/* HENI Shop – Stile (eingebunden in themes/heni2025/header.php) */
/* ======== Kopfzeile: Logo, Konto, Warenkorb, Merkliste ======== */
/* ===== HENI Kopfbereich: Logo + Konto/Warenkorb/Merkliste ===== */
.heni-brand{ display:flex; align-items:center; gap:16px; text-decoration:none; }
.heni-brand .heni-logo{ display:block; height:44px; width:auto; overflow:visible; }
@media (min-width:768px){ .heni-brand .heni-logo{ height:54px; } }
.heni-brand .lg-txt{ fill:#6d7476; transition:fill .35s ease; }
.heni-brand .lg-dot{ fill:#0b55a3; transform-box:fill-box; transform-origin:50% 60%;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1), fill .3s ease; animation:heniDotIn 1.3s .35s cubic-bezier(.22,1,.36,1) backwards; }
.heni-brand .lg-shine{ transform:translateX(0) skewX(-20deg); }
.heni-brand:hover .lg-txt, .heni-brand:focus-visible .lg-txt{ fill:#4f5658; }
.heni-brand:hover .lg-dot, .heni-brand:focus-visible .lg-dot{ fill:#0a62c2; transform:translateY(-4px) rotate(-10deg) scale(1.15); }
.heni-brand:hover .lg-shine, .heni-brand:focus-visible .lg-shine{ animation:heniLgShine .9s ease; }
@keyframes heniLgShine{ from{ transform:translateX(0) skewX(-20deg); } to{ transform:translateX(460px) skewX(-20deg); } }
@keyframes heniDotIn{ 0%{ transform:translate(28px,-60px) rotate(-200deg) scale(.2); opacity:0; } 55%{ transform:translate(0,4px) rotate(8deg) scale(1.15); opacity:1; } 75%{ transform:translate(0,-3px) rotate(-4deg) scale(.96); } 100%{ transform:none; opacity:1; } }
.heni-brand-tag{ display:none; padding-left:16px; border-left:2px solid #e2e6ea; color:#6d7476;
  font-size:11px; line-height:1.25; font-weight:800; font-style:italic; letter-spacing:.16em; text-transform:uppercase; white-space:nowrap;
  transition:color .3s ease, border-color .3s ease; }
.heni-brand-tag b{ display:block; color:#0b55a3; font-weight:800; }
.heni-brand:hover .heni-brand-tag{ border-color:#0b55a3; }
@media (min-width:1180px){ .heni-brand-tag{ display:block; } }

.heni-hd-actions{ align-items:center; gap:4px; } /* sichtbar ab md (Tailwind md:flex) */
.heni-hd-btn{ position:relative; display:flex; align-items:center; gap:10px; padding:5px 14px 5px 5px; border-radius:999px;
  color:#1f2937; text-decoration:none; background:transparent; border:0; cursor:pointer;
  transition:background-color .25s ease, box-shadow .25s ease; }
.heni-hd-btn:hover, .heni-hd-btn:focus-visible, .heni-hd-acc:focus-within > .heni-hd-btn{ background:#f2f6fb; box-shadow:inset 0 0 0 1px #dbe5f1; outline:none; }
.heni-hd-ic{ position:relative; flex:0 0 auto; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#eaf1f9; color:var(--color-primary, #0b55a3); font-size:16px;
  transition:background-color .25s ease, color .25s ease, transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease; }
.heni-hd-btn:hover .heni-hd-ic, .heni-hd-btn:focus-visible .heni-hd-ic, .heni-hd-acc:focus-within .heni-hd-ic{
  background:var(--color-primary, #0b55a3); color:#fff; transform:translateY(-2px);
  box-shadow:0 8px 16px -8px var(--color-primary, #0b55a3); }
.heni-hd-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.15; text-align:left; }
.heni-hd-txt small{ font-size:11px; font-weight:500; color:#6b7280; }
.heni-hd-txt strong{ font-size:13.5px; font-weight:700; color:#111827; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:color .2s ease; }
.heni-hd-btn:hover strong, .heni-hd-btn:focus-visible strong{ color:var(--color-primary, #0b55a3); }
.heni-hd-chev{ font-size:10px; color:#9ca3af; margin-left:2px; transition:transform .25s ease; }
.heni-hd-acc:hover .heni-hd-chev, .heni-hd-acc:focus-within .heni-hd-chev{ transform:rotate(180deg); }
.heni-hd-badge{ position:absolute; top:-5px; right:-7px; min-width:20px; height:20px; padding:0 5px; border-radius:999px;
  display:flex; align-items:center; justify-content:center; background:#dc2626; color:#fff; font-size:11px; font-weight:700; border:2px solid #fff; }
.heni-hd-badge:has(.header-cart-items-marker:empty){ display:none; }
.heni-hd-cart:hover .heni-hd-ic i{ animation:heniCartWiggle .6s ease; }
@keyframes heniCartWiggle{ 0%,100%{ transform:none; } 30%{ transform:translateX(-3px) rotate(-8deg); } 60%{ transform:translateX(3px) rotate(6deg); } }
.heni-hd-bm .fa-solid{ display:none; }
.heni-hd-bm:hover .fa-regular{ display:none; }
.heni-hd-bm:hover .fa-solid{ display:inline-block; animation:heniPop .35s ease; }
@keyframes heniPop{ from{ transform:scale(.6); } to{ transform:scale(1); } }
/* Konto-Menue */
.heni-hd-acc{ position:relative; z-index:9999; }
.heni-hd-menu{ position:absolute; right:0; top:calc(100% + 8px); z-index:9999; width:230px; margin:0 !important; padding:8px !important; list-style:none;
  background:#fff; border:1px solid #e5e7eb; border-radius:14px; box-shadow:0 18px 40px -18px rgba(15,23,42,.45);
  opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .2s ease, transform .2s ease, visibility .2s; }
.heni-hd-menu::before{ content:''; position:absolute; left:0; right:0; top:-10px; height:10px; }
.heni-hd-acc:hover .heni-hd-menu, .heni-hd-acc:focus-within .heni-hd-menu{ opacity:1; visibility:visible; transform:none; }
.heni-hd-menu .who{ padding:8px 10px 10px; margin-bottom:6px; border-bottom:1px solid #eef0f3; font-size:11px; color:#6b7280; }
.heni-hd-menu .who b{ display:block; font-size:13px; color:#111827; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.heni-hd-menu a{ display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:9px; font-size:13.5px; color:#374151; text-decoration:none; transition:background-color .15s ease, color .15s ease; }
.heni-hd-menu a i{ width:16px; text-align:center; color:#9ca3af; transition:color .15s ease; }
.heni-hd-menu a:hover{ background:#f2f6fb; color:var(--color-primary, #0b55a3); }
.heni-hd-menu a:hover i{ color:var(--color-primary, #0b55a3); }
.heni-hd-menu a.is-admin{ color:#b91c1c; }
.heni-hd-menu a.is-admin i{ color:#dc2626; }
.heni-hd-menu a.is-admin:hover{ background:#fef2f2; color:#991b1b; }
.heni-hd-menu .sep{ height:1px; margin:6px 4px; background:#eef0f3; }
@media (prefers-reduced-motion:reduce){
  .heni-brand .lg-dot, .heni-brand:hover .lg-shine, .heni-hd-cart:hover .heni-hd-ic i{ animation:none; }
}

/* ======== Seitenleiste Warenkorb / Merkliste ======== */
/* ===== Seitenleiste Warenkorb / Merkliste ===== */
.heni-dr-backdrop{ position:fixed; inset:0; z-index:10000; background:rgba(15,23,42,.45); backdrop-filter:blur(2px);
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s; }
.heni-dr-backdrop.is-open{ opacity:1; visibility:visible; }
.heni-dr{ position:fixed; top:0; right:0; bottom:0; z-index:10001; width:min(440px, 100vw); display:flex; flex-direction:column;
  background:#fff; box-shadow:-24px 0 48px -24px rgba(15,23,42,.45); transform:translateX(105%);
  transition:transform .38s cubic-bezier(.22,1,.36,1); font-size:14px; color:#111827; }
.heni-dr.is-open{ transform:none; }
.heni-dr-head{ display:flex; align-items:center; gap:10px; padding:16px 18px 0; }
.heni-dr-tabs{ display:flex; gap:4px; flex:1; background:#f1f5f9; padding:4px; border-radius:12px; }
.heni-dr-tab{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:9px 10px; border:0; border-radius:9px;
  background:transparent; color:#475569; font-weight:700; font-size:13.5px; cursor:pointer; transition:background-color .2s, color .2s, box-shadow .2s; }
.heni-dr-tab .cnt{ min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:#e2e8f0; color:#334155; font-size:11px; display:inline-flex; align-items:center; justify-content:center; }
.heni-dr-tab.is-active{ background:#fff; color:var(--color-primary,#0b55a3); box-shadow:0 2px 8px -3px rgba(15,23,42,.25); }
.heni-dr-tab.is-active .cnt{ background:var(--color-primary,#0b55a3); color:#fff; }
.heni-dr-close{ width:38px; height:38px; border-radius:50%; border:0; background:#f1f5f9; color:#334155; cursor:pointer; font-size:16px;
  transition:background-color .2s, transform .3s; }
.heni-dr-close:hover{ background:#e2e8f0; transform:rotate(90deg); }
.heni-dr-sub{ display:flex; gap:6px; flex-wrap:wrap; padding:12px 18px 0; }
.heni-dr-chip{ padding:5px 11px; border-radius:999px; border:1px solid #dbe3ec; background:#fff; font-size:12px; font-weight:600; color:#475569; cursor:pointer; transition:all .2s; }
.heni-dr-chip:hover{ border-color:var(--color-primary,#0b55a3); color:var(--color-primary,#0b55a3); }
.heni-dr-chip.is-active{ background:var(--color-primary,#0b55a3); border-color:var(--color-primary,#0b55a3); color:#fff; }
.heni-dr-body{ flex:1; overflow-y:auto; padding:12px 18px 18px; overscroll-behavior:contain; }
.heni-dr-list{ list-style:none; margin:0; padding:0; }
.heni-dr-item{ display:grid; grid-template-columns:76px 1fr; gap:12px; padding:14px 0; border-bottom:1px solid #eef0f3;
  animation:heniDrIn .35s ease both; transition:opacity .25s ease, transform .25s ease, max-height .3s ease, padding .3s ease; max-height:240px; overflow:hidden; }
.heni-dr-item.is-leaving{ opacity:0; transform:translateX(30px); max-height:0; padding:0; border-width:0; }
@keyframes heniDrIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.heni-dr-img{ width:76px; height:76px; border-radius:10px; border:1px solid #eef0f3; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.heni-dr-img img{ max-width:100%; max-height:100%; object-fit:contain; transition:transform .3s; }
.heni-dr-item:hover .heni-dr-img img{ transform:scale(1.06); }
.heni-dr-name{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-weight:700; font-size:13.5px; line-height:1.3; color:#111827; text-decoration:none; }
.heni-dr-name:hover{ color:var(--color-primary,#0b55a3); }
.heni-dr-meta{ margin-top:2px; font-size:11.5px; color:#6b7280; }
.heni-dr-meta .ok{ color:#15803d; }
.heni-dr-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; }
.heni-dr-qty{ display:inline-flex; align-items:center; border:1px solid #dbe3ec; border-radius:999px; overflow:hidden; }
.heni-dr-qty button{ width:30px; height:30px; border:0; background:#fff; color:#334155; cursor:pointer; font-size:12px; transition:background-color .15s, color .15s; }
.heni-dr-qty button:hover{ background:var(--color-primary,#0b55a3); color:#fff; }
.heni-dr-qty input{ width:40px; height:30px; border:0; text-align:center; font-weight:700; font-size:13px; -moz-appearance:textfield; }
.heni-dr-qty input::-webkit-outer-spin-button, .heni-dr-qty input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.heni-dr-price{ font-weight:800; font-size:14px; white-space:nowrap; }
.heni-dr-acts{ display:flex; gap:4px; }
.heni-dr-ic{ width:30px; height:30px; border-radius:50%; border:0; background:transparent; color:#94a3b8; cursor:pointer; transition:background-color .15s, color .15s; }
.heni-dr-ic:hover{ background:#f1f5f9; color:var(--color-primary,#0b55a3); }
.heni-dr-ic.del:hover{ background:#fef2f2; color:#dc2626; }
.heni-dr-tocart{ display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:999px; border:0; background:var(--color-primary,#0b55a3); color:#fff; font-weight:700; font-size:12px; cursor:pointer; transition:filter .15s, transform .15s; }
.heni-dr-tocart:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.heni-dr-empty{ text-align:center; padding:48px 12px; color:#6b7280; }
.heni-dr-empty i{ font-size:34px; color:#cbd5e1; margin-bottom:12px; display:block; }
.heni-dr-foot{ border-top:1px solid #eef0f3; padding:14px 18px 18px; background:#fbfcfe; }
.heni-dr-sum{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:12px; }
.heni-dr-sum b{ font-size:18px; }
.heni-dr-sum small{ display:block; font-size:11px; color:#6b7280; }
.heni-dr-btns{ display:grid; gap:8px; }
.heni-dr-btn{ display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 14px; border-radius:12px; font-weight:800; font-size:14px; text-decoration:none; transition:filter .15s, background-color .15s, transform .15s; }
.heni-dr-btn.primary{ background:var(--color-primary,#0b55a3); color:#fff; }
.heni-dr-btn.primary:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.heni-dr-btn.ghost{ border:1px solid #dbe3ec; color:#334155; background:#fff; }
.heni-dr-btn.ghost:hover{ border-color:var(--color-primary,#0b55a3); color:var(--color-primary,#0b55a3); }
.heni-dr-busy{ pointer-events:none; opacity:.55; }
html.heni-dr-lock{ overflow:hidden; }
@media (prefers-reduced-motion:reduce){ .heni-dr, .heni-dr-item{ transition:none; animation:none; } }
.heni-dr-tab:focus, .heni-dr-chip:focus, .heni-dr-close:focus{ outline:none; }
.heni-dr-tab:focus-visible, .heni-dr-chip:focus-visible, .heni-dr-close:focus-visible{ outline:2px solid var(--color-primary,#0b55a3); outline-offset:2px; }
.heni-dr-chip span{ opacity:.7; font-weight:700; margin-left:2px; }
.heni-dr-gifts{ margin-top:14px; padding:12px; border-radius:12px; background:#f0fdf4; border:1px dashed #86efac; }
.heni-dr-gifts-t{ font-weight:800; font-size:12.5px; color:#15803d; margin-bottom:8px; }
.heni-dr-gift{ display:grid; grid-template-columns:40px 1fr auto; gap:10px; align-items:center; padding:6px 0; }
.heni-dr-gift img{ width:40px; height:40px; object-fit:contain; background:#fff; border-radius:8px; border:1px solid #dcfce7; }
.heni-dr-gift b{ display:block; font-size:12.5px; line-height:1.25; }
.heni-dr-gift small{ font-size:11px; color:#4b5563; }
.heni-dr-gift em{ font-style:normal; font-weight:800; font-size:12px; color:#15803d; }

/* ======== Warenkorb-Seite ======== */
/* ===== Warenkorb-Seite ===== */
#cart-main > ul:has(> li[data-line]){ display:grid; gap:12px; }
#cart-main > ul > li[data-line]{ border:1px solid #e5e9f0 !important; border-radius:16px; padding:18px !important; box-shadow:0 1px 2px rgba(15,23,42,.05) !important;
  transition:box-shadow .25s ease, border-color .25s ease; }
#cart-main > ul > li[data-line]:hover{ border-color:#cfd9e6 !important; box-shadow:0 12px 26px -16px rgba(15,23,42,.35) !important; }
#cart-main li[data-line] article > div:first-child{ border-radius:12px; border:1px solid #eef0f3; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; }
#cart-main li[data-line] article > div:first-child img{ transition:transform .35s ease; }
#cart-main li[data-line]:hover article > div:first-child img{ transform:scale(1.05); }
#cart-main li[data-line] a.font-semibold{ font-size:15px; line-height:1.3; color:#111827; transition:color .15s; }
#cart-main li[data-line] a.font-semibold:hover{ color:var(--color-primary,#0b55a3); }
#cart-main li[data-line] small{ display:block; margin-top:2px; font-size:12px; color:#6b7280; letter-spacing:.02em; }
#cart-main li[data-line] .text-xl.font-semibold{ font-size:19px; font-weight:800; color:#111827; white-space:nowrap; }
/* Mengenfeld */
#cart-main li[data-line] div:has(> button[name="action"]){ display:inline-flex; align-items:center; border:1px solid #cbd5e1 !important; border-radius:999px !important; overflow:hidden; background:#fff; }
#cart-main li[data-line] button[name="action"]{ width:38px; height:38px; padding:0 !important; background:#fff !important; color:var(--color-primary,#0b55a3) !important; font-size:18px; font-weight:700; line-height:1; transition:background-color .15s, color .15s; }
#cart-main li[data-line] button[name="action"]:hover{ background:var(--color-primary,#0b55a3) !important; color:#fff !important; }
#cart-main li[data-line] input[type="number"]{ width:56px !important; height:38px; border:0 !important; border-left:1px solid #e5e9f0 !important; border-right:1px solid #e5e9f0 !important;
  text-align:center !important; font-weight:700; font-size:15px; color:#111827 !important; -moz-appearance:textfield; background:#fff; }
#cart-main li[data-line] input[type="number"]::-webkit-outer-spin-button, #cart-main li[data-line] input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
#cart-main li[data-line] input[type="number"]:focus{ outline:none; background:#f2f6fb; }
/* Merkliste / Entfernen als Knoepfe */
#cart-main li[data-line] a[id^="item-bookmark-"], #cart-main li[data-line] a[id^="item-delete-"]{ display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px;
  border:1px solid #e2e8f0; text-decoration:none !important; font-size:12.5px; font-weight:600; color:#475569 !important; transition:all .15s; }
#cart-main li[data-line] a[id^="item-bookmark-"]::before, #cart-main li[data-line] a[id^="item-delete-"]::before{ font-family:"Font Awesome 6 Free"; font-weight:400; }
#cart-main li[data-line] a[id^="item-bookmark-"]::before{ content:"\f02e"; }
#cart-main li[data-line] a[id^="item-delete-"]::before{ content:"\f2ed"; }
#cart-main li[data-line] a[id^="item-bookmark-"]:hover{ border-color:var(--color-primary,#0b55a3); color:var(--color-primary,#0b55a3) !important; background:#f2f6fb; }
#cart-main li[data-line] a[id^="item-delete-"]:hover{ border-color:#fca5a5; color:#dc2626 !important; background:#fef2f2; }
#cart-main li[data-line] .mt-3.flex.items-center.gap-2.text-sm{ font-size:0; gap:8px; }
/* Bearbeiten-Stift */
#cart-main .cart-line-menu-toggle{ width:34px; height:34px; border-radius:50%; background:#f1f5f9; transition:background-color .15s, color .15s; }
#cart-main .cart-line-menu-toggle:hover{ background:var(--color-primary,#0b55a3); color:#fff !important; }
#cart-main .cart-line-menu{ border-radius:12px !important; overflow:hidden; box-shadow:0 18px 40px -18px rgba(15,23,42,.45) !important; }
/* Fracht: kompakt, direkt unter dem zugehoerigen Artikel */
#cart-main > ul > li.heni-freight{ margin-top:-8px; padding:10px 18px !important; background:#f8fafc !important; border-style:dashed !important; box-shadow:none !important; }
#cart-main > ul > li.heni-freight article{ grid-template-columns:1fr !important; }
#cart-main > ul > li.heni-freight article > div:first-child{ display:none !important; }
#cart-main > ul > li.heni-freight a.font-semibold{ pointer-events:none; font-size:13px; font-weight:600; color:#475569; }
#cart-main > ul > li.heni-freight a.font-semibold::before{ content:"\f0d1"; font-family:"Font Awesome 6 Free"; font-weight:900; margin-right:8px; color:#94a3b8; }
#cart-main > ul > li.heni-freight .text-xl.font-semibold{ font-size:14px; font-weight:700; color:#475569; }
#cart-main > ul > li.heni-freight .mt-4, #cart-main > ul > li.heni-freight small, #cart-main > ul > li.heni-freight .mt-1, #cart-main > ul > li.heni-freight .cart-line-extras:empty{ display:none; }
/* Geschenke */
#cart-main > ul > li.heni-cart-gift{ background:linear-gradient(90deg,#f0fdf4,#fff 60%) !important; border-color:#bbf7d0 !important; }
.heni-cart-gift-badge{ display:inline-flex; align-items:center; gap:6px; margin-bottom:6px; padding:3px 10px; border-radius:999px; background:#dcfce7; color:#15803d; font-size:11.5px; font-weight:800; }
#cart-main > ul > li.heni-cart-gift .text-xl.font-semibold{ color:#15803d; }

/* Treue-Leiste */
#cart-incentive.heni-inc{ padding:16px 18px 14px !important; border-radius:16px !important; background:linear-gradient(135deg,#f1f5fb,#f8fafc) !important; border:1px solid #e5e9f0; }
#cart-incentive.heni-inc [data-el="markers"]{ height:44px !important; }
.heni-inc-mk{ cursor:default; outline:none; z-index:1; }
.heni-inc-mk:hover, .heni-inc-mk:focus{ z-index:5; }
.heni-inc-mk > div:nth-child(2){ margin-top:2px !important; }
.heni-inc-mk > div:nth-child(2) i{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:#fff; border:1px solid #cbd5e1; font-size:11px; transition:transform .25s cubic-bezier(.34,1.56,.64,1), background-color .2s, color .2s; }
.heni-inc-mk.is-reached > div:nth-child(2) i{ background:#16a34a; border-color:#16a34a; color:#fff !important; }
.heni-inc-mk:hover > div:nth-child(2) i, .heni-inc-mk:focus > div:nth-child(2) i{ transform:scale(1.25); }
.heni-inc-mk.is-next > div:nth-child(2) i{ border-color:var(--color-primary,#0b55a3); color:var(--color-primary,#0b55a3) !important; animation:heniIncPulse 1.8s ease-out infinite; }
@keyframes heniIncPulse{ 0%{ box-shadow:0 0 0 0 rgba(11,85,163,.45); } 70%{ box-shadow:0 0 0 8px rgba(11,85,163,0); } 100%{ box-shadow:0 0 0 0 rgba(11,85,163,0); } }
.heni-inc-amt{ display:block; margin-top:2px; font-size:10.5px; font-weight:700; color:#64748b; white-space:nowrap; }
.heni-inc-mk.is-reached .heni-inc-amt{ color:#15803d; }
.heni-inc-mk.is-low > div:first-child{ height:30px !important; }
.heni-inc-mk.is-low .heni-inc-amt{ position:absolute; left:calc(50% + 14px); top:37px; margin:0; }
.heni-inc-mk.lbl-left .heni-inc-amt{ position:absolute; right:calc(50% + 14px); top:19px; margin:0; }
#cart-incentive.heni-inc [data-el="markers"]:has(.is-low){ height:60px !important; }
.heni-inc-tip{ position:absolute; bottom:calc(100% + 10px); left:50%; transform:translate(-50%,6px); min-width:170px; padding:9px 12px; border-radius:10px;
  background:#0f172a; color:#fff; font-size:12px; line-height:1.35; text-align:left; white-space:nowrap; pointer-events:none;
  opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility .2s; box-shadow:0 12px 24px -12px rgba(15,23,42,.6); }
.heni-inc-tip::after{ content:''; position:absolute; top:100%; left:50%; margin-left:-6px; border:6px solid transparent; border-top-color:#0f172a; }
.heni-inc-tip b{ display:block; font-size:12.5px; }
.heni-inc-tip small{ display:block; color:#cbd5e1; font-size:11px; }
.heni-inc-tip .ok{ color:#4ade80; font-weight:700; }
.heni-inc-tip .todo{ color:#93c5fd; font-weight:700; }
.heni-inc-mk:hover .heni-inc-tip, .heni-inc-mk:focus .heni-inc-tip, .heni-inc-knob:hover .heni-inc-tip{ opacity:1; visibility:visible; transform:translate(-50%,0); }
.is-end > .heni-inc-tip{ left:auto; right:-10px; transform:translate(0,6px); }
.is-end > .heni-inc-tip::after{ left:auto; right:14px; }
.is-start > .heni-inc-tip{ left:-10px; transform:translate(0,6px); }
.is-start > .heni-inc-tip::after{ left:14px; margin-left:0; }
.heni-inc-mk.is-end:hover .heni-inc-tip, .heni-inc-mk.is-end:focus .heni-inc-tip, .heni-inc-knob.is-end:hover .heni-inc-tip,
.heni-inc-mk.is-start:hover .heni-inc-tip, .heni-inc-mk.is-start:focus .heni-inc-tip, .heni-inc-knob.is-start:hover .heni-inc-tip{ transform:none; }
.heni-inc-knob{ z-index:6; cursor:default; }
.heni-inc-knob > div:first-child{ transition:transform .25s; }
.heni-inc-knob:hover > div:first-child{ transform:scale(1.2); }
.heni-inc-knob .heni-inc-tip{ bottom:calc(100% + 8px); }
.heni-inc-status{ margin-top:6px; font-size:12.5px; color:#334155; }
.heni-inc-status b{ color:var(--color-primary,#0b55a3); }
.heni-inc-status .fa-circle-check{ color:#16a34a; margin-right:4px; }

/* ======== Hauptmenue ======== */
/* Hauptmenue */
.heni-nav{ scrollbar-width:none; }
.heni-nav::-webkit-scrollbar{ display:none; }
.heni-nav-link{ position:relative; display:inline-flex; align-items:center; padding:.55rem .95rem; border-radius:6px; color:#fff; opacity:.88; text-decoration:none !important; transition:background-color .2s ease, opacity .2s ease; }
.heni-nav-link::after{ content:''; position:absolute; left:.95rem; right:.95rem; bottom:.3rem; height:2px; border-radius:2px; background:#fff; transform:scaleX(0); transition:transform .25s ease; }
.heni-nav-link:hover, .heni-nav-link:focus-visible{ background:rgba(255,255,255,.13); opacity:1; }
.heni-nav-link:hover::after, .heni-nav-link.is-active::after{ transform:scaleX(1); }
.heni-nav-link.is-active{ opacity:1; }
@media (max-width:639px){
  .heni-nav{ -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent); }
}

/* ======== Startseite ======== */
/* ===== Startseite: Vorteils-Karten (Kompetent, Unschlagbar ...) ===== */
section[aria-labelledby="keyfeatures-heading"] > div{ max-width:1280px; }
section[aria-labelledby="keyfeatures-heading"] ul{ gap:22px; }
section[aria-labelledby="keyfeatures-heading"] li{
  position:relative; overflow:hidden; background:#fff;
  border:1px solid #e5e7eb; border-radius:14px; padding:30px 18px 26px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
section[aria-labelledby="keyfeatures-heading"] li > *{ position:relative; z-index:1; }
section[aria-labelledby="keyfeatures-heading"] li::before{
  content:''; position:absolute; inset:0; z-index:0; opacity:0; transition:opacity .35s ease;
  background:radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 70%);
}
section[aria-labelledby="keyfeatures-heading"] li::after{
  content:''; position:absolute; top:0; left:-70%; width:45%; height:100%; z-index:0;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.75), transparent);
  transform:skewX(-20deg); pointer-events:none;
}
section[aria-labelledby="keyfeatures-heading"] li:hover{
  transform:translateY(-6px);
  border-color:var(--color-primary);
  box-shadow:0 18px 38px -14px color-mix(in srgb, var(--color-primary) 55%, transparent);
}
section[aria-labelledby="keyfeatures-heading"] li:hover::before{ opacity:1; }
section[aria-labelledby="keyfeatures-heading"] li:hover::after{ animation:heniShine .9s ease; }
section[aria-labelledby="keyfeatures-heading"] li > div:first-child{
  width:3.5rem; height:3.5rem; margin-bottom:.9rem;
  transition:transform .35s ease, box-shadow .35s ease;
}
section[aria-labelledby="keyfeatures-heading"] li:hover > div:first-child{
  transform:scale(1.12);
  box-shadow:0 0 0 7px color-mix(in srgb, var(--color-primary) 14%, transparent),
             0 0 22px color-mix(in srgb, var(--color-primary) 55%, transparent);
}
section[aria-labelledby="keyfeatures-heading"] h3{ font-size:.95rem; letter-spacing:.04em; transition:color .35s ease; }
section[aria-labelledby="keyfeatures-heading"] li:hover h3{ color:var(--color-primary); }
section[aria-labelledby="keyfeatures-heading"] p{ font-size:.8rem; line-height:1.45; }
.heni-reveal li{ opacity:0; transform:translateY(18px); }
.heni-reveal li.is-visible{ opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease, box-shadow .35s ease, border-color .35s ease; }
.heni-reveal li.is-visible:hover{ transform:translateY(-6px); }

/* ===== Abschnitts-Ueberschriften (Highlights, Top Hersteller, Neue Produkte ...) ===== */
.heni-heading{
  position:relative; overflow:hidden; cursor:default;
  transition:padding-right .35s ease, box-shadow .35s ease, transform .6s ease, opacity .6s ease;
}
.heni-heading-icon{ display:inline-block; margin-right:.55rem; transition:transform .45s ease; }
.heni-heading::after{
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.45), transparent);
  transform:skewX(-20deg); animation:heniHeadShine 6s ease-in-out infinite; pointer-events:none;
}
@keyframes heniHeadShine{ 0%,70%{ left:-60%; } 100%{ left:140%; } }
.heni-heading:hover{ padding-right:3rem !important; box-shadow:0 8px 20px -8px color-mix(in srgb, var(--color-primary) 70%, transparent); }
.heni-heading:hover .heni-heading-icon{ transform:rotate(-14deg) scale(1.25); }
.heni-heading-line{
  flex:1 1 auto; height:2px; margin:0 1rem; border-radius:2px;
  background:linear-gradient(to right, var(--color-primary), transparent);
  transform-origin:left center; transform:scaleX(0); transition:transform 1.2s ease .2s;
}
.heni-heading-row .heni-heading{ opacity:0; transform:translateX(-24px); }
.heni-heading-row > a.heni-more{
  display:inline-flex; align-items:center; gap:.45rem; padding:.38rem .95rem; margin-right:.5rem;
  border:1px solid color-mix(in srgb, var(--color-primary) 35%, transparent); border-radius:999px;
  font-size:.82rem; font-weight:600; color:var(--color-primary); background:#fff; text-decoration:none;
  transition:background-color .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.heni-heading-row > a.heni-more i{ font-size:.75rem; transition:transform .3s ease; }
.heni-heading-row > a.heni-more:hover{
  background:var(--color-primary); color:#fff; border-color:var(--color-primary); text-decoration:none;
  box-shadow:0 6px 16px -6px color-mix(in srgb, var(--color-primary) 70%, transparent);
}
.heni-heading-row > a.heni-more:hover i{ transform:translateX(4px); }
.heni-heading-row.is-visible .heni-heading{ opacity:1; transform:none; }
.heni-heading-row.is-visible .heni-heading-line{ transform:scaleX(1); }

/* ===== Produkt-Reihen (Highlights, Neue Produkte) ===== */
.heni-rail{ position:relative; padding:0 54px; }
.heni-rail-viewport{ overflow:hidden; padding:14px 0 24px; }
.heni-rail-track{ display:flex; align-items:stretch; will-change:transform; }
.heni-rail .product-box{ height:auto; }
.heni-rail-btn{
  position:absolute; top:50%; z-index:5; width:44px; height:44px; margin-top:-22px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:#fff; color:var(--color-primary); border:1px solid #e5e7eb;
  box-shadow:0 6px 16px -6px rgba(15,23,42,.35); cursor:pointer;
  transition:background-color .25s ease, color .25s ease, transform .25s ease;
}
.heni-rail-btn:hover{ background:var(--color-primary); color:#fff; transform:scale(1.08); }
.heni-rail-btn.prev{ left:4px; }
.heni-rail-btn.next{ right:4px; }
.heni-rail.is-static .heni-rail-btn{ display:none; }
.heni-rail.is-static .heni-rail-track{ justify-content:center; transform:none !important; }
@media (max-width:639px){
  .heni-rail{ padding:0 40px; }
  .heni-rail-btn{ width:34px; height:34px; margin-top:-17px; }
}

/* ===== Top Hersteller als laufendes Band (mit Maus ziehbar) ===== */
.heni-marquee{
  position:relative; overflow:hidden; margin:0 16px; cursor:grab;
  touch-action:pan-y; user-select:none; -webkit-user-select:none;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
          mask-image:linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
}
.heni-marquee.is-dragging{ cursor:grabbing; }
.heni-marquee-track{ display:flex; align-items:center; width:max-content; will-change:transform; }
.heni-marquee-track > a{ flex:0 0 auto; display:block; box-sizing:content-box; }
.heni-marquee-track img{ display:block; width:100%; height:auto; transition:transform .3s ease; pointer-events:none; }
.heni-marquee-track > a:hover img{ transform:scale(1.06); }

@media (prefers-reduced-motion:reduce){
  section[aria-labelledby="keyfeatures-heading"] li:hover::after,
  .heni-heading::after{ animation:none; }
}

/* ======== Produktkarten ======== */
/* ===== Produktkarten (Startseite, Neuheiten, Angebote, Suche, Kategorien ...) ===== */
@keyframes heniShine{ from{ left:-70%; } to{ left:130%; } }
body .product-box{
  position:relative; overflow:hidden; background:#fff; border-radius:14px;
  padding:12px 12px 14px; border-color:#d6dbe4;
  box-shadow:0 2px 6px rgba(15,23,42,.07), 0 10px 22px -14px rgba(15,23,42,.35);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
body .product-box::after{
  content:''; position:absolute; top:0; left:-70%; width:45%; height:100%; z-index:0;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.75), transparent);
  transform:skewX(-20deg); pointer-events:none;
}
body .product-box:hover{
  transform:translateY(-6px);
  border-color:var(--color-primary);
  box-shadow:0 18px 38px -14px color-mix(in srgb, var(--color-primary) 55%, transparent);
}
body .product-box:hover::after{ animation:heniShine .9s ease; }
body .product-box > *{ position:relative; z-index:1; }
body .product-box > .absolute{ position:absolute; z-index:2; }
body .product-box > br{ display:none; }
/* Bild fuellt die Kartenbreite (quadratisch) */
body .product-box > .mb-4{ top:0; margin-bottom:20px; }
body .product-box > .mb-4 > div{ width:100% !important; height:auto !important; aspect-ratio:1 / 1; }
body .product-box figure{ display:block; width:100%; height:100%; margin:0; overflow:hidden; }
body .product-box figure a{ display:block; width:100%; height:100%; }
body .product-box figure img{ width:100% !important; height:100% !important; max-width:100% !important; max-height:none !important; object-fit:contain; object-position:center; transition:transform .5s ease, opacity .18s ease; }
body .product-box:hover figure img{ transform:scale(1.07); }
/* Texte kompakter */
body .product-box h3{
  font-size:.8rem; line-height:1.25; margin-bottom:2px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
body .product-box p{ font-size:.74rem; line-height:1.3; margin-bottom:4px; }
body .product-box p.font-bold{ font-size:.95rem; margin-bottom:6px; }
body .product-box .mt-auto .text-xs{ font-size:.68rem; }

/* ===== Bildwechsel in der Karte ===== */
.heni-gal{ position:relative; }
.heni-gal-btn{
  position:absolute; top:50%; z-index:3; width:30px; height:30px; margin-top:-15px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:rgba(255,255,255,.92); color:var(--color-primary); border:1px solid #e5e7eb;
  box-shadow:0 3px 10px -3px rgba(15,23,42,.35); cursor:pointer; font-size:.75rem;
  opacity:0; transition:opacity .25s ease, background-color .2s ease, color .2s ease;
}
.heni-gal-btn.prev{ left:-6px; }
.heni-gal-btn.next{ right:-6px; }
.heni-gal-btn:hover{ background:var(--color-primary); color:#fff; }
.product-box:hover .heni-gal-btn, .heni-gal:focus-within .heni-gal-btn{ opacity:1; }
.heni-gal-dots{ position:absolute; left:0; right:0; bottom:-13px; display:flex; justify-content:center; gap:5px; z-index:3; }
.heni-gal-dots span{ width:6px; height:6px; border-radius:50%; background:#cbd5e1; transition:background-color .2s ease, transform .2s ease; }
.heni-gal-dots span.is-active{ background:var(--color-primary); transform:scale(1.3); }
@media (hover:none){ .heni-gal-btn{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ body .product-box:hover::after{ animation:none; } }

/* ======== Downloads ======== */
/* Download-Karten (Downloads-Seite) */
.heni-dl-card{
  position:relative; overflow:hidden; border-radius:14px; border-color:#d6dbe4 !important;
  box-shadow:0 2px 6px rgba(15,23,42,.07), 0 10px 22px -14px rgba(15,23,42,.35);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.heni-dl-card::after{
  content:''; position:absolute; top:0; left:-70%; width:45%; height:100%; z-index:2;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.6), transparent);
  transform:skewX(-20deg); pointer-events:none;
}
.heni-dl-card:hover{
  transform:translateY(-6px); border-color:var(--color-primary) !important;
  box-shadow:0 18px 38px -14px color-mix(in srgb, var(--color-primary) 55%, transparent);
}
.heni-dl-card:hover::after{ animation:heniShine .9s ease; }
/* Titelbild im A4-Format statt 4:3 */
.heni-dl-card > a > div:first-child{ aspect-ratio:210 / 297; background:#f1f5f9; border-bottom:1px solid #e5e7eb; }
.heni-dl-card > a > div:first-child img{ object-fit:cover; object-position:top center; transition:transform .5s ease; }
.heni-dl-card:hover > a > div:first-child img{ transform:scale(1.04); }
.heni-dl-card .heni-dl-meta{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:8px; }
.heni-dl-card .heni-dl-meta span{ font-weight:600; color:#475569; white-space:nowrap; }
/* "Neueste Downloads": Vorschaubild darf nicht schrumpfen */
.heni-dl-mini > a{ padding:4px; border-radius:8px; transition:background-color .2s ease; }
.heni-dl-mini > a:hover{ background:#fff; }
.heni-dl-mini > a > div:first-child{
  flex:0 0 auto; width:48px !important; height:66px !important; border-radius:4px; background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.18);
}
.heni-dl-mini > a > div:first-child img{ object-fit:cover; object-position:top center; }
@media (prefers-reduced-motion:reduce){ .heni-dl-card:hover::after{ animation:none; } }
