/*
Theme Name: Reta24
Theme URI: https://reta24.net
Author: Reta24
Description: Premium Peptide Shop Theme — Light Edition
Version: 3.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
License: Proprietary
Text Domain: reta24
*/

/* ═══════════════════════════════════════════
   DESIGN SYSTEM — CLEAN BIOTECH LIGHT
   ═══════════════════════════════════════════ */
:root {
  /* Backgrounds */
  --bg:        #deeaf7;
  --surface:   #ffffff;
  --panel:     #cddff0;
  --hero-bg:   #d4e5f5;

  /* Brand colours */
  --navy:      #0a1e38;
  --cyan:      #0095d0;
  --cyan-dk:   #0079ab;
  --cyan-lt:   #dff0fa;
  --cyan-glow: rgba(0,149,208,.12);
  --green:     #00b37a;
  --green-dk:  #009063;
  --green-lt:  #dff7ef;

  /* Text */
  --t1: #08192e;
  --t2: #3a5268;
  --t3: #7a96b0;

  /* Borders */
  --border:   rgba(0,149,208,.14);
  --border-h: rgba(0,149,208,.45);
  --border-gray: rgba(9,27,51,.1);

  /* Shadows */
  --shadow-sm:   0 1px 4px rgba(0,0,0,.07);
  --shadow-md:   0 4px 18px rgba(0,0,0,.09);
  --shadow-lg:   0 10px 40px rgba(0,0,0,.11);
  --shadow-card: 0 2px 10px rgba(9,27,51,.08), 0 0 0 1px rgba(9,27,51,.06);
  --shadow-card-h: 0 6px 28px rgba(0,149,208,.2), 0 2px 8px rgba(0,0,0,.1), 0 0 0 1px rgba(0,149,208,.25);
  --shadow-btn:  0 4px 16px rgba(0,149,208,.3);
  --shadow-green:0 4px 16px rgba(0,179,122,.28);

  /* Typography */
  --font-head: 'Outfit', sans-serif;
  --font-body: 'DM Sans', sans-serif;

  /* Layout */
  --max-w: 1320px;
  --logo-h:  220px;
  --hh:      74px;
  --r:     10px;
  --r-lg:  16px;
  --r-xl:  24px;

  /* Transitions */
  --t-fast: 150ms ease;
  --t-med:  260ms cubic-bezier(.22,.68,0,1.2);
  --t-slow: 380ms ease;
}

/* ─── RESET ─────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--t2);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: var(--cyan); text-decoration: none; transition: color var(--t-fast); }
a:hover { color: var(--cyan-dk); }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }
button { cursor: pointer; font-family: var(--font-body); }

/* ─── TYPOGRAPHY ────────────────────────── */
h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-head);
  font-weight: 700;
  line-height: 1.15;
  color: var(--t1);
  letter-spacing: -.02em;
}
h1 { font-size: clamp(2rem, 5vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); }
h4 { font-size: 1.05rem; }

.gradient-text {
  background: linear-gradient(135deg, var(--cyan) 0%, #0055a8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─── LAYOUT ────────────────────────────── */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; }
.section    { padding: 96px 0; }
.section-sm { padding: 60px 0; }
.section-alt { background: var(--surface); }
.section-tint { background: linear-gradient(180deg, var(--panel) 0%, var(--bg) 100%); }

/* ═══════════════════════════════════════════
   TOP BAR
   ═══════════════════════════════════════════ */
.top-bar {
  background: var(--navy);
  padding: 9px 0;
}
.top-bar-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 36px; flex-wrap: wrap;
}
.top-bar-item {
  display: flex; align-items: center; gap: 7px;
  font-size: .77rem; font-weight: 500;
  color: rgba(255,255,255,.7);
  letter-spacing: .02em;
}
.top-bar-item svg { width: 13px; height: 13px; color: #5cc8f0; flex-shrink: 0; }
.top-bar-item strong { color: #fff; }
.top-bar-mobile { display: none; }

/* ═══════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════ */
#main-nav {
  position: sticky; top: 0; z-index: 900;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border-gray);
  transition: box-shadow var(--t-slow);
}
#main-nav.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,.1); }

.nav-inner {
  display: flex; align-items: center; gap: 6px;
  height: var(--hh); overflow: visible;
}

.header-inner {
  display: flex; align-items: center;
  height: var(--hh); gap: 24px;
}

/* Logo */
.site-logo {
  flex-shrink: 0;
  text-decoration: none;
  display: flex;
  align-items: center;
  margin-right: 8px;
}
#main-nav .logo-img {
  height: var(--logo-h);
  width: auto;
  max-width: 450px;
  display: block;
  object-fit: contain;
  pointer-events: none;
}

/* Search */
.header-search { flex: 1; max-width: 440px; }
.header-search form {
  display: flex; align-items: center;
  background: var(--bg);
  border: 1.5px solid var(--border-gray);
  border-radius: 50px; overflow: hidden;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.header-search form:focus-within {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(0,149,208,.1);
}
.header-search input {
  flex: 1; border: none; padding: 9px 16px;
  font-size: .88rem; background: none; outline: none;
  color: var(--t1); font-family: var(--font-body);
}
.header-search input::placeholder { color: var(--t3); }
.header-search button {
  background: none; border: none; padding: 9px 14px;
  color: var(--t3); transition: color var(--t-fast);
  display: flex; align-items: center;
}
.header-search button:hover { color: var(--cyan); }
.header-search button svg { width: 17px; height: 17px; }
.header-search input[type="submit"] {
  flex: none; width: auto; background: none; border: none;
  padding: 9px 14px; color: var(--t3); font-size: .82rem;
  cursor: pointer; transition: color var(--t-fast);
}
.header-search input[type="submit"]:hover { color: var(--cyan); }

/* Header actions */
.header-actions { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.header-action-btn {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 7px 12px; border-radius: var(--r);
  color: var(--t3); font-size: .69rem; font-weight: 500;
  text-decoration: none; transition: color var(--t-fast), background var(--t-fast);
  position: relative; cursor: pointer; background: none; border: none;
  white-space: nowrap; letter-spacing: .02em;
}
.header-action-btn:hover { color: var(--cyan); background: var(--cyan-lt); }
.header-action-btn svg { width: 21px; height: 21px; }
.cart-count {
  position: absolute; top: 3px; right: 7px;
  background: var(--green); color: #fff;
  font-size: .62rem; font-weight: 800;
  min-width: 17px; height: 17px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}

/* ═══════════════════════════════════════════
   NAVIGATION
   ═══════════════════════════════════════════ */
.nav-inner { display: flex; align-items: center; gap: 6px; }
.nav-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.mobile-menu-btn { display: none; }
body:not(.home) #main-content { padding-top: 80px; }
.nav-cart-btn {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 20px;
  background: var(--cyan); color: #fff;
  font-size: .83rem; font-weight: 600;
  text-decoration: none; white-space: nowrap;
  position: relative; flex-shrink: 0;
  transition: background var(--t-fast);
}
.nav-cart-btn:hover { background: var(--cyan-dk); color: #fff; }
.nav-cart-btn svg { width: 16px; height: 16px; }
.nav-cart-btn .cart-count {
  position: absolute; top: -4px; right: -4px;
  background: var(--navy); color: #fff;
  font-size: 10px; font-weight: 700;
  width: 16px; height: 16px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.nav-search .search-form { display: flex; align-items: center; background: var(--bg); border: 1.5px solid var(--border-gray); border-radius: 50px; overflow: hidden; transition: border-color var(--t-fast); }
.nav-search .search-form:focus-within { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(0,149,208,.1); }
.nav-search input[type="search"] { flex: 1; border: none; background: none; padding: 9px 18px; font-size: .88rem; outline: none; color: var(--t1); font-family: var(--font-body); min-width: 0; }
.nav-search input[type="search"]::placeholder { color: var(--t3); }
.nav-search button { background: none; border: none; padding: 9px 14px; cursor: pointer; color: var(--t3); display: flex; align-items: center; transition: color var(--t-fast); }
.nav-search button:hover { color: var(--cyan); }
.nav-search button svg { width: 16px; height: 16px; }
.nav-menu { display: flex; list-style: none; }
.nav-menu > li { position: relative; }
.nav-menu > li > a {
  display: flex; align-items: center; gap: 5px;
  padding: 13px 16px;
  color: var(--t2); font-size: .85rem; font-weight: 500;
  text-decoration: none; transition: color var(--t-fast);
  white-space: nowrap; letter-spacing: .01em;
  border-bottom: 2px solid transparent;
}
.nav-menu > li > a:hover,
.nav-menu > li:hover > a { color: var(--cyan); border-bottom-color: var(--cyan); }
.nav-arrow { width: 12px; height: 12px; transition: transform var(--t-fast); }
.nav-menu > li:hover > a .nav-arrow { transform: rotate(180deg); }

/* Dropdown */
.dropdown {
  position: absolute; top: calc(100% + 1px); left: 0;
  background: var(--surface);
  border: 1px solid var(--border-gray);
  border-radius: 0 var(--r) var(--r) var(--r);
  min-width: 220px; padding: 8px;
  opacity: 0; visibility: hidden;
  transform: translateY(-6px);
  transition: all var(--t-med);
  z-index: 999;
  box-shadow: var(--shadow-lg);
}
.nav-menu > li:hover .dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.dropdown a {
  display: block; padding: 9px 13px;
  color: var(--t2); font-size: .84rem;
  border-radius: 7px;
  transition: color var(--t-fast), background var(--t-fast), padding var(--t-fast);
}
.dropdown a:hover { color: var(--cyan); background: var(--cyan-lt); padding-left: 18px; }

/* Mega dropdown */
.mega-dropdown {
  min-width: 560px; padding: 24px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.mega-dropdown-col h5 {
  font-size: .71rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--cyan); margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-gray);
}
.mega-dropdown-col a { padding: 6px 0; font-size: .83rem; }
.mega-dropdown-col a:hover { background: none; padding-left: 7px; }

/* ═══════════════════════════════════════════
   MINI CART SIDEBAR
   ═══════════════════════════════════════════ */
.overlay {
  position: fixed; inset: 0;
  background: rgba(9,27,51,.4);
  backdrop-filter: blur(4px);
  z-index: 1099;
  opacity: 0; pointer-events: none;
  transition: opacity var(--t-slow);
}
.overlay.active { opacity: 1; pointer-events: all; }

/* Mini-Cart Backdrop */
.mini-cart-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(8,25,46,.45);
  backdrop-filter: blur(2px);
  z-index: 1099;
  transition: opacity .3s ease;
  opacity: 0;
}
.mini-cart-backdrop.open { display: block; opacity: 1; }

.mini-cart-sidebar {
  position: fixed;
  top: var(--hh);
  right: -460px;
  width: 430px;
  height: calc(100vh - var(--hh));
  height: calc(100dvh - var(--hh));
  background: var(--surface);
  border-radius: var(--r-xl) 0 0 var(--r-xl);
  box-shadow: -8px 0 48px rgba(0,0,0,.18);
  z-index: 1100;
  transition: right var(--t-slow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.mini-cart-sidebar.open { right: 0; }

.mini-cart-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px;
  background: var(--surface);
  border-bottom: 2px solid var(--cyan);
  flex-shrink: 0;
}
.mini-cart-header h3 {
  font-size: 1rem;
  font-family: var(--font-head);
  font-weight: 800;
  color: var(--t1);
  display: flex; align-items: center; gap: 8px;
}
.mini-cart-header h3::before {
  content: '🛒';
  font-size: .9rem;
}
.mini-cart-close {
  background: var(--bg);
  border: 1px solid var(--border-gray);
  color: var(--t3);
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--t-fast); cursor: pointer;
}
.mini-cart-close:hover { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-lt); }

.mini-cart-body {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 20px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-gray) transparent;
  -webkit-overflow-scrolling: touch;
}
.mini-cart-footer {
  padding: 16px 20px;
  border-top: 1.5px solid var(--border-gray);
  background: var(--bg);
  flex-shrink: 0;
}
.mini-cart-total {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--font-head);
  font-weight: 800; font-size: 1.05rem;
  margin-bottom: 12px; color: var(--t1);
}
.mini-cart-total span:last-child { color: var(--cyan); }

.mini-cart-item {
  display: flex; gap: 12px; padding: 12px 0; position: relative;
  border-bottom: 1px solid var(--border-gray);
}
.mini-cart-item:last-child { border-bottom: none; }
.mini-cart-item img {
  width: 52px; height: 52px; flex-shrink: 0;
  object-fit: contain; border-radius: 10px;
  border: 1px solid var(--border-gray);
  background: var(--panel); padding: 3px;
}
.mini-cart-item-info { flex: 1; min-width: 0; padding-right: 26px; }
.mini-cart-item-name {
  font-weight: 600; font-size: .85rem; color: var(--t1);
  margin-bottom: 2px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.mini-cart-item-price { font-size: .8rem; color: var(--cyan); font-weight: 700; margin-bottom: 8px; }
.cart-empty-msg {
  text-align: center; color: var(--t3); padding: 48px 20px;
  font-size: .9rem; line-height: 1.6;
}
.mini-cart-qty { display: flex; align-items: center; gap: 6px; }
.qty-btn {
  width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--border-gray); background: var(--bg);
  color: var(--t2); font-size: .95rem; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.qty-btn:hover { background: var(--cyan); color: #fff; border-color: var(--cyan); }
.qty-val { font-size: .85rem; font-weight: 700; min-width: 18px; text-align: center; color: var(--t1); }
.mini-cart-remove {
  position: absolute; top: 12px; right: 0;
  width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--border-gray); background: none; color: var(--t3);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: color var(--t-fast), border-color var(--t-fast), background var(--t-fast);
  font-size: .75rem;
}
.mini-cart-remove:hover { color: #e03030; border-color: #e03030; background: rgba(224,48,48,.08); }

/* Versand-Fortschrittsbalken */
.mc-shipping-bar {
  background: var(--cyan-lt);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 10px 12px;
  margin-bottom: 12px;
  font-size: .8rem;
  color: var(--t2);
}
.mc-shipping-bar--done {
  background: var(--green-lt);
  border-color: rgba(0,179,122,.25);
  color: var(--green-dk);
  font-size: .82rem;
}
.mc-shipping-bar-text { margin-bottom: 7px; line-height: 1.4; }
.mc-shipping-bar-track {
  height: 5px;
  background: rgba(0,149,208,.15);
  border-radius: 100px;
  overflow: hidden;
}
.mc-shipping-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--cyan), var(--cyan-dk));
  border-radius: 100px;
  transition: width .4s ease;
}

/* Zubehör-Hinweis in Sidebar */
.mc-zubehoer-hint {
  background: var(--bg);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r);
  padding: 10px 12px;
  margin-top: 12px;
}
.mc-zh-title {
  font-size: .75rem;
  font-weight: 700;
  color: var(--t2);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.mc-zh-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid var(--border-gray);
  gap: 8px;
}
.mc-zh-item:last-child { border-bottom: none; }
.mc-zh-name {
  font-size: .8rem;
  color: var(--t1);
  font-weight: 500;
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mc-zh-add {
  flex-shrink: 0;
  padding: 4px 10px !important;
  font-size: .75rem !important;
  border-radius: 100px !important;
  white-space: nowrap;
}

/* ═══════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 28px; border-radius: 50px;
  font-family: var(--font-body); font-size: .9rem; font-weight: 600;
  text-decoration: none; cursor: pointer; border: none;
  transition: all var(--t-med); white-space: nowrap;
  letter-spacing: .01em;
}
.btn svg { width: 17px; height: 17px; }

.btn-primary {
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%);
  color: #fff;
  box-shadow: var(--shadow-btn);
}
.btn-primary:hover {
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0,149,208,.4);
}

.btn-green {
  background: linear-gradient(135deg, var(--green) 0%, var(--green-dk) 100%);
  color: #fff;
  box-shadow: var(--shadow-green);
}
.btn-green:hover {
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 22px rgba(0,179,122,.4);
}

.btn-ghost {
  background: transparent;
  color: var(--t2);
  border: 1.5px solid var(--border-gray);
}
.btn-ghost:hover {
  border-color: var(--cyan);
  color: var(--cyan);
  background: var(--cyan-lt);
}

.btn-outline-cyan {
  background: transparent;
  color: var(--cyan);
  border: 1.5px solid var(--cyan);
}
.btn-outline-cyan:hover {
  background: var(--cyan);
  color: #fff;
  box-shadow: var(--shadow-btn);
}

/* ═══════════════════════════════════════════
   HERO — VIAL FLOATING LAYOUT
   ═══════════════════════════════════════════ */

@keyframes vial-float {
  0%, 100% { transform: translateY(0px) rotate(-1deg); }
  50%       { transform: translateY(-22px) rotate(1deg); }
}
@keyframes glow-pulse {
  0%, 100% { opacity: .5; transform: scale(1); }
  50%       { opacity: .85; transform: scale(1.08); }
}

.hero-new {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 80px 0 60px;
  min-height: 560px;
}
.hero-new-left { z-index: 1; flex-shrink: 0; max-width: 500px; }

.hero-new-title {
  font-family: var(--font-head);
  font-size: clamp(2.4rem, 4.5vw, 3.6rem);
  font-weight: 800;
  line-height: 1.1;
  color: var(--navy);
  margin: 14px 0 16px;
}
.hero-new-sub {
  font-size: 1.05rem;
  color: var(--t2);
  line-height: 1.6;
  max-width: 480px;
  margin-bottom: 28px;
}

.hero-trust-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 32px;
}
.hero-trust-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.hero-trust-check {
  flex-shrink: 0;
  width: 26px; height: 26px;
  background: var(--green);
  color: #fff;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; font-weight: 800;
  margin-top: 1px;
}
.hero-trust-item > div:last-child { display: flex; flex-direction: column; gap: 2px; }
.hero-trust-item strong { font-size: .95rem; color: var(--t1); font-weight: 700; }
.hero-trust-item span { font-size: .82rem; color: var(--t3); }

/* Vial side */
.hero-new-right {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  flex-shrink: 0;
  margin-left: -60px;
}
.hero-vial-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-vial-glow {
  position: absolute;
  width: 620px; height: 620px;
  background: radial-gradient(circle, rgba(0,149,208,.28) 0%, transparent 70%);
  border-radius: 50%;
  animation: glow-pulse 4s ease-in-out infinite;
}
.hero-vial-img {
  position: relative; z-index: 1;
  width: 620px; max-width: 95%;
  height: auto;
  filter: drop-shadow(0 32px 64px rgba(0,100,180,.25));
  animation: vial-float 5s ease-in-out infinite;
}

/* ═══════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════ */
.hero {
  position: relative;
  background: linear-gradient(160deg, #deeaf7 0%, #c8dff0 40%, #d8edf6 100%);
  overflow: hidden;
  padding: 0;
}

/* Soft decorative background shapes */
.hero-aurora { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.aurora-orb {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: .18;
}
.aurora-orb-1 {
  width: 700px; height: 700px;
  background: radial-gradient(circle, #b3e0f8 0%, transparent 70%);
  top: -20%; right: -10%;
}
.aurora-orb-2 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, #b3f0d8 0%, transparent 70%);
  bottom: -10%; left: -5%;
}
.aurora-orb-3 {
  width: 350px; height: 350px;
  background: radial-gradient(circle, #cce5ff 0%, transparent 70%);
  top: 30%; left: 40%;
}

.hero-grid {
  position: absolute; inset: 0; z-index: 1;
  background-image:
    linear-gradient(rgba(0,149,208,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,149,208,.05) 1px, transparent 1px);
  background-size: 60px 60px;
}
.hero-vignette { display: none; }

.hero-content {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 72px;
  padding: 96px 0 80px;
}

.hero-left { max-width: 600px; }

.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1.5px solid rgba(0,149,208,.3);
  background: var(--cyan-lt);
  color: var(--cyan); font-size: .76rem;
  font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; padding: 5px 14px;
  border-radius: 50px; margin-bottom: 24px;
}
.hero-eyebrow::before {
  content: ''; width: 6px; height: 6px;
  background: var(--cyan); border-radius: 50%;
  animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .4; transform: scale(.7); }
}

.hero-title {
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  font-weight: 800; line-height: 1.05;
  margin-bottom: 22px; letter-spacing: -.035em;
  color: var(--t1);
}

.hero-desc {
  font-size: 1.06rem; color: var(--t2);
  margin-bottom: 36px; line-height: 1.75;
  max-width: 520px;
}

.hero-actions {
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap; margin-bottom: 20px;
}
.hero-price-hint {
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap; margin-bottom: 44px; margin-top: 14px;
}
.hero-price-tag {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(0,188,212,.10);
  border-left: 3px solid var(--cyan);
  color: var(--t1);
  font-size: .88rem;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 0 6px 6px 0;
  white-space: nowrap;
}
.hero-price-tag strong {
  color: var(--cyan);
  font-size: 1.05rem;
  font-weight: 800;
}
.hero-price-sub {
  font-size: .8rem;
  color: var(--t3);
  white-space: nowrap;
}

.hero-stats {
  display: flex; gap: 28px; flex-wrap: wrap;
  padding-top: 28px;
  border-top: 1px solid var(--border-gray);
}
.hero-stat-value {
  font-family: var(--font-head);
  font-size: 1.7rem; font-weight: 800;
  color: var(--cyan); line-height: 1;
}
.hero-stat-label { font-size: .76rem; color: var(--t3); margin-top: 4px; letter-spacing: .03em; }

/* Hero right: floating feature cards */
.hero-right { position: relative; }
.hero-cards-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.hero-feat-card {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  padding: 22px 20px;
  box-shadow: var(--shadow-card);
  transition: border-color var(--t-med), transform var(--t-med), box-shadow var(--t-med);
}
.hero-feat-card:hover {
  border-color: var(--cyan);
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-h);
}
.hero-feat-card:nth-child(2) { margin-top: 22px; }
.hero-feat-card:nth-child(4) { margin-top: -22px; }

.feat-icon {
  width: 44px; height: 44px; border-radius: 10px;
  background: var(--cyan-lt); border: 1px solid rgba(0,149,208,.15);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px; font-size: 1.3rem;
}
.hero-feat-card h4 { font-size: .93rem; margin-bottom: 4px; font-family: var(--font-head); color: var(--t1); }
.hero-feat-card p { font-size: .77rem; color: var(--t3); margin: 0; line-height: 1.4; }
.feat-badge {
  display: inline-block; margin-top: 10px;
  font-size: .67rem; font-weight: 700; letter-spacing: .06em;
  padding: 3px 10px; border-radius: 50px;
  background: var(--green-lt); color: var(--green); border: 1px solid rgba(0,179,122,.2);
}

/* ═══════════════════════════════════════════
   TRUST STRIP
   ═══════════════════════════════════════════ */
.trust-strip {
  background: var(--navy);
  border: none;
}
.trust-strip-inner { display: flex; align-items: stretch; }
.trust-item {
  flex: 1;
  display: flex; align-items: center; gap: 12px;
  padding: 18px 22px;
  border-right: 1px solid rgba(255,255,255,.08);
  transition: background var(--t-fast);
}
.trust-item:last-child { border-right: none; }
.trust-item:hover { background: rgba(255,255,255,.04); }
.trust-icon {
  width: 38px; height: 38px; flex-shrink: 0;
  background: rgba(255,255,255,.08);
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
}
.trust-icon svg { width: 17px; height: 17px; color: #5cc8f0; }
.trust-text strong { display: block; font-size: .86rem; font-weight: 600; color: #fff; }
.trust-text span { font-size: .74rem; color: rgba(255,255,255,.5); }

/* ═══════════════════════════════════════════
   SECTION HEADS
   ═══════════════════════════════════════════ */
.section-head { margin-bottom: 52px; }
.section-head.center { text-align: center; }
.section-head.center p { margin: 12px auto 0; }

.pretitle {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .72rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--cyan); margin-bottom: 10px;
}
.pretitle::before {
  content: ''; display: block; width: 18px; height: 2px;
  background: var(--cyan); border-radius: 2px;
}
.section-head h2 { margin-bottom: 0; color: var(--t1); }
.section-head p { color: var(--t2); max-width: 560px; font-size: 1rem; margin-top: 12px; }

/* ═══════════════════════════════════════════
   PRODUCT CARDS
   ═══════════════════════════════════════════ */
.products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
}

.product-card {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform var(--t-med), box-shadow var(--t-med), border-color var(--t-med);
  position: relative;
  display: flex; flex-direction: column;
}
.product-card-body { flex: 1; display: flex; flex-direction: column; }
.product-card-footer { margin-top: auto; }
.product-price-soon,
.woocommerce ul.products li.product .price .product-price-soon {
  color: var(--t3) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  font-style: normal !important;
}
.product-card:hover {
  transform: translateY(-5px);
  border-color: var(--cyan);
  box-shadow: var(--shadow-card-h);
}

.product-image-wrap {
  position: relative; overflow: hidden;
  background: var(--panel);
  aspect-ratio: 1;
}
.product-image-wrap img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}
.product-card:hover .product-image-wrap img { transform: scale(1.05); }

/* Badges */
.product-badges {
  position: absolute; top: 10px; left: 10px;
  display: flex; flex-direction: column; gap: 5px; z-index: 2;
}
.p-badge {
  display: inline-block; padding: 3px 10px;
  border-radius: 50px; font-size: .68rem; font-weight: 700;
  letter-spacing: .04em; white-space: nowrap;
}
.p-badge-seller    { background: var(--cyan); color: #fff; }
.p-badge-new       { background: var(--green-lt); color: var(--green); border: 1px solid rgba(0,179,122,.25); }
.p-badge-sale      { background: #fff0f0; color: #e03030; border: 1px solid rgba(220,50,50,.2); }
.p-badge-outofstock { background: #e03030; color: #fff; box-shadow: 0 2px 8px rgba(224,48,48,.35); }
.p-badge-instock    { background: #15803d; color: #fff; box-shadow: 0 2px 8px rgba(21,128,61,.30); }
.p-badge-lowstock   { background: #e6a817; color: #fff; box-shadow: 0 2px 8px rgba(230,168,23,.35); }
.p-badge-comingsoon { background: linear-gradient(90deg,#0095d0,#00c5e3); color: #fff; }

/* Purity bar */
.purity-bar-wrap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 7px 12px;
  background: linear-gradient(0deg, rgba(255,255,255,.95) 0%, transparent 100%);
  z-index: 2;
}
.purity-bar-label {
  font-size: .66rem; font-weight: 700; color: var(--green);
  letter-spacing: .05em; margin-bottom: 4px;
  display: flex; justify-content: space-between;
}
.purity-bar-track {
  height: 3px; background: rgba(0,0,0,.1); border-radius: 2px; overflow: hidden;
}
.purity-bar-fill {
  height: 100%; background: linear-gradient(90deg, var(--green), #2ee8a0);
  border-radius: 2px; width: 98.9%; transition: width 1s ease;
}

/* Card actions */
.product-card-actions {
  position: absolute; top: 10px; right: 10px;
  display: flex; flex-direction: column; gap: 6px;
  opacity: 0; transform: translateX(8px);
  transition: opacity var(--t-med), transform var(--t-med); z-index: 3;
}
.product-card:hover .product-card-actions { opacity: 1; transform: translateX(0); }
.pca-btn {
  width: 34px; height: 34px;
  background: rgba(255,255,255,.95);
  border: 1px solid var(--border-gray);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: var(--t3); transition: all var(--t-fast);
  box-shadow: var(--shadow-sm);
}
.pca-btn:hover { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-lt); }
.pca-btn svg { width: 15px; height: 15px; }

/* Card body */
.product-card-body { padding: 15px 16px 16px; }
.product-cat-tag {
  font-size: .67rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--cyan); margin-bottom: 6px; opacity: .9;
}
.product-card-title {
  font-family: var(--font-head); font-size: .97rem; font-weight: 700;
  color: var(--t1); margin-bottom: 9px; line-height: 1.25;
}
.product-card-title a { color: var(--t1); text-decoration: none; }
.product-card-title a:hover { color: var(--cyan); }

.product-card-rating {
  display: flex; align-items: center; gap: 5px; margin-bottom: 11px;
}
.stars { color: #f59e0b; font-size: .82rem; letter-spacing: -.04em; }
.rating-num { font-size: .75rem; color: var(--t3); }

.product-card-footer {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding-top: 11px; border-top: 1px solid var(--border-gray);
}
.product-price {
  font-family: var(--font-head); font-size: 1.15rem; font-weight: 800;
  color: var(--t1);
}
.product-price-old { font-size: .8rem; color: var(--t3); text-decoration: line-through; }

.atc-btn {
  background: var(--cyan-lt);
  border: 1.5px solid rgba(0,149,208,.25);
  color: var(--cyan);
  padding: 8px 14px; border-radius: 8px;
  font-size: .79rem; font-weight: 700;
  white-space: nowrap; transition: all var(--t-fast);
  letter-spacing: .01em;
}
.atc-btn:hover {
  background: var(--cyan); color: #fff;
  border-color: var(--cyan);
  box-shadow: 0 2px 12px rgba(0,149,208,.3);
}
/* Ausgegraut für Ausverkauft / Coming Soon — Startseite */
.outofstock .atc-btn, .coming-soon .atc-btn {
  background: var(--border-gray) !important;
  border-color: transparent !important;
  color: var(--t3) !important;
  box-shadow: none !important;
  cursor: default !important;
}
.outofstock .atc-btn:hover, .coming-soon .atc-btn:hover {
  background: #d0d0d0 !important;
  color: var(--t2) !important;
  border-color: rgba(0,149,208,.4) !important;
  box-shadow: 0 0 0 3px rgba(0,149,208,.08) !important;
  transform: translateY(-1px) !important;
}

/* ═══════════════════════════════════════════
   CATEGORY PILLS
   ═══════════════════════════════════════════ */
.categories-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 14px;
}
.cat-pill {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 18px;
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  text-decoration: none; color: var(--t1);
  transition: all var(--t-med);
  box-shadow: var(--shadow-sm);
}
.cat-pill:hover {
  border-color: var(--cyan);
  box-shadow: var(--shadow-card-h);
  color: var(--t1);
  transform: translateY(-3px);
}
.cat-emoji {
  font-size: 1.5rem; width: 46px; height: 46px;
  background: var(--panel);
  border: 1px solid var(--border-gray);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: background var(--t-fast);
}
.cat-pill:hover .cat-emoji { background: var(--cyan-lt); border-color: rgba(0,149,208,.2); }
.cat-pill h4 { font-size: .87rem; font-family: var(--font-head); margin-bottom: 2px; color: var(--t1); }
.cat-pill span { font-size: .71rem; color: var(--t3); }

/* ═══════════════════════════════════════════
   QUALITY CARDS
   ═══════════════════════════════════════════ */
.quality-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.quality-card {
  border-radius: var(--r-lg); padding: 40px 32px 36px;
  position: relative; overflow: hidden;
  transition: transform var(--t-med), box-shadow var(--t-med);
  display: flex; flex-direction: column;
  border: none;
}
.quality-card:hover { transform: translateY(-8px); }
.qc-price    { background: linear-gradient(145deg, #00b84c 0%, #008533 100%); box-shadow: 0 4px 24px rgba(0,200,100,.15); }
.qc-shipping { background: linear-gradient(145deg, #0099d6 0%, #006699 100%); box-shadow: 0 4px 24px rgba(0,149,208,.15); }
.qc-quality  { background: linear-gradient(145deg, #b38600 0%, #806000 100%); box-shadow: 0 4px 24px rgba(255,170,0,.15); }
.qc-price:hover    { background: linear-gradient(145deg, #00cc55 0%, #00b84c 100%); box-shadow: 0 12px 40px rgba(0,200,100,.25); }
.qc-shipping:hover { background: linear-gradient(145deg, #00aaee 0%, #0099d6 100%); box-shadow: 0 12px 40px rgba(0,149,208,.25); }
.qc-quality:hover  { background: linear-gradient(145deg, #cc9900 0%, #b38600 100%); box-shadow: 0 12px 40px rgba(255,170,0,.25); }
.qc-accent {
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  transition: height var(--t-med);
}
.quality-card:hover .qc-accent { height: 6px; }
.qc-price .qc-accent    { background: linear-gradient(90deg, #00c864, #00ff80); }
.qc-shipping .qc-accent { background: linear-gradient(90deg, var(--cyan), #00d4ff); }
.qc-quality .qc-accent  { background: linear-gradient(90deg, #ffaa00, #ffd000); }
.quality-card-num {
  position: absolute; bottom: -10px; right: 16px;
  font-family: var(--font-head); font-size: 7rem; font-weight: 800;
  line-height: 1; pointer-events: none; user-select: none; opacity: .07;
}
.qc-price .quality-card-num    { color: #00ff80; }
.qc-shipping .quality-card-num { color: #00d4ff; }
.qc-quality .quality-card-num  { color: #ffd000; }
.qc-icon {
  width: 64px; height: 64px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 24px;
  transition: transform var(--t-med), box-shadow var(--t-med);
}
.quality-card:hover .qc-icon { transform: scale(1.12); }
.qc-price:hover .qc-icon    { box-shadow: 0 4px 16px rgba(0,200,100,.25); }
.qc-shipping:hover .qc-icon { box-shadow: 0 4px 16px rgba(0,149,208,.25); }
.qc-quality:hover .qc-icon  { box-shadow: 0 4px 16px rgba(255,170,0,.25); }
.qc-price .qc-icon    { background: rgba(0,200,100,.15); border: 1.5px solid rgba(0,200,100,.3); color: #00c864; }
.qc-shipping .qc-icon { background: rgba(0,149,208,.15); border: 1.5px solid rgba(0,149,208,.3); color: #00c8ff; }
.qc-quality .qc-icon  { background: rgba(255,170,0,.15); border: 1.5px solid rgba(255,170,0,.3); color: #ffaa00; }
.quality-card h3 { font-size: 1.25rem; margin-bottom: 12px; font-family: var(--font-head); font-weight: 700; color: #fff; }
.quality-card p  { font-size: .88rem; line-height: 1.7; margin: 0 0 24px; flex: 1; color: rgba(255,255,255,.65); }
.qc-badge {
  display: inline-flex; align-items: center;
  font-size: .73rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 6px 14px; border-radius: 20px; width: fit-content;
}
.qc-price .qc-badge    { background: rgba(0,200,100,.2); color: #00e872; border: 1px solid rgba(0,200,100,.35); }
.qc-shipping .qc-badge { background: rgba(0,149,208,.2); color: #00d4ff; border: 1px solid rgba(0,149,208,.35); }
.qc-quality .qc-badge  { background: rgba(255,170,0,.2); color: #ffc030; border: 1px solid rgba(255,170,0,.35); }
.quality-icon { display: none; }

/* ═══════════════════════════════════════════
   TOOLS
   ═══════════════════════════════════════════ */
.tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.tool-card {
  display: block; text-decoration: none; color: var(--t2);
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg); padding: 26px;
  transition: all var(--t-med);
  box-shadow: var(--shadow-sm);
  position: relative;
}
.tool-card::after {
  content: '→'; position: absolute; top: 22px; right: 22px;
  font-size: 1rem; color: var(--t3);
  transition: color var(--t-fast), transform var(--t-fast);
}
.tool-card:hover {
  border-color: var(--cyan); box-shadow: var(--shadow-card-h);
  color: var(--t2); transform: translateY(-4px);
}
.tool-card:hover::after { color: var(--cyan); transform: translate(3px,-3px); }
.tool-icon {
  width: 46px; height: 46px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px; font-size: 1.4rem;
}
.tool-card h4 { font-size: .95rem; margin-bottom: 7px; font-family: var(--font-head); color: var(--t1); }
.tool-card p { font-size: .82rem; color: var(--t2); margin: 0; line-height: 1.55; }

/* ═══════════════════════════════════════════
   REVIEWS
   ═══════════════════════════════════════════ */
.reviews-banner {
  background: linear-gradient(135deg, var(--cyan-lt) 0%, var(--green-lt) 100%);
  border: 1.5px solid rgba(0,149,208,.15);
  border-radius: var(--r-xl); padding: 44px;
  text-align: center; margin-bottom: 36px;
}
.review-score {
  font-family: var(--font-head); font-size: 4.5rem; font-weight: 800;
  color: var(--t1); line-height: 1;
}
.review-stars-lg { font-size: 1.7rem; color: #f59e0b; margin: 8px 0 6px; }
.review-meta { font-size: .88rem; color: var(--t2); }

.reviews-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px;
}
.review-card {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg); padding: 22px;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
  box-shadow: var(--shadow-sm);
}
.review-card:hover { border-color: var(--cyan); box-shadow: var(--shadow-card-h); }
.review-header { display: flex; align-items: center; gap: 12px; margin-bottom: 11px; }
.review-av {
  width: 40px; height: 40px; border-radius: 10px;
  background: linear-gradient(135deg, var(--cyan-lt), var(--green-lt));
  border: 1px solid rgba(0,149,208,.15);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem; color: var(--cyan);
  flex-shrink: 0; font-family: var(--font-head);
}
.review-name { font-weight: 600; font-size: .88rem; color: var(--t1); }
.review-date { font-size: .72rem; color: var(--t3); }
.review-stars-sm { color: #f59e0b; font-size: .82rem; margin-bottom: 7px; }
.review-text { font-size: .85rem; color: var(--t2); line-height: 1.6; margin: 0; }
.review-verified {
  margin-top: 10px; font-size: .7rem; color: var(--green);
  display: flex; align-items: center; gap: 4px;
}

/* ═══════════════════════════════════════════
   NEWSLETTER
   ═══════════════════════════════════════════ */
.newsletter-section {
  background: linear-gradient(135deg, var(--navy) 0%, #0d2d52 100%);
  padding: 80px 0;
}
.newsletter-inner { text-align: center; }
.newsletter-inner h2 { color: #fff; margin-bottom: 10px; }
.newsletter-inner .gradient-text {
  background: linear-gradient(135deg, #7de8ff 0%, #a8ffd8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.newsletter-inner p { color: rgba(255,255,255,.65); margin-bottom: 32px; }
.nl-form {
  display: flex; max-width: 480px; margin: 0 auto;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50px; overflow: hidden;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.nl-form:focus-within {
  border-color: rgba(255,255,255,.5);
  box-shadow: 0 0 0 3px rgba(255,255,255,.08);
}
.nl-form input {
  flex: 1; background: none; border: none; padding: 13px 22px;
  color: #fff; font-size: .9rem; outline: none; font-family: var(--font-body);
}
.nl-form input::placeholder { color: rgba(255,255,255,.45); }
.nl-form button {
  background: var(--cyan); border: none; padding: 13px 26px;
  color: #fff; font-weight: 700; font-size: .88rem;
  transition: all var(--t-fast); white-space: nowrap; font-family: var(--font-body);
}
.nl-form button:hover { background: var(--cyan-dk); }
.nl-note { margin-top: 12px; font-size: .74rem; color: rgba(255,255,255,.4); }

/* ═══════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════ */
#site-footer {
  background: var(--navy);
  border-top: none;
  padding: 70px 0 0;
}
.footer-grid {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px; padding-bottom: 56px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.footer-logo-text {
  font-family: var(--font-head); font-size: 1.5rem; font-weight: 800;
  color: #fff;
}
.footer-logo-text em { font-style: normal; color: #5cc8f0; }
.footer-brand p { color: rgba(255,255,255,.5); font-size: .83rem; margin-top: 14px; line-height: 1.7; }
.footer-trust-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.fchip {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px; padding: 4px 11px;
  font-size: .7rem; color: rgba(255,255,255,.55); font-weight: 500;
}
.footer-col h5 {
  font-size: .71rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: #5cc8f0; margin-bottom: 16px;
}
.footer-col ul { list-style: none; }
.footer-col ul li { margin-bottom: 8px; }
.footer-col ul li a {
  color: rgba(255,255,255,.5); font-size: .83rem;
  transition: color var(--t-fast), padding-left var(--t-fast);
}
.footer-col ul li a:hover { color: #fff; padding-left: 5px; }

.footer-bottom {
  padding: 18px 0;
  display: flex; align-items: center; justify-content: space-between;
  font-size: .75rem; color: rgba(255,255,255,.35); gap: 16px; flex-wrap: wrap;
}
.footer-pay-icons { display: flex; gap: 8px; }
.pay-chip {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 5px; padding: 4px 10px; font-size: .69rem;
  color: rgba(255,255,255,.45);
}

/* ═══════════════════════════════════════════
   WOOCOMMERCE
   ═══════════════════════════════════════════ */
.woocommerce-wrapper { padding: 60px 0; }

.woocommerce ul.products { margin: 0 !important; padding: 0; }
/* ── WooCommerce product loop cards ── */
.woocommerce ul.products li.product {
  background: var(--surface) !important;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: var(--r-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--shadow-sm) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-5px) !important;
  border-color: var(--cyan) !important;
  box-shadow: var(--shadow-card-h) !important;
}

/* Link wrapper (image + title + price) fills card */
.woocommerce ul.products li.product a.woocommerce-loop-product__link {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  text-decoration: none !important;
  padding: 0 !important;
}

/* Image area */
.woocommerce ul.products li.product a.woocommerce-loop-product__link img {
  width: 100% !important;
  aspect-ratio: 1 !important;
  object-fit: cover !important;
  display: block !important;
  background: var(--panel) !important;
  transition: transform .5s ease !important;
}
.woocommerce ul.products li.product:hover a.woocommerce-loop-product__link img {
  transform: scale(1.04) !important;
}

/* Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-head) !important;
  font-size: .97rem !important;
  font-weight: 700 !important;
  color: var(--t1) !important;
  text-align: center !important;
  padding: 16px 16px 6px !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

/* Price */
.woocommerce ul.products li.product .price {
  font-family: var(--font-head) !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  color: var(--cyan) !important;
  text-align: center !important;
  display: block !important;
  padding: 4px 16px 16px !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product .price del {
  font-size: .8rem !important;
  color: var(--t3) !important;
  font-weight: 400 !important;
  margin-right: 5px !important;
}

/* Stars — gold + centered in product loops */
.woocommerce ul.products li.product .star-rating {
  float: none !important;
  align-self: center !important;
  margin: 0 0 4px !important;
}
.star-rating span::before,
.star-rating span { color: #e6a817 !important; }

/* Add to cart button — full width, with breathing room */
.woocommerce ul.products li.product a.button.add_to_cart_button {
  display: block !important;
  width: calc(100% - 32px) !important;
  margin: 0 16px 16px !important;
  padding: 11px 16px !important;
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-family: var(--font-head) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  letter-spacing: .02em !important;
  box-shadow: 0 3px 12px rgba(0,149,208,.28) !important;
  transition: filter .2s, transform .15s, box-shadow .2s !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
}
.woocommerce ul.products li.product a.button.add_to_cart_button:hover {
  filter: brightness(1.1) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0,149,208,.4) !important;
}
.woocommerce ul.products li.product a.button.add_to_cart_button.loading {
  opacity: .7 !important;
}
.woocommerce ul.products li.product a.button.add_to_cart_button.added {
  background: linear-gradient(135deg, var(--green) 0%, var(--green-dk) 100%) !important;
  box-shadow: 0 3px 12px rgba(0,179,122,.3) !important;
}

/* Weiterlesen-Button (ausverkauft) im Produkt-Grid — identisch zum Add-to-Cart */
.woocommerce ul.products li.product a.button:not(.add_to_cart_button) {
  display: block !important;
  width: calc(100% - 32px) !important;
  margin: 0 16px 16px !important;
  padding: 11px 16px !important;
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-family: var(--font-head) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  letter-spacing: .02em !important;
  box-shadow: 0 3px 12px rgba(0,149,208,.28) !important;
  transition: filter .2s, transform .15s, box-shadow .2s !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
}
.woocommerce ul.products li.product a.button:not(.add_to_cart_button):hover {
  filter: brightness(1.1) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0,149,208,.4) !important;
}
/* Ausgegraut für Ausverkauft / Coming Soon — Shop-Seite */
.woocommerce ul.products li.product.outofstock a.button:not(.add_to_cart_button),
.woocommerce ul.products li.product.coming-soon a.button:not(.add_to_cart_button) {
  background: var(--border-gray) !important;
  color: var(--t3) !important;
  box-shadow: none !important;
  cursor: default !important;
  filter: none !important;
}
.woocommerce ul.products li.product.outofstock a.button:not(.add_to_cart_button):hover,
.woocommerce ul.products li.product.coming-soon a.button:not(.add_to_cart_button):hover {
  background: #d0d0d0 !important;
  color: var(--t2) !important;
  border: 1.5px solid rgba(0,149,208,.4) !important;
  box-shadow: 0 0 0 3px rgba(0,149,208,.08) !important;
  transform: translateY(-2px) !important;
  filter: none !important;
}

/* Ausverkauft — Badge-Position für WooCommerce-Loop und Startseiten-Cards */
.woocommerce ul.products li.product.outofstock,
.product-card.outofstock {
  position: relative;
}
/* Badge wird per PHP in .product-badges eingefügt (beide Kontexte) */
.woocommerce ul.products li.product .p-badge-outofstock {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
}
/* Durchgestrichener Preis — nur für das ausverkaufte Produkt selbst, nicht für ähnliche Produkte */
.woocommerce ul.products li.product.outofstock .price,
body.outofstock .woocommerce div.product .summary .price,
.outofstock .product-price {
  text-decoration: line-through !important;
  opacity: .55 !important;
  color: var(--t2) !important;
}

/* Other WooCommerce buttons (checkout, cart etc.) */
.woocommerce a.button:not(.add_to_cart_button),
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk)) !important;
  color: #fff !important;
  font-weight: 700 !important;
  border-radius: 100px !important;
  border: none !important;
  font-family: var(--font-head) !important;
  box-shadow: var(--shadow-btn) !important;
  transition: filter .2s, transform .15s !important;
}
.woocommerce a.button:not(.add_to_cart_button):hover,
.woocommerce button.button:hover,
.woocommerce #place_order:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0,149,208,.35) !important;
}
.woocommerce .woocommerce-breadcrumb { color: var(--t3) !important; font-size: .82rem; }
.woocommerce .woocommerce-breadcrumb a { color: var(--t2) !important; }
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
  background: var(--cyan-lt) !important;
  border-top-color: var(--cyan) !important;
  color: var(--t1) !important;
}
.woocommerce .product_title { font-family: var(--font-head) !important; color: var(--t1) !important; }
.woocommerce .price { color: var(--cyan) !important; font-family: var(--font-head) !important; }

/* Single product */
.woocommerce div.product { color: var(--t2); display: flow-root; }

/* Panels außer dem ersten standardmäßig versteckt — WC JS zeigt den aktiven */
#tab-reviews,
#tab-additional_information { display: none; }
.woocommerce div.product .woocommerce-product-gallery {
  border-radius: var(--r-lg); overflow: hidden; border: 1.5px solid var(--border-gray);
}
.woocommerce div.product form.cart .quantity input {
  background: var(--bg); border: 1.5px solid var(--border-gray);
  color: var(--t1); border-radius: 8px; padding: 8px 12px;
}

/* Peptide specs */
.peptide-specs {
  background: var(--panel); border: 1px solid var(--border-gray);
  border-radius: var(--r); padding: 14px 18px; margin-bottom: 18px;
}
.peptide-spec {
  font-size: .85rem; color: var(--t2);
  padding: 5px 0; border-bottom: 1px solid var(--border-gray);
  display: flex; gap: 8px;
}
.peptide-spec:last-child { border-bottom: none; }
.peptide-spec strong { color: var(--cyan); min-width: 140px; flex-shrink: 0; }

/* ═══════════════════════════════════════════
   PRODUCT SUMMARY — SINGLE PRODUCT PAGE
   ═══════════════════════════════════════════ */

/* Outer wrapper — white card with border */
.woocommerce div.product .summary.entry-summary {
  background: var(--surface) !important;
  border: 2px solid rgba(0,149,208,.22) !important;
  border-radius: var(--r-lg) !important;
  padding: 36px 40px !important;
  box-shadow: var(--shadow-md) !important;
  box-sizing: border-box !important;
}

/* Product title */
.woocommerce div.product h1.product_title {
  font-family: var(--font-head) !important;
  font-size: clamp(1.55rem, 3.5vw, 2.1rem) !important;
  font-weight: 800 !important;
  color: var(--navy) !important;
  line-height: 1.2 !important;
  margin: 0 0 10px !important;
  letter-spacing: -.02em;
}
.woocommerce div.product h1.product_title::after {
  content: '';
  display: block;
  width: 52px;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--cyan) 0%, var(--green) 100%);
  margin-top: 12px;
}

/* Price */
.woocommerce div.product .summary .price {
  font-family: var(--font-head) !important;
  font-size: 2rem !important;
  font-weight: 800 !important;
  color: var(--cyan) !important;
  display: block;
  margin: 20px 0 22px !important;
  line-height: 1;
}
.woocommerce div.product .summary .price del {
  font-size: 1.1rem !important;
  color: var(--t3) !important;
  font-weight: 400 !important;
  margin-right: 8px;
}

/* Short description box */
.woocommerce div.product .woocommerce-product-details__short-description {
  background: var(--cyan-lt);
  border-left: 4px solid var(--cyan);
  border-radius: 0 var(--r) var(--r) 0;
  padding: 18px 22px;
  margin-bottom: 22px;
  color: var(--t2) !important;
  font-size: .95rem;
  line-height: 1.75;
}
/* Reset inner wrapper — no extra border */
.woocommerce div.product .woocommerce-product-details__short-description .product-short-desc {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  border-radius: 0;
}
.woocommerce div.product .woocommerce-product-details__short-description p,
.woocommerce div.product .woocommerce-product-details__short-description .product-short-desc p {
  margin: 0 !important;
  color: var(--t2) !important;
}

/* Stock badge */
.woocommerce div.product .summary p.stock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .82rem !important;
  font-weight: 600 !important;
  padding: 5px 14px !important;
  border-radius: 100px !important;
  margin-bottom: 22px !important;
  letter-spacing: .03em;
}
.woocommerce div.product .summary p.stock.in-stock {
  background: var(--green-lt) !important;
  color: var(--green-dk) !important;
  border: 1.5px solid rgba(0,179,122,.25) !important;
}
.woocommerce div.product .summary p.stock.in-stock::before {
  content: '●';
  font-size: .55rem;
  color: var(--green);
}
.woocommerce div.product .summary p.stock.out-of-stock {
  background: #fdf0f0 !important;
  color: #c0392b !important;
  border: 1.5px solid rgba(192,57,43,.2) !important;
}
.woocommerce div.product .summary p.stock.low-stock {
  background: #fff8e6 !important;
  color: #9a6200 !important;
  border: 1.5px solid rgba(230,168,23,.35) !important;
}
.woocommerce div.product .summary p.stock.low-stock::before {
  content: '●';
  font-size: .55rem;
  color: #e6a817;
}

/* Cart form — qty + button row */
.woocommerce div.product form.cart {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  margin-bottom: 20px !important;
}

/* Quantity input */
.woocommerce div.product form.cart .quantity {
  display: flex !important;
  align-items: center !important;
}
.woocommerce div.product form.cart .quantity input[type=number] {
  width: 72px !important;
  height: 50px !important;
  padding: 0 12px !important;
  background: var(--bg) !important;
  border: 2px solid var(--border-gray) !important;
  border-radius: var(--r) !important;
  font-family: var(--font-head) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--t1) !important;
  text-align: center !important;
  transition: border-color .2s !important;
  -moz-appearance: textfield !important;
}
.woocommerce div.product form.cart .quantity input[type=number]:focus {
  outline: none !important;
  border-color: var(--cyan) !important;
  box-shadow: 0 0 0 3px rgba(0,149,208,.12) !important;
}
.woocommerce div.product form.cart .quantity input[type=number]::-webkit-inner-spin-button,
.woocommerce div.product form.cart .quantity input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

/* Add-to-cart button */
.woocommerce div.product form.cart .single_add_to_cart_button {
  flex: 1 1 auto !important;
  min-width: 180px !important;
  height: 50px !important;
  padding: 0 30px !important;
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-family: var(--font-head) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  cursor: pointer !important;
  transition: filter .2s, transform .15s, box-shadow .2s !important;
  box-shadow: 0 4px 16px rgba(0,149,208,.35) !important;
  white-space: nowrap;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
  filter: brightness(1.1) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0,149,208,.45) !important;
}
.woocommerce div.product form.cart .single_add_to_cart_button:active {
  transform: translateY(0) !important;
}


/* Product meta (category + SKU) */
.woocommerce div.product .product_meta {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1.5px solid var(--border-gray);
  font-size: .83rem;
  color: var(--t3);
  line-height: 2;
}
.woocommerce div.product .product_meta .posted_in,
.woocommerce div.product .product_meta .tagged_as,
.woocommerce div.product .product_meta .sku_wrapper {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.woocommerce div.product .product_meta .posted_in span,
.woocommerce div.product .product_meta .tagged_as span,
.woocommerce div.product .product_meta .sku_wrapper span { font-weight: 600; color: var(--t2); }
.woocommerce div.product .product_meta a {
  color: var(--cyan) !important;
  text-decoration: none !important;
  font-weight: 600;
}
.woocommerce div.product .product_meta a:hover { text-decoration: underline !important; }

/* Peptide specs inside summary */
.woocommerce div.product .summary .peptide-specs {
  margin-top: 22px;
  background: var(--panel);
  border: 1.5px solid rgba(0,149,208,.2);
  border-radius: var(--r);
  padding: 18px 22px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 6px 20px;
}
.woocommerce div.product .summary .peptide-spec {
  font-size: .83rem;
  color: var(--t2);
  padding: 7px 0;
  border-bottom: 1px solid rgba(0,149,208,.12);
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.woocommerce div.product .summary .peptide-spec:last-child { border-bottom: none; }
.woocommerce div.product .summary .peptide-spec strong {
  color: var(--navy);
  font-weight: 700;
  min-width: 130px;
  flex-shrink: 0;
  font-size: .78rem;
  letter-spacing: .03em;
  text-transform: uppercase;
}

/* Related / upsell products */
.woocommerce .related,
.woocommerce .up-sells {
  margin-top: 56px !important;
  clear: both !important;
}
.woocommerce .related > h2,
.woocommerce .up-sells > h2 {
  font-family: var(--font-head) !important;
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  color: var(--navy) !important;
  margin-bottom: 28px !important;
  padding-bottom: 14px !important;
  border-bottom: 2px solid var(--border-gray) !important;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  background: var(--surface) !important; border: 1.5px solid var(--border-gray) !important;
  color: var(--t2) !important; border-radius: 8px !important; margin: 2px !important;
}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--cyan) !important; color: #fff !important; border-color: var(--cyan) !important;
}

/* ─── Product Review Cards ─── */
#reviews { color: var(--t1); }
#reviews ol.commentlist {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 14px;
}
#reviews ol.commentlist li.comment { padding: 0; border: none; }
#reviews ol.commentlist li.comment .comment_container {
  display: flex; gap: 18px;
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  padding: 20px 24px;
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
  transition: border-color .2s, box-shadow .2s;
}
#reviews ol.commentlist li.comment .comment_container:hover {
  border-color: rgba(0,149,208,.3);
  box-shadow: 0 4px 18px rgba(0,0,0,.1);
}
#reviews ol.commentlist img.avatar {
  width: 46px; height: 46px; border-radius: 50%;
  border: 2px solid var(--border-gray);
  flex-shrink: 0; margin: 0;
}
#reviews ol.commentlist .comment-text { flex: 1; min-width: 0; }
#reviews .comment-text .star-rating { font-size: .95rem; margin: 0 0 10px; float: none !important; }
#reviews .comment-text p.meta {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 5px; margin: 0 0 10px; padding: 0;
}
#reviews .woocommerce-review__author {
  font-weight: 700; font-size: .95rem; color: var(--t1); margin-right: 2px;
}
#reviews .woocommerce-review__dash { color: var(--t3); }
#reviews .woocommerce-review__published-date {
  font-size: .8rem; color: var(--t3); font-style: normal;
}
#reviews .r24-verified-badge {
  font-size: .75rem; font-style: normal; font-weight: 600;
  color: #15803d; background: #f0fdf4;
  border: 1px solid #bbf7d0; border-radius: 50px;
  padding: 2px 9px; white-space: nowrap;
}
#reviews .description p {
  margin: 0; font-size: .93rem;
  color: var(--t2) !important; line-height: 1.65;
}
#reviews .description p a { color: var(--t2) !important; }

/* Review forms */
.woocommerce #review_form #respond {
  background: var(--surface); border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg); padding: 26px;
}
.woocommerce #review_form #respond label { color: var(--t2); }
.woocommerce #review_form #respond input,
.woocommerce #review_form #respond textarea {
  background: var(--bg) !important; border: 1.5px solid var(--border-gray) !important;
  color: var(--t1) !important; border-radius: 8px !important;
}

/* Short description */
.product-short-desc { color: var(--t2); }

/* ═══════════════════════════════════════════
   CALCULATOR
   ═══════════════════════════════════════════ */
.calculator-card {
  background: var(--surface); border: 1.5px solid var(--border-gray);
  border-radius: var(--r-xl); padding: 40px;
  max-width: 640px; margin: 0 auto; box-shadow: var(--shadow-md);
}
.calc-row { margin-bottom: 20px; }
.calc-row label {
  display: block; font-size: .84rem; font-weight: 600;
  color: var(--t2); margin-bottom: 7px;
}
.calc-row input, .calc-row select {
  width: 100%; padding: 11px 16px;
  background: var(--bg); border: 1.5px solid var(--border-gray);
  border-radius: 10px; font-size: .9rem; color: var(--t1);
  outline: none; font-family: var(--font-body);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.calc-row input:focus, .calc-row select:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(0,149,208,.1);
}
.calc-result {
  background: var(--cyan-lt); border: 1.5px solid rgba(0,149,208,.25);
  border-radius: 12px; padding: 18px;
  text-align: center; font-size: 1.05rem; font-weight: 700;
  color: var(--cyan); font-family: var(--font-head);
}
.calc-result--active { background: #e8f7f0; border-color: #34c98040; color: #1a8a56; }
.calc-result--active small { display:block; font-size:.8rem; font-weight:500; color:#6b7280; margin-top:4px; }

/* ═══════════════════════════════════════════
   GENERAL PAGE CONTENT
   ═══════════════════════════════════════════ */
.page-content h1,
.page-content h2,
.page-content h3 { color: var(--t1); margin-bottom: .5em; margin-top: 1.4em; }
.page-content p { color: var(--t2); margin-bottom: 1em; }
.page-content a { color: var(--cyan); }
.page-content table { width: 100%; border-collapse: collapse; margin: 1.5em 0; }
.page-content table th {
  background: var(--cyan-lt); color: var(--cyan); padding: 10px 14px;
  border: 1px solid var(--border-gray); font-size: .83rem;
}
.page-content table td {
  padding: 10px 14px; border: 1px solid var(--border-gray);
  color: var(--t2); font-size: .85rem;
}
.page-content ul, .page-content ol {
  margin: 0 0 1.2em 1.4em; color: var(--t2);
}
.page-content ul { list-style: disc; }
.page-content ol { list-style: decimal; }
.page-content li { margin-bottom: .45em; font-size: .95rem; line-height: 1.6; }
.page-content strong { color: var(--t1); }
.page-content { max-width: 780px; }
.woocommerce-cart .page-content,
.woocommerce-checkout .page-content { max-width: none; }

/* Dropdown-Divider für Wirkstoffe-Links im Header */
.dropdown .dropdown-divider {
  display: block; padding: 8px 16px 4px;
  font-size: .68rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--t3);
  border-top: 1px solid var(--border-gray); margin-top: 4px;
  pointer-events: none;
}

/* Info-Banner (Wirkstoff-Infoseite unter Produkt-Tabs + Kategorieseiten) */
.r24-info-banner { margin: 28px 0 4px; }
.r24-info-banner__link {
  display: flex; align-items: center; gap: 18px;
  background: linear-gradient(135deg, var(--cyan-lt) 0%, var(--surface) 60%);
  border: 1px solid rgba(0,149,208,.22);
  border-left: 4px solid var(--cyan);
  border-radius: 12px; padding: 16px 20px;
  text-decoration: none; color: inherit;
  box-shadow: 0 2px 10px rgba(0,149,208,.08);
  transition: border-color .2s, background .2s, box-shadow .2s, transform .15s;
}
.r24-info-banner__link:hover {
  border-color: var(--cyan); background: linear-gradient(135deg, #c6e8f8 0%, var(--cyan-lt) 100%);
  box-shadow: 0 4px 18px rgba(0,149,208,.18); transform: translateY(-1px);
}
.r24-info-banner__icon {
  flex-shrink: 0; width: 40px; height: 40px;
  background: var(--cyan); border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: #fff; line-height: 1;
}
.r24-info-banner__text { flex: 1; min-width: 0; }
.r24-info-banner__text strong {
  display: block; font-size: 14px; font-weight: 700; color: var(--t1); margin-bottom: 4px;
}
.r24-info-banner__text span { font-size: 12.5px; color: var(--t2); }
.r24-info-banner__arrow {
  color: var(--cyan); font-size: 20px; flex-shrink: 0;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(0,149,208,.1);
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, transform .2s;
}
.r24-info-banner__link:hover .r24-info-banner__arrow {
  background: var(--cyan); color: #fff; transform: translateX(3px);
}

/* WooCommerce Ordering + Result Count */
.woocommerce-result-count {
  font-size: 13px; color: var(--t3); margin: 0; align-self: center;
}
form.woocommerce-ordering {
  margin: 0;
}
form.woocommerce-ordering select,
.woocommerce-ordering select {
  appearance: none; -webkit-appearance: none;
  background-color: var(--surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230095d0' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  border: 1.5px solid var(--border-gray);
  border-radius: 8px;
  padding: 8px 36px 8px 14px;
  font-size: 13px; font-family: var(--font-body);
  color: var(--t1); cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: border-color .2s, box-shadow .2s;
  min-width: 180px;
}
form.woocommerce-ordering select:hover,
.woocommerce-ordering select:hover {
  border-color: var(--cyan); box-shadow: 0 0 0 3px var(--cyan-glow);
}
form.woocommerce-ordering select:focus,
.woocommerce-ordering select:focus {
  outline: none; border-color: var(--cyan); box-shadow: 0 0 0 3px var(--cyan-glow);
}

/* Kategorie-Header: Abstand zwischen Titel und SEO-Beschreibung */
.woocommerce-products-header__title { margin-bottom: 32px; }
.woocommerce-products-header .term-description {
  margin-top: 0; padding-top: 28px;
  border-top: 1px solid var(--border-gray);
  font-size: 14px; color: var(--t2); line-height: 1.7;
  max-width: 820px;
}

/* Breadcrumbs */
.breadcrumbs {
  padding: 14px 0; border-bottom: 1px solid var(--border-gray);
  font-size: .8rem; color: var(--t3); background: var(--surface);
}
.breadcrumbs a { color: var(--t2); }
.breadcrumbs a:hover { color: var(--cyan); }
.breadcrumbs span { margin: 0 6px; opacity: .4; }

/* Cookie notice */
#cookie-notice {
  background: rgba(255,255,255,.97) !important;
  border-top: 2px solid var(--cyan) !important;
  box-shadow: 0 -4px 20px rgba(0,0,0,.1) !important;
  color: var(--t2) !important;
}
#cookie-notice .cn-button {
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk)) !important;
  color: #fff !important; font-weight: 700 !important;
  border-radius: 8px !important;
}

/* ═══════════════════════════════════════════
   UTILITIES
   ═══════════════════════════════════════════ */
.text-cyan   { color: var(--cyan); }
.text-green  { color: var(--green); }
.text-muted  { color: var(--t3); }
.text-center { text-align: center; }

/* ═══════════════════════════════════════════
   PRODUCT PAGE — TABS & DESCRIPTION
   ═══════════════════════════════════════════ */

.woocommerce div.product .woocommerce-tabs {
  margin-top: 48px;
}

/* ── Tab buttons ── */
.woocommerce-tabs .tabs.wc-tabs {
  display: flex !important;
  gap: 8px !important;
  list-style: none !important;
  padding: 0 0 20px 0 !important;
  margin: 0 !important;
  background: none !important;
  border-bottom: none !important;
  flex-wrap: wrap !important;
}
.woocommerce-tabs .tabs.wc-tabs li {
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  z-index: auto !important;
}
.woocommerce-tabs .tabs.wc-tabs li::before,
.woocommerce-tabs .tabs.wc-tabs li::after {
  display: none !important;
}
.woocommerce-tabs .tabs.wc-tabs li a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 10px 24px !important;
  font-family: var(--font-head) !important;
  font-size: .88rem !important;
  font-weight: 600 !important;
  color: var(--t2) !important;
  text-decoration: none !important;
  background: var(--surface) !important;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: 100px !important;
  transition: color .18s, background .18s, border-color .18s !important;
}
.woocommerce-tabs .tabs.wc-tabs li a:hover {
  color: var(--cyan) !important;
  background: var(--cyan-lt) !important;
  border-color: rgba(0,149,208,.35) !important;
}
.woocommerce-tabs .tabs.wc-tabs li.active a {
  color: #fff !important;
  background: var(--cyan) !important;
  border-color: var(--cyan) !important;
  box-shadow: 0 3px 12px rgba(0,149,208,.3) !important;
}

/* ── Tab panel wrapper ── */
.woocommerce-Tabs-panel {
  background: var(--surface) !important;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: var(--r-lg) !important;
  padding: 48px 52px !important;
  box-shadow: var(--shadow-md) !important;
}

/* ── Typography ── */
.woocommerce-Tabs-panel > *:first-child { margin-top: 0 !important; }
.woocommerce-Tabs-panel > *:last-child  { margin-bottom: 0 !important; }

.woocommerce-Tabs-panel p {
  color: var(--t2);
  line-height: 1.9;
  margin-bottom: 1.2em;
  font-size: .96rem;
}

.woocommerce-Tabs-panel h2 {
  font-family: var(--font-head);
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--navy);
  margin: 2em 0 .7em;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--border-gray);
}
.woocommerce-Tabs-panel h3 {
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 700;
  color: var(--t1);
  margin: 1.8em 0 .6em;
  display: flex;
  align-items: center;
  gap: 10px;
}
.woocommerce-Tabs-panel h3::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 1.1em;
  background: linear-gradient(180deg, var(--cyan) 0%, var(--green) 100%);
  border-radius: 3px;
  flex-shrink: 0;
}
.woocommerce-Tabs-panel h4 {
  font-family: var(--font-head);
  font-size: .98rem;
  font-weight: 700;
  color: var(--t1);
  margin: 1.4em 0 .5em;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .8rem;
  color: var(--t3);
}

/* ── Tables ── */
.woocommerce-Tabs-panel table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.6em 0;
  font-size: .9rem;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--border-gray);
}
.woocommerce-Tabs-panel table thead th {
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 14px 20px;
  text-align: left;
}
.woocommerce-Tabs-panel table tbody tr:nth-child(even) td { background: var(--panel); }
.woocommerce-Tabs-panel table tbody tr:nth-child(odd)  td { background: var(--surface); }
.woocommerce-Tabs-panel table tbody tr:hover td { background: var(--cyan-lt); }
.woocommerce-Tabs-panel table td {
  padding: 13px 20px;
  border-bottom: 1px solid var(--border-gray);
  color: var(--t2);
  line-height: 1.55;
  vertical-align: middle;
}
.woocommerce-Tabs-panel table tbody tr:last-child td { border-bottom: none; }
.woocommerce-Tabs-panel table td:first-child {
  font-weight: 600;
  color: var(--t1);
  width: 36%;
}

/* ── Lists ── */
.woocommerce-Tabs-panel ul,
.woocommerce-Tabs-panel ol {
  margin: .9em 0 1.4em 0;
  padding-left: 0;
  list-style: none;
}
.woocommerce-Tabs-panel ul li,
.woocommerce-Tabs-panel ol li {
  color: var(--t2);
  line-height: 1.85;
  margin-bottom: .55em;
  font-size: .95rem;
  padding-left: 1.6em;
  position: relative;
}
.woocommerce-Tabs-panel ul li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: .62em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cyan);
}
.woocommerce-Tabs-panel ol { counter-reset: ol-c; }
.woocommerce-Tabs-panel ol li { counter-increment: ol-c; }
.woocommerce-Tabs-panel ol li::before {
  content: counter(ol-c) '.';
  position: absolute;
  left: 0;
  color: var(--cyan);
  font-weight: 700;
  font-size: .8rem;
}

/* ── Inline formatting ── */
.woocommerce-Tabs-panel strong { color: var(--t1); font-weight: 700; }
.woocommerce-Tabs-panel em { font-style: italic; color: var(--t2); }

/* ── Disclaimer / info box ── */
.woocommerce-Tabs-panel p:last-child:has(em),
.woocommerce-Tabs-panel .disclaimer {
  background: var(--panel);
  border-radius: var(--r);
  padding: 16px 22px;
  margin-top: 2em;
}
.woocommerce-Tabs-panel p:last-child em,
.woocommerce-Tabs-panel p em {
  display: block;
  font-size: .83rem;
  color: var(--t3);
  font-style: normal;
  line-height: 1.7;
}

/* ── Reviews tab ── */
.woocommerce-Reviews { }
/* Formular nur via E-Mail-Link zugänglich — auf Produktseite ausblenden */
.woocommerce-Reviews #review_form_wrapper { display: none !important; }
.cr-review-hint {
  text-align: center;
  padding: 24px 0 8px;
  color: var(--t3);
  font-size: .88rem;
}
.woocommerce-Reviews #review_form_wrapper {
  background: var(--bg);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  padding: 32px 36px;
  margin-top: 32px;
}
.woocommerce-Reviews #review_form_wrapper h3 {
  font-family: var(--font-head);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 20px;
  padding: 0;
  border: none;
  display: block;
}
.woocommerce-Reviews #review_form_wrapper h3::before { display: none; }
.woocommerce-Reviews .comment-form label {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  color: var(--t2);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 6px;
}
.woocommerce-Reviews .comment-form input[type=text],
.woocommerce-Reviews .comment-form input[type=email],
.woocommerce-Reviews .comment-form textarea {
  width: 100%;
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r);
  padding: 11px 15px;
  font-family: var(--font-body);
  font-size: .92rem;
  color: var(--t1);
  transition: border-color .2s;
  box-sizing: border-box;
}
.woocommerce-Reviews .comment-form input:focus,
.woocommerce-Reviews .comment-form textarea:focus {
  outline: none;
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(0,149,208,.1);
}
.woocommerce-Reviews .comment-form .form-submit input {
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%);
  color: #fff;
  border: none;
  border-radius: 100px;
  padding: 12px 32px;
  font-family: var(--font-head);
  font-size: .9rem;
  font-weight: 700;
  cursor: pointer;
  transition: filter .2s, transform .15s;
  box-shadow: 0 4px 14px rgba(0,149,208,.3);
  width: auto;
}
.woocommerce-Reviews .comment-form .form-submit input:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}
.woocommerce-noreviews {
  text-align: center;
  padding: 32px 0 8px;
  color: var(--t3);
  font-size: .95rem;
}

/* "No reviews yet" text */
.woocommerce-noreviews {
  color: var(--t3); font-size: .9rem;
  padding: 20px 0; text-align: center;
}

/* Wrapper for single product */

/* ═══════════════════════════════════════════
   ANIMATIONS
   ═══════════════════════════════════════════ */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.anim-fade-up { animation: fade-up .6s ease both; }
.anim-delay-1 { animation-delay: .1s; }
.anim-delay-2 { animation-delay: .2s; }
.anim-delay-3 { animation-delay: .3s; }
.anim-delay-4 { animation-delay: .4s; }

/* ═══════════════════════════════════════════
   FAQ PAGE
   ═══════════════════════════════════════════ */
.faq-page { padding-bottom: 80px; }

.faq-hero {
  background: linear-gradient(135deg, var(--navy) 0%, #0d2d52 100%);
  padding: 60px 0 52px;
  text-align: center;
  margin-bottom: 48px;
}
.faq-hero .pretitle { color: var(--cyan); opacity: 1; }
.faq-hero h1 {
  font-family: var(--font-head);
  font-size: 2.2rem;
  font-weight: 800;
  color: #fff;
  margin: 10px 0 14px;
}
.faq-hero p { color: rgba(255,255,255,.65); font-size: 1rem; }

.faq-container { max-width: 820px; }

/* Kategorie-Tabs */
.faq-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}
.faq-tab {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  color: var(--t2);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: .82rem;
  padding: 8px 18px;
  border-radius: 100px;
  cursor: pointer;
  transition: all var(--t-fast);
  white-space: nowrap;
}
.faq-tab:hover { border-color: var(--cyan); color: var(--cyan); }
.faq-tab.active {
  background: var(--cyan);
  border-color: var(--cyan);
  color: #fff;
  box-shadow: var(--shadow-btn);
}

/* FAQ Akkordeon */
.faq-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 56px; }

.faq-item {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.faq-item.open {
  border-color: var(--cyan);
  box-shadow: 0 4px 20px rgba(0,149,208,.1);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  text-align: left;
  transition: background var(--t-fast);
}
.faq-question:hover { background: var(--cyan-lt); }
.faq-item.open .faq-question { background: var(--cyan-lt); }

.faq-question span:first-child {
  font-family: var(--font-head);
  font-size: .97rem;
  font-weight: 700;
  color: var(--t1);
  line-height: 1.4;
}
.faq-icon {
  flex-shrink: 0;
  color: var(--cyan);
  transition: transform var(--t-fast);
  display: flex;
}
.faq-item.open .faq-icon { transform: rotate(180deg); }

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.faq-answer-inner {
  padding: 0 22px 20px;
  font-size: .92rem;
  color: var(--t2);
  line-height: 1.7;
  border-top: 1px solid var(--border-gray);
  padding-top: 16px;
}
.faq-answer-inner a { color: var(--cyan); text-decoration: underline; }
.faq-answer-inner strong { color: var(--t1); }

/* FAQ CTA */
.faq-cta {
  background: linear-gradient(135deg, var(--navy) 0%, #0d2d52 100%);
  border-radius: var(--r-xl);
  padding: 48px 40px;
  text-align: center;
}
.faq-cta-icon { font-size: 2.4rem; margin-bottom: 14px; }
.faq-cta h3 {
  font-family: var(--font-head);
  font-size: 1.4rem;
  font-weight: 800;
  color: #fff;
  margin: 0 0 10px;
}
.faq-cta p { color: rgba(255,255,255,.65); margin-bottom: 24px; }

@media (max-width: 768px) {
  .faq-hero { padding: 40px 0 36px; }
  .faq-hero h1 { font-size: 1.6rem; }
  .faq-tabs { gap: 6px; }
  .faq-tab { font-size: .78rem; padding: 7px 14px; }
  .faq-question { padding: 15px 16px; }
  .faq-question span:first-child { font-size: .9rem; }
  .faq-answer-inner { padding: 14px 16px 16px; }
  .faq-cta { padding: 32px 20px; }
}

/* ═══════════════════════════════════════════
   NEWS POPUP
   ═══════════════════════════════════════════ */
.r24-popup {
  position: fixed;
  z-index: 9999;
  width: 340px;
  max-width: calc(100vw - 32px);
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: 0 20px 60px rgba(0,0,0,.2), 0 4px 16px rgba(0,0,0,.12);
  border: 1.5px solid var(--border-gray);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .35s ease, transform .35s ease;
  overflow: hidden;
}
.r24-popup--visible {
  opacity: 1;
  transform: translateY(0);
}
.r24-popup--bottom-right { bottom: 24px; right: 24px; }
.r24-popup--bottom-left  { bottom: 24px; left: 24px; }
.r24-popup--center {
  top: 50%; left: 50%;
  transform: translate(-50%, -40%);
  width: 420px;
}
.r24-popup--center.r24-popup--visible {
  transform: translate(-50%, -50%);
}

.r24-popup-inner {
  padding: 24px 24px 20px;
  border-top: 4px solid var(--cyan);
  position: relative;
}
.r24-popup-close {
  position: absolute; top: 14px; right: 14px;
  background: var(--bg); border: 1px solid var(--border-gray);
  color: var(--t3); width: 28px; height: 28px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all var(--t-fast);
}
.r24-popup-close:hover { border-color: var(--cyan); color: var(--cyan); }

.r24-popup-badge {
  display: inline-block;
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk));
  color: #fff; font-size: .7rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  padding: 4px 12px; border-radius: 100px;
  margin-bottom: 12px;
}
.r24-popup-title {
  font-family: var(--font-head);
  font-size: 1.1rem; font-weight: 800;
  color: var(--t1); margin: 0 0 10px;
  padding-right: 24px;
  line-height: 1.3;
}
.r24-popup-msg {
  font-size: .88rem; color: var(--t2);
  line-height: 1.65; margin-bottom: 18px;
}
.r24-popup-msg a { color: var(--cyan); text-decoration: underline; }
.r24-popup-msg strong { color: var(--t1); }
.r24-popup-btn {
  width: 100%;
  justify-content: center;
  font-size: .9rem !important;
}

/* Foto-Popup */
.r24-popup--image {
  width: 360px;
  border: none;
  background: transparent;
  box-shadow: 0 24px 64px rgba(0,0,0,.35);
}
.r24-popup-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--r-xl);
}
.r24-popup-close--img {
  position: absolute;
  top: 10px; right: 10px;
  background: rgba(0,0,0,.55);
  border-color: transparent;
  color: #fff;
  z-index: 2;
  border-radius: 50%;
  width: 32px; height: 32px;
}
.r24-popup-close--img:hover {
  background: rgba(0,0,0,.82);
  border-color: transparent;
  color: #fff;
}

@media (max-width: 480px) {
  .r24-popup--bottom-right,
  .r24-popup--bottom-left {
    bottom: 16px; right: 16px; left: 16px; width: auto;
  }
  .r24-popup--center { width: calc(100vw - 32px); top: auto; bottom: 16px; left: 16px; right: 16px; transform: translateY(20px); }
  .r24-popup--center.r24-popup--visible { transform: translateY(0); }
  .r24-popup--image { top: 16px !important; bottom: auto !important; left: 16px !important; right: 16px !important; width: calc(100vw - 32px); transform: translateY(-20px) !important; }
  .r24-popup--image.r24-popup--visible { transform: translateY(0) !important; }
}

/* ═══════════════════════════════════════════
   ANWENDUNGSANLEITUNG
   ═══════════════════════════════════════════ */
.guide-page { padding-bottom: 80px; }
.guide-container { max-width: 860px; }

/* Disclaimer */
.guide-disclaimer {
  display: flex; align-items: flex-start; gap: 14px;
  background: #fff8e1; border: 1.5px solid #f5c518;
  border-radius: var(--r-lg); padding: 16px 20px;
  font-size: .88rem; color: #7a5f00; line-height: 1.6;
  margin-bottom: 48px;
}
.guide-disclaimer-icon { font-size: 1.4rem; flex-shrink: 0; }
.guide-disclaimer strong { display: block; color: #5a4000; margin-bottom: 4px; }

/* Materialien */
.guide-materials { margin-bottom: 48px; }
.guide-materials-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.material-card {
  background: var(--surface); border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg); padding: 20px 16px; text-align: center;
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.material-card:hover { border-color: var(--cyan); transform: translateY(-2px); }
.material-icon { font-size: 2rem; margin-bottom: 10px; }
.material-card h4 { font-family: var(--font-head); font-size: .9rem; font-weight: 700; color: var(--t1); margin: 0 0 6px; }
.material-card p { font-size: .78rem; color: var(--t2); line-height: 1.5; margin: 0; }
.material-card a { color: var(--cyan); }

/* Steps */
.guide-steps-section { margin-bottom: 48px; }
.guide-steps { display: flex; flex-direction: column; gap: 0; position: relative; }
.guide-steps::before {
  content: ''; position: absolute; left: 28px; top: 0; bottom: 0;
  width: 2px; background: var(--border-gray); z-index: 0;
}
.guide-step {
  display: flex; gap: 24px; align-items: flex-start;
  padding: 0 0 32px; position: relative; z-index: 1;
}
.guide-step:last-child { padding-bottom: 0; }
.gs-number {
  width: 58px; height: 58px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk));
  color: #fff; font-family: var(--font-head); font-weight: 800; font-size: .85rem;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(0,149,208,.35);
  position: relative; z-index: 2;
}
.gs-content {
  flex: 1; background: var(--surface); border: 1.5px solid var(--border-gray);
  border-radius: var(--r-xl); padding: 24px 24px 20px;
  box-shadow: var(--shadow-card); margin-top: 6px;
}
.gs-icon { font-size: 1.8rem; margin-bottom: 8px; }
.gs-content h3 {
  font-family: var(--font-head); font-size: 1.05rem; font-weight: 800;
  color: var(--t1); margin: 0 0 10px;
}
.gs-content p { font-size: .9rem; color: var(--t2); line-height: 1.7; margin: 0 0 12px; }
.gs-content p a { color: var(--cyan); text-decoration: underline; }
.gs-content p strong { color: var(--t1); }
.gs-tip {
  background: var(--cyan-lt); border-radius: var(--r);
  padding: 10px 14px; font-size: .82rem; color: var(--t2);
  border-left: 3px solid var(--cyan); line-height: 1.5;
}
.gs-tip strong { color: var(--t1); }

/* Dosierungsbeispiel */
.guide-example { margin-bottom: 48px; }
.guide-example-table {
  background: var(--surface); border: 1.5px solid var(--border-gray);
  border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--shadow-card);
  margin-bottom: 10px;
}
.get-header {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: var(--navy); padding: 12px 20px; gap: 8px;
}
.get-header div {
  font-family: var(--font-head); font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; color: rgba(255,255,255,.7);
}
.get-row {
  display: grid; grid-template-columns: repeat(4, 1fr);
  padding: 13px 20px; gap: 8px;
  border-bottom: 1px solid var(--border-gray);
  transition: background var(--t-fast); font-size: .9rem;
}
.get-row:last-child { border-bottom: none; }
.get-row:hover { background: var(--cyan-lt); }
.get-row div { color: var(--t1); font-family: var(--font-head); font-weight: 500; }
.get-row div:first-child { font-weight: 700; color: var(--cyan); }
.guide-example-note { font-size: .78rem; color: var(--t3); margin: 0; }

@media (max-width: 768px) {
  .guide-materials-grid { grid-template-columns: repeat(2, 1fr); }
  .guide-steps::before { left: 22px; }
  .gs-number { width: 46px; height: 46px; font-size: .75rem; }
  .guide-step { gap: 14px; }
  .gs-content { padding: 16px; }
  .get-header, .get-row { grid-template-columns: repeat(2, 1fr); }
  .get-header div:nth-child(n+3), .get-row div:nth-child(n+3) { display: none; }
  .storage-cta-grid { flex-direction: column; }
}
@media (max-width: 480px) {
  .guide-materials-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════
   LAGERUNGSANLEITUNG
   ═══════════════════════════════════════════ */
.storage-page { padding-bottom: 80px; }
.storage-container { max-width: 960px; }

/* Temperatur-Karten */
.storage-temp-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 48px;
}
.stc-card {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 24px 18px;
  text-align: center;
  border-top: 4px solid var(--border-gray);
  transition: transform var(--t-fast), box-shadow var(--t-fast);
}
.stc-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-card-h); }
.stc-freeze  { border-top-color: #6ec6f5; }
.stc-fridge  { border-top-color: var(--cyan); }
.stc-room    { border-top-color: var(--green); }
.stc-danger  { border-top-color: #e03030; }
.stc-icon { font-size: 2rem; margin-bottom: 10px; }
.stc-temp { font-family: var(--font-head); font-size: 1.3rem; font-weight: 800; color: var(--t1); margin-bottom: 4px; }
.stc-label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--t3); margin-bottom: 8px; }
.stc-desc { font-size: .78rem; color: var(--t2); line-height: 1.5; }

/* Sektionen */
.storage-sections { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 48px; }
.storage-section {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 28px 28px;
  border: 1.5px solid var(--border-gray);
}
.ss-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1.5px solid var(--border-gray); }
.ss-icon { font-size: 2rem; flex-shrink: 0; margin-top: 2px; }
.ss-header h2 { font-family: var(--font-head); font-size: 1.05rem; font-weight: 800; color: var(--t1); margin: 0 0 4px; }
.ss-header p { font-size: .8rem; color: var(--t3); margin: 0; }
.ss-steps { display: flex; flex-direction: column; gap: 16px; }
.ss-step { display: flex; gap: 14px; align-items: flex-start; }
.ss-step-num {
  font-family: var(--font-head); font-size: .7rem; font-weight: 800;
  color: var(--cyan); background: var(--cyan-lt);
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; letter-spacing: .04em;
}
.ss-step-text { font-size: .88rem; color: var(--t2); line-height: 1.6; padding-top: 4px; }
.ss-step-text strong { color: var(--t1); }

/* Tipps */
.storage-tips-section { margin-bottom: 48px; }
.storage-tips-section .section-head { margin-bottom: 28px; }
.storage-tips-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.storage-tip {
  background: var(--surface);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: 22px 20px;
  border: 1.5px solid var(--border-gray);
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.storage-tip:hover { border-color: var(--cyan); transform: translateY(-2px); }
.tip-icon { font-size: 1.8rem; margin-bottom: 10px; }
.storage-tip h4 { font-family: var(--font-head); font-size: .92rem; font-weight: 700; color: var(--t1); margin: 0 0 8px; }
.storage-tip p { font-size: .82rem; color: var(--t2); line-height: 1.6; margin: 0; }

/* Lagerungs-FAQ */
.storage-faq { margin-bottom: 48px; }
.storage-faq-title { font-family: var(--font-head); font-size: 1.3rem; font-weight: 800; color: var(--t1); margin-bottom: 20px; }

/* CTA Grid */
.storage-cta-grid { display: flex; gap: 20px; }
.storage-cta-grid .faq-cta { margin: 0; }

@media (max-width: 900px) {
  .storage-temp-cards { grid-template-columns: repeat(2, 1fr); }
  .storage-sections { grid-template-columns: 1fr; }
  .storage-tips-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .storage-temp-cards { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .storage-tips-grid { grid-template-columns: 1fr; }
  .storage-cta-grid { flex-direction: column; }
  .storage-section { padding: 20px 16px; }
}

/* ═══════════════════════════════════════════
   STATS BAR
   ═══════════════════════════════════════════ */
.stats-bar-section { padding: 0; margin-top: -2px; }
.stats-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--navy);
  border-radius: var(--r-xl);
  padding: 32px 40px;
  gap: 0;
  flex-wrap: wrap;
}
.stat-item {
  flex: 1;
  text-align: center;
  min-width: 140px;
  padding: 8px 16px;
}
.stat-num {
  font-family: var(--font-head);
  font-size: 2rem;
  font-weight: 800;
  color: var(--cyan);
  line-height: 1.1;
  margin-bottom: 6px;
}
.stat-label {
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  line-height: 1.5;
}
.stat-label small { font-size: .72rem; color: rgba(255,255,255,.45); display: block; }
.stat-divider {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,.1);
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════
   PEPTIDE FOCUS CARDS
   ═══════════════════════════════════════════ */
.peptide-focus-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  gap: 20px;
  align-items: start;
}
.peptide-focus-card {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 32px 28px;
  position: relative;
  border: 1.5px solid var(--border-gray);
  transition: box-shadow var(--t-med), transform var(--t-med);
}
.peptide-focus-card:hover {
  box-shadow: var(--shadow-card-h);
  transform: translateY(-3px);
}
.pfc-top {
  border-color: var(--cyan);
  box-shadow: 0 4px 24px rgba(0,149,208,.15), var(--shadow-card);
}
.pfc-badge {
  display: inline-block;
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk));
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 100px;
  margin-bottom: 16px;
}
.pfc-icon {
  font-size: 2.2rem;
  margin-bottom: 12px;
  line-height: 1;
}
.peptide-focus-card h3 {
  font-family: var(--font-head);
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--t1);
  margin: 0 0 4px;
}
.pfc-sub {
  font-size: .78rem;
  font-weight: 700;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0 0 14px;
}
.pfc-desc {
  font-size: .88rem;
  color: var(--t2);
  line-height: 1.65;
  margin-bottom: 20px;
}
.pfc-stats {
  display: flex;
  gap: 12px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.pfc-stat {
  flex: 1;
  min-width: 70px;
  background: var(--bg);
  border-radius: var(--r);
  padding: 10px 8px;
  text-align: center;
}
.pfc-stat strong {
  display: block;
  font-family: var(--font-head);
  font-size: .95rem;
  font-weight: 800;
  color: var(--t1);
}
.pfc-stat span {
  font-size: .68rem;
  color: var(--t3);
  line-height: 1.3;
}
.stat-source-link {
  font-size: .7rem;
  font-weight: 700;
  color: var(--cyan);
  text-decoration: none;
  vertical-align: super;
  margin-left: 3px;
  position: relative;
  cursor: pointer;
  background: #fff;
  border: 1px solid rgba(0,149,208,.35);
  border-radius: 4px;
  padding: 0px 4px 1px;
  line-height: 1;
  display: inline-block;
}
.stat-source-link:hover {
  background: var(--cyan);
  color: #fff;
  border-color: var(--cyan);
}
.stat-source-link::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--navy);
  color: #fff;
  font-size: .72rem;
  font-weight: 400;
  font-family: var(--font-body);
  line-height: 1.4;
  padding: 8px 12px;
  border-radius: 8px;
  white-space: normal;
  width: 220px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(0,0,0,.2);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
  z-index: 99;
}
.stat-source-link::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: var(--navy);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
  z-index: 99;
}
.stat-source-link:hover::after,
.stat-source-link:hover::before { opacity: 1; }

@media (max-width: 480px) {
  .pfc-stats { gap: 6px; }
  .pfc-stat { min-width: 0; padding: 8px 6px; }
  .pfc-stat strong { font-size: .85rem; }
  .pfc-stat span { font-size: .6rem; display: block; word-break: break-word; }
}

/* ═══════════════════════════════════════════
   HOW IT WORKS
   ═══════════════════════════════════════════ */
.how-it-works-grid {
  display: flex;
  align-items: center;
  gap: 0;
  justify-content: center;
}
.hiw-step {
  flex: 1;
  max-width: 280px;
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 32px 24px;
  text-align: center;
  position: relative;
}
.hiw-num {
  font-family: var(--font-head);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .1em;
  color: var(--cyan);
  text-transform: uppercase;
  margin-bottom: 12px;
}
.hiw-icon {
  font-size: 2.4rem;
  margin-bottom: 14px;
  line-height: 1;
}
.hiw-step h4 {
  font-family: var(--font-head);
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--t1);
  margin: 0 0 10px;
}
.hiw-step p {
  font-size: .85rem;
  color: var(--t2);
  line-height: 1.6;
  margin: 0;
}
.hiw-arrow {
  font-size: 1.8rem;
  color: var(--cyan);
  padding: 0 20px;
  font-weight: 300;
  flex-shrink: 0;
}

@media (max-width: 1024px) {
  .peptide-focus-grid { grid-template-columns: 1fr 1fr; }
  .pfc-top { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
  .peptide-focus-grid { grid-template-columns: 1fr; }
  .pfc-top { grid-column: auto; }
  .stats-bar { padding: 24px 20px; gap: 16px; }
  .stat-divider { display: none; }
  .stat-item { min-width: calc(50% - 16px); }
  .how-it-works-grid { flex-direction: column; gap: 16px; }
  .hiw-arrow { transform: rotate(90deg); padding: 0; }
  .hiw-step { max-width: 100%; width: 100%; }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════ */
/* ═══════════════════════════════════════════
   ZUBEHÖR-EMPFEHLUNG — PRODUKTSEITE
   ═══════════════════════════════════════════ */
.peptid-zubehoer-box {
  margin-top: 24px;
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.pzb-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--bg);
  border-bottom: 1px solid var(--border-gray);
  font-size: .78rem;
  font-weight: 700;
  color: var(--t2);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.pzb-header svg { color: var(--cyan); flex-shrink: 0; }
.pzb-items { display: flex; flex-direction: column; }
.pzb-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border-gray);
  transition: background var(--t-fast);
}
.pzb-item:last-child { border-bottom: none; }
.pzb-item:hover { background: var(--cyan-lt); }
.pzb-img-link { flex-shrink: 0; }
.pzb-img { width: 44px !important; height: 44px !important; object-fit: contain; border-radius: 8px; background: var(--panel); padding: 4px; display: block; }
.pzb-info { flex: 1; min-width: 0; }
.pzb-name { display: block; font-size: .85rem; font-weight: 600; color: var(--t1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pzb-price { display: block; font-size: .8rem; color: var(--cyan); font-weight: 700; font-family: var(--font-head); }
.pzb-item .atc-btn {
  flex-shrink: 0;
  padding: 6px 14px !important;
  font-size: .78rem !important;
  border-radius: 100px !important;
  white-space: nowrap;
}
.pzb-oos { font-size: .75rem; color: var(--t3); flex-shrink: 0; }

/* ═══════════════════════════════════════════
   ZUBEHÖR-HINWEIS — WARENKORB
   ═══════════════════════════════════════════ */
.cart-zubehoer-notice {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--cyan-lt);
  border: 1.5px solid var(--border);
  border-radius: var(--r-lg);
  padding: 14px 18px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.czn-icon { font-size: 1.4rem; flex-shrink: 0; }
.czn-text { flex: 1; font-size: .88rem; color: var(--t2); line-height: 1.5; min-width: 200px; }
.czn-text strong { display: block; color: var(--t1); margin-bottom: 2px; }
.czn-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.czn-btn {
  background: linear-gradient(135deg, var(--cyan), var(--cyan-dk));
  color: #fff !important;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .82rem;
  padding: 8px 18px;
  border-radius: 100px;
  text-decoration: none;
  white-space: nowrap;
  transition: filter var(--t-fast);
}
.czn-btn:hover { filter: brightness(1.08); }
.czn-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--t3);
  font-size: 1rem;
  padding: 4px;
  line-height: 1;
  transition: color var(--t-fast);
}
.czn-close:hover { color: var(--t1); }

/* ═══════════════════════════════════════════
   ORDER RECEIVED — THANK YOU PAGE
   ═══════════════════════════════════════════ */

.r24-thankyou {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 0 60px;
}

/* Erfolgs-Banner */
.r24-ty-banner {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  text-align: center;
  padding: 48px 40px 40px;
  margin-bottom: 28px;
}
.r24-ty-banner--error { border-top: 4px solid #e03030; }
.r24-ty-banner:not(.r24-ty-banner--error) { border-top: 4px solid var(--cyan); }

.r24-ty-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  color: var(--cyan);
}
.r24-ty-icon svg { width: 64px; height: 64px; }

.r24-ty-banner h2 {
  font-family: var(--font-head);
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--t1);
  margin: 0 0 12px;
}
.r24-ty-banner p {
  color: var(--t2);
  font-size: .95rem;
  line-height: 1.65;
  max-width: 480px;
  margin: 0 auto;
}
.r24-ty-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 24px;
  flex-wrap: wrap;
}

/* Übersichts-Cards */
.r24-ty-overview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 32px;
}
.r24-ty-card {
  background: var(--surface);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.r24-ty-card-label {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--t3);
}
.r24-ty-card-value {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 1rem;
  color: var(--t1);
}
.r24-ty-card-value--total {
  color: var(--cyan);
  font-size: 1.15rem;
}

/* Bestätigungs-Details (WooCommerce Hooks) */
.r24-thankyou .woocommerce-order-details,
.r24-thankyou .woocommerce-customer-details {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 28px 32px;
  margin-bottom: 20px;
}
.r24-thankyou .woocommerce-order-details__title,
.r24-thankyou .woocommerce-column__title {
  font-family: var(--font-head) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: var(--t1) !important;
  margin: 0 0 18px !important;
  padding-bottom: 14px !important;
  border-bottom: 1.5px solid var(--border-gray) !important;
}
.r24-thankyou .woocommerce-table--order-details {
  width: 100%;
  border-collapse: collapse;
}
.r24-thankyou .woocommerce-table--order-details thead th {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--t3) !important;
  padding: 0 0 10px !important;
  border-bottom: 1.5px solid var(--border-gray) !important;
  background: none !important;
}
.r24-thankyou .woocommerce-table--order-details tbody td {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--border-gray) !important;
  color: var(--t2);
  font-size: .92rem;
}
.r24-thankyou .woocommerce-table--order-details tfoot th,
.r24-thankyou .woocommerce-table--order-details tfoot td {
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--border-gray) !important;
  font-size: .88rem;
  color: var(--t2);
}
.r24-thankyou .woocommerce-table--order-details tfoot .order-total th,
.r24-thankyou .woocommerce-table--order-details tfoot .order-total td {
  font-weight: 800 !important;
  color: var(--cyan) !important;
  font-size: 1rem !important;
  border-bottom: none !important;
}
.r24-thankyou .woocommerce-customer-details .woocommerce-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.r24-thankyou address {
  font-style: normal;
  font-size: .9rem;
  color: var(--t2);
  line-height: 1.7;
}

/* Alten WC-Notice-Stil überschreiben */
.r24-thankyou .woocommerce-notice--success,
.r24-thankyou .woocommerce-thankyou-order-received { display: none !important; }

@media (max-width: 600px) {
  .r24-thankyou { padding: 20px 0 40px; }
  .r24-ty-banner { padding: 32px 20px 28px; }
  .r24-ty-banner h2 { font-size: 1.25rem; }
  .r24-ty-overview { grid-template-columns: 1fr 1fr; }
  .r24-thankyou .woocommerce-order-details,
  .r24-thankyou .woocommerce-customer-details { padding: 20px 16px; }
  .r24-thankyou .woocommerce-customer-details .woocommerce-columns { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════
   CART & CHECKOUT — MODERN REDESIGN
   ═══════════════════════════════════════════ */

/* ── Shared wrapper ── */
.woocommerce-cart #main-content,
.woocommerce-checkout #main-content {
  padding-top: 40px;
  padding-bottom: 60px;
}

/* ── Cart table ── */
.woocommerce-cart-form {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  margin-bottom: 32px;
}

.woocommerce-cart-form table.shop_table {
  width: 100%;
  border-collapse: collapse;
  border: none !important;
}

.woocommerce-cart-form table.shop_table thead tr {
  background: var(--navy) !important;
}

.woocommerce-cart-form table.shop_table thead th {
  background: var(--navy) !important;
  color: #fff !important;
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 14px 20px !important;
  border: none !important;
}

.woocommerce-cart-form table.shop_table tbody tr.cart_item {
  border-bottom: 1px solid var(--border-gray) !important;
  transition: background var(--t-fast);
}
.woocommerce-cart-form table.shop_table tbody tr.cart_item:hover {
  background: var(--cyan-lt);
}
.woocommerce-cart-form table.shop_table tbody tr.cart_item td {
  padding: 18px 20px !important;
  border: none !important;
  vertical-align: middle;
  color: var(--t1);
}

/* Produktbild in Cart */
.woocommerce-cart-form table.shop_table td.product-thumbnail img {
  border-radius: 10px;
  width: 72px !important;
  height: 72px !important;
  object-fit: contain;
  background: var(--panel);
  padding: 4px;
  box-shadow: var(--shadow-sm);
}

/* Produktname */
.woocommerce-cart-form table.shop_table td.product-name a {
  color: var(--t1) !important;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  transition: color var(--t-fast);
}
.woocommerce-cart-form table.shop_table td.product-name a:hover {
  color: var(--cyan) !important;
}

/* Preis */
.woocommerce-cart-form table.shop_table td.product-price,
.woocommerce-cart-form table.shop_table td.product-subtotal {
  font-family: var(--font-head);
  font-weight: 700;
  color: var(--cyan) !important;
  font-size: 1.05rem;
}

/* Remove-Button */
.woocommerce-cart-form table.shop_table td.product-remove a.remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(224,48,48,.08);
  color: #e03030 !important;
  font-size: 1.1rem;
  font-weight: 700;
  text-decoration: none;
  transition: background var(--t-fast), transform var(--t-fast);
}
.woocommerce-cart-form table.shop_table td.product-remove a.remove:hover {
  background: rgba(224,48,48,.18);
  transform: scale(1.12);
}

/* Quantity-Input in Cart */
.woocommerce-cart-form .quantity input[type=number] {
  width: 68px !important;
  padding: 8px 10px !important;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: 8px !important;
  background: var(--bg) !important;
  color: var(--t1) !important;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: .95rem;
  text-align: center;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.woocommerce-cart-form .quantity input[type=number]:focus {
  border-color: var(--cyan) !important;
  box-shadow: 0 0 0 3px var(--cyan-glow) !important;
  outline: none !important;
}

/* Coupon-Zeile */
.woocommerce-cart-form table.shop_table tr.actions {
  border-bottom: none !important;
}
.woocommerce-cart-form table.shop_table td.actions {
  padding: 16px 20px !important;
  background: var(--panel);
}
/* Update-Cart Button immer sichtbar */
.woocommerce-cart-form button[name="update_cart"] {
  opacity: 1 !important;
  background: linear-gradient(135deg, var(--navy), #0d2d52) !important;
  color: #fff !important;
  border-radius: 100px !important;
  padding: 9px 22px !important;
  font-size: .88rem !important;
  font-weight: 700 !important;
  border: none !important;
  cursor: pointer;
  transition: filter .2s !important;
}
.woocommerce-cart-form button[name="update_cart"]:hover {
  filter: brightness(1.15) !important;
}
.woocommerce-cart-form .coupon {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
}
.woocommerce-cart-form .coupon input#coupon_code {
  flex: 1;
  min-width: 160px;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: 100px !important;
  padding: 9px 18px !important;
  background: var(--surface) !important;
  color: var(--t1) !important;
  font-size: .9rem;
  transition: border-color var(--t-fast);
}
.woocommerce-cart-form .coupon input#coupon_code:focus {
  border-color: var(--cyan) !important;
  outline: none !important;
}
.woocommerce-cart-form .coupon button {
  border-radius: 100px !important;
  padding: 9px 22px !important;
  font-size: .88rem !important;
}

/* ── Cart Totals Box ── */
.cart-collaterals {
  display: flex;
  justify-content: flex-end;
}
.cart_totals {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  width: 100%;
  max-width: 440px;
}
.cart_totals h2 {
  font-family: var(--font-head);
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--t1);
  padding: 20px 24px 16px;
  border-bottom: 1px solid var(--border-gray);
  margin: 0;
}
.cart_totals table.shop_table {
  width: 100%;
  border-collapse: collapse;
  border: none !important;
}
.cart_totals table.shop_table tr {
  border-bottom: 1px solid var(--border-gray) !important;
}
.cart_totals table.shop_table tr:last-child {
  border-bottom: none !important;
}
.cart_totals table.shop_table th {
  padding: 14px 24px !important;
  font-family: var(--font-head);
  font-size: .82rem;
  font-weight: 700;
  color: var(--t2) !important;
  text-align: left;
  border: none !important;
  background: none !important;
  width: 45%;
}
.cart_totals table.shop_table td {
  padding: 14px 24px !important;
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--t1) !important;
  border: none !important;
  background: none !important;
}
.cart_totals table.shop_table tr.order-total th,
.cart_totals table.shop_table tr.order-total td {
  background: var(--cyan-lt) !important;
  font-size: 1.05rem;
  font-weight: 800;
}
.cart_totals table.shop_table tr.order-total td {
  color: var(--cyan) !important;
}
.wc-proceed-to-checkout {
  padding: 20px 24px !important;
}
.wc-proceed-to-checkout .checkout-button {
  width: 100% !important;
  padding: 16px 24px !important;
  font-size: 1rem !important;
  letter-spacing: .03em;
}

/* ── Checkout Page Layout (2-Spalten via Float) ── */
form.checkout.woocommerce-checkout {
  display: block;
}
form.checkout.woocommerce-checkout::after {
  content: "";
  display: table;
  clear: both;
}
form.checkout.woocommerce-checkout #customer_details {
  float: left;
  width: 57%;
}
/* Billing und Shipping untereinander, volle Breite */
form.checkout.woocommerce-checkout #customer_details .col-1,
form.checkout.woocommerce-checkout #customer_details .col-2 {
  float: none !important;
  width: 100% !important;
  clear: both;
}
form.checkout.woocommerce-checkout #order_review_heading {
  float: right;
  width: 38%;
}
form.checkout.woocommerce-checkout #order_review {
  float: right;
  width: 38%;
  clear: right;
}

.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-card);
  padding: 28px 32px;
  margin-bottom: 24px;
}

.woocommerce-checkout h3#ship-to-different-address,
.woocommerce-checkout h3 {
  font-family: var(--font-head) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--t1) !important;
  margin: 0 0 20px !important;
  padding-bottom: 14px !important;
  border-bottom: 1.5px solid var(--border-gray) !important;
}

/* Checkout Formularfelder */
.woocommerce-checkout .form-row label {
  font-size: .8rem !important;
  font-weight: 700 !important;
  color: var(--t2) !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  margin-bottom: 6px !important;
  display: block;
}
.woocommerce-checkout .form-row input[type=text],
.woocommerce-checkout .form-row input[type=email],
.woocommerce-checkout .form-row input[type=tel],
.woocommerce-checkout .form-row input[type=password],
.woocommerce-checkout .form-row input[type=number],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  width: 100% !important;
  border: 1.5px solid var(--border-gray) !important;
  border-radius: 10px !important;
  padding: 11px 16px !important;
  background: var(--bg) !important;
  color: var(--t1) !important;
  font-family: var(--font-body) !important;
  font-size: .95rem !important;
  transition: border-color var(--t-fast), box-shadow var(--t-fast) !important;
}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
  border-color: var(--cyan) !important;
  box-shadow: 0 0 0 3px var(--cyan-glow) !important;
  outline: none !important;
  background: var(--surface) !important;
}
.woocommerce-checkout .form-row select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%233a5268' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 38px !important;
}

/* ── Order Review (Checkout Zusammenfassung) ── */
#order_review_heading {
  font-family: var(--font-head) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--t1) !important;
  margin: 0 !important;
  padding: 28px 28px 20px !important;
  background: var(--surface);
  border-radius: var(--r-xl) var(--r-xl) 0 0;
  border: 1px solid rgba(9,27,51,.07);
  border-bottom: 1.5px solid var(--border-gray) !important;
}

#order_review {
  background: var(--surface);
  border-radius: 0 0 var(--r-xl) var(--r-xl);
  box-shadow: 0 4px 12px rgba(9,27,51,.08);
  border: 1px solid rgba(9,27,51,.07);
  border-top: none;
  padding: 28px;
}

table.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  border: none !important;
  margin-bottom: 0 !important;
}
table.woocommerce-checkout-review-order-table thead th {
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--t3) !important;
  padding: 0 0 12px !important;
  border: none !important;
  border-bottom: 1.5px solid var(--border-gray) !important;
}
table.woocommerce-checkout-review-order-table tbody td,
table.woocommerce-checkout-review-order-table tfoot td,
table.woocommerce-checkout-review-order-table tfoot th {
  padding: 12px 0 !important;
  border: none !important;
  border-bottom: 1px solid var(--border-gray) !important;
  font-family: var(--font-head);
  font-size: .92rem;
  color: var(--t2);
}
table.woocommerce-checkout-review-order-table tfoot .order-total td,
table.woocommerce-checkout-review-order-table tfoot .order-total th {
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  color: var(--cyan) !important;
  border-bottom: none !important;
  padding-top: 16px !important;
}
table.woocommerce-checkout-review-order-table tbody tr.cart_item {
  background: transparent;
}
table.woocommerce-checkout-review-order-table tbody td.product-name {
  color: var(--t1) !important;
  font-weight: 700 !important;
  font-size: .92rem !important;
  padding: 10px 0 !important;
}

/* Produktbild + Text nebeneinander */
.checkout-item-inner {
  display: flex;
  align-items: center;
  gap: 10px;
}
.checkout-thumb-wrap img.checkout-review-thumb {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain;
  border-radius: 8px;
  background: var(--surface);
  padding: 3px;
  box-shadow: var(--shadow-sm);
  flex-shrink: 0;
  display: block;
}
.checkout-item-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.checkout-item-text .product-quantity {
  font-size: .8rem;
  font-weight: 600;
  color: var(--t3);
}
table.woocommerce-checkout-review-order-table tbody td.product-total {
  font-weight: 800 !important;
  color: var(--cyan) !important;
  text-align: right;
  white-space: nowrap;
  font-size: .95rem !important;
  padding: 14px 0 !important;
}
table.woocommerce-checkout-review-order-table tfoot td,
table.woocommerce-checkout-review-order-table tfoot th {
  font-size: .84rem !important;
}
table.woocommerce-checkout-review-order-table tfoot .order-total th,
table.woocommerce-checkout-review-order-table tfoot .order-total td {
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: var(--cyan) !important;
}
table.woocommerce-checkout-review-order-table thead th:last-child {
  text-align: right;
}
table.woocommerce-checkout-review-order-table thead th {
  font-size: .68rem;
}

/* ── Zahlungsmethoden ── */
#payment {
  background: var(--bg) !important;
  border-radius: var(--r-lg) !important;
  border: 1.5px solid var(--border-gray) !important;
  padding: 0 !important;
  overflow: hidden;
  margin-top: 20px;
}
#payment ul.payment_methods {
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1.5px solid var(--border-gray) !important;
  list-style: none;
}
#payment ul.payment_methods li {
  padding: 0 !important;
  border-bottom: 1px solid var(--border-gray) !important;
  background: var(--surface);
}
#payment ul.payment_methods li:last-child {
  border-bottom: none !important;
}
/* Zahlungsart-Zeile: radio + label nebeneinander */
#payment ul.payment_methods li {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--border-gray) !important;
  background: var(--surface);
  transition: background var(--t-fast);
}
#payment ul.payment_methods li:hover {
  background: var(--cyan-lt);
}
#payment ul.payment_methods li:last-child {
  border-bottom: none !important;
}
#payment ul.payment_methods input[type=radio] {
  accent-color: var(--cyan);
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  flex-shrink: 0;
  margin: 0 0 0 14px !important;
  padding: 0 !important;
  cursor: pointer;
}
#payment ul.payment_methods label {
  display: inline !important;
  flex: 1;
  padding: 10px 12px 10px 8px !important;
  cursor: pointer;
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  font-size: .88rem !important;
  color: var(--t1) !important;
  line-height: 1.3;
}
#payment .payment_box {
  width: 100%;
  background: var(--cyan-lt) !important;
  border: none !important;
  border-top: 1px solid var(--border) !important;
  border-radius: 0 !important;
  padding: 7px 14px !important;
  font-size: .79rem !important;
  color: var(--t2) !important;
}
#payment .payment_box::before { display: none !important; }
#payment #place_order {
  margin: 14px !important;
  width: calc(100% - 28px) !important;
  padding: 13px 20px !important;
  font-size: .92rem !important;
  letter-spacing: .03em;
  display: block !important;
  text-align: center;
  float: none !important;
}

/* ── Datenschutz & AGB Box ── */
#payment .place-order {
  background: var(--surface);
  border-top: 1.5px solid var(--border-gray);
  padding: 16px 16px 14px !important;
  border-radius: 0 0 var(--r-lg) var(--r-lg);
}

.woocommerce-checkout .woocommerce-privacy-policy-text {
  font-size: .78rem;
  color: var(--t2);
  line-height: 1.55;
  background: var(--bg);
  border: 1px solid var(--border-gray);
  border-radius: var(--r);
  padding: 10px 13px;
  margin: 0 0 12px !important;
}
.woocommerce-checkout .woocommerce-privacy-policy-text a {
  color: var(--cyan);
  text-decoration: underline;
}

/* AGB-Checkbox Zeile */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  margin: 0 !important;
}
.woocommerce-checkout #terms-field,
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 9px !important;
  padding: 0 0 14px !important;
  margin: 0 !important;
}
.woocommerce-checkout #terms-field input[type=checkbox],
.woocommerce-checkout .woocommerce-form__label-for-checkbox input[type=checkbox] {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px;
  margin: 2px 0 0 !important;
  accent-color: var(--cyan);
  cursor: pointer;
  flex-shrink: 0;
}
.woocommerce-checkout #terms-field label,
.woocommerce-checkout .woocommerce-form__label-for-checkbox span {
  font-size: .8rem !important;
  color: var(--t2) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  cursor: pointer;
}
.woocommerce-checkout #terms-field label a,
.woocommerce-checkout .woocommerce-form__label-for-checkbox span a {
  color: var(--cyan) !important;
  text-decoration: underline;
  font-weight: 600 !important;
}

/* Forschungszweck-Checkbox */
/* ── Checkout Confirm Boxes (Forschungszweck + Vorbestellung) ─── */
.r24-confirm-box {
  margin-top: 12px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid transparent;
}
.r24-confirm-box--research {
  background: #fffdf0;
  border-color: #f0d060;
}
.r24-confirm-box--preorder {
  background: #fff8f3;
  border-color: #f97316;
}
.r24-confirm-box__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px 6px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.r24-confirm-box--research .r24-confirm-box__header { color: #92720a; }
.r24-confirm-box--preorder .r24-confirm-box__header { color: #c2440a; }
.r24-confirm-box__label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 6px 14px 13px !important;
  cursor: pointer;
  text-transform: none !important;
  font-weight: normal !important;
  letter-spacing: normal !important;
}
.r24-confirm-box__label input[type=checkbox] {
  width: 17px !important;
  height: 17px !important;
  min-width: 17px;
  margin: 2px 0 0 !important;
  accent-color: var(--cyan);
  cursor: pointer;
  flex-shrink: 0;
}
.r24-confirm-box__label span {
  font-size: .83rem;
  color: var(--navy, #1a2340);
  line-height: 1.55;
  text-transform: none;
}

/* Legacy — nicht mehr verwendet, aber für Cache-Sicherheit */
.r24-research-confirm { display: none; }
.r24-research-label { display: none !important; }

/* Versandoptionen im Cart Total */
#shipping_method li {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-size: .9rem;
  color: var(--t2);
}
#shipping_method input[type=radio] {
  accent-color: var(--cyan);
}

@media (max-width: 1100px) {
  .hero-content { grid-template-columns: 1fr; gap: 48px; padding: 72px 0 56px; }
  .hero-right { display: none; }
  .hero-new {
    flex-direction: column;
    padding: 32px 0 24px;
    gap: 0;
    align-items: center;
  }
  .hero-new-left {
    max-width: 100%;
    text-align: center;
    order: 2;
  }
  .hero-trust-item { text-align: left; }
  .hero-new-right {
    order: 1;
    margin-left: 0;
    justify-content: center;
    margin-bottom: -20px;
  }
  .hero-vial-img { width: 220px; }
  .hero-vial-glow { width: 220px; height: 220px; }
  .hero-actions { justify-content: center; flex-wrap: wrap; }
  .quality-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  :root { --logo-h: 56px; --hh: 58px; }
  body:not(.home) #main-content { padding-top: 0; }

  .mobile-menu-btn {
    display: flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: var(--r);
    border: 1px solid var(--border-gray); background: none;
    color: var(--t2); cursor: pointer;
    transition: background var(--t-fast), color var(--t-fast);
  }
  .mobile-menu-btn:hover { background: var(--cyan-lt); color: var(--cyan); }

  .nav-menu {
    display: none;
    position: fixed; top: var(--hh); left: 0; right: 0;
    background: rgba(255,255,255,.98);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    flex-direction: column;
    padding: 8px 0 20px;
    box-shadow: 0 8px 32px rgba(0,0,0,.15);
    z-index: 898;
    max-height: calc(100vh - var(--hh));
    overflow-y: auto;
  }
  .nav-menu > li > a {
    padding: 14px 24px;
    font-size: 1rem; border-bottom: 1px solid var(--border-gray);
    border-radius: 0;
  }
  .nav-menu .dropdown {
    display: none;
    position: static;
    opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: none; border-radius: 0;
    background: transparent;
    padding: 0; min-width: unset;
  }
  .nav-menu .dropdown.open { display: block; }
  .nav-menu .dropdown a {
    display: block;
    padding: 13px 24px 13px 40px;
    font-size: .9rem;
    color: #555;
    border-bottom: 1px solid rgba(0,0,0,.06);
    position: relative;
  }
  .nav-menu .dropdown a::before {
    content: '›';
    position: absolute; left: 24px;
    color: #aaa;
  }
  .nav-menu .dropdown a:last-child { border-bottom: none; }
  .nav-menu > li > a.has-dropdown .nav-arrow { transition: transform .25s ease; }
  .nav-menu > li > a.has-dropdown.open .nav-arrow { transform: rotate(180deg); }
  .mini-cart-sidebar { width: 100%; right: -100%; border-radius: 0; top: var(--hh); height: calc(100vh - var(--hh)); height: calc(100dvh - var(--hh)); }
  .logo-img { height: 88px; }
  .container { padding: 0 16px; }
  .section { padding: 60px 0; }
  .trust-strip-inner { flex-wrap: wrap; }
  .trust-item { flex: 0 0 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,.08); }
  .trust-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.08); }
  .quality-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .header-search { display: none; }
  .nav-menu { display: none; }
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .categories-grid { grid-template-columns: repeat(2, 1fr); }
  .mini-cart-sidebar { width: 100%; right: -100%; border-radius: 0; top: var(--hh); height: calc(100vh - var(--hh)); height: calc(100dvh - var(--hh)); }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .hero-stats { gap: 18px; }
  .reviews-banner { padding: 28px; }

  /* Allgemeine Absicherung */
  * { box-sizing: border-box; }
  img, video, iframe, embed, object { max-width: 100% !important; height: auto; }

  /* Produkt-Attribut-Tabellen: gestapeltes Label-Wert-Layout */
  .woocommerce-product-attributes table,
  table.shop_attributes {
    display: block; width: 100%; border: none;
  }
  .woocommerce-product-attributes tbody,
  table.shop_attributes tbody { display: block; }
  .woocommerce-product-attributes tr,
  table.shop_attributes tr {
    display: flex; flex-direction: column;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-gray);
  }
  .woocommerce-product-attributes th,
  table.shop_attributes th {
    display: block; padding: 0 0 3px;
    font-size: .72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    color: var(--t3); border: none; background: none;
  }
  .woocommerce-product-attributes td,
  table.shop_attributes td {
    display: block; padding: 0;
    font-size: .9rem; color: var(--t1);
    border: none; word-break: break-word;
  }

  /* WooCommerce Cart/Order Tabellen: gestapelt pro Produkt */
  table.shop_table, table.woocommerce-cart-totals {
    display: block; width: 100%;
  }
  table.shop_table thead { display: none; }
  table.shop_table tbody, table.shop_table tfoot { display: block; }
  table.shop_table tr {
    display: flex; flex-wrap: wrap;
    padding: 12px 0; border-bottom: 1px solid var(--border-gray);
    gap: 6px;
  }
  table.shop_table td {
    display: block; border: none; padding: 2px 0;
    width: 100%; word-break: break-word;
  }
  table.shop_table td::before {
    content: attr(data-title) " ";
    font-weight: 700; color: var(--t2);
    font-size: .8rem;
  }

  /* Checkout Review-Tabelle: normales Table-Layout erhalten */
  table.woocommerce-checkout-review-order-table {
    display: table !important; width: 100% !important;
  }
  table.woocommerce-checkout-review-order-table tbody,
  table.woocommerce-checkout-review-order-table tfoot {
    display: table-row-group !important;
  }
  table.woocommerce-checkout-review-order-table tr {
    display: table-row !important; padding: 0 !important;
    border-bottom: 1px solid var(--border-gray) !important;
  }
  table.woocommerce-checkout-review-order-table th,
  table.woocommerce-checkout-review-order-table td {
    display: table-cell !important; width: auto !important;
    padding: 10px 4px !important; border: none !important;
    vertical-align: middle !important;
  }
  table.woocommerce-checkout-review-order-table td {
    text-align: right !important;
  }
  table.woocommerce-checkout-review-order-table td::before { display: none !important; }
  /* Versand-Beschreibung auch im Checkout ausblenden */
  #order_review .woocommerce-shipping-destination,
  #order_review .shipping-calculator-button { display: none !important; }

  /* Cart-Summen-Box: normales Table-Layout erhalten */
  .cart_totals table.shop_table {
    display: table !important;
    width: 100% !important;
  }
  .cart_totals table.shop_table tbody,
  .cart_totals table.shop_table tfoot {
    display: table-row-group !important;
  }
  .cart_totals table.shop_table tr {
    display: table-row !important;
    padding: 0 !important;
    border-bottom: 1px solid var(--border-gray) !important;
  }
  .cart_totals table.shop_table th,
  .cart_totals table.shop_table td {
    display: table-cell !important;
    width: auto !important;
    padding: 12px 16px !important;
    border: none !important;
    vertical-align: middle !important;
  }
  .cart_totals table.shop_table td {
    text-align: right !important;
  }
  .cart_totals table.shop_table td::before { display: none !important; }
  /* Versand-Beschreibungstext + Rechner-Link ausblenden */
  .cart_totals .woocommerce-shipping-destination,
  .cart_totals .shipping-calculator-button { display: none !important; }
  /* Versandmethoden-Liste rechtsbündig */
  .cart_totals #shipping_method { list-style: none; padding: 0; margin: 0; text-align: right; }
  .cart_totals #shipping_method li { justify-content: flex-end; }

  /* Coupon-Zeile auf Mobile: Input + Button untereinander */
  .woocommerce-cart-form .coupon {
    flex-wrap: wrap !important;
  }
  .woocommerce-cart-form .coupon input#coupon_code {
    width: 100% !important;
    flex: 1 1 100% !important;
  }
  .woocommerce-cart-form .coupon button {
    white-space: nowrap !important;
    width: 100% !important;
    flex: 1 1 100% !important;
    text-align: center !important;
  }

  /* Alle anderen unbekannten Tabellen: einfach scrollbar aber nicht zerstört */
  table:not(.woocommerce-product-attributes table):not(.shop_attributes):not(.shop_table) {
    display: block; overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%; max-width: 100%;
  }

  /* Produktseite: volle Breite, gestapelt */
  .woocommerce div.product,
  .woocommerce-product-gallery,
  .woocommerce div.product .summary.entry-summary {
    width: 100% !important;
    float: none !important;
    max-width: 100% !important;
    clear: both;
  }
  .woocommerce div.product .summary.entry-summary {
    padding: 20px 16px !important;
    margin-top: 16px;
  }

  /* Alle Boxen: volle Breite */
  .woocommerce-tabs, .woocommerce-Tabs-panel,
  .cart-collaterals, .woocommerce-cart-form,
  .woocommerce-checkout, .woocommerce-account,
  .peptide-specs, .related.products, .upsells {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* Container-Padding auf Mobile reduzieren */
  .woocommerce-wrapper, .container { padding-left: 10px !important; padding-right: 10px !important; }

  /* Checkout: Spalten auf Mobile stacken */
  form.checkout.woocommerce-checkout #customer_details,
  form.checkout.woocommerce-checkout #order_review_heading,
  form.checkout.woocommerce-checkout #order_review {
    float: none !important;
    width: 100% !important;
    clear: both !important;
  }
  .woocommerce-billing-fields,
  .woocommerce-shipping-fields,
  .woocommerce-additional-fields {
    padding: 20px 16px !important;
    border-radius: var(--r-lg) !important;
  }
  #order_review_heading {
    padding: 20px 16px 16px !important;
    border-radius: var(--r-lg) var(--r-lg) 0 0 !important;
  }
  #order_review {
    padding: 20px 16px !important;
    border-radius: 0 0 var(--r-lg) var(--r-lg) !important;
  }

  /* Produktname-Spalte im Checkout: linksbündig + kein Wortbruch */
  table.woocommerce-checkout-review-order-table td.product-name {
    text-align: left !important;
    word-break: normal !important;
  }
  /* Meta-Felder (Bestelltyp, Lieferzeit, Rabatt) kompakt inline */
  table.woocommerce-checkout-review-order-table dl.variation {
    margin: 4px 0 0;
    font-size: .78rem;
    color: var(--t3);
  }
  table.woocommerce-checkout-review-order-table dl.variation dt,
  table.woocommerce-checkout-review-order-table dl.variation dd {
    display: inline;
    margin: 0;
  }
  table.woocommerce-checkout-review-order-table dl.variation dd::after {
    content: '';
    display: block;
  }
  /* Versandmethode im Checkout rechtsbündig (wie cart_totals) */
  #order_review #shipping_method {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
  }
  #order_review #shipping_method li {
    justify-content: flex-end !important;
  }
}
@media (max-width: 480px) {
  .products-grid { grid-template-columns: 1fr; }
  .trust-item { flex: 0 0 100%; border-right: none; }
  .top-bar { padding: 7px 0; }
  .top-bar-inner { gap: 4px; justify-content: center; }
  .top-bar-desktop { display: none; }
  .top-bar-mobile { display: flex; }
  .top-bar-item { font-size: .78rem; }
  .nl-form { flex-direction: column; border-radius: var(--r); }
  .nl-form input, .nl-form button { border-radius: 0; }
}

/* ═══════════════════════════════════════════
   PEN PRODUCT BANNER — Produktseiten (Peptide)
   ═══════════════════════════════════════════ */
/* clear: both damit der Banner unter den WC-Float-Columns (Bild + Summary) erscheint */
.pen-product-banner {
  clear: both;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 36px;
  background: linear-gradient(135deg, var(--navy) 0%, #0d1e36 60%, #0a1628 100%);
  border-radius: 16px;
  padding: 28px 36px;
  margin: 48px 0 48px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(10,30,56,.22);
}
.pen-product-banner::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 45% 80% at 6% 50%, rgba(0,149,208,.2) 0%, transparent 70%);
  pointer-events: none;
}
.pen-pb-img-wrap {
  position: relative;
  flex: 0 0 190px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pen-pb-img-glow {
  position: absolute;
  width: 160px; height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,149,208,.45) 0%, transparent 70%);
  filter: blur(28px);
  pointer-events: none;
}
.pen-pb-img-wrap a { display: block; position: relative; z-index: 1; }
.pen-pb-img-wrap img,
.pen-pb-img-wrap .wp-post-image {
  width: 170px; height: 170px;
  object-fit: contain;
  filter: drop-shadow(0 6px 18px rgba(0,149,208,.35));
}
.pen-pb-content {
  flex: 1;
  min-width: 0;
}
.pen-pb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 6px;
}
.pen-pb-eyebrow svg { stroke: var(--cyan); flex-shrink: 0; }
.pen-pb-title {
  font-size: 1.45rem;
  font-weight: 800;
  color: #fff;
  margin: 0 0 14px;
  line-height: 1.2;
}
.pen-pb-list {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.pen-pb-list li {
  font-size: .88rem;
  color: rgba(255,255,255,.78);
  padding-left: 16px;
  position: relative;
  line-height: 1.4;
}
.pen-pb-list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--cyan);
  font-weight: 700;
}
.pen-pb-action {
  flex: 0 0 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.pen-pb-price-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pen-pb-price {
  font-size: 1.9rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}
.pen-pb-vat {
  font-size: .7rem;
  color: rgba(255,255,255,.4);
  margin-top: 3px;
}
.pen-pb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--cyan);
  color: #fff !important;
  font-size: .9rem;
  font-weight: 700;
  padding: 12px 22px;
  border-radius: 10px;
  text-decoration: none;
  white-space: nowrap;
  width: 100%;
  transition: background .2s, transform .2s;
  box-shadow: 0 4px 16px rgba(0,149,208,.4);
}
.pen-pb-btn:hover { background: var(--cyan-dk); transform: translateY(-1px); }
.pen-pb-btn--ghost {
  background: transparent;
  border: 1.5px solid rgba(255,255,255,.3);
  box-shadow: none;
}
.pen-pb-note {
  font-size: .75rem;
  color: rgba(255,255,255,.42);
}
@media (max-width: 900px) {
  .pen-pb-img-wrap { flex: 0 0 130px; }
  .pen-pb-img-wrap img,
  .pen-pb-img-wrap .wp-post-image { width: 120px; height: 120px; }
  .pen-pb-img-glow { width: 110px; height: 110px; }
  .pen-pb-action { flex: 0 0 150px; }
  .pen-pb-title { font-size: 1.2rem; }
}
@media (max-width: 680px) {
  .pen-product-banner {
    flex-direction: column;
    gap: 14px;
    padding: 20px;
    margin: 28px 0;
    align-items: stretch;
  }
  /* Bild: zentriert, mittelgroß */
  .pen-pb-img-wrap {
    flex: none;
    align-self: center;
    width: 100px;
  }
  .pen-pb-img-wrap img,
  .pen-pb-img-wrap .wp-post-image { width: 100px; height: 100px; }
  .pen-pb-img-glow { width: 96px; height: 96px; }
  /* Content: volle Breite */
  .pen-pb-content { flex: none; }
  .pen-pb-eyebrow { justify-content: center; }
  .pen-pb-title { font-size: 1.1rem; text-align: center; margin-bottom: 12px; }
  .pen-pb-list li { font-size: .83rem; }
  /* Action: Preis + Button nebeneinander, volle Breite */
  .pen-pb-action {
    flex: none;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.12);
  }
  .pen-pb-price-wrap { align-items: flex-start; }
  .pen-pb-price { font-size: 1.4rem; }
  .pen-pb-btn { flex-shrink: 0; font-size: .85rem; padding: 11px 16px; width: auto; }
  /* Versandzeit unter Preis+Button */
  .pen-pb-action { flex-wrap: wrap; }
  .pen-pb-note { flex: 0 0 100%; text-align: center; font-size: .78rem; }
}

/* ═══════════════════════════════════════════
   PEN HIGHLIGHT SECTION — Startseite
   ═══════════════════════════════════════════ */
.pen-highlight-section {
  background: linear-gradient(135deg, var(--navy) 0%, #0d1e36 60%, #0a1628 100%);
  position: relative;
  overflow: hidden;
}
.pen-highlight-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 60% at 15% 50%, rgba(0,149,208,.13) 0%, transparent 70%),
    radial-gradient(ellipse 40% 50% at 85% 20%, rgba(0,149,208,.08) 0%, transparent 70%);
  pointer-events: none;
}
.pen-highlight-inner {
  display: flex;
  align-items: center;
  gap: 72px;
}

/* ---- Image column ---- */
.pen-highlight-img-col {
  position: relative;
  flex: 0 0 300px;
  display: flex;
  justify-content: center;
}
.pen-hl-glow {
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,149,208,.35) 0%, transparent 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  filter: blur(32px);
  pointer-events: none;
}
.pen-hl-img-link img,
.pen-hl-img-link .wp-post-image {
  width: 260px;
  height: auto;
  object-fit: contain;
  position: relative;
  z-index: 1;
  drop-shadow: none;
  filter: drop-shadow(0 12px 32px rgba(0,149,208,.25));
}
.pen-img-placeholder {
  width: 260px;
  height: 360px;
  background: rgba(0,149,208,.08);
  border-radius: 16px;
  border: 1px dashed rgba(0,149,208,.3);
}
.pen-hl-new-badge {
  position: absolute;
  top: -10px;
  right: 10px;
  background: var(--cyan);
  color: #fff;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 20px;
  z-index: 2;
  box-shadow: 0 4px 12px rgba(0,149,208,.4);
}

/* ---- Content column ---- */
.pen-highlight-content {
  flex: 1;
  min-width: 0;
}
.pen-highlight-content .pretitle {
  color: var(--cyan);
}
.pen-hl-title {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 800;
  color: #fff;
  margin: 8px 0 16px;
  line-height: 1.15;
}
.pen-hl-lead {
  font-size: 1.05rem;
  color: rgba(255,255,255,.72);
  line-height: 1.6;
  margin-bottom: 28px;
  max-width: 520px;
}
.pen-hl-features {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pen-hl-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .97rem;
  color: rgba(255,255,255,.88);
}
.pen-hl-features li svg {
  flex-shrink: 0;
  color: var(--cyan);
  stroke: var(--cyan);
}
.pen-hl-footer {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.pen-hl-price-wrap {
  display: flex;
  flex-direction: column;
}
.pen-hl-price {
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}
.pen-hl-vat {
  font-size: .78rem;
  color: rgba(255,255,255,.45);
  margin-top: 2px;
}
.pen-hl-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
}
.pen-hl-delivery {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .85rem;
  color: rgba(255,255,255,.5);
}
.pen-hl-delivery svg { stroke: rgba(255,255,255,.5); }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .pen-highlight-inner { gap: 40px; }
  .pen-highlight-img-col { flex: 0 0 220px; }
  .pen-hl-img-link img,
  .pen-hl-img-link .wp-post-image { width: 200px; }
  .pen-hl-glow { width: 200px; height: 200px; }
  .pen-img-placeholder { width: 200px; height: 280px; }
}
@media (max-width: 680px) {
  .pen-highlight-inner { flex-direction: column; gap: 32px; text-align: center; }
  .pen-highlight-img-col { flex: none; }
  .pen-hl-lead { margin-left: auto; margin-right: auto; }
  .pen-hl-features { align-items: flex-start; text-align: left; }
  .pen-hl-footer { justify-content: center; }
  .pen-hl-new-badge { right: 0; }
}

/* ── Language Switcher ────────────────────────────────────────────────── */
.lang-switcher {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1.5px solid var(--border-gray);
  border-radius: 50px;
  overflow: hidden;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  flex-shrink: 0;
}
.lang-btn {
  display: block;
  padding: 5px 10px;
  color: var(--t3);
  text-transform: uppercase;
  transition: color var(--t-fast), background var(--t-fast);
  line-height: 1;
  white-space: nowrap;
}
.lang-btn:hover { color: var(--cyan); background: var(--cyan-lt); }
.lang-btn--active { color: #fff !important; background: var(--cyan) !important; }
@media (max-width: 768px) {
  /* Im Header ausblenden */
  .nav-actions .lang-switcher { display: none; }
  /* Im Burger-Menü anzeigen */
  .nav-menu-lang {
    display: flex; align-items: center; justify-content: center;
    gap: 12px; padding: 16px 24px;
    border-top: 1px solid var(--border-gray);
    margin-top: 4px;
  }
  .nav-menu-lang a {
    font-size: .8rem; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--t3);
    padding: 6px 16px; border-radius: 50px;
    border: 1.5px solid var(--border-gray);
    transition: color var(--t-fast), background var(--t-fast), border-color var(--t-fast);
  }
  .nav-menu-lang a:hover { color: var(--cyan); border-color: var(--cyan); background: var(--cyan-lt); }
  .nav-menu-lang a.lang-btn--active { color: #fff; background: var(--cyan); border-color: var(--cyan); }
}
@media (min-width: 769px) {
  /* Im Burger-Menü verstecken auf Desktop */
  .nav-menu-lang { display: none; }
}

/* ============================================================
   VARIANTEN-DROPDOWN (Produktseite)
   ============================================================ */
.variations_form .variations {
  border-collapse: separate;
  border-spacing: 0;
  margin-bottom: 8px;
  width: 100%;
}
.variations_form .variations tr {
  display: flex;
  align-items: center;
  gap: 16px;
}
.variations_form .variations td.label {
  min-width: 70px;
  padding: 0;
}
.variations_form .variations td.label label {
  font-size: .85rem;
  font-weight: 700;
  color: var(--t3);
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
  margin: 0;
}
.variations_form .variations td.value {
  flex: 1;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.variations_form .variations select {
  flex: 1;
  appearance: none;
  -webkit-appearance: none;
  background-color: var(--surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230095d0' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  border: 1.5px solid var(--border-gray);
  border-radius: 10px;
  padding: 10px 40px 10px 14px;
  font-family: var(--font-body);
  font-size: .95rem;
  font-weight: 500;
  color: var(--t1);
  cursor: pointer;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.variations_form .variations select:hover {
  border-color: var(--border-h);
}
.variations_form .variations select:focus {
  outline: none;
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px var(--cyan-glow);
}
.variations_form .reset_variations {
  font-size: .78rem;
  font-weight: 600;
  color: var(--t3);
  white-space: nowrap;
  text-decoration: none;
  opacity: .7;
  transition: color var(--t-fast), opacity var(--t-fast);
  flex-shrink: 0;
}
.variations_form .reset_variations:hover {
  color: var(--cyan);
  opacity: 1;
}

/* Variations: auf Mobile Label oben, Dropdown darunter (volle Breite) */
@media (max-width: 600px) {
  .variations_form .variations tr {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 12px;
  }
  .variations_form .variations td.label {
    min-width: unset;
  }
  .variations_form .variations td.value {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .variations_form .variations select {
    width: 100%;
  }
  .variations_form .reset_variations {
    align-self: flex-start;
  }
}

/* ── Payment Guide Seite ─────────────────────────────────── */
.r24-payment-guide {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 0 56px;
}
.r24-pg-intro {
  background: var(--cyan-lt);
  border-left: 4px solid var(--cyan);
  border-radius: 0 var(--r) var(--r) 0;
  padding: 18px 22px;
  font-size: .97rem;
  line-height: 1.8;
  color: var(--t2);
  margin-bottom: 32px;
}
.r24-pg-intro strong { color: var(--t1); }
.r24-pg-steps {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.r24-pg-step {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: var(--r-lg);
  padding: 22px 24px;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.r24-pg-step:hover {
  border-color: var(--border-h);
  box-shadow: 0 4px 20px rgba(0,149,208,.08);
}
.r24-pg-num {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cyan) 0%, var(--cyan-dk) 100%);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .92rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,149,208,.3);
  margin-top: 1px;
}
.r24-pg-body { flex: 1; }
.r24-pg-body h3 {
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--t1);
  margin-bottom: 8px;
  line-height: 1.3;
}
.r24-pg-body p {
  font-size: .93rem;
  line-height: 1.75;
  color: var(--t2);
  margin-bottom: 8px;
}
.r24-pg-body p:last-child { margin-bottom: 0; }
.r24-pg-body strong { color: var(--t1); font-weight: 600; }
.r24-pg-body a { color: var(--cyan); }
.r24-pg-body ul {
  list-style: none;
  padding: 0;
  margin: 8px 0;
}
.r24-pg-body ul li {
  font-size: .93rem;
  line-height: 1.7;
  color: var(--t2);
  padding-left: 18px;
  position: relative;
  margin-bottom: 4px;
}
.r24-pg-body ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--cyan);
  font-size: .85rem;
}
.r24-pg-cta {
  margin-top: 32px;
  text-align: center;
}
.r24-pg-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 32px;
  background: var(--cyan);
  color: #fff !important;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .95rem;
  border-radius: 50px;
  text-decoration: none;
  box-shadow: var(--shadow-btn);
  transition: background var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast);
}
.r24-pg-btn:hover {
  background: var(--cyan-dk);
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(0,149,208,.38);
}
@media (max-width: 600px) {
  .r24-pg-step { padding: 16px 18px; gap: 14px; }
  .r24-pg-num { width: 28px; height: 28px; font-size: .82rem; }
}

/* ── Checkout: Zahlungsanleitung Banner ─────────────────── */
.r24-payment-guide-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--cyan-lt);
  border: 1.5px solid var(--border-h);
  border-radius: var(--r);
  padding: 12px 18px;
  margin-bottom: 22px;
  font-size: .9rem;
}
.r24-pgb-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  opacity: .8;
}
.r24-pgb-text {
  color: var(--t2);
  line-height: 1.5;
}
.r24-pgb-text a {
  color: var(--cyan);
  font-weight: 600;
  text-decoration: none;
}
.r24-pgb-text a:hover { text-decoration: underline; }
@media (max-width: 480px) {
  .r24-payment-guide-banner { flex-direction: column; gap: 6px; }
}

/* ═══════════════════════════════════════════
   ZAHLUNGSANLEITUNG
   ═══════════════════════════════════════════ */
.pay-guide-page { padding-bottom: 80px; }
.pay-guide-container { max-width: 960px; }

/* Zahlungsmethoden Übersicht */
.pay-methods-section { margin-bottom: 48px; }
.pay-methods-section .section-head { margin-bottom: 28px; }
.pay-methods-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.pay-method-card {
  background: var(--surface);
  border: 1.5px solid var(--border-gray);
  border-radius: 14px;
  padding: 0;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: border-color .2s, box-shadow .2s, transform .2s;
  display: flex;
  flex-direction: column;
}
.pay-method-card:hover {
  border-color: var(--cyan);
  box-shadow: var(--shadow-card-h);
  transform: translateY(-2px);
}
.pmc-body {
  padding: 20px 24px 24px;
}
.pmc-body h3 {
  font-family: var(--font-head);
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--t1);
  margin: 0 0 4px;
}
.pmc-body > p { font-size: .8rem; color: var(--t3); margin: 0 0 16px; }
.pmc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 14px;
  margin-bottom: 18px;
}
.pmc-chip {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 6px;
  background: var(--cyan-lt);
  color: var(--cyan-dk);
  border: 1px solid rgba(0,149,208,.2);
}
.pmc-chip--green {
  background: var(--green-lt);
  color: var(--green-dk);
  border-color: rgba(0,179,122,.2);
}
.pmc-features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.pmc-features li {
  font-size: .86rem;
  color: var(--t2);
  line-height: 1.5;
  padding-left: 18px;
  position: relative;
}
.pmc-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--cyan);
  font-weight: 700;
  font-size: .8rem;
}

/* Checkout-Steps */
.pay-steps-section { margin-bottom: 48px; }
.pay-steps-section .section-head { margin-bottom: 28px; }

/* Responsive */
@media (max-width: 700px) {
  .pay-methods-grid { grid-template-columns: 1fr; }
}

/* Zahlungsmethoden-Bilder: Anleitung (Cards) */
.pmc-img {
  width: 100%;
  flex-shrink: 0;
}
.pmc-img img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 0;
}

/* Zahlungsmethoden-Icons: Fallback (falls Card-CSS nicht greift) */
.r24-pay-icon { display: block; border-radius: 6px; }
.r24-pay-icon--sc  { max-height: 44px; width: auto; }
.r24-pay-icon--cry { max-height: 44px; width: auto; }

/* (Checkout-Layout-Overrides entfernt — Standard-WooCommerce-Layout aktiv) */

/* ── Zahlungsbereich ── */
.r24-payment {
  border-top: 2px solid var(--border-gray);
}

/* Hinweis-Banner */
.r24-pay-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  font-size: .78rem;
  color: var(--t3);
  background: var(--bg);
  border-bottom: 1px solid var(--border-gray);
}
.r24-pay-hint a { color: var(--cyan); text-decoration: none; font-weight: 600; }
.r24-pay-hint a:hover { text-decoration: underline; }

/* Zahlungskarten-Grid */
.r24-pay-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 16px 20px;
}

/* Einzelne Karte */
.r24-pay-card {
  position: relative;
  border: 2px solid var(--border-gray);
  border-radius: 13px;
  padding: 0;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
  background: var(--surface);
  overflow: hidden;
  transition: border-color .17s, box-shadow .17s, transform .17s;
}
.r24-pay-card:hover {
  border-color: rgba(0,149,208,.5);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.r24-pay-card--active {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(0,149,208,.1), var(--shadow-md);
}

/* Radio: klein oben rechts, aber sichtbar */
.r24-pay-radio {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--cyan);
  cursor: pointer;
}

/* Bild */
.r24-pay-logo {
  width: 100%;
  height: 110px;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 0;
  flex-shrink: 0;
}

/* Titel-Label */
.r24-pay-card-label {
  font-family: var(--font-head);
  font-size: .73rem;
  font-weight: 600;
  color: var(--t3);
  letter-spacing: .02em;
  cursor: pointer;
  margin: 0;
  padding: 8px 12px 12px;
  width: 100%;
  box-sizing: border-box;
  line-height: 1.4;
}

/* Details / payment_fields */
.r24-pay-detail {
  display: none;
  padding: 10px 20px 6px;
  background: var(--bg);
  border-top: 1px solid var(--border-gray);
  font-size: .8rem;
  color: var(--t2);
  line-height: 1.6;
}
.r24-pay-detail--active { display: block; }
.r24-pay-detail p { margin: 0 0 4px; font-size: .78rem; color: var(--t2); }

/* Zahlungsanleitung-Hinweisbox */
.r24-pay-guide-note {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 14px 20px 18px;
  padding: 13px 16px;
  background: rgba(220,50,30,.05);
  border: 1.5px solid rgba(220,50,30,.18);
  border-left: 4px solid #d93e2d;
  border-radius: 10px;
}
.r24-pgn-icon {
  font-size: 1.15rem;
  flex-shrink: 0;
  line-height: 1.4;
}
.r24-pgn-body {
  flex: 1;
  min-width: 0;
}
.r24-pgn-intro {
  display: block;
  font-size: .82rem;
  color: var(--t2);
  margin-bottom: 5px;
  line-height: 1.45;
}
.r24-pgn-body a {
  color: var(--t1);
  font-weight: 700;
  text-decoration: none;
  font-size: .86rem;
  display: block;
  margin-bottom: 4px;
}
.r24-pgn-body a:hover { color: var(--cyan); text-decoration: underline; }
.r24-pgn-body p {
  margin: 0;
  font-size: .77rem;
  color: var(--t3);
  line-height: 1.55;
}

/* Kompakter Datenschutz-Hinweis unter AGB-Checkbox */
.r24-privacy-note {
  margin: 6px 0 0;
  font-size: .75rem;
  color: var(--t3);
  line-height: 1.45;
}
.r24-privacy-note a {
  color: var(--t2);
  text-decoration: underline;
}
.r24-privacy-note a:hover { color: var(--cyan); }

/* Place-order-Bereich */
.r24-place-order {
  padding: 14px 20px 20px;
  margin: 0;
  border-top: 1.5px solid var(--border-gray);
}

/* Bestell-Button */
.r24-order-btn {
  width: 100%;
  padding: 15px 20px;
  font-size: 1rem;
  font-weight: 800;
  border-radius: 12px;
  margin-top: 10px;
  letter-spacing: .02em;
}

/* Responsive */
@media (max-width: 900px) {
  .r24-checkout-grid { grid-template-columns: 1fr; }
  .r24-co-right { order: -1; } /* Bestellung zuerst auf Mobile */
}
@media (max-width: 480px) {
  .r24-pay-cards { grid-template-columns: 1fr; }
  .r24-co-card-head { padding: 14px 16px; }
  .r24-co-fields { padding: 6px 16px 16px; }
  .r24-co-card--order .shop_table td,
  .r24-co-card--order .shop_table th { padding: 8px 14px; }
  .r24-pay-cards { padding: 12px 14px; }
  .r24-place-order { padding: 12px 14px 16px; }
}

/* Paket-Versicherung: WC-Gebührenzeile verstecken – Preis steht bereits in der Checkbox-Zeile */
.woocommerce-checkout-review-order-table tr.fee { display: none !important; }

/* ── Partner-Bereich (Creator-Login + Dashboard) ─────────────────────────── */
.partner-page { max-width: 760px; margin: 60px auto; padding: 0 16px 80px; min-height: 50vh; }

.partner-notice { padding: 12px 18px; border-radius: 8px; font-size: 14px; font-weight: 600; margin-bottom: 22px; }
.partner-notice--ok  { background: rgba(63,185,80,.1); color: #1e9e6e; border: 1px solid rgba(63,185,80,.3); }
.partner-notice--err { background: rgba(248,81,73,.08); color: #c00; border: 1px solid rgba(248,81,73,.3); }
.partner-notice--warn { background: rgba(230,115,0,.08); color: #b35900; border: 1px solid rgba(230,115,0,.3); margin-bottom: 18px; }

.partner-card { background: #fff; border: 1px solid #e0e8f0; border-radius: 10px; padding: 28px 30px; }
.partner-card--narrow { max-width: 420px; margin: 0 auto; }
.partner-card h1 { font-size: 22px; color: #0f3454; margin: 0 0 6px; }
.partner-card h3 { font-size: 15px; color: #0f3454; margin: 0 0 14px; }
.partner-sub { color: #667; font-size: 14px; margin: 0 0 22px; }

.partner-form { display: flex; flex-direction: column; gap: 6px; }
.partner-form label { font-size: 12px; font-weight: 700; color: #555; margin-top: 8px; }
.partner-form input[type=text],
.partner-form input[type=email],
.partner-form input[type=password] {
  padding: 11px 14px; border: 1.5px solid #c0ccd8; border-radius: 6px; font-size: 14px; background: #fff;
}
.partner-form input:focus { outline: none; border-color: #0f3454; box-shadow: 0 0 0 2px rgba(15,52,84,.12); }

.partner-btn {
  margin-top: 16px; background: #0f3454; color: #fff; border: none; border-radius: 6px;
  padding: 12px 22px; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .15s;
}
.partner-btn:hover { background: #1a4d7a; }
.partner-btn--ghost { background: transparent; color: #0f3454; border: 1.5px solid #c0ccd8; }
.partner-btn--ghost:hover { background: #f0f5fa; }

.partner-forgot { margin-top: 18px; font-size: 13px; color: #667; }
.partner-forgot summary { cursor: pointer; color: #0f3454; font-weight: 600; }
.partner-forgot .partner-form { margin-top: 12px; }

.partner-collapse-summary { cursor: pointer; font-size: 15px; font-weight: 700; color: #0f3454; list-style: revert; }
.partner-collapse .partner-form { margin-top: 14px; }
.partner-collapse .partner-wallet-note,
.partner-collapse .partner-wallet-hint { margin-top: 12px; }
.partner-collapse-flag { font-size: 11px; font-weight: 700; color: #b35900; vertical-align: middle; }

.partner-dash-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 14px; margin-bottom: 28px; }
.partner-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #889; }
.partner-code { font-size: 36px; font-weight: 800; color: #0f3454; letter-spacing: 1px; margin: 4px 0 0; }

.partner-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 18px; }
.partner-stat { background: #f0f5fa; border: 1px solid #d0dce8; border-radius: 10px; padding: 16px 14px; text-align: center; }
.partner-stat--accent { background: rgba(63,185,80,.1); border-color: rgba(63,185,80,.3); }
.partner-stat-num { display: block; font-size: 19px; font-weight: 800; color: #0f3454; }
.partner-stat-label { display: block; font-size: 11px; color: #667; margin-top: 4px; }

.partner-payout-note { font-size: 13px; color: #667; background: #fafbfc; border: 1px dashed #d0dce8; border-radius: 8px; padding: 12px 16px; margin-bottom: 28px; }
.partner-payout-note strong { color: #0f3454; }

.partner-wallet-note { font-size: 12px; color: #b35900; background: rgba(230,115,0,.07); border: 1px solid rgba(230,115,0,.25); border-radius: 6px; padding: 9px 12px; margin: 0 0 14px; line-height: 1.5; }
.partner-wallet-note strong { color: #b35900; }
.partner-wallet-hint { font-size: 12px; color: #667; margin: 0 0 14px; line-height: 1.5; }
.partner-wallet-hint strong { color: #0f3454; }

.partner-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 32px; }

.partner-table-title { font-size: 16px; color: #0f3454; margin: 0 0 12px; }
.partner-table-wrap { overflow-x: auto; border: 1px solid #e0e8f0; border-radius: 10px; }
.partner-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.partner-table th { text-align: left; padding: 10px 14px; background: #f0f5fa; color: #0f3454; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.partner-table td { padding: 10px 14px; border-top: 1px solid #eef2f6; }
.partner-table-empty { text-align: center; color: #999; padding: 24px; }
.partner-row--cancelled { opacity: .55; }
.partner-tag { font-size: 10px; font-weight: 700; background: rgba(248,81,73,.1); color: #c00; padding: 2px 8px; border-radius: 4px; }

.partner-support-note { margin-top: 24px; font-size: 13px; color: #889; text-align: center; }
.partner-support-note a { color: #0f3454; font-weight: 600; text-decoration: none; }
.partner-support-note a:hover { text-decoration: underline; }

@media (max-width: 720px) {
  .partner-stats { grid-template-columns: repeat(2, 1fr); }
  .partner-grid { grid-template-columns: 1fr; }
  .partner-card { padding: 22px 18px; }
}