/* ==========================================================================
   HNN · Liquid-Glass-Variante (Startseite)
   Schaltet sich über .hnn-glass ein; ?stil=eckig zeigt den scharfkantigen Stand.

   Warum es so aussieht (Apple "Liquid Glass" statt grauer Milchglasplatte):
   - Das Material ist fast klar. Es dunkelt nur leicht ab (Lesbarkeit) und
     bläst die Farben dahinter auf (saturate), statt sie zu vergrauen.
   - Die Form entsteht über die Kante: ein dünner Lichtrand, der an zwei
     gegenüberliegenden Stellen hell aufleuchtet und dazwischen fast
     verschwindet. Er folgt dem Zeiger (--ang, glass.js).
   - Wenige Flächen, ruhige Schatten. Glas nur dort, wo bedient wird.
   - Nur in Chromium zusätzlich Linsenbrechung am Rand (SVG, glass.js);
     Safari/Firefox bekommen dasselbe Material ohne Verzerrung.
   ========================================================================== */

body.hnn-glass {
  --g-r: 32px;
  --g-r-klein: 18px;
  /* Material: klar, leicht rauchig, oben einen Hauch heller */
  --g-fill: linear-gradient(160deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .03) 42%, rgba(12, 12, 14, .12));
  --g-ton: rgba(14, 14, 18, .22);
  --g-blur: blur(14px) saturate(165%);
  --g-schatten: 0 20px 50px -22px rgba(0, 0, 0, .55);
  /* Lichtrand: zwei gegenüberliegende Glanzpunkte, dazwischen fast nichts */
  --g-rand: conic-gradient(from var(--ang, 315deg) at 50% 50%,
      rgba(255, 255, 255, .85) 0deg, rgba(255, 255, 255, .12) 55deg,
      rgba(255, 255, 255, .05) 120deg, rgba(255, 255, 255, .5) 180deg,
      rgba(255, 255, 255, .1) 235deg, rgba(255, 255, 255, .04) 300deg,
      rgba(255, 255, 255, .85) 360deg);
}

/* ---------- gemeinsamer Glaskörper (Klasse setzt glass.js) ---------- */
body.hnn-glass .hnn-glas {
  position: relative; isolation: isolate;
  background-color: var(--g-ton);
  background-image: var(--g-fill);
  -webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur);
  border: 0;
  box-shadow: var(--g-schatten), inset 0 0 22px rgba(255, 255, 255, .035);
}
/* Lichtrand (1,25 px, nur der Rand sichtbar dank Maske) */
body.hnn-glass .hnn-glas::after {
  content: ''; position: absolute; inset: 0; z-index: 2; border-radius: inherit; padding: 1.25px; pointer-events: none;
  background: var(--g-rand);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
/* weicher Zeigerglanz im Inneren, kaum sichtbar */
body.hnn-glass .hnn-glas::before {
  content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(320px circle at var(--mx, 20%) var(--my, 0%), rgba(255, 255, 255, .13), rgba(255, 255, 255, 0) 62%);
}

/* ---------- Kopfzeile: schwebende Kapsel ---------- */
body.hnn-glass .wlf-site-header.af-header {
  background: transparent !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  border-bottom: 0 !important; pointer-events: none;
}
body.hnn-glass.hnn-home .wlf-site-header.af-header:not(.is-stuck) { background: transparent !important; border-bottom: 0 !important; }
body.hnn-glass .wlf-site-header.af-header > * { pointer-events: auto; }
body.hnn-glass .hnn-strip { background: transparent !important; border-bottom: 0 !important; }
body.hnn-glass .wlf-site-header.af-header .wlf-container.af-header__inner {
  width: calc(100% - 2 * clamp(12px, 2vw, 32px));
  max-width: calc(var(--wlf-container) - 2 * clamp(0px, 1vw, 24px));
  height: 62px; margin: 8px auto 0;
  padding: 0 9px 0 clamp(18px, 2vw, 28px) !important;
  border-radius: 999px;
}
/* nach dem Scrollen: helles Glas, dunkle Schrift */
body.hnn-glass .wlf-site-header.af-header.is-stuck .wlf-container.af-header__inner {
  background-color: rgba(246, 246, 244, .6);
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .15));
  -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%);
  box-shadow: 0 14px 40px -18px rgba(10, 10, 10, .4), inset 0 0 18px rgba(255, 255, 255, .5);
  padding: 0 9px 0 clamp(18px, 2vw, 28px) !important;
  --g-rand: conic-gradient(from var(--ang, 315deg) at 50% 50%, rgba(255,255,255,1) 0deg, rgba(255,255,255,.35) 70deg, rgba(10,10,10,.06) 150deg, rgba(255,255,255,.9) 180deg, rgba(255,255,255,.3) 250deg, rgba(10,10,10,.05) 320deg, rgba(255,255,255,1) 360deg);
}
body.hnn-glass .af-header__tools .af-iconbtn { border-radius: 50% !important; }
body.hnn-glass .af-header__beratung { border-radius: 999px; }
body.hnn-glass .wlf-site-header .wlf-nav a { border-radius: 999px; }
body.hnn-glass .hnn-btn--head { height: 46px; padding-left: 20px; }
body.hnn-glass .hnn-btn--head .hnn-btn__pfeil { width: 38px; height: 38px; margin: 4px; }

/* ---------- Schaltflächen: Kapsel + runder Pfeil ---------- */
body.hnn-glass .hnn-btn { border-radius: 999px; }
body.hnn-glass .hnn-btn__pfeil { border-radius: 50%; width: 42px; height: 42px; margin: 4px; }
body.hnn-glass .hnn-btn--weiss { height: 58px; }
body.hnn-glass .hnn-btn--weiss .hnn-btn__pfeil { width: 50px; height: 50px; }
body.hnn-glass .hnn-btn--glas {
  height: 52px; padding: 0 26px; border-radius: 999px;
  --g-schatten: 0 10px 28px -14px rgba(0, 0, 0, .5);
  transition: transform .3s cubic-bezier(.2, .7, .2, 1), background-color .25s;
}
body.hnn-glass .hnn-btn--glas:hover { transform: translateY(-2px); background-color: rgba(14, 14, 18, .12); }

/* ---------- Aufmacher ---------- */
body.hnn-glass .hnn-tag { border-radius: 999px; padding: 6px 13px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4); }
body.hnn-glass .hnn-hero__meta { align-items: center; }
/* Kennzahlen bleiben ruhig: keine Kacheln, nur Trennlinien */
body.hnn-glass .hnn-hero__stats { border-top: 1px solid rgba(255, 255, 255, .18); padding-top: 18px; gap: 20px 44px; max-width: 520px; }

/* ---------- Fahrzeugsuche: klare Glasplatte ---------- */
body.hnn-glass .hnn-suche {
  padding: 26px; border-radius: var(--g-r); clip-path: none;
  --g-blur: blur(18px) saturate(170%);
  box-shadow: 0 30px 70px -28px rgba(0, 0, 0, .65), inset 0 0 30px rgba(255, 255, 255, .03);
}
body.hnn-glass .hnn-suche .af-fitment__tabs {
  padding: 4px !important; border-radius: 999px !important;
  background: rgba(10, 10, 12, .3) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .4) !important;
}
body.hnn-glass .hnn-suche .af-fitment__tab { border-radius: 999px !important; padding: 11px 10px !important; transition: background .25s, color .25s; }
body.hnn-glass .hnn-suche .af-fitment__tab.is-active {
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 4px 12px -4px rgba(0, 0, 0, .4) !important;
}
/* Felder: ruhige Flächen ohne eigene Umrandung */
body.hnn-glass .hnn-suche .af-fitment__cascade,
body.hnn-glass .hnn-suche .af-fitment__hsn-row { border-bottom: 0; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 8px; }
body.hnn-glass .hnn-suche .af-fitment .wlf-field {
  margin: 0 !important; border: 0 !important;
  border-radius: var(--g-r-klein) !important;
  padding: 11px 38px 11px 46px !important;
  background: rgba(255, 255, 255, .075) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1) !important;
  transition: background .2s, box-shadow .2s;
}
body.hnn-glass .hnn-suche .af-fitment .wlf-field:hover { background: rgba(255, 255, 255, .11) !important; }
body.hnn-glass .hnn-suche .af-fitment .wlf-field:focus-within { background: rgba(255, 255, 255, .15) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5) !important; }
body.hnn-glass .hnn-suche .af-fitment .wlf-field::before { left: 18px; }
body.hnn-glass .hnn-suche .af-fitment__cascade .wlf-field::after { right: 18px; }
/* Absenden: klare rote Kapsel */
body.hnn-glass .hnn-suche .af-fitment .wlf-fitment-search__submit {
  height: 58px !important; border-radius: 999px !important; padding: 0 62px 0 26px !important;
  background: #ff3b1f !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 12px 26px -12px rgba(255, 59, 31, .8) !important;
  transition: transform .25s cubic-bezier(.2, .7, .2, 1), background .2s;
}
body.hnn-glass .hnn-suche .af-fitment .wlf-fitment-search__submit:hover:not(:disabled) { background: #ff4f35 !important; color: #fff !important; transform: translateY(-2px); }
body.hnn-glass .hnn-suche .af-fitment .wlf-fitment-search__submit::after {
  right: 6px; top: 6px; bottom: 6px; width: 46px; height: auto; border-radius: 50%;
  background: #fff; color: var(--hnn-tinte); font-weight: 700;
}
body.hnn-glass .hnn-suche .af-fitment .wlf-fitment-search__submit:disabled { opacity: .78; }

/* Bildwechsel-Regler: kleine Kapsel */
body.hnn-glass .hnn-hero__regler { display: inline-flex; margin-left: auto; padding: 4px 16px 4px 18px; border-radius: 999px; --g-schatten: 0 8px 20px -10px rgba(0,0,0,.5); }
body.hnn-glass .hnn-hero__regler-rahmen { display: flex; }
body.hnn-glass .hnn-hero__punkt span { border-radius: 99px; height: 3px; }
body.hnn-glass .hnn-hero__kante { border-radius: 99px; width: 6px; box-shadow: 0 0 36px 4px rgba(255, 59, 31, .45); }
body.hnn-glass .hnn-ticker { background: var(--hnn-tinte); border-top: 0; padding: 16px 0; }

/* Linsenbrechung (nur Chromium, setzt glass.js über --lens) */
body.hnn-glass.hnn-lens .hnn-glas[data-linse] { -webkit-backdrop-filter: var(--linse) blur(10px) saturate(170%); backdrop-filter: var(--linse) blur(10px) saturate(170%); }

/* ---------- Rest der Startseite: runder, ohne abgeschnittene Ecke ---------- */
body.hnn-glass .wlf-model-grid { gap: 14px !important; }
body.hnn-glass .wlf-model-card { clip-path: none !important; border-radius: 28px !important; overflow: hidden; box-shadow: 0 14px 34px -24px rgba(10, 10, 10, .3) !important; transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s; }
body.hnn-glass .wlf-model-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -24px rgba(10, 10, 10, .4) !important; }
body.hnn-glass .wlf-model-card__body { border-top: 0 !important; padding: 0 8px 8px 0 !important; align-items: center !important; }
body.hnn-glass .wlf-model-card__body::after { width: 46px !important; height: 46px; align-self: center !important; border-radius: 50%; flex: none; }
body.hnn-glass .wlf-model-card__row { padding: 14px 6px 16px 20px !important; }
body.hnn-glass .wlf-model-card__kopf { padding: 18px 22px 0; }
body.hnn-glass .hnn-chip { border-radius: 999px; padding-inline: 16px; }
body.hnn-glass .hnn-chips { gap: 8px; }
body.hnn-glass .hnn-section--dunkel { border-radius: 44px; margin-inline: clamp(8px, 1.4vw, 20px); }
body.hnn-glass .hnn-service__karte { clip-path: none; border-radius: 30px; }
body.hnn-glass .hnn-service__bild { border-radius: 30px; overflow: hidden; }
body.hnn-glass .hnn-service__liste li { border-radius: 14px; }
body.hnn-glass .hnn-fakten > div { border-radius: 24px; }
body.hnn-glass .hnn-faq__liste { display: grid; gap: 8px; }
body.hnn-glass .hnn-faq__item { border: 1px solid rgba(10, 10, 10, .12); border-radius: 22px; background: #fff; padding-inline: 8px; }
body.hnn-glass .hnn-faq__item summary { padding-inline: 14px; }
body.hnn-glass .hnn-faq__zeichen { border-radius: 50%; }
body.hnn-glass .hnn-cta { border-radius: 44px; margin-inline: clamp(8px, 1.4vw, 20px); overflow: hidden; }

@media (max-width: 599px) {
  body.hnn-glass .hnn-btn--head { padding: 0 !important; background: transparent !important; width: 46px; height: 46px; }
  body.hnn-glass .hnn-btn--head .hnn-btn__pfeil { margin: 0; width: 42px; height: 42px; box-shadow: 0 8px 20px -6px rgba(255, 59, 31, .7); }
}
@media (max-width: 720px) {
  body.hnn-glass .wlf-site-header.af-header .wlf-container.af-header__inner { height: 56px; }
  body.hnn-glass .hnn-suche { border-radius: 30px; padding: 20px; }
  body.hnn-glass .hnn-hero__regler { padding: 4px 10px; }
  body.hnn-glass .hnn-hero__zaehler { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.hnn-glass * { transition: none !important; }
}
/* Ohne backdrop-filter bleibt das Glas lesbar: dunkler Grund statt Durchsicht */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.hnn-glass .hnn-suche,
  body.hnn-glass .hnn-glas,
  body.hnn-glass .wlf-site-header.af-header .wlf-container.af-header__inner { background: rgba(14, 14, 14, .78); }
}

/* ---------- Service-Block: ein ruhiges Raster aus gleich runden Karten ---------- */
body.hnn-glass .hnn-service { gap: 14px; align-items: stretch; }
body.hnn-glass .hnn-service__karte,
body.hnn-glass .hnn-service__schritte {
  min-height: 460px;
  padding: clamp(26px, 2.8vw, 38px);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 30px;
  background: linear-gradient(165deg, #19191c 0%, #101012 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}
body.hnn-glass .hnn-service__karte { clip-path: none; }
body.hnn-glass .hnn-service__liste li { border-top: 1px solid rgba(255, 255, 255, .08); border-radius: 0; }
body.hnn-glass .hnn-service__schritte { align-content: space-between; }
body.hnn-glass .hnn-service__schritte li { border-top: 1px solid rgba(255, 255, 255, .08); padding: 22px 0 18px; }
body.hnn-glass .hnn-service__schritte li:first-child { border-top: 0; padding-top: 0; }
body.hnn-glass .hnn-stempel { border-radius: 14px; }
body.hnn-glass .hnn-service__bild {
  min-height: 460px; border-radius: 30px; overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
}
body.hnn-glass .hnn-service__bild::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0) 55%, rgba(10, 10, 10, .55) 100%);
}
body.hnn-glass .hnn-service__bild .hnn-kana {
  z-index: 1; border-radius: 999px; padding: 8px 16px;
  background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22);
}
body.hnn-glass .hnn-fakten { gap: 14px; margin-top: 14px; }
body.hnn-glass .hnn-fakten > div {
  border: 1px solid rgba(255, 255, 255, .09); border-radius: 26px;
  background: linear-gradient(165deg, #19191c 0%, #101012 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
  padding: 26px 26px 24px;
}

/* Dropdown-Popover im Glas-Stil (Portal am Body, daher nicht unter .hnn-glass) */
body.hnn-glass .af-dd { --dd-r: 16px; border-radius: 26px; }
body.hnn-glass .af-dd__opt.ist-aktiv { background: rgba(255, 255, 255, .13); }
body.hnn-glass .af-dd--sheet { border-radius: 32px 32px 0 0; }

/* ==========================================================================
   Innenseiten: Produktlisten im selben Kartenstil wie die Modellkarten
   ========================================================================== */
body.hnn-glass ul.products,
body.hnn-glass ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)) !important;
  gap: 14px !important; margin: 0 0 40px !important; padding: 0 !important; list-style: none;
}
body.hnn-glass ul.products li.product {
  width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important;
  display: flex !important; flex-direction: column;
  background: #fff !important; border: 0 !important; border-radius: 28px !important; overflow: hidden;
  box-shadow: 0 14px 34px -24px rgba(10, 10, 10, .3) !important;
  transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s;
}
body.hnn-glass ul.products li.product:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -24px rgba(10, 10, 10, .4) !important; }
body.hnn-glass ul.products li.product a.woocommerce-LoopProduct-link { display: flex !important; flex-direction: column; flex: 1; padding: 0 !important; color: var(--hnn-tinte); text-decoration: none; }
body.hnn-glass ul.products li.product .af-card-media {
  display: block; margin: 0 !important; padding: 16px 30px 6px !important; aspect-ratio: 1.1; border: 0 !important; border-radius: 0 !important; background: transparent !important;
}
body.hnn-glass ul.products li.product .af-card-media img { width: 100% !important; height: 100% !important; object-fit: contain !important; transition: none !important; transform: none !important; margin: 0 !important; }
body.hnn-glass ul.products li.product .af-card-media .af-leerbild { height: 100%; }
body.hnn-glass ul.products li.product .woocommerce-loop-product__title {
  margin: 8px 0 0 !important; padding: 0 22px !important;
  font-family: var(--wlf-font-display) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.25 !important; letter-spacing: -.02em !important; text-transform: none !important; color: var(--hnn-tinte) !important;
}
body.hnn-glass ul.products li.product .af-specs { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 12px 0 0 !important; padding: 0 22px !important; }
body.hnn-glass ul.products li.product .af-specs li {
  margin: 0 !important; padding: 3px 10px !important; border: 1px solid rgba(10, 10, 10, .14) !important; border-radius: 999px !important; background: transparent !important;
  font-family: var(--hnn-mono); font-size: 11px !important; letter-spacing: .03em; color: var(--hnn-grau) !important;
}
body.hnn-glass ul.products li.product .price { display: block; margin: 16px 0 0 !important; padding: 0 22px !important; font-family: var(--hnn-mono) !important; font-size: 17px !important; font-weight: 500 !important; color: var(--hnn-tinte) !important; }
body.hnn-glass ul.products li.product .af-pricenote { margin: 4px 0 0 !important; padding: 0 22px !important; font-size: 11.5px; color: var(--hnn-grau-2); }
body.hnn-glass ul.products li.product a.button,
body.hnn-glass ul.products li.product a.add_to_cart_button {
  display: flex !important; align-items: center; justify-content: center; height: 46px; margin: 16px 16px 8px !important; padding: 0 20px !important;
  border: 0 !important; border-radius: 999px !important; background: var(--hnn-tinte) !important; color: #fff !important;
  font-size: 14px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important;
  transition: background .2s, transform .25s cubic-bezier(.2, .7, .2, 1);
}
body.hnn-glass ul.products li.product a.button:hover { background: var(--hnn-rot) !important; transform: translateY(-1px); }
body.hnn-glass ul.products li.product a.added_to_cart { display: block; margin: 0 16px 14px; text-align: center; font-size: 13px; }
/* "Details →" und Sonstiges unter dem Knopf */
body.hnn-glass ul.products li.product > a:not(.woocommerce-LoopProduct-link):not(.button) { display: block; margin: 0 22px 18px; font-size: 13px; font-weight: 600; color: var(--hnn-grau); }

/* Werkzeugleiste: Trefferzahl + Sortierung */
body.hnn-glass .hnn-liste .woocommerce-result-count { float: none; display: inline-block; }
body.hnn-glass .hnn-liste .woocommerce-ordering { float: none; margin: 0 0 18px; display: inline-block; float: right; }
body.hnn-glass .hnn-liste .woocommerce-ordering select {
  height: 44px; padding: 0 40px 0 18px; border: 1px solid rgba(10, 10, 10, .18); border-radius: 999px; background-color: #fff;
  font-size: 14px; color: var(--hnn-tinte); -webkit-appearance: none; 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 1.5 5 5 5-5' fill='none' stroke='%230a0a0a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}
body.hnn-glass .hnn-liste ul.products { clear: both; }
/* Seitenzahlen */
body.hnn-glass .woocommerce-pagination ul.page-numbers { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; border: 0 !important; margin: 0; padding: 0; list-style: none; }
body.hnn-glass .woocommerce-pagination ul.page-numbers li { border: 0 !important; margin: 0; float: none; }
body.hnn-glass .woocommerce-pagination .page-numbers { min-width: 44px; height: 44px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(10, 10, 10, .16); border-radius: 999px; background: #fff; font-family: var(--hnn-mono); font-size: 13px; color: var(--hnn-tinte); text-decoration: none; }
body.hnn-glass .woocommerce-pagination a.page-numbers:hover { background: var(--hnn-tinte); color: #fff; }
body.hnn-glass .woocommerce-pagination .page-numbers.current { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff; }
body.hnn-glass .woocommerce-pagination .page-numbers.dots { border-color: transparent; background: transparent; }
body.hnn-glass .hnn-zurueck .hnn-link { font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .05em; text-transform: uppercase; }

/* Titel vollständig zeigen, nicht abschneiden */
body.hnn-glass ul.products li.product .woocommerce-loop-product__title { display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important; }
/* Rahmen der Woo-Hülle entfernen (weißer Kasten um die Liste) */
body.hnn-glass .hnn-liste .wlf-woocommerce,
body.hnn-glass .hnn-liste .wlf-container { background: none !important; border: 0 !important; box-shadow: none !important; }
body.hnn-glass .hnn-liste .wlf-woocommerce { padding-inline: 0 !important; }
body.hnn-glass .hnn-liste .wlf-woocommerce > .wlf-container { padding: 0 !important; }
body.hnn-glass ul.products li.product .af-card-media { background: transparent !important; }
body.hnn-glass ul.products li.product a.button:hover { background: var(--hnn-rot) !important; }
body.hnn-glass ul.products li.product > a:not(.woocommerce-LoopProduct-link):not(.button) { color: var(--hnn-tinte); font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
/* Markenfilter über dem Modellraster */
body.hnn-glass .af-filter { margin: 0 0 22px !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; }
body.hnn-glass .af-filter .af-chip {
  display: inline-flex !important; align-items: center; min-height: 40px; padding: 0 18px !important;
  font-family: var(--hnn-mono) !important; font-size: 12px !important; letter-spacing: .05em; text-transform: uppercase;
  color: var(--hnn-tinte) !important; background: transparent !important; border: 1px solid rgba(10, 10, 10, .22) !important; border-radius: 999px !important; text-decoration: none !important;
  transition: background .15s, color .15s, border-color .15s;
}
body.hnn-glass .af-filter .af-chip:hover { border-color: var(--hnn-tinte) !important; }
body.hnn-glass .af-filter .af-chip.is-aktiv { background: var(--hnn-tinte) !important; border-color: var(--hnn-tinte) !important; color: #fff !important; }
body.hnn-glass .af-filter__titel { display: none; }

/* Shop-Schale des alten Stils: kein Innenabstand um den Bildkopf */
body.hnn-seite .wlf-site-main { padding: 0 !important; }

/* Zubehör: Ankerchips und Gruppenköpfe */
body.hnn-glass .hnn-chips--anker .hnn-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border: 1px solid rgba(10, 10, 10, .22); border-radius: 999px; background: transparent; color: var(--hnn-tinte); font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; }
body.hnn-glass .hnn-chips--anker .hnn-chip:hover { background: var(--hnn-tinte); color: #fff; }
body.hnn-glass .hnn-zubehoer .hnn-head__text { color: var(--hnn-grau); }
body.hnn-glass .hnn-anfrageliste { border-radius: 0; }

/* Suchleiste im flachen Bildkopf: Felder nebeneinander (schlägt die Einspalten-Regel der Karte) */
body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment__cascade { grid-template-columns: repeat(4, minmax(0, 1fr)) auto !important; align-items: stretch; }
body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment__hsn-row { grid-template-columns: repeat(2, minmax(0, 220px)) auto !important; align-items: stretch; }
body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment .wlf-field { padding: 9px 28px 9px 42px !important; }
body.hnn-glass .hnn-suche.hnn-suche--leiste { padding: 12px 14px 14px; border-radius: 28px; }
body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment .wlf-fitment-search__submit { height: 100% !important; min-height: 56px; min-width: 180px; width: auto !important; }
@media (max-width: 1100px) {
  body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment__cascade { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 720px) {
  body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment__cascade,
  body.hnn-glass .hnn-suche.hnn-suche--leiste .af-fitment__hsn-row { grid-template-columns: minmax(0, 1fr) !important; }
}

/* Hinweiszeile "Gezeigt werden nur …" ist doppelt: die Fahrzeugleiste im Kopf sagt es schon */
body.hnn-seite .af-filter__gruppe--hinweis { display: none; }
body.hnn-seite .hnn-hero--kompakt .hnn-hero__titel { font-size: clamp(26px, 2.6vw, 40px); }
body.hnn-glass .hnn-suche--leiste .wlf-vehicle-banner .wlf-button::after { content: none; }

/* ==========================================================================
   Produktseite
   ========================================================================== */

/* Kopfzeile auf hellen Seiten: immer die helle Glaskapsel */
body.hnn-glass.hnn-hell .wlf-site-header.af-header .wlf-container.af-header__inner {
  background-color: rgba(246, 246, 244, .62);
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .6), rgba(255, 255, 255, .16));
  -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%);
  box-shadow: 0 14px 40px -18px rgba(10, 10, 10, .35), inset 0 0 18px rgba(255, 255, 255, .5);
  --g-rand: conic-gradient(from var(--ang, 315deg) at 50% 50%, rgba(255,255,255,1) 0deg, rgba(255,255,255,.35) 70deg, rgba(10,10,10,.06) 150deg, rgba(255,255,255,.9) 180deg, rgba(255,255,255,.3) 250deg, rgba(10,10,10,.05) 320deg, rgba(255,255,255,1) 360deg);
}
body.hnn-glass.hnn-hell .wlf-site-header.af-header { position: sticky; top: 0; }

body.hnn-produkt .wlf-site-main { padding: 0 !important; }
body.hnn-produkt .wlf-container.wlf-woocommerce {
  max-width: var(--wlf-container); width: 100%; margin: 0 auto !important;
  padding: 28px var(--hnn-rand, 24px) 72px !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
}
.hnn-pdp__krumen { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 22px; font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-pdp__krumen a { color: var(--hnn-grau); text-decoration: none; }
.hnn-pdp__krumen a:hover { color: var(--hnn-tinte); text-decoration: underline; text-underline-offset: 3px; }

body.hnn-produkt div.product {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 0 clamp(28px, 4vw, 64px); align-items: start;
}
body.hnn-produkt div.product > .woocommerce-product-gallery {
  grid-column: 1; grid-row: 1 / span 3; position: sticky; top: 112px;
  float: none !important; width: auto !important; margin: 0 !important; padding: clamp(18px, 3vw, 40px);
  background: #fff; border-radius: 36px; box-shadow: 0 20px 50px -30px rgba(10, 10, 10, .35);
  overflow: hidden; isolation: isolate;
}
body.hnn-produkt div.product > .woocommerce-product-gallery::before {
  content: ''; position: absolute; inset: 12% 8% 6%; z-index: -1; border-radius: 50%;
  background: radial-gradient(closest-side, var(--pdp-glow, rgba(0, 0, 0, .08)) 0%, rgba(0, 0, 0, 0) 100%); filter: blur(14px);
}
body.hnn-produkt .woocommerce-product-gallery__wrapper, body.hnn-produkt .woocommerce-product-gallery__image { margin: 0 !important; }
body.hnn-produkt .woocommerce-product-gallery img { display: block; width: 100% !important; height: auto; max-height: 640px; object-fit: contain; border-radius: 0; background: transparent; }
body.hnn-produkt .woocommerce-product-gallery .flex-control-thumbs { display: flex; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
body.hnn-produkt .woocommerce-product-gallery .flex-control-thumbs img { width: 64px !important; height: 64px; border-radius: 14px; border: 1px solid rgba(10, 10, 10, .12); object-fit: cover; }
body.hnn-produkt div.product > .summary { grid-column: 2; grid-row: 1; float: none !important; width: auto !important; margin: 0 !important; padding: 6px 0 0; display: grid; gap: 0; align-content: start; }

.hnn-pdp__marke { margin: 0 0 8px; font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
body.hnn-produkt .summary .product_title {
  margin: 0; font-family: var(--wlf-font-display) !important; font-size: clamp(38px, 4.4vw, 64px) !important; font-weight: 700 !important;
  line-height: 1 !important; letter-spacing: -.055em !important; text-transform: uppercase; color: var(--hnn-tinte);
}
.hnn-pdp__unter { margin: 10px 0 0; font-size: 17px; color: var(--hnn-grau); }
body.hnn-produkt .summary .price { margin: 22px 0 0 !important; font-family: var(--hnn-mono) !important; font-size: 30px !important; font-weight: 500 !important; letter-spacing: -.02em; color: var(--hnn-tinte) !important; }
.hnn-pdp__daten { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hnn-pdp__daten li { display: inline-flex; align-items: baseline; gap: 8px; padding: 7px 14px; border: 1px solid rgba(10, 10, 10, .14); border-radius: 999px; background: #fff; }
.hnn-pdp__daten span { font-family: var(--hnn-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-pdp__daten b { font-size: 14px; font-weight: 600; color: var(--hnn-tinte); }
body.hnn-produkt .woocommerce-product-details__short-description { margin: 0; }

/* Passform */
body.hnn-produkt .af-passform { margin: 26px 0 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
body.hnn-produkt .af-passform--status { display: grid; gap: 8px; }
body.hnn-produkt .af-passform--status .af-passform__zeile { margin: 0; padding: 14px 18px; border-radius: 20px; font-size: 14.5px; line-height: 1.45; background: #fff; border: 1px solid rgba(10, 10, 10, .1); }
body.hnn-produkt .af-passform__zeile--ja { background: rgba(31, 157, 85, .08) !important; border-color: rgba(31, 157, 85, .3) !important; }
body.hnn-produkt .af-passform__zeile--teils { background: rgba(224, 160, 32, .1) !important; border-color: rgba(224, 160, 32, .35) !important; }
body.hnn-produkt .af-passform__zeile--nein { background: rgba(10, 10, 10, .04) !important; }
body.hnn-produkt .af-passform__wechsel { margin: 4px 4px 0; font-size: 13px; }
body.hnn-produkt .af-passform__wechsel a { color: var(--hnn-grau); text-underline-offset: 3px; }
/* Frage-Zustand: dunkle Karte mit der Fahrzeugsuche (wie im Aufmacher) */
body.hnn-glass .hnn-suche.hnn-suche--produkt {
  flex: none; width: 100%; padding: 22px; border-radius: 28px; clip-path: none;
  background: #121214 !important; -webkit-backdrop-filter: none; backdrop-filter: none; border: 0; box-shadow: 0 24px 50px -30px rgba(10, 10, 10, .6);
}
body.hnn-glass .hnn-suche--produkt::before, body.hnn-glass .hnn-suche--produkt::after { display: none !important; }
.hnn-suche--produkt .af-passform__zeile--frage { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: rgba(255, 255, 255, .72); }
.hnn-suche--produkt .af-passform__zeile--frage strong { display: block; margin-bottom: 4px; font-size: 18px; letter-spacing: -.02em; color: #fff; }
.hnn-suche--produkt .af-fitment { margin: 0 !important; }
body.hnn-glass .hnn-suche.hnn-suche--produkt .af-fitment__cascade { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.hnn-glass .hnn-suche.hnn-suche--produkt .af-fitment__action { grid-column: 1 / -1; }
body.hnn-glass .hnn-suche.hnn-suche--produkt .af-fitment .wlf-field { padding: 9px 28px 9px 42px !important; }

/* Varianten */
body.hnn-produkt .af-varianten { margin: 26px 0 0; display: grid; gap: 22px; }
.af-varianten__titel { display: block; margin: 0 0 10px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.af-varianten__farben { display: flex; flex-wrap: wrap; gap: 14px; }
body.hnn-produkt .af-farbe { display: grid !important; justify-items: center; gap: 7px; width: 74px; padding: 0 !important; border: 0 !important; background: none !important; text-decoration: none !important; color: var(--hnn-grau) !important; font-size: 11.5px; line-height: 1.25; text-align: center; }
body.hnn-produkt .af-farbe img { width: 58px !important; height: 58px !important; border-radius: 50% !important; object-fit: cover; background: #fff; border: 0 !important; box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(10, 10, 10, .2); transition: transform .2s cubic-bezier(.2, .7, .2, 1), box-shadow .2s; }
body.hnn-produkt .af-farbe:hover img { transform: scale(1.08); }
body.hnn-produkt .af-farbe.is-aktuell img { box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px var(--hnn-tinte); }
body.hnn-produkt .af-farbe.is-aktuell { color: var(--hnn-tinte) !important; font-weight: 600; }
.af-varianten__groessen { display: flex; flex-wrap: wrap; gap: 8px; }
body.hnn-produkt .af-groesse {
  display: inline-flex !important; align-items: center; min-height: 40px; padding: 0 16px !important; border: 1px solid rgba(10, 10, 10, .2) !important; border-radius: 999px !important;
  background: #fff !important; color: var(--hnn-tinte) !important; font-family: var(--hnn-mono); font-size: 12.5px !important; letter-spacing: .02em; text-decoration: none !important;
  transition: border-color .15s, background .15s, color .15s;
}
body.hnn-produkt .af-groesse:hover { border-color: var(--hnn-tinte) !important; }
body.hnn-produkt .af-groesse.is-aktuell { background: var(--hnn-tinte) !important; border-color: var(--hnn-tinte) !important; color: #fff !important; }

/* Bestand, Menge, Kaufen */
body.hnn-produkt .summary p.stock { display: inline-flex; align-items: center; gap: 8px; margin: 22px 0 0 !important; font-size: 13.5px; font-weight: 600; color: #1f7a45 !important; }
body.hnn-produkt .summary p.stock::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #1f9d55; box-shadow: 0 0 0 3px rgba(31, 157, 85, .2); }
body.hnn-produkt .summary p.stock.out-of-stock { color: #b03a2e !important; }
body.hnn-produkt .summary p.stock.out-of-stock::before { background: #d04a3c; box-shadow: 0 0 0 3px rgba(208, 74, 60, .2); }
body.hnn-produkt .summary form.cart { display: flex !important; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin: 16px 0 0 !important; }
body.hnn-produkt .summary form.cart .quantity { display: inline-flex; align-items: center; height: 56px; margin: 0 !important; padding: 0 6px; border: 1px solid rgba(10, 10, 10, .2); border-radius: 999px; background: #fff; }
body.hnn-produkt .af-qty-step { width: 42px; height: 42px; border: 0; border-radius: 50%; background: transparent; color: var(--hnn-tinte); cursor: pointer; display: flex; align-items: center; justify-content: center; }
body.hnn-produkt .af-qty-step:hover { background: rgba(10, 10, 10, .07); }
body.hnn-produkt .summary form.cart .qty { width: 52px; height: 42px; border: 0 !important; background: transparent !important; text-align: center; font-family: var(--hnn-mono); font-size: 16px; -moz-appearance: textfield; }
body.hnn-produkt .af-satz { font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--hnn-grau-2); }
body.hnn-produkt .summary .single_add_to_cart_button {
  flex: 1 1 100%; height: 60px; margin: 2px 0 0 !important; padding: 0 28px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--hnn-tinte) !important; color: #fff !important; font-size: 16px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important;
  box-shadow: 0 16px 32px -16px rgba(10, 10, 10, .6) !important; transition: background .2s, transform .25s cubic-bezier(.2, .7, .2, 1);
}
body.hnn-produkt .summary .single_add_to_cart_button:hover { background: var(--hnn-rot) !important; transform: translateY(-2px); box-shadow: 0 18px 34px -14px rgba(255, 59, 31, .7) !important; }
body.hnn-produkt .af-promises { list-style: none; margin: 26px 0 0; padding: 6px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: #fff; border-radius: 24px; border: 1px solid rgba(10, 10, 10, .08); }
body.hnn-produkt .af-promises__item { display: flex; gap: 10px; align-items: flex-start; padding: 14px 14px; }
body.hnn-produkt .af-promises__item + .af-promises__item { border-left: 1px solid rgba(10, 10, 10, .08); }
body.hnn-produkt .af-promises__item svg { flex: none; width: 20px; height: 20px; color: var(--hnn-rot); }
body.hnn-produkt .af-promises__item strong { display: block; font-size: 13.5px; }
body.hnn-produkt .af-promises__item em { display: block; margin-top: 2px; font-style: normal; font-size: 12px; line-height: 1.4; color: var(--hnn-grau); }
body.hnn-produkt .product_meta { margin: 20px 0 0; display: grid; gap: 4px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .03em; color: var(--hnn-grau-2); }
body.hnn-produkt .product_meta a { color: var(--hnn-grau); }

/* Zusatzinfos als Karte */
body.hnn-produkt div.product > .woocommerce-tabs { grid-column: 1 / -1; margin-top: clamp(36px, 5vw, 64px); }
body.hnn-produkt .woocommerce-tabs ul.tabs { display: none; }
body.hnn-produkt .woocommerce-tabs .panel { margin: 0; padding: clamp(22px, 3vw, 36px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 28px; max-width: 760px; }
body.hnn-produkt .woocommerce-tabs .panel h2 { margin: 0 0 14px; font-family: var(--hnn-mono); font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
body.hnn-produkt table.woocommerce-product-attributes { width: 100%; border: 0; border-collapse: collapse; }
body.hnn-produkt table.woocommerce-product-attributes th, body.hnn-produkt table.woocommerce-product-attributes td { padding: 13px 4px; border: 0; border-bottom: 1px solid rgba(10, 10, 10, .08); background: none !important; font-size: 14.5px; text-align: left; }
body.hnn-produkt table.woocommerce-product-attributes th { width: 38%; font-weight: 500; color: var(--hnn-grau); }
body.hnn-produkt table.woocommerce-product-attributes td p { margin: 0; font-style: normal; }
body.hnn-produkt div.product > .related, body.hnn-produkt div.product > .upsells { grid-column: 1 / -1; margin-top: 56px; }
@media (max-width: 960px) {
  body.hnn-produkt div.product { grid-template-columns: minmax(0, 1fr); }
  body.hnn-produkt div.product > .woocommerce-product-gallery { grid-row: auto; position: relative; top: auto; }
  body.hnn-produkt div.product > .summary { grid-column: 1; margin-top: 28px !important; }
  body.hnn-produkt .af-promises { grid-template-columns: 1fr; }
  body.hnn-produkt .af-promises__item + .af-promises__item { border-left: 0; border-top: 1px solid rgba(10, 10, 10, .08); }
}

/* Produktseite: Feinschliff */
body.hnn-produkt .af-passform.hnn-suche--produkt { padding: 22px !important; border-radius: 28px !important; background: #121214 !important; }
body.hnn-produkt .woocommerce-product-gallery__wrapper,
body.hnn-produkt .woocommerce-product-gallery__image,
body.hnn-produkt .woocommerce-product-gallery__image a { background: transparent !important; padding: 0 !important; border: 0 !important; }
body.hnn-produkt .woocommerce-product-gallery img { mix-blend-mode: multiply; }
body.hnn-produkt .woocommerce-tabs, body.hnn-produkt .wc-tabs-wrapper { border: 0 !important; padding: 0 !important; background: none !important; }
body.hnn-produkt .woocommerce-tabs .panel { position: static; }
body.hnn-produkt table.woocommerce-product-attributes td, body.hnn-produkt table.woocommerce-product-attributes td * { font-style: normal !important; }
body.hnn-produkt table.woocommerce-product-attributes tr:last-child th, body.hnn-produkt table.woocommerce-product-attributes tr:last-child td { border-bottom: 0; }
body.hnn-produkt .woocommerce-product-gallery img,
body.hnn-produkt .woocommerce-product-gallery img.wlfc-catalog-image { background: transparent !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
body.hnn-produkt .woocommerce-tabs .panel h2 { display: none; }
body.hnn-produkt table.woocommerce-product-attributes td p, body.hnn-produkt table.woocommerce-product-attributes td { margin: 0 !important; line-height: 1.4; }

/* ==========================================================================
   Produktseite unter dem Bildkopf: Titel steht im Kopf, nicht doppelt
   ========================================================================== */
body.hnn-produkt .summary .product_title,
body.hnn-produkt .hnn-pdp__marke,
body.hnn-produkt .hnn-pdp__unter { display: none; }
body.hnn-produkt .summary .price { margin-top: 0 !important; }
body.hnn-produkt div.product > .woocommerce-product-gallery { top: 24px; }
body.hnn-produkt .wlf-container.wlf-woocommerce { padding-top: 32px !important; }
body.hnn-produkt .hnn-pdp__krumen { margin-bottom: 18px; }

/* ==========================================================================
   Warenkorb · Kasse · Konto (klassische Woo-Seiten im neuen Stil)
   ========================================================================== */
body.hnn-woo { --woo-karte: #fff; }
body.hnn-woo .hnn-woo-karte { display: block; }
body.hnn-woo .woocommerce { color: var(--hnn-tinte); }

/* Hinweise */
body.hnn-woo .woocommerce-message, body.hnn-woo .woocommerce-info, body.hnn-woo .woocommerce-error {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0 0 18px !important; padding: 16px 22px !important;
  list-style: none; border: 1px solid rgba(10, 10, 10, .1) !important; border-left: 1px solid rgba(10, 10, 10, .1) !important; border-radius: 20px !important; background: #fff !important; box-shadow: none !important; color: var(--hnn-tinte) !important; font-size: 14.5px; line-height: 1.5;
}
body.hnn-woo .woocommerce-message::before, body.hnn-woo .woocommerce-info::before, body.hnn-woo .woocommerce-error::before { position: static !important; display: inline-block; width: 10px; height: 10px; border-radius: 50%; content: '' !important; font-size: 0; background: #1f9d55; flex: none; box-shadow: 0 0 0 4px rgba(31, 157, 85, .2); }
body.hnn-woo .woocommerce-info::before { background: var(--hnn-rot); box-shadow: 0 0 0 4px rgba(255, 59, 31, .18); }
body.hnn-woo .woocommerce-error::before { background: #d04a3c; box-shadow: 0 0 0 4px rgba(208, 74, 60, .2); }
body.hnn-woo .woocommerce-message .button, body.hnn-woo .woocommerce-info .button { margin-left: auto; }
body.hnn-woo .woocommerce-info a, body.hnn-woo .woocommerce-message a:not(.button) { color: var(--hnn-tinte); text-decoration: underline; text-underline-offset: 3px; }

/* Schaltflächen: Kapseln */
body.hnn-woo .woocommerce a.button, body.hnn-woo .woocommerce button.button, body.hnn-woo .woocommerce input.button, body.hnn-woo .woocommerce #respond input#submit {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px !important; border: 1px solid rgba(10, 10, 10, .2) !important; border-radius: 999px !important;
  background: #fff !important; color: var(--hnn-tinte) !important; font-size: 14.5px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; text-decoration: none !important; box-shadow: none !important;
  transition: background .2s, color .2s, border-color .2s, transform .25s cubic-bezier(.2, .7, .2, 1);
}
body.hnn-woo .woocommerce a.button:hover, body.hnn-woo .woocommerce button.button:hover, body.hnn-woo .woocommerce input.button:hover { background: var(--hnn-tinte) !important; border-color: var(--hnn-tinte) !important; color: #fff !important; }
body.hnn-woo .woocommerce a.button.alt, body.hnn-woo .woocommerce button.button.alt, body.hnn-woo .woocommerce #place_order, body.hnn-woo .woocommerce a.checkout-button {
  min-height: 58px; border: 0 !important; background: var(--hnn-tinte) !important; color: #fff !important; font-size: 16px !important;
  box-shadow: 0 16px 32px -16px rgba(10, 10, 10, .6) !important;
}
body.hnn-woo .woocommerce a.button.alt:hover, body.hnn-woo .woocommerce button.button.alt:hover, body.hnn-woo .woocommerce #place_order:hover, body.hnn-woo .woocommerce a.checkout-button:hover { background: var(--hnn-rot) !important; transform: translateY(-2px); box-shadow: 0 18px 34px -14px rgba(255, 59, 31, .7) !important; }
body.hnn-woo .woocommerce button.button:disabled, body.hnn-woo .woocommerce button.button[disabled] { opacity: .45; cursor: not-allowed; }

/* Eingabefelder */
body.hnn-woo .woocommerce input.input-text, body.hnn-woo .woocommerce textarea, body.hnn-woo .woocommerce select,
body.hnn-woo .woocommerce .select2-container .select2-selection--single {
  width: 100%; min-height: 52px; padding: 0 16px; border: 1px solid rgba(10, 10, 10, .18) !important; border-radius: 16px !important; background: #fff !important; box-shadow: none !important;
  font-family: var(--wlf-font-body); font-size: 15px; color: var(--hnn-tinte); transition: border-color .15s, box-shadow .15s;
}
body.hnn-woo .woocommerce textarea { padding: 14px 16px; min-height: 110px; }
body.hnn-woo .woocommerce .select2-container .select2-selection--single { display: flex; align-items: center; }
body.hnn-woo .woocommerce .select2-container .select2-selection__rendered { padding: 0; line-height: 1.4; color: var(--hnn-tinte); }
body.hnn-woo .woocommerce .select2-container .select2-selection__arrow { height: 50px; right: 10px; }
body.hnn-woo .woocommerce input.input-text:focus, body.hnn-woo .woocommerce textarea:focus, body.hnn-woo .woocommerce select:focus { outline: none; border-color: var(--hnn-tinte) !important; box-shadow: 0 0 0 3px rgba(10, 10, 10, .08) !important; }
body.hnn-woo .woocommerce form .form-row label, body.hnn-woo .woocommerce form .form-row .woocommerce-form__label { display: block; margin: 0 0 7px; font-family: var(--hnn-mono); font-size: 11.5px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau); }
body.hnn-woo .woocommerce form .form-row label .required, body.hnn-woo .woocommerce form .form-row .required { color: var(--hnn-rot); text-decoration: none; }
body.hnn-woo .woocommerce form .form-row { margin: 0 0 16px; padding: 0; }
body.hnn-woo .woocommerce form .form-row .optional { color: var(--hnn-grau-2); text-transform: none; letter-spacing: 0; font-family: var(--wlf-font-body); }
body.hnn-woo .woocommerce input[type=checkbox], body.hnn-woo .woocommerce input[type=radio] { accent-color: var(--hnn-tinte); width: 18px; height: 18px; }
body.hnn-woo .woocommerce form .form-row label.checkbox, body.hnn-woo .woocommerce form .form-row .woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 10px; font-family: var(--wlf-font-body); font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--hnn-tinte); }

/* ---- Warenkorb ---- */
body.hnn-woo.woocommerce-cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 0 28px; align-items: start; }
body.hnn-woo.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper, body.hnn-woo.woocommerce-cart .woocommerce > .woocommerce-message { grid-column: 1 / -1; }
body.hnn-woo.woocommerce-cart .woocommerce-cart-form { grid-column: 1; padding: clamp(18px, 2.4vw, 30px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
body.hnn-woo table.shop_table { width: 100%; border: 0 !important; border-collapse: collapse; background: none !important; margin: 0; }
body.hnn-woo table.shop_table th { padding: 0 8px 14px; border: 0 !important; background: none !important; font-family: var(--hnn-mono); font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); text-align: left; }
body.hnn-woo table.shop_table td { padding: 18px 8px; border: 0 !important; border-top: 1px solid rgba(10, 10, 10, .08) !important; background: none !important; font-size: 15px; vertical-align: middle; }
body.hnn-woo table.shop_table td.product-name a { color: var(--hnn-tinte); font-weight: 600; text-decoration: none; }
body.hnn-woo table.shop_table td.product-name a:hover { text-decoration: underline; text-underline-offset: 3px; }
body.hnn-woo table.shop_table td.product-price, body.hnn-woo table.shop_table td.product-subtotal, body.hnn-woo table.shop_table td.product-total { font-family: var(--hnn-mono); white-space: nowrap; }
body.hnn-woo table.shop_table td.product-thumbnail { width: 84px; }
body.hnn-woo table.shop_table td.product-thumbnail img, body.hnn-woo table.shop_table td.product-thumbnail .af-leerbild { width: 72px; height: 72px; border-radius: 18px; object-fit: contain; background: #f3f3f1; }
body.hnn-woo a.remove { display: inline-flex !important; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(10, 10, 10, .06) !important; color: var(--hnn-tinte) !important; font-size: 18px; line-height: 1; text-decoration: none; }
body.hnn-woo a.remove:hover { background: var(--hnn-rot) !important; color: #fff !important; }
body.hnn-woo .quantity { display: inline-flex; align-items: center; height: 46px; padding: 0 4px; border: 1px solid rgba(10, 10, 10, .2); border-radius: 999px; background: #fff; }
body.hnn-woo .quantity .qty { width: 46px; height: 38px; min-height: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center; font-family: var(--hnn-mono); -moz-appearance: textfield; }
body.hnn-woo .af-qty-step { width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--hnn-tinte); }
body.hnn-woo .af-qty-step:hover { background: rgba(10, 10, 10, .07); }
body.hnn-woo td.actions { padding: 22px 0 0 !important; border-top: 1px solid rgba(10, 10, 10, .08) !important; }
body.hnn-woo td.actions .coupon { display: inline-flex; flex-wrap: wrap; gap: 10px; align-items: center; }
body.hnn-woo td.actions .coupon input.input-text { width: 220px; }
body.hnn-woo td.actions > button.button { float: right; }
body.hnn-woo .cart-collaterals { grid-column: 2; grid-row: 2; position: sticky; top: 24px; width: auto !important; float: none !important; }
body.hnn-woo .cart_totals { width: 100% !important; float: none !important; padding: 28px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
body.hnn-woo .cart_totals h2, body.hnn-woo #order_review_heading, body.hnn-woo .woocommerce-billing-fields h3, body.hnn-woo .woocommerce-additional-fields h3 { margin: 0 0 16px; font-family: var(--wlf-font-display); font-size: 22px; font-weight: 700; letter-spacing: -.03em; text-transform: none; color: var(--hnn-tinte); }
body.hnn-woo .cart_totals table.shop_table th { width: auto; padding: 14px 0; border-top: 1px solid rgba(10, 10, 10, .08) !important; font-size: 11.5px; }
body.hnn-woo .cart_totals table.shop_table td { padding: 14px 0; text-align: right; font-family: var(--hnn-mono); }
body.hnn-woo .cart_totals tr:first-child th, body.hnn-woo .cart_totals tr:first-child td { border-top: 0 !important; }
body.hnn-woo .cart_totals .order-total td, body.hnn-woo .order-total td { font-size: 22px; font-weight: 600; }
body.hnn-woo .wc-proceed-to-checkout { padding: 8px 0 0; }
body.hnn-woo .wc-proceed-to-checkout a.checkout-button { display: flex; width: 100%; margin: 0; }
body.hnn-woo .cart-empty, body.hnn-woo .return-to-shop { text-align: center; }

/* ---- Kasse ---- */
body.hnn-woo form.checkout { display: grid; grid-template-columns: minmax(0, 1fr) 430px; gap: 0 28px; align-items: start; }
body.hnn-woo form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; float: none; width: auto !important; padding: clamp(20px, 2.6vw, 34px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
body.hnn-woo form.checkout #customer_details .col-1, body.hnn-woo form.checkout #customer_details .col-2 { float: none !important; width: 100% !important; max-width: none; padding: 0; }
body.hnn-woo form.checkout #customer_details .col-2 { margin-top: 12px; }
body.hnn-woo form.checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
body.hnn-woo form.checkout .form-row-wide, body.hnn-woo form.checkout .form-row.notes { grid-column: 1 / -1; }
body.hnn-woo form.checkout .form-row-first, body.hnn-woo form.checkout .form-row-last { float: none; width: auto; }
body.hnn-woo form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin: 0 0 14px; }
body.hnn-woo form.checkout #order_review { grid-column: 2; grid-row: 2; position: sticky; top: 24px; float: none; width: auto !important; padding: 28px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
body.hnn-woo #order_review table.shop_table th, body.hnn-woo #order_review table.shop_table td { padding: 13px 4px; font-size: 14px; }
body.hnn-woo #order_review table.shop_table td:last-child, body.hnn-woo #order_review table.shop_table th:last-child { text-align: right; }
body.hnn-woo #payment { margin: 20px 0 0; padding: 0; border: 0; border-radius: 0; background: none !important; }
body.hnn-woo #payment ul.payment_methods { margin: 0 0 16px; padding: 0; border: 0 !important; list-style: none; }
body.hnn-woo #payment ul.payment_methods li { margin: 0 0 8px; padding: 14px 16px; border: 1px solid rgba(10, 10, 10, .14); border-radius: 18px; background: #fff; }
body.hnn-woo #payment div.payment_box { margin: 10px 0 0; padding: 12px 14px; border-radius: 14px; background: #f3f3f1 !important; color: var(--hnn-grau); font-size: 13.5px; }
body.hnn-woo #payment div.payment_box::before { display: none; }
body.hnn-woo #payment .place-order { padding: 0 !important; margin: 0; }
body.hnn-woo #payment #place_order { width: 100%; }
body.hnn-woo .woocommerce-privacy-policy-text { margin: 0 0 16px; font-size: 12.5px; line-height: 1.5; color: var(--hnn-grau); }
body.hnn-woo .woocommerce-privacy-policy-text a { color: var(--hnn-tinte); }
body.hnn-woo .weblabsui-mkt-checkout-consent__box { border: 1px solid rgba(10, 10, 10, .1); border-radius: 18px; background: #f7f7f5; }
body.hnn-woo form.checkout_coupon, body.hnn-woo form.woocommerce-form-login { padding: 20px 24px; border: 1px solid rgba(10, 10, 10, .1) !important; border-radius: 22px !important; background: #fff; margin: 0 0 18px; }

/* ---- Konto ---- */
body.hnn-woo .af-konto-seite { }
body.hnn-woo.woocommerce-account .woocommerce-form-login, body.hnn-woo.woocommerce-account .woocommerce-form-register { border-radius: 28px; }

@media (max-width: 1000px) {
  body.hnn-woo.woocommerce-cart .woocommerce, body.hnn-woo form.checkout { grid-template-columns: minmax(0, 1fr); }
  body.hnn-woo .cart-collaterals, body.hnn-woo form.checkout #order_review, body.hnn-woo form.checkout #order_review_heading, body.hnn-woo form.checkout #customer_details { grid-column: 1; grid-row: auto; position: static; }
  body.hnn-woo form.checkout #order_review_heading { margin-top: 28px; }
  body.hnn-woo.woocommerce-cart .woocommerce-cart-form { padding: 16px; }
}
@media (max-width: 600px) {
  body.hnn-woo form.checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }
  body.hnn-woo table.shop_table_responsive tr td::before { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); }
  /* WooCommerce blendet das Positionsbild am Handy aus: wieder zeigen */
  body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail { display: block !important; width: auto; text-align: left; padding-bottom: 0; border-bottom: 0; }
  body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail::before { content: none; }
  body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail img { width: 88px; height: 88px; }
}

/* Feinschliff Woo-Seiten */
body.hnn-woo .woocommerce-message, body.hnn-woo .woocommerce-info, body.hnn-woo .woocommerce-error, body.hnn-woo .woocommerce-notices-wrapper > *:focus { outline: none !important; }
body.hnn-woo .hnn-woo-inhalt { padding-bottom: clamp(40px, 6vw, 80px); }
body.hnn-woo .weblabsui-mkt-checkout-consent label, body.hnn-woo .weblabsui-mkt-checkout-consent__text, body.hnn-woo .weblabsui-mkt-checkout-consent__option { font-family: var(--wlf-font-body) !important; font-size: 13.5px !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--hnn-tinte); line-height: 1.5; }
body.hnn-woo .weblabsui-mkt-checkout-consent__title { font-family: var(--wlf-font-display); font-size: 15px; font-weight: 700; letter-spacing: -.01em; text-transform: none; }
body.hnn-produkt table.woocommerce-product-attributes td p { display: inline !important; }
body.hnn-produkt table.woocommerce-product-attributes tr { height: auto; }
body.hnn-produkt table.woocommerce-product-attributes th, body.hnn-produkt table.woocommerce-product-attributes td { padding: 14px 4px !important; vertical-align: middle; }

/* Doppelte Rahmen der alten Woo-Tabellen und Felder entfernen */
body.hnn-woo table.shop_table, body.hnn-woo table.shop_table thead, body.hnn-woo table.shop_table tbody, body.hnn-woo table.shop_table tr,
body.hnn-woo .shop_table_responsive { border: 0 !important; box-shadow: none !important; background: none !important; border-radius: 0 !important; }
body.hnn-woo table.shop_table_responsive tr { margin: 0; }
body.hnn-woo table.shop_table_responsive tr td { text-align: right; }
body.hnn-woo table.shop_table_responsive tr td.product-name { text-align: left; }
body.hnn-woo .af-konto-seite .form-row, body.hnn-woo .af-konto-seite .woocommerce-form-row, body.hnn-woo .af-konto-seite p.form-row { border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
body.hnn-woo .woocommerce-form-login__submit, body.hnn-woo .woocommerce-form-register__submit, body.hnn-woo .af-konto-seite button[type=submit].button {
  width: 100%; min-height: 56px; border: 0 !important; background: var(--hnn-tinte) !important; color: #fff !important; box-shadow: 0 14px 28px -16px rgba(10, 10, 10, .6) !important;
}
body.hnn-woo .woocommerce-form-login__submit:hover, body.hnn-woo .woocommerce-form-register__submit:hover { background: var(--hnn-rot) !important; }
body.hnn-woo .af-konto-seite { margin: 0; }
body.hnn-woo .af-konto-seite > * { border-radius: 28px; }
body.hnn-woo .af-konto-seite form *:not(input):not(select):not(textarea):not(button):not(a):not(.select2-selection) { border-color: transparent !important; box-shadow: none !important; }
body.hnn-woo .af-konto-seite form p.form-row, body.hnn-woo .af-konto-seite form .form-row { margin-bottom: 16px; }
body.hnn-woo .af-konto-seite > * { border-radius: 0; }
body.hnn-woo .woocommerce-form-login__submit { margin-top: 14px; }
body.hnn-woo .af-konto-seite form.woocommerce-form, body.hnn-woo .af-konto-seite form.login, body.hnn-woo .af-konto-seite form.register { border: 0 !important; border-radius: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; margin: 0 !important; }

/* ==========================================================================
   Produktseite v2 — gleiche Abschnitte wie die Startseite
   ========================================================================== */
body.hnn-produkt .hnn-pdp .wlf-container { padding-top: 0 !important; }
.hnn-pdp__kopf { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(24px, 3.4vw, 52px); align-items: start; }

/* Galerie */
.hnn-galerie { min-width: 0; }
.hnn-galerie__haupt {
  position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1.08; padding: clamp(16px, 3vw, 40px);
  background: #fff; border-radius: 36px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); overflow: hidden; isolation: isolate;
}
.hnn-galerie__haupt::before { content: ''; position: absolute; inset: 12% 8% 6%; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, var(--pdp-glow, rgba(0,0,0,.08)) 0%, rgba(0,0,0,0) 100%); filter: blur(14px); }
.hnn-galerie__haupt img { width: 100%; height: 100%; object-fit: contain; transition: opacity .22s ease; mix-blend-mode: multiply; }
.hnn-galerie__thumbs { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 10px; }
.hnn-galerie__thumb { position: relative; display: block; width: 100%; aspect-ratio: 1; padding: 6px; background: #fff; border: 1px solid rgba(10, 10, 10, .1); border-radius: 20px; cursor: pointer; overflow: hidden; transition: border-color .15s, transform .2s; }
.hnn-galerie__thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.hnn-galerie__thumb span { position: absolute; left: 8px; bottom: 6px; font-family: var(--hnn-mono); font-size: 10px; letter-spacing: .04em; color: var(--hnn-grau); }
.hnn-galerie__thumb:hover { transform: translateY(-2px); }
.hnn-galerie__thumb.is-aktiv { border-color: var(--hnn-tinte); box-shadow: 0 0 0 1px var(--hnn-tinte); }

/* Kaufkarte */
body.hnn-produkt .hnn-pdp__kauf {
  padding: clamp(22px, 2.6vw, 34px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4);
  display: block; position: sticky; top: 24px;
}
body.hnn-produkt .hnn-pdp__kauf .price { margin: 0 !important; }
.hnn-waehler { margin-top: 22px; }
.hnn-waehler__titel { display: flex; align-items: baseline; gap: 8px; margin: 0 0 10px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-waehler__titel span { color: var(--hnn-tinte); }
.hnn-waehler__opt { display: flex; flex-wrap: wrap; gap: 10px; }
.hnn-farbwahl { display: grid; justify-items: center; gap: 6px; width: 76px; color: var(--hnn-grau) !important; text-decoration: none !important; font-size: 11.5px; line-height: 1.25; text-align: center; }
.hnn-farbwahl__kreis { position: relative; display: block; width: 58px; height: 58px; border-radius: 50%; overflow: hidden; background: var(--sw, #999); box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(10, 10, 10, .2); transition: transform .2s cubic-bezier(.2, .7, .2, 1), box-shadow .2s; }
.hnn-farbwahl__kreis img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.75); }
.hnn-farbwahl:hover .hnn-farbwahl__kreis { transform: scale(1.08); }
.hnn-farbwahl.is-aktuell .hnn-farbwahl__kreis { box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px var(--hnn-tinte); }
.hnn-farbwahl.is-aktuell { color: var(--hnn-tinte) !important; font-weight: 600; }
.hnn-chipwahl { display: inline-flex; align-items: center; min-height: 42px; padding: 0 16px; border: 1px solid rgba(10, 10, 10, .2); border-radius: 999px; background: #fff; color: var(--hnn-tinte) !important; font-family: var(--hnn-mono); font-size: 13px; text-decoration: none !important; transition: border-color .15s, background .15s, color .15s; }
.hnn-chipwahl:hover { border-color: var(--hnn-tinte); }
.hnn-chipwahl.is-aktuell { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff !important; }
body.hnn-produkt .hnn-pdp__kauf form.cart { margin-top: 20px !important; }
body.hnn-produkt .hnn-pdp__kauf .af-promises { margin-top: 18px; box-shadow: none; background: #f7f7f5; }

/* Passform (dunkle Insel) */
body.hnn-produkt .hnn-pdp-passform { border-radius: 44px; margin-inline: clamp(8px, 1.4vw, 20px); }
body.hnn-produkt .hnn-pdp-passform .af-passform { max-width: 760px; margin: 0 !important; }
body.hnn-glass .hnn-pdp-passform .hnn-suche.hnn-suche--produkt { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(255, 255, 255, .1); box-shadow: none; max-width: 760px; }
body.hnn-glass .hnn-pdp-passform .hnn-suche.hnn-suche--produkt .af-fitment__cascade { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.hnn-produkt .hnn-pdp-passform .af-passform__zeile { color: #fff; background: rgba(255, 255, 255, .06) !important; border-color: rgba(255, 255, 255, .14) !important; }
body.hnn-produkt .hnn-pdp-passform .af-passform__wechsel a { color: rgba(255, 255, 255, .75); }

/* Technische Daten */
.hnn-daten { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.hnn-daten > div { padding: 22px 24px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 26px; }
.hnn-daten dt { margin: 0 0 10px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-daten dd { margin: 0; font-size: clamp(22px, 2.2vw, 30px); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; color: var(--hnn-tinte); overflow-wrap: anywhere; }

@media (max-width: 960px) {
  .hnn-pdp__kopf { grid-template-columns: minmax(0, 1fr); }
  body.hnn-produkt .hnn-pdp__kauf { position: static; }
}

/* Zubehör: Abschnitte ohne Vollbreiten-Linie, saubere Abstände */
body.hnn-glass .hnn-zubehoer { border-top: 0; margin-top: clamp(48px, 6vw, 88px); }
body.hnn-glass .hnn-zubehoer .hnn-head { margin-bottom: 28px; }
body.hnn-glass .hnn-anker { margin: 28px auto 0; }
body.hnn-glass .hnn-anfrageliste { margin-top: 0; border-top: 1px solid rgba(10, 10, 10, .14); }
body.hnn-glass .hnn-anfrage { padding: 18px 4px; border-bottom: 1px solid rgba(10, 10, 10, .1); }
body.hnn-glass .hnn-zubehoer .hnn-label { margin-bottom: 0; }
body.hnn-glass .hnn-zubehoer + .hnn-zubehoer { margin-top: clamp(56px, 7vw, 104px); }
body.hnn-glass .hnn-gut-inhalt .af-gutachten, body.hnn-glass .hnn-gut-inhalt .wlf-gutachten { margin-top: 0; }

/* Gutachten: Einleitung steht schon im Kopf; Karten wie die übrigen */
body.hnn-glass .hnn-gut-inhalt .wlf-container > p:first-child { display: none; }
body.hnn-glass .hnn-gut-inhalt .af-gutachten > *, body.hnn-glass .hnn-gut-inhalt .af-gutachten__model, body.hnn-glass .hnn-gut-inhalt .af-gutachten details { border: 0 !important; border-radius: 28px !important; background: #fff !important; box-shadow: 0 14px 34px -24px rgba(10, 10, 10, .3) !important; }
body.hnn-glass .hnn-gut-inhalt .af-gutachten { gap: 14px !important; }
body.hnn-glass .hnn-gut-inhalt .af-gutachten__media { border-radius: 18px; }

/* Pflege-/Zubehörprodukte */
.hnn-galerie__haupt--pflege { aspect-ratio: 1; }
.hnn-pflege__titel { margin: 0; font-family: var(--wlf-font-display); font-size: clamp(30px, 3.4vw, 48px); font-weight: 700; line-height: 1.05; letter-spacing: -.045em; text-transform: uppercase; color: var(--hnn-tinte); }
.hnn-pflege__kurz { margin: 14px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--hnn-grau); }
.hnn-pflege__kurz p { margin: 0; }
body.hnn-pflege .hnn-pdp__kauf .price { margin-top: 20px !important; }
.hnn-pflege__anfrage { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 14px 0 0; font-size: 14.5px; color: var(--hnn-grau); }
.hnn-pflege__raster { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.hnn-pflege__text { font-size: 17px; line-height: 1.7; color: var(--hnn-tinte); max-width: 62ch; }
.hnn-pflege__text p { margin: 0 0 1em; }
.hnn-daten--eng { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 960px) { .hnn-pflege__raster { grid-template-columns: minmax(0, 1fr); } }

body.hnn-produkt .hnn-pdp__marke, body.hnn-produkt .hnn-pdp__unter { display: block; }
body.hnn-produkt .hnn-pdp__marke { margin: 0 0 8px; }
body.hnn-produkt .hnn-pdp__unter { margin: 10px 0 0; font-size: 16px; color: var(--hnn-grau); }
body.hnn-produkt .hnn-pdp__kauf .hnn-pflege__titel + .hnn-pdp__unter + .price, body.hnn-produkt .hnn-pdp__kauf .hnn-pdp__unter + .price { margin-top: 18px !important; }
.hnn-pdp__krumen { align-items: center; }
.hnn-zurueck-pill { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; border: 1px solid rgba(10, 10, 10, .18); border-radius: 999px; color: var(--hnn-tinte) !important; background: #fff; text-decoration: none !important; font-size: 11.5px; transition: background .15s, color .15s; }
.hnn-zurueck-pill:hover { background: var(--hnn-tinte); color: #fff !important; border-color: var(--hnn-tinte); }

/* Galerie: kein Schimmer, keine Überblendung, keine Beschriftung auf den Bildern */
.hnn-galerie__haupt::before, body.hnn-produkt div.product > .woocommerce-product-gallery::before { display: none !important; }
.hnn-galerie__haupt img, .hnn-galerie__thumb img { mix-blend-mode: normal !important; }
.hnn-galerie__thumb span { display: none !important; }

.af-anfrage { font-family: var(--hnn-mono); font-size: 13px; letter-spacing: .02em; color: var(--hnn-grau); }
body.hnn-glass ul.products li.product a.button.product_type_simple:not(.add_to_cart_button) { display: none; }

body.hnn-glass ul.products::before, body.hnn-glass ul.products::after { content: none !important; display: none !important; }
.hnn-btn--schwarz { background: var(--hnn-tinte); color: #fff !important; height: 54px; }
.hnn-btn--schwarz .hnn-btn__pfeil { background: var(--hnn-rot); }
.hnn-btn--schwarz:hover { background: var(--hnn-rot); }
.hnn-btn--schwarz:hover .hnn-btn__pfeil { background: var(--hnn-tinte); }
body.hnn-glass .hnn-btn--schwarz { padding-left: 24px; }
.hnn-pflege__anfrage { margin: 18px 0 0; }

/* Zubehör-Karten: gleiche Karte wie Modelle, dazu Details + Schnell-in-den-Warenkorb */
.hnn-zkarte { display: flex !important; flex-direction: column; }
.hnn-zkarte .wlf-model-card__link { flex: 1; }
.hnn-zkarte .wlf-model-card__media { aspect-ratio: 1 !important; padding: 14px !important; }
.hnn-zkarte .wlf-model-card__media img { border-radius: 18px; object-fit: cover !important; }
.hnn-zkarte .wlf-model-card__body::after { display: none !important; }
.hnn-zkarte .wlf-model-card__body { border-top: 0 !important; padding: 0 !important; }
.hnn-zkarte .wlf-model-card__row { padding: 6px 22px 14px !important; }
.hnn-zkarte__aktion { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 14px 14px 22px; }
.hnn-zdetail { font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--hnn-tinte) !important; text-decoration: underline; text-underline-offset: 4px; }
.hnn-zadd { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; border-radius: 999px; background: var(--hnn-tinte); color: #fff !important; font-size: 13.5px; font-weight: 600; text-decoration: none !important; transition: background .2s, transform .25s cubic-bezier(.2, .7, .2, 1); }
.hnn-zadd span { font-size: 18px; line-height: 1; }
.hnn-zadd:hover { background: var(--hnn-rot); transform: translateY(-1px); }
.hnn-zadd.loading { opacity: .6; pointer-events: none; }
.hnn-zadd.added { background: #1f9d55; }
.hnn-zadd--anfrage { background: transparent; color: var(--hnn-tinte) !important; border: 1px solid rgba(10, 10, 10, .25); }
.hnn-zadd--anfrage:hover { color: #fff !important; }
.hnn-zkarte a.added_to_cart { display: none; }
.hnn-zkarte .wlf-model-card__media { padding: 14px 14px 0 !important; aspect-ratio: auto !important; display: block !important; }
.hnn-zkarte .wlf-model-card__media img { width: 100% !important; height: auto !important; aspect-ratio: 1; object-fit: cover !important; border-radius: 20px; }
.hnn-zkarte .wlf-model-card__row { display: grid !important; gap: 8px; justify-content: stretch; }
.hnn-zkarte .wlf-model-card__side { justify-items: start; text-align: left; }
.hnn-zkarte .wlf-model-card__price { font-size: 15px !important; }
.hnn-zkarte .wlf-model-card__title { font-size: 18px !important; line-height: 1.25 !important; }
body.hnn .hnn-zkarte .wlf-model-card__row { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 8px !important; }
body.hnn .hnn-zkarte .wlf-model-card__side { justify-items: start; text-align: left; }
body.hnn-glass ul.wlf-model-grid, body.hnn-glass .wlf-model-grid { gap: 14px !important; }

/* ==========================================================================
   EINHEITLICHER SEITENKOPF (alle Seiten außer Startseite)
   Eine Höhe, ein Titelmaß, gleiche Ausrichtung — nur Foto, Label und Text
   wechseln. Die Fahrzeugsuche sitzt, wo es sie gibt, als Leiste über der
   unteren Kante des Kopfes (.hnn-suchband).
   ========================================================================== */
body.hnn .hnn-hero.hnn-hero--seite {
  min-height: clamp(340px, 40svh, 420px) !important;
  justify-content: flex-end;
}
body.hnn .hnn-hero--seite .hnn-hero__inner {
  display: block !important; flex-direction: initial; padding-top: 148px !important; padding-bottom: 52px !important;
  padding-right: var(--hnn-rand, 24px) !important; gap: 0;
}
body.hnn .hnn-hero--seite.hnn-hero--mitsuche .hnn-hero__inner { padding-bottom: 96px !important; }
body.hnn .hnn-hero--seite .hnn-hero__copy { display: block; flex: none; max-width: 760px; }
body.hnn .hnn-hero--seite .hnn-label { margin: 0 0 14px; }
body.hnn .hnn-hero--seite .hnn-hero__titel { margin: 0; max-width: none; font-size: clamp(32px, 3.8vw, 58px); line-height: 1.02; }
body.hnn .hnn-hero--seite .hnn-hero__text { margin: 14px 0 0; max-width: 56ch; font-size: 16px; line-height: 1.55; }
body.hnn .hnn-hero--seite .hnn-hero__kana, body.hnn .hnn-hero--seite .hnn-seitenpunkte, body.hnn .hnn-hero--seite .hnn-hero__aktion { display: none; }

.hnn-suchband { position: relative; z-index: 5; margin-top: -58px; margin-bottom: 8px; }
.hnn-suchband .hnn-suche.hnn-suche--leiste {
  width: 100%; flex: none; padding: 14px 16px 16px; border-radius: 30px; clip-path: none;
  background: #121214 !important; border: 1px solid rgba(255, 255, 255, .08);
  -webkit-backdrop-filter: none; backdrop-filter: none;
  box-shadow: 0 28px 60px -30px rgba(10, 10, 10, .7);
}
.hnn-suchband .hnn-suche--leiste::before, .hnn-suchband .hnn-suche--leiste::after { display: none !important; }
@media (max-width: 720px) {
  body.hnn .hnn-hero--seite .hnn-hero__inner { padding-top: 112px !important; padding-bottom: 36px !important; }
  body.hnn .hnn-hero--seite.hnn-hero--mitsuche .hnn-hero__inner { padding-bottom: 76px !important; }
  .hnn-suchband { margin-top: -42px; }
}

body.hnn .hnn-hero.hnn-hero--seite { min-height: 360px !important; height: 360px; }
body.hnn .hnn-hero--seite.hnn-hero--mitsuche .hnn-hero__inner { padding-bottom: 84px !important; }
@media (max-width: 720px) { body.hnn .hnn-hero.hnn-hero--seite { height: auto; min-height: 300px !important; } }


/* ===== Feedback-Runde 15.10. ===== */
/* Kopf etwas höher/luftiger; Suchleiste liegt im Inhalt, nicht über dem Kopf */
body.hnn .hnn-hero.hnn-hero--seite { min-height: 420px !important; height: 420px; }
body.hnn .hnn-hero--seite .hnn-hero__inner { padding-top: 168px !important; padding-bottom: 64px !important; }
body.hnn .hnn-hero--seite.hnn-hero--mitsuche .hnn-hero__inner { padding-bottom: 64px !important; }
.hnn-suchband { margin-top: 28px !important; margin-bottom: 0 !important; }
@media (max-width: 720px) {
  body.hnn .hnn-hero.hnn-hero--seite { height: auto; min-height: 340px !important; }
  body.hnn .hnn-hero--seite .hnn-hero__inner { padding-top: 128px !important; padding-bottom: 44px !important; }
  .hnn-suchband { margin-top: 18px !important; }
}
/* Fahrzeugleiste mit Schalter */
.hnn-fahrzeugleiste { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 4px 8px; color: #fff; }
.hnn-fahrzeugleiste__fahrzeug { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.hnn-fahrzeugleiste__fahrzeug span { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.hnn-fahrzeugleiste__fahrzeug strong { font-size: 18px; font-weight: 600; letter-spacing: -.01em; }
.hnn-fahrzeugleiste__aktion { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.hnn-fahrzeugleiste__schalter { display: inline-flex; align-items: center; gap: 12px; color: #fff !important; font-size: 14px; font-weight: 500; text-decoration: none !important; }
.hnn-fahrzeugleiste__schalter i { position: relative; width: 44px; height: 26px; border-radius: 99px; background: rgba(255, 255, 255, .22); transition: background .2s; }
.hnn-fahrzeugleiste__schalter i::after { content: ''; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .22s cubic-bezier(.2, .7, .2, 1); }
.hnn-fahrzeugleiste__schalter.is-an i { background: #1f9d55; }
.hnn-fahrzeugleiste__schalter.is-an i::after { transform: translateX(18px); }
.hnn-fahrzeugleiste__reset { color: rgba(255, 255, 255, .8) !important; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
/* Abstand unter den Abschnitten */
body.hnn .hnn-section--erste { padding-bottom: clamp(48px, 6vw, 88px); }
body.hnn .hnn-grid-fuss { margin-bottom: 8px; }
/* Kopfzeile: Beratung ohne halben Kreis */
body.hnn .af-header__beratung { border-left: 0 !important; padding-left: 6px !important; }
/* FAQ ohne schwarze Schlusslinie */
body.hnn .hnn-faq__liste { border-bottom: 0 !important; }
body.hnn .hnn-faq__item:last-child { border-bottom: 0 !important; }

/* ===== Produktseite: Satzpreis, Passform, Gutachten, Infos ===== */
.hnn-pdp__satz { margin: 6px 0 0; font-size: 14px; color: var(--hnn-grau); }
.hnn-pdp__satz b { color: var(--hnn-tinte); font-family: var(--hnn-mono); font-weight: 500; }
.hnn-pdp__passt { display: flex; align-items: center; gap: 12px; margin: 18px 0 0; padding: 12px 16px; background: rgba(31, 157, 85, .08); border: 1px solid rgba(31, 157, 85, .25); border-radius: 20px; font-size: 14.5px; }
.hnn-pdp__passt .wlf-fit-badge { position: static !important; box-shadow: none; }
.hnn-pdp__passtfrage { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 0; padding: 14px 18px; border: 1px dashed rgba(10, 10, 10, .28); border-radius: 20px; color: var(--hnn-tinte) !important; font-weight: 600; font-size: 14.5px; text-decoration: none !important; transition: background .15s, border-color .15s; }
.hnn-pdp__passtfrage span { font-weight: 500; font-size: 13.5px; color: var(--hnn-rot-text); }
.hnn-pdp__passtfrage:hover { background: #fff; border-color: var(--hnn-tinte); }
.hnn-gutliste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.hnn-gutliste a { display: flex; align-items: center; gap: 14px; padding: 16px 18px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 22px; color: var(--hnn-tinte) !important; text-decoration: none !important; transition: border-color .15s, transform .2s; }
.hnn-gutliste a:hover { border-color: var(--hnn-tinte); transform: translateY(-2px); }
.hnn-gutliste .is-passt a { border-color: rgba(31, 157, 85, .4); background: rgba(31, 157, 85, .05); }
.hnn-gutliste__ikon { flex: none; display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: var(--hnn-tinte); color: #fff; }
.hnn-gutliste__ikon svg { width: 18px; height: 18px; }
.hnn-gutliste__text { flex: 1; min-width: 0; display: grid; gap: 2px; }
.hnn-gutliste__text b { font-family: var(--hnn-mono); font-size: 13.5px; font-weight: 500; }
.hnn-gutliste__text em { font-style: normal; font-size: 12.5px; color: var(--hnn-grau); }
.hnn-gutrest { margin: 20px 0 0; }
body.hnn-produkt .hnn-pdp-info .hnn-faq__item { border-top: 1px solid rgba(10, 10, 10, .14); }
body.hnn-produkt .hnn-pdp-info .hnn-faq__item p { margin: 0 0 22px; max-width: 62ch; color: var(--hnn-grau); line-height: 1.6; }

.hnn-gutfilter { display: grid; gap: 14px; margin: 0 0 26px; }
.hnn-gutfilter__suche { display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 20px; max-width: 460px; background: #fff; border: 1px solid rgba(10, 10, 10, .16); border-radius: 999px; }
.hnn-gutfilter__suche svg { width: 18px; height: 18px; fill: none; stroke: var(--hnn-grau); stroke-width: 2; stroke-linecap: round; }
.hnn-gutfilter__suche input { flex: 1; border: 0 !important; outline: none !important; background: transparent !important; box-shadow: none !important; font-size: 15px; }
.hnn-gutfilter__zahl { margin: 0; min-height: 1em; font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--hnn-grau-2); }
.af-gutachten__model[hidden] { display: none !important; }

/* ===== Konto-Unterseiten (Navigation, Adressen, Bestellungen) ===== */
body.hnn-woo .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
body.hnn-woo .woocommerce-MyAccount-navigation a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 18px; border: 1px solid rgba(10, 10, 10, .18); border-radius: 999px; background: #fff; color: var(--hnn-tinte) !important; font-size: 14px; text-decoration: none !important; transition: background .15s, color .15s; }
body.hnn-woo .woocommerce-MyAccount-navigation a:hover { border-color: var(--hnn-tinte); }
body.hnn-woo .woocommerce-MyAccount-navigation .is-active a { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff !important; }
body.hnn-woo .woocommerce-MyAccount-content { margin-top: 22px; padding: clamp(20px, 2.6vw, 34px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
body.hnn-woo .woocommerce-MyAccount-content h2, body.hnn-woo .woocommerce-MyAccount-content h3 { margin: 0 0 14px; font-family: var(--wlf-font-display); font-size: 22px; font-weight: 700; letter-spacing: -.03em; text-transform: none; }
body.hnn-woo .woocommerce-MyAccount-content .u-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.hnn-woo .woocommerce-MyAccount-content .u-column1, body.hnn-woo .woocommerce-MyAccount-content .u-column2 { float: none; width: auto; padding: 22px; background: #f7f7f5; border-radius: 24px; }
body.hnn-woo .woocommerce-MyAccount-content address { font-style: normal; line-height: 1.6; }
body.hnn-woo .woocommerce-MyAccount-content .edit, body.hnn-woo .woocommerce-Address-title a { display: inline-flex; margin-top: 10px; padding: 6px 14px; border: 1px solid rgba(10, 10, 10, .2); border-radius: 999px; color: var(--hnn-tinte) !important; font-size: 13px; text-decoration: none !important; }
body.hnn-woo .woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
@media (max-width: 720px) { body.hnn-woo .woocommerce-MyAccount-content .u-columns { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   PRODUKTSEITE v3 — Bühne links, Info ohne Karte rechts (kein Bildkopf)
   ========================================================================== */
body.hnn-produkt .wlf-site-main { padding: 0 !important; }
.hnn-pdp2 { padding-top: 20px; }
.hnn-pdp2 .hnn-pdp__krumen { margin: 0 0 22px; }
.hnn-pdp2__raster { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(28px, 4.4vw, 72px); align-items: start; }

/* Bühne: große weiße Fläche, Vorschauen als Leiste links */
.hnn-buehne { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; position: sticky; top: 104px; align-items: start; }
.hnn-buehne__bild { grid-column: 2; position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1; padding: clamp(18px, 3vw, 44px); background: #fff; border-radius: 40px; overflow: hidden; box-shadow: 0 30px 70px -44px rgba(10, 10, 10, .5); }
.hnn-buehne__bild img { width: 100%; height: 100%; object-fit: contain; transition: opacity .22s ease; }
.hnn-buehne__marke { position: absolute; left: 22px; top: 22px; z-index: 2; padding: 6px 14px; border-radius: 999px; background: var(--hnn-tinte); color: #fff; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.hnn-buehne__thumbs { grid-column: 1; grid-row: 1; list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; align-content: start; }
.hnn-buehne__thumbs .hnn-galerie__thumb { width: 84px; padding: 6px; border-radius: 22px; }
.hnn-buehne--pflege .hnn-buehne__bild img { object-fit: cover; border-radius: 24px; }
.hnn-buehne--pflege .hnn-buehne__bild { padding: 14px; }

/* Info: direkt auf dem Seitengrund, getrennt durch feine Linien */
.hnn-pdp2__info { padding-top: 4px; min-width: 0; }
.hnn-pdp2__info .hnn-label { margin: 0; }
.hnn-label__sku { color: var(--hnn-grau-2); }
.hnn-pdp2__titel { margin: 12px 0 0 !important; font-size: clamp(44px, 5.4vw, 84px) !important; line-height: 1 !important; max-width: none !important; }
.hnn-pdp2__unter { margin: 10px 0 0; font-size: 18px; color: var(--hnn-grau); }
.hnn-pdp2__preis { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 22px; margin: 26px 0 0; padding: 22px 0; border-top: 1px solid rgba(10, 10, 10, .14); }
.hnn-pdp2__preis .price { margin: 0 !important; font-family: var(--hnn-mono) !important; font-size: clamp(30px, 3vw, 42px) !important; font-weight: 500 !important; letter-spacing: -.03em; color: var(--hnn-tinte) !important; }
.hnn-pdp2__preis .hnn-pdp__satz { margin: 0; }
.hnn-pdp2__lager { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: #1f7a45; }
.hnn-pdp2__lager::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #1f9d55; box-shadow: 0 0 0 3px rgba(31, 157, 85, .2); }
.hnn-pdp2__konf { border-top: 1px solid rgba(10, 10, 10, .14); }
.hnn-pdp2__konf .hnn-waehler { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 10px 18px; align-items: center; margin: 0; padding: 16px 0; border-bottom: 1px solid rgba(10, 10, 10, .14); }
.hnn-pdp2__konf .hnn-waehler__titel { margin: 0; }
.hnn-pdp2__konf .hnn-waehler--farbe { align-items: start; }
.hnn-pdp2__kauf { margin-top: 24px; }
.hnn-pdp2__kauf form.cart, body.hnn-produkt .hnn-pdp2__kauf form.cart { display: grid !important; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px 14px; margin: 0 !important; }
.hnn-pdp2__kauf .af-satz { grid-column: 1 / -1; order: 3; font-size: 11.5px; }
.hnn-pdp2__kauf .single_add_to_cart_button { grid-column: 2; order: 2; flex: none; margin: 0 !important; }
.hnn-pdp2__kauf .quantity { order: 1; }
.hnn-pdp2__zusagen { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hnn-pdp2__zusagen li { display: flex; align-items: flex-start; gap: 10px; font-size: 12.5px; line-height: 1.4; color: var(--hnn-grau); }
.hnn-pdp2__zusagen svg { flex: none; width: 22px; height: 22px; color: var(--hnn-rot); stroke: currentColor; }
.hnn-pdp2__zusagen b { display: block; color: var(--hnn-tinte); font-size: 13.5px; }
.hnn-pdp2__passtlink { display: inline-flex; gap: 8px; margin-top: 22px; color: var(--hnn-tinte) !important; font-size: 14px; font-weight: 600; text-decoration: underline !important; text-underline-offset: 4px; }
.hnn-pdp2__info--pflege .hnn-pflege__titel { margin-top: 12px; }
@media (max-width: 1000px) {
  .hnn-pdp2__raster { grid-template-columns: minmax(0, 1fr); }
  .hnn-buehne { position: static; grid-template-columns: minmax(0, 1fr); }
  .hnn-buehne__bild { grid-column: 1; grid-row: 1; }
  .hnn-buehne__thumbs { grid-column: 1; grid-row: 2; grid-auto-flow: column; grid-auto-columns: 72px; overflow-x: auto; }
  .hnn-buehne__thumbs .hnn-galerie__thumb { width: 72px; }
  .hnn-pdp2__konf .hnn-waehler { grid-template-columns: minmax(0, 1fr); }
  .hnn-pdp2__zusagen { grid-template-columns: minmax(0, 1fr); }
}

/* Global: Luft zwischen Inhalt und Footer */
body.hnn:not(.home) .wlf-site-main { padding-bottom: clamp(56px, 7vw, 104px); }
body.hnn.hnn-produkt .wlf-site-main { padding-bottom: clamp(56px, 7vw, 104px) !important; }

/* Suchband im Kopf: schwebendes Glas unter der Kapsel */
body.hnn-glass .af-searchbar:not([hidden]) { position: absolute; left: 0; right: 0; top: 100%; display: block; background: transparent !important; border: 0 !important; transition: none; pointer-events: none; }
body.hnn-glass .af-searchbar:not(.is-open) { display: none; }
body.hnn-glass .af-searchbar > .wlf-container { overflow: visible; width: calc(100% - 2 * clamp(12px, 2vw, 32px)); max-width: calc(var(--wlf-container) - 2 * clamp(0px, 1vw, 24px)); margin: 8px auto 0; padding: 0; pointer-events: auto; }
body.hnn-glass .af-searchbar__form { padding: 10px 10px 10px 22px; border-radius: 999px; background: rgba(18, 18, 20, .94); border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 24px 50px -22px rgba(10, 10, 10, .7); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
body.hnn-glass .af-searchbar__form .af-ikon { color: rgba(255, 255, 255, .6); }
body.hnn-glass .af-searchbar__form input[type="search"] { color: #fff; font-size: 16px; }
body.hnn-glass .af-searchbar__form input[type="search"]::placeholder { color: rgba(255, 255, 255, .45); }
body.hnn-glass .af-searchbar__form .af-btn { height: 46px; padding: 0 26px; border: 0; border-radius: 999px; background: #ff3b1f; color: #fff; font-weight: 600; cursor: pointer; }

/* Gutachten: Werkzeugzeile wie bei den Felgen, Gruppen je Marke */
.hnn-gutfilter { gap: 16px; }
.hnn-gutfilter__zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.hnn-gutfilter .hnn-chips { margin: 0; }
.hnn-gutfilter__suche { max-width: 420px; height: 46px; }
.hnn-gutgruppe { margin: 0 0 clamp(32px, 4vw, 56px); }
.hnn-gutgruppe[hidden] { display: none; }
.hnn-gutgruppe__titel { display: flex; align-items: baseline; gap: 12px; margin: 0 0 18px; font-family: var(--wlf-font-display); font-size: clamp(26px, 3vw, 40px); font-weight: 700; letter-spacing: -.05em; text-transform: uppercase; color: var(--hnn-tinte); }
.hnn-gutgruppe__titel i { font-style: normal; font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .06em; color: var(--hnn-grau-2); }
body.hnn-produkt .hnn-pdp2 .summary p.stock { display: none; }

/* Händlerseite */
.hnn-vorteile { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hnn-vorteile li { padding: clamp(22px, 2.4vw, 32px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; box-shadow: 0 18px 44px -34px rgba(10, 10, 10, .4); }
.hnn-vorteile__ikon { display: inline-flex; width: 52px; height: 52px; align-items: center; justify-content: center; margin-bottom: 18px; border-radius: 50%; background: var(--hnn-tinte); color: #fff; }
.hnn-vorteile__ikon svg { width: 24px; height: 24px; }
.hnn-vorteile h3 { margin: 0 0 8px; font-family: var(--wlf-font-display); font-size: 21px; font-weight: 700; letter-spacing: -.03em; text-transform: none; }
.hnn-vorteile p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--hnn-grau); }
.hnn-haendler-aktion { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.hnn-haendler-schritte { margin-top: 0 !important; }
body.hnn-glass .hnn-haendler-schritte { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; background: none; border: 0; padding: 0; }
body.hnn-glass .hnn-haendler-schritte li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 26px; border: 1px solid rgba(255, 255, 255, .09); border-radius: 28px; background: linear-gradient(165deg, #19191c, #101012); }
body.hnn-glass .hnn-haendler-schritte li:first-child { border-top: 1px solid rgba(255, 255, 255, .09); padding-top: 26px; }
.hnn-haendler-karte { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; padding: clamp(26px, 3vw, 44px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 36px; }
.hnn-haendler-karte ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.hnn-haendler-karte li { display: grid; gap: 2px; }
.hnn-haendler-karte li span { font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-haendler-karte li a { font-size: clamp(20px, 2.2vw, 28px); font-weight: 600; letter-spacing: -.03em; color: var(--hnn-tinte); text-decoration: none; }
.hnn-haendler-karte li a:hover { color: var(--hnn-rot-text); }
@media (max-width: 900px) { .hnn-vorteile, body.hnn-glass .hnn-haendler-schritte { grid-template-columns: minmax(0, 1fr); } }

body.hnn-glass .hnn-haendler-schritte, body.hnn-glass .hnn-haendler-schritte li { min-height: 0 !important; }
body.hnn-glass .hnn-haendler-schritte { align-content: start; }
.hnn-haendler-ablauf { padding-bottom: clamp(56px, 7vw, 104px); }

/* Karten-Hover: Bildfläche bleibt weiß (Fotos haben weißen Grund), nur der untere Bereich färbt sich */
body.hnn .wlf-model-card:hover, body.hnn .wlf-model-card__link:hover { background: #fff !important; }
body.hnn .wlf-model-card__media { background: #fff !important; }
body.hnn .wlf-model-card__body { transition: background .22s ease; background: #fff; }
body.hnn .wlf-model-card:hover .wlf-model-card__body, body.hnn .wlf-model-card__link:hover .wlf-model-card__body { background: #efeeea !important; }

/* Garage-Popover als dunkle Glasfläche, Text immer lesbar */
body.hnn .af-garage__pop { top: calc(100% + 14px); width: min(340px, calc(100vw - 24px)); padding: 6px; background: rgba(18, 18, 20, .96); color: #fff; border: 1px solid rgba(255, 255, 255, .1); border-radius: 28px; box-shadow: 0 30px 60px -24px rgba(10, 10, 10, .7); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
body.hnn .af-garage__head { padding: 12px 14px 10px 18px; border: 0; }
body.hnn .af-garage__head strong { font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .1em; color: rgba(255, 255, 255, .65); }
body.hnn .af-garage__head .af-iconbtn { color: #fff; }
body.hnn .af-garage__body { padding: 4px 14px 16px 18px; }
body.hnn .af-garage__active { margin-bottom: 14px; padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
body.hnn .af-garage__active-label { margin: 0 0 4px; font-size: 18px; font-weight: 600; letter-spacing: -.02em; color: #fff; }
body.hnn .af-garage__meta, body.hnn .af-garage__hint, body.hnn .af-garage__empty p { color: rgba(255, 255, 255, .6) !important; }
body.hnn .af-garage__active-actions { gap: 8px; }
body.hnn .af-garage__active-actions .af-btn { display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; border: 0; }
body.hnn .af-garage__active-actions .af-btn--accent { background: #ff3b1f; color: #fff !important; }
body.hnn .af-garage__active-actions .af-btn--accent::after, body.hnn .af-garage__active-actions .af-btn--ghost::after { content: none !important; display: none !important; }
body.hnn .af-garage__active-actions .af-btn--ghost { background: rgba(255, 255, 255, .1); color: #fff !important; }
body.hnn .af-garage__list-title { color: rgba(255, 255, 255, .55); }
body.hnn .af-garage__link { color: #fff; border-radius: 16px; }
body.hnn .af-garage__link:hover { background: rgba(255, 255, 255, .08); }
body.hnn .af-garage__link span { color: rgba(255, 255, 255, .55); }
body.hnn .af-garage__del { color: rgba(255, 255, 255, .6); }

/* Aktionen rechts im Seitenkopf (z. B. Händler) */
body.hnn .hnn-hero--seite .hnn-hero__inner { position: relative; }
.hnn-hero__rechts { position: absolute; right: var(--hnn-rand, 24px); bottom: 64px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
@media (max-width: 720px) { .hnn-hero__rechts { position: static; margin-top: 22px; justify-content: flex-start; } }

/* Kontakt */
.hnn-kontakt { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.hnn-kontakt__form { padding: clamp(24px, 3vw, 40px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 36px; box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .4); }
.hnn-kontakt__form .hnn-h3 { margin: 0 0 20px; }
.hnn-form { display: grid; gap: 16px; }
.hnn-form__zeile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.hnn-form label span { display: block; margin: 0 0 7px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau); }
.hnn-form input, .hnn-form textarea { width: 100%; min-height: 52px; padding: 0 16px; border: 1px solid rgba(10, 10, 10, .18); border-radius: 16px; background: #fff; font: inherit; font-size: 15px; color: var(--hnn-tinte); }
.hnn-form textarea { padding: 14px 16px; min-height: 150px; resize: vertical; }
.hnn-form input:focus, .hnn-form textarea:focus { outline: none; border-color: var(--hnn-tinte); box-shadow: 0 0 0 3px rgba(10, 10, 10, .08); }
.hnn-form__falle { position: absolute; left: -9999px; }
.hnn-form__recht { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--hnn-grau); }
.hnn-form__recht a { color: var(--hnn-tinte); }
.hnn-form .hnn-btn { justify-self: start; }
.hnn-kontakt__hinweis { margin: 0 0 18px; padding: 14px 18px; border: 1px solid rgba(10, 10, 10, .12); border-radius: 18px; background: #f7f7f5; font-size: 14.5px; }
.hnn-kontakt__hinweis--ok { border-color: rgba(31, 157, 85, .35); background: rgba(31, 157, 85, .08); }
.hnn-kontakt__info { display: grid; gap: 14px; }
.hnn-kontaktkarte { padding: 24px 26px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 28px; }
.hnn-kontaktkarte ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 12px; }
.hnn-kontaktkarte li { display: grid; gap: 2px; }
.hnn-kontaktkarte li span { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-kontaktkarte li a { font-size: 22px; font-weight: 600; letter-spacing: -.03em; color: var(--hnn-tinte); text-decoration: none; }
.hnn-kontaktkarte address { margin: 12px 0 14px; font-style: normal; font-size: 16px; line-height: 1.6; }
.hnn-kontaktkarte p:not(.hnn-label) { margin: 10px 0 14px; font-size: 14.5px; color: var(--hnn-grau); }
@media (max-width: 900px) { .hnn-kontakt, .hnn-form__zeile { grid-template-columns: minmax(0, 1fr); } }
body.hnn .af-garage__item { background: rgba(255, 255, 255, .06) !important; border: 0 !important; border-radius: 16px; }
body.hnn .af-garage__item:hover { background: rgba(255, 255, 255, .1) !important; }
body.hnn .af-garage__link { background: transparent !important; }
body.hnn .af-garage__link strong { color: #fff !important; }
body.hnn .af-garage__del { background: transparent !important; color: rgba(255, 255, 255, .65) !important; }

/* ===== Passform auf Ausführungsebene ===== */
.hnn-fzpille { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; padding: 12px 16px; border-radius: 18px; font-size: 14px; }
.hnn-pdp2__info > .hnn-fzpille { margin: 0 0 4px; }
.hnn-fzpille i { width: 9px; height: 9px; border-radius: 50%; background: #9a9da3; flex: none; }
.hnn-fzpille b { font-weight: 700; }
.hnn-fzpille--frei { background: rgba(31, 157, 85, .09); border: 1px solid rgba(31, 157, 85, .3); }
.hnn-fzpille--frei i { background: #1f9d55; box-shadow: 0 0 0 3px rgba(31, 157, 85, .22); }
.hnn-fzpille--eintrag { background: rgba(224, 160, 32, .1); border: 1px solid rgba(224, 160, 32, .38); }
.hnn-fzpille--eintrag i { background: #e0a020; box-shadow: 0 0 0 3px rgba(224, 160, 32, .24); }
.hnn-fzpille--nein { background: rgba(208, 74, 60, .08); border: 1px solid rgba(208, 74, 60, .3); }
.hnn-fzpille--nein i { background: #d04a3c; box-shadow: 0 0 0 3px rgba(208, 74, 60, .22); }
.hnn-fzwarnung { margin: 18px 0 0; padding: 12px 16px; border-radius: 16px; background: rgba(208, 74, 60, .08); font-size: 13.5px; line-height: 1.5; color: #7a2a22; }
.hnn-fzwarnung a { color: inherit; text-decoration: underline; }
.hnn-fzpanel { display: grid; gap: 16px; max-width: 760px; color: #fff; }
.hnn-fzpanel .hnn-fzpille { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .16); color: #fff; font-size: 16px; }
.hnn-fzpanel__text { margin: 0; font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .8); }
.hnn-fzpanel__daten { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.hnn-fzpanel__daten > div { padding: 16px 18px; border-radius: 20px; background: rgba(255, 255, 255, .06); }
.hnn-fzpanel__daten dt { margin: 0 0 6px; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.hnn-fzpanel__daten dd { margin: 0; font-size: 17px; font-weight: 600; }
.hnn-fzpanel__auflagen { border-radius: 20px; background: rgba(255, 255, 255, .06); }
.hnn-fzpanel__auflagen summary { padding: 16px 18px; cursor: pointer; font-weight: 600; }
.hnn-fzpanel__auflagen ul { list-style: none; margin: 0; padding: 0 18px 12px; display: grid; gap: 10px; }
.hnn-fzpanel__auflagen li { display: grid; grid-template-columns: 44px 1fr; gap: 10px; font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, .75); }
.hnn-fzpanel__auflagen li b { font-family: var(--hnn-mono); color: #fff; }
.hnn-fzpanel__passende { display: flex; flex-wrap: wrap; gap: 8px; }
.hnn-fzpanel .hnn-btn { justify-self: start; }
.hnn-fzpanel__wechsel { margin: 0; font-size: 14px; }
.hnn-fzpanel__wechsel a { color: rgba(255, 255, 255, .75); }

.hnn-fzpanel__daten dd { display: grid; gap: 4px; font-size: 15.5px; font-weight: 600; }
.hnn-fzpanel__daten dd em { font-style: normal; font-weight: 400; font-size: 13px; color: rgba(255, 255, 255, .6); }
.hnn-fzpanel__daten dd a { color: #fff; text-decoration: underline; text-underline-offset: 3px; font-weight: 500; font-size: 14px; }

.hnn-fzauto { margin: 14px 0 0; padding: 0 2px; font-size: 13px; line-height: 1.5; color: var(--hnn-grau); }

/* ===== Feedback 15.10. (2) ===== */
.hnn-pdp2__preis { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 16px; }
.hnn-pdp2__satzpreis { margin: 0; font-family: var(--hnn-mono); font-size: clamp(30px, 3vw, 42px); font-weight: 500; letter-spacing: -.03em; color: var(--hnn-tinte); }
.hnn-pdp2__satzpreis small { font-family: var(--wlf-font-body); font-size: 14px; letter-spacing: 0; color: var(--hnn-grau); margin-left: 6px; }
.hnn-pdp2__satzpreis .woocommerce-Price-amount { font: inherit; }
.hnn-pdp2__einzel { grid-column: 1; margin: 0; font-size: 14px; color: var(--hnn-grau); }
.hnn-pdp2__einzel .woocommerce-Price-amount { font-family: var(--hnn-mono); color: var(--hnn-tinte); }
.hnn-pdp2__preis .hnn-pdp2__lager { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0; }
.hnn-pdp2__lager--knapp { color: #9a6200 !important; }
.hnn-pdp2__lager--knapp::before { background: #e0a020 !important; box-shadow: 0 0 0 3px rgba(224, 160, 32, .25) !important; }
/* Farben: Titel oben, volle Breite, enger */
.hnn-pdp2__konf .hnn-waehler--farbe { grid-template-columns: minmax(0, 1fr); }
.hnn-waehler--farbe .hnn-waehler__opt { gap: 8px 12px; flex-wrap: wrap; }
.hnn-farbwahl { width: 68px; gap: 4px; font-size: 11px; line-height: 1.2; }
.hnn-farbwahl__kreis { width: 54px; height: 54px; }
/* Abstand unter Statuspille */
.hnn-pdp2__info > .hnn-fzpille { margin: 18px 0 !important; }
/* Passform: gut lesbar auf Schwarz, Auflagen als Schaltfläche */
.hnn-fzpanel .hnn-fzpille--frei { background: rgba(60, 214, 120, .14); border-color: rgba(60, 214, 120, .5); }
.hnn-fzpanel .hnn-fzpille--eintrag { background: rgba(255, 190, 60, .14); border-color: rgba(255, 190, 60, .5); }
.hnn-fzpanel .hnn-fzpille--nein { background: rgba(255, 110, 96, .14); border-color: rgba(255, 110, 96, .5); }
.hnn-fzpanel .hnn-fzpille b, .hnn-fzpanel .hnn-fzpille span { color: #fff; }
.hnn-fzpanel .hnn-fzpille--frei i { background: #3cd678; box-shadow: 0 0 0 3px rgba(60, 214, 120, .3); }
.hnn-fzpanel__text, .hnn-fzpanel__daten dd { color: #fff; }
.hnn-fzpanel__auflagen { background: none; }
.hnn-fzpanel__auflagen summary { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 20px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px; list-style: none; font-size: 14.5px; transition: background .15s; }
.hnn-fzpanel__auflagen summary::-webkit-details-marker { display: none; }
.hnn-fzpanel__auflagen summary::after { content: '+'; font-size: 18px; line-height: 1; }
.hnn-fzpanel__auflagen[open] summary::after { content: '–'; }
.hnn-fzpanel__auflagen summary:hover { background: rgba(255, 255, 255, .1); }
.hnn-fzpanel__auflagen ul { margin-top: 14px; padding: 18px; border-radius: 20px; background: rgba(255, 255, 255, .06); }
.hnn-fzpanel__auflagen li { color: rgba(255, 255, 255, .88); }
/* Zubehör-Karten: Bild randlos über die volle Breite, unterer Bereich färbt sich beim Hover */
.hnn-zkarte { overflow: hidden; }
.hnn-zkarte .wlf-model-card__media { padding: 0 !important; margin: 0 !important; border-radius: 0 !important; }
.hnn-zkarte .wlf-model-card__media img { border-radius: 0 !important; width: 100% !important; aspect-ratio: 1; object-fit: cover !important; }
.hnn-zkarte .wlf-model-card__body, .hnn-zkarte__aktion { background: #fff; transition: background .22s ease; }
.hnn-zkarte .wlf-model-card__row { padding-top: 16px !important; }
.hnn-zkarte__aktion { padding-top: 6px; padding-bottom: 16px; }
.hnn-zkarte:hover .wlf-model-card__body, .hnn-zkarte:hover .hnn-zkarte__aktion { background: #efeeea !important; }
body.hnn .hnn-zkarte .wlf-model-card__media { padding: 0 !important; margin: 0 !important; display: block !important; aspect-ratio: auto !important; border-radius: 0 !important; }
body.hnn .hnn-zkarte .wlf-model-card__media img { display: block; width: 100% !important; height: auto !important; aspect-ratio: 1 !important; object-fit: cover !important; border-radius: 0 !important; margin: 0 !important; }
body.hnn .hnn-zkarte .wlf-model-card__link { flex: 0 0 auto; height: auto; background: transparent; }
body.hnn .hnn-zkarte { background: #fff; gap: 0; }
body.hnn .hnn-zkarte .wlf-model-card__body { flex: 1; border-top: 0 !important; }
body.hnn .hnn-zkarte__aktion { margin: 0; flex: none; }
body.hnn .hnn-zkarte .wlf-model-card__link:hover { background: transparent !important; }
body.hnn .hnn-zkarte:hover { background: #efeeea; }
body.hnn .hnn-zkarte:hover .wlf-model-card__media { background: #fff !important; }
body.hnn .hnn-zkarte .wlf-model-card__body { padding-bottom: 0 !important; }

/* ===== Kaufkarte: Menge, Express, Lieferung, Beratung ===== */
.hnn-menge { display: inline-flex; gap: 4px; padding: 4px; margin: 0 0 14px; border-radius: 999px; background: rgba(10, 10, 10, .06); }
.hnn-menge button { height: 38px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent; color: var(--hnn-tinte); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .18s, color .18s; }
.hnn-menge button.is-aktiv { background: var(--hnn-tinte); color: #fff; }
.hnn-menge button:not(.is-aktiv):hover { background: rgba(10, 10, 10, .08); }
.hnn-express { margin-top: 18px; }
.hnn-express__titel { display: flex; align-items: center; gap: 14px; margin: 0 0 12px; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-express__titel::before, .hnn-express__titel::after { content: ''; flex: 1; height: 1px; background: rgba(10, 10, 10, .14); }
.hnn-express__reihe { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; }
.hnn-express__knopf { display: flex; align-items: center; justify-content: center; height: 52px; border: 1px solid rgba(10, 10, 10, .16); border-radius: 999px; background: #fff; transition: border-color .15s, transform .2s cubic-bezier(.2, .7, .2, 1), box-shadow .2s; }
.hnn-express__knopf:hover { border-color: var(--hnn-tinte); transform: translateY(-2px); box-shadow: 0 12px 24px -16px rgba(10, 10, 10, .5); }
.hnn-express__knopf img { height: 22px; width: auto; max-width: 78%; }
.hnn-pdp2__lieferung { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0 0; font-size: 14px; line-height: 1.45; color: var(--hnn-tinte); }
.hnn-pdp2__lieferung svg { flex: none; width: 22px; height: 22px; color: #1f7a45; stroke: currentColor; }
.hnn-pdp2__preisnote { margin: 6px 0 0 32px; font-size: 12.5px; color: var(--hnn-grau-2); }
.hnn-beratung { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; align-items: center; margin-top: 26px; padding: 18px 20px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 24px; }
.hnn-beratung__ikon { display: flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; background: var(--hnn-tinte); color: #fff; grid-row: span 2; }
.hnn-beratung__ikon svg { width: 22px; height: 22px; }
.hnn-beratung__text { display: grid; gap: 2px; font-size: 13.5px; line-height: 1.4; color: var(--hnn-grau); }
.hnn-beratung__text b { color: var(--hnn-tinte); font-size: 15px; }
.hnn-beratung__aktion { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14px; }
.hnn-beratung__aktion a { color: var(--hnn-tinte); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* ===== Kopfband und Kapsel als eine Einheit =====
   Das Band liegt nie als schwarzer Streifen über die ganze Breite, sondern
   fluchtet mit der Kapsel: gleiche Breite, gleicher Innenabstand. Auf Bildseiten
   steht es hell auf dem Foto, auf hellen Seiten (Produkt) dunkel auf dem Grund. */
body.hnn-glass .hnn-strip { background: transparent !important; border: 0 !important; max-height: 38px; }
body.hnn-glass .hnn-strip .wlf-container.hnn-strip__inner {
  width: calc(100% - 2 * clamp(12px, 2vw, 32px));
  max-width: calc(var(--wlf-container) - 2 * clamp(0px, 1vw, 24px));
  margin: 0 auto; padding: 0 clamp(18px, 2vw, 28px) !important; height: 38px;
}
body.hnn-glass.hnn-hell .hnn-strip { color: var(--hnn-grau); }
body.hnn-glass.hnn-hell .hnn-strip a:hover { color: var(--hnn-tinte) !important; }
body.hnn-glass:not(.hnn-hell) .hnn-strip { color: rgba(255, 255, 255, .78); }
body.hnn-glass.hnn-hell .wlf-site-header.af-header { margin-bottom: 0; }

/* ==========================================================================
   Konfigurator (Felge + Reifen)
   ========================================================================== */
.hnn-kr__schritte { list-style: none; margin: 0 0 32px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.hnn-kr__schritte li > a, .hnn-kr__schritte li > span { display: flex; align-items: center; gap: 12px; height: 56px; padding: 0 20px; border-radius: 999px; background: #fff; border: 1px solid rgba(10, 10, 10, .1); font-size: 14.5px; font-weight: 600; color: var(--hnn-grau-2); text-decoration: none; }
.hnn-kr__schritte b { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(10, 10, 10, .08); font-family: var(--hnn-mono); font-size: 12px; font-weight: 500; }
.hnn-kr__schritte .is-aktiv > span { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff; }
.hnn-kr__schritte .is-aktiv b { background: var(--hnn-rot); color: #fff; }
.hnn-kr__schritte .is-fertig > a, .hnn-kr__schritte .is-fertig > span { color: var(--hnn-tinte); }
.hnn-kr__schritte .is-fertig b { background: #1f9d55; color: #fff; }
.hnn-kr__schritte .is-fertig a:hover { border-color: var(--hnn-tinte); }
.hnn-kr__kopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin: 0 0 20px; }
.hnn-kr__kopf .hnn-h3 { margin: 0; font-size: clamp(22px, 2.2vw, 30px); letter-spacing: -.04em; text-transform: none; }
.hnn-kr__leer { max-width: 640px; padding: clamp(22px, 3vw, 36px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; }
.hnn-kr__leer .hnn-h3 { margin: 0 0 10px; }
.hnn-kr__leer p { margin: 0 0 18px; color: var(--hnn-grau); line-height: 1.6; }
.hnn-kr__hinweis { padding: 18px 22px; border-radius: 22px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); }
.hnn-kr__modelle { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.hnn-kr__modelle a { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 14px 24px 14px 14px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; color: var(--hnn-tinte) !important; text-decoration: none !important; transition: border-color .15s, transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s; }
.hnn-kr__modelle a:hover { border-color: var(--hnn-tinte); transform: translateY(-2px); box-shadow: 0 18px 36px -26px rgba(10, 10, 10, .5); }
.hnn-kr__bild { display: flex; align-items: center; justify-content: center; width: 112px; height: 112px; border-radius: 22px; background: #f3f3f1; overflow: hidden; }
.hnn-kr__bild img { width: 100%; height: 100%; object-fit: contain; }
.hnn-kr__bild--klein { width: 76px; height: 76px; border-radius: 18px; flex: none; }
.hnn-kr__bild--reifen svg { width: 30px; height: 30px; color: var(--hnn-grau-2); }
.hnn-kr__info { display: grid; gap: 4px; min-width: 0; }
.hnn-kr__info small, .hnn-kr__gewtext small, .hnn-kr__rinfo small { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-kr__info strong { font-family: var(--wlf-font-display); font-size: clamp(22px, 2.4vw, 32px); font-weight: 700; letter-spacing: -.04em; line-height: 1.05; }
.hnn-kr__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 4px; }
.hnn-kr__meta em { font-style: normal; font-size: 13px; color: var(--hnn-grau); }
.hnn-kr__meta .hnn-fzpille { padding: 5px 12px; font-size: 12.5px; border-radius: 999px; }
.hnn-kr__preis { display: grid; justify-items: end; font-family: var(--hnn-mono); font-size: 20px; letter-spacing: -.02em; }
.hnn-kr__preis small { font-family: var(--wlf-font-body); font-size: 12px; color: var(--hnn-grau-2); letter-spacing: 0; }
.hnn-kr__gewaehlt { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 14px 22px; align-items: center; margin: 0 0 28px; padding: 14px 24px 14px 14px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; }
.hnn-kr__gewtext { display: grid; gap: 2px; }
.hnn-kr__gewtext strong { font-family: var(--wlf-font-display); font-size: 26px; font-weight: 700; letter-spacing: -.04em; }
.hnn-kr__gewtext span { font-size: 14px; color: var(--hnn-grau); }
.hnn-kr__wechsel { display: grid; gap: 8px; justify-items: end; }
.hnn-kr__wechsel .hnn-waehler__opt { justify-content: flex-end; gap: 6px; }
.hnn-kr__wechsel .hnn-chipwahl { min-height: 34px; padding: 0 12px; font-size: 12px; }
.hnn-kr__zul { margin: -6px 0 18px; font-size: 14px; color: var(--hnn-grau); }
.hnn-btn--klein { height: 46px; font-size: 14px; }
.hnn-kr__uebersicht { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.hnn-kr__positionen, .hnn-kr__checks { padding: clamp(22px, 2.6vw, 34px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 32px; box-shadow: 0 20px 50px -36px rgba(10, 10, 10, .4); }
.hnn-kr__positionen .hnn-h3, .hnn-kr__checks .hnn-h3 { margin: 0 0 18px; font-size: 22px; text-transform: none; letter-spacing: -.03em; }
.hnn-kr__positionen ul, .hnn-kr__checks ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.hnn-kr__positionen li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 16px 0; border-top: 1px solid rgba(10, 10, 10, .1); }
.hnn-kr__pos { display: grid; gap: 3px; }
.hnn-kr__pos strong { font-size: 17px; letter-spacing: -.02em; }
.hnn-kr__pos em { font-style: normal; font-weight: 400; color: var(--hnn-grau); }
.hnn-kr__pos small { font-size: 13px; color: var(--hnn-grau); }
.hnn-kr__pos a { color: var(--hnn-tinte); text-decoration: underline; text-underline-offset: 3px; }
.hnn-kr__pp { font-family: var(--hnn-mono); font-size: 17px; }
.hnn-kr__summe { margin: 0; padding: 18px 0 20px; border-top: 1px solid var(--hnn-tinte); display: grid; gap: 6px; }
.hnn-kr__summe > div { display: flex; justify-content: space-between; align-items: baseline; }
.hnn-kr__summe dt { font-family: var(--hnn-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-kr__summe dd { margin: 0; font-family: var(--hnn-mono); font-size: clamp(28px, 3vw, 38px); letter-spacing: -.03em; }
.hnn-kr__summe small { font-size: 12.5px; color: var(--hnn-grau-2); }
.hnn-kr__kaufen { width: 100%; justify-content: space-between; height: 60px; font-size: 16px; }
.hnn-kr__checks li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 0; border-top: 1px solid rgba(10, 10, 10, .1); font-size: 14px; }
.hnn-kr__checks li svg { flex: none; width: 22px; height: 22px; color: var(--hnn-rot); stroke: currentColor; margin-top: 1px; }
.hnn-kr__checks li span { display: grid; gap: 2px; color: var(--hnn-grau); }
.hnn-kr__checks li b { color: var(--hnn-tinte); font-size: 14.5px; }
.hnn-kr__checks li a { color: var(--hnn-tinte); text-underline-offset: 3px; }
.hnn-kr__checks .hnn-fzpille { margin: 0 0 8px; }
@media (max-width: 900px) {
  .hnn-kr__schritte { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hnn-kr__modelle a { grid-template-columns: 84px minmax(0, 1fr); }
  .hnn-kr__bild { width: 84px; height: 84px; }
  .hnn-kr__preis { grid-column: 1 / -1; justify-items: start; }
  .hnn-kr__gewaehlt { grid-template-columns: auto minmax(0, 1fr); }
  .hnn-kr__wechsel, .hnn-kr__gewaehlt > .hnn-link { grid-column: 1 / -1; justify-items: start; }
  .hnn-kr__wechsel .hnn-waehler__opt { justify-content: flex-start; }
  .hnn-kr__uebersicht { grid-template-columns: minmax(0, 1fr); }
}

.hnn-kr__kopf .hnn-h3, .hnn-kr .hnn-h3 { max-width: none !important; font-size: clamp(22px, 2.2vw, 30px) !important; line-height: 1.15 !important; }
.hnn-kr__leerbild { font-family: var(--hnn-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--hnn-grau-2); text-align: center; padding: 6px; }

/* Kasse: Kontakt (E-Mail, Name) optisch vom Rest getrennt, PLZ/Ort halbe Breite */
body.hnn-woo .woocommerce-billing-fields__field-wrapper { position: relative; }
body.hnn-woo #billing_email_field::before { content: 'Kontakt'; display: block; margin: 0 0 14px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
body.hnn-woo #billing_email_field { padding-top: 4px; }
body.hnn-woo #billing_last_name_field, body.hnn-woo #billing_company_field.af-kasse-name-ende { margin-bottom: 26px !important; padding-bottom: 28px; border-bottom: 1px solid rgba(10, 10, 10, .12); }
body.hnn-woo #billing_first_name_field { margin-bottom: 16px; }
body.hnn-woo #billing_country_field::before { content: 'Adresse'; display: block; margin: 0 0 14px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
body.hnn-woo #billing_postcode_field, body.hnn-woo #billing_city_field { grid-column: auto !important; }
body.hnn-woo form.checkout .form-row.af-kasse-plz, body.hnn-woo form.checkout .form-row.af-kasse-ort { grid-column: span 1; width: auto; }
body.hnn-woo form.checkout #billing_first_name_field, body.hnn-woo form.checkout #billing_last_name_field { grid-column: span 1; }
body.hnn-woo #billing_last_name_field { margin-bottom: 16px !important; padding-bottom: 0; border-bottom: 0; }
body.hnn-woo #billing_country_field { margin-top: 14px; padding-top: 28px; border-top: 1px solid rgba(10, 10, 10, .12); }

/* ===== Kasse im Shopify-Stil ===== */
/* Konto erstellen: dezenter Schalter oben rechts in der Adresskarte */
body.hnn-woo form.checkout #customer_details .col-1 { position: relative; }
body.hnn-woo .woocommerce-account-fields { position: absolute; top: 2px; right: 0; margin: 0; }
body.hnn-woo .woocommerce-account-fields p.create-account { margin: 0 !important; padding: 0; }
body.hnn-woo .woocommerce-account-fields p.create-account label { display: inline-flex !important; align-items: center; gap: 10px; margin: 0 !important; cursor: pointer; font-family: var(--wlf-font-body) !important; font-size: 13.5px !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--hnn-grau) !important; }
body.hnn-woo .woocommerce-account-fields input#createaccount { appearance: none; -webkit-appearance: none; position: relative; width: 38px; height: 22px; margin: 0; border-radius: 99px; background: rgba(10, 10, 10, .2); cursor: pointer; transition: background .2s; }
body.hnn-woo .woocommerce-account-fields input#createaccount::after { content: ''; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s cubic-bezier(.2, .7, .2, 1); }
body.hnn-woo .woocommerce-account-fields input#createaccount:checked { background: var(--hnn-tinte); }
body.hnn-woo .woocommerce-account-fields input#createaccount:checked::after { transform: translateX(16px); }
body.hnn-woo div.create-account { position: absolute; top: 40px; right: 0; width: min(320px, 100%); z-index: 3; padding: 16px; background: #fff; border: 1px solid rgba(10, 10, 10, .12); border-radius: 22px; box-shadow: 0 24px 50px -28px rgba(10, 10, 10, .5); }
body.hnn-woo div.create-account .form-row { margin: 0; }
/* Lieferung an andere Adresse */
body.hnn-woo #ship-to-different-address { margin: 26px 0 0; padding-top: 24px; border-top: 1px solid rgba(10, 10, 10, .12); }
body.hnn-woo #ship-to-different-address label { display: flex; align-items: center; gap: 12px; margin: 0; cursor: pointer; font-family: var(--wlf-font-body); font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--hnn-tinte); }
body.hnn-woo #ship-to-different-address h3 { margin: 0; font-size: 18px; }
body.hnn-woo #ship-to-different-address input[type=checkbox] { appearance: none; -webkit-appearance: none; width: 22px; height: 22px; margin: 0; border: 1.5px solid rgba(10, 10, 10, .4); border-radius: 7px; background: #fff; cursor: pointer; display: inline-grid; place-content: center; }
body.hnn-woo #ship-to-different-address input[type=checkbox]:checked { background: var(--hnn-tinte); border-color: var(--hnn-tinte); }
body.hnn-woo #ship-to-different-address input[type=checkbox]:checked::after { content: ''; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) translate(-1px, -1px); }
body.hnn-woo .woocommerce-shipping-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; margin-top: 22px; }
body.hnn-woo .woocommerce-shipping-fields__field-wrapper .form-row-wide { grid-column: 1 / -1; }
body.hnn-woo .woocommerce-shipping-fields__field-wrapper .form-row-first, body.hnn-woo .woocommerce-shipping-fields__field-wrapper .form-row-last { float: none; width: auto; }
/* Newsletter-Hinweis als saubere Checkbox */
body.hnn-woo .weblabsui-mkt-checkout-consent { margin: 18px 0 8px; padding: 16px 18px; background: transparent; border: 1px solid rgba(10, 10, 10, .12); border-radius: 18px; }
body.hnn-woo .weblabsui-mkt-checkout-consent__title { margin: 0 0 10px; font-size: 14.5px; font-weight: 700; }
body.hnn-woo .weblabsui-mkt-checkout-consent__option { display: flex !important; align-items: flex-start; gap: 12px; margin: 0; padding: 0 !important; border: 0 !important; background: none !important; cursor: pointer; }
body.hnn-woo .weblabsui-mkt-checkout-consent__input { appearance: none; -webkit-appearance: none; position: static !important; opacity: 1 !important; flex: none; width: 22px !important; height: 22px !important; margin: 1px 0 0 !important; border: 1.5px solid rgba(10, 10, 10, .4); border-radius: 7px; background: #fff; display: grid; place-content: center; cursor: pointer; clip: auto !important; }
body.hnn-woo .weblabsui-mkt-checkout-consent__input:checked { background: var(--hnn-tinte); border-color: var(--hnn-tinte); }
body.hnn-woo .weblabsui-mkt-checkout-consent__input:checked::after { content: ''; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) translate(-1px, -1px); }
body.hnn-woo .weblabsui-mkt-checkout-consent__box { display: none !important; }
body.hnn-woo .weblabsui-mkt-checkout-consent__text { font-family: var(--wlf-font-body) !important; font-size: 13.5px !important; line-height: 1.5; letter-spacing: 0 !important; text-transform: none !important; color: var(--hnn-grau); }
body.hnn-woo .weblabsui-mkt-checkout-consent__legal { margin: 8px 0 0 34px; font-size: 12px; }
/* Zusammenfassung wie Shopify: Bild mit Mengen-Marke */
body.hnn-woo form.checkout #order_review { background: #fafaf8; }
.af-kasse-pos { display: flex; align-items: center; gap: 16px; }
.af-kasse-pos__bild { position: relative; flex: none; width: 64px; height: 64px; border-radius: 14px; background: #fff; border: 1px solid rgba(10, 10, 10, .12); }
.af-kasse-pos__bild img { width: 100%; height: 100%; object-fit: contain; border-radius: 13px; }
.af-kasse-pos__bild b { position: absolute; top: -8px; right: -8px; min-width: 22px; height: 22px; padding: 0 6px; display: flex; align-items: center; justify-content: center; border-radius: 99px; background: rgba(10, 10, 10, .78); color: #fff; font-size: 12px; font-weight: 600; }
.af-kasse-pos__name { font-size: 14px; line-height: 1.4; font-weight: 500; }
body.hnn-woo #order_review td.product-name { padding-right: 12px; }
body.hnn-woo form.checkout #customer_details .col-2 { margin-top: 0; }
body.hnn-woo #ship-to-different-address { width: 100%; display: block; margin: 26px 0 8px; }
body.hnn-woo #ship-to-different-address label { width: 100%; }
body.hnn-woo .woocommerce-shipping-fields { margin-bottom: 8px; }
body.hnn-woo .woocommerce-additional-fields { margin-top: 26px; padding-top: 24px; border-top: 1px solid rgba(10, 10, 10, .12); }
.af-kasse-recht { margin: 22px auto 4px; max-width: 440px; display: grid; gap: 8px; text-align: center; } /* 13.11.26: Abstand zum Knopf, mittig */
.af-kasse-recht p { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--hnn-grau); text-align: center; }
.af-kasse-recht a { color: var(--hnn-tinte); text-decoration: underline; text-underline-offset: 2px; }
body.hnn-woo .order-total td small.includes_tax { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--hnn-grau); }
body.hnn-woo .order-total td strong { font-size: 22px; }

.hnn-kr__bild--reifen img { object-fit: contain; }
body.hnn-woo td.product-thumbnail img.af-posbild { width: 72px; height: 72px; border-radius: 18px; object-fit: contain; background: #f3f3f1; }

.af-minicart img.af-posbild, .af-drawer img.af-posbild { width: 64px; height: 64px; border-radius: 14px; object-fit: contain; background: #f3f3f1; }
body.hnn-woo .cart_totals .order-total small.includes_tax, body.hnn-woo .cart_totals small.includes_tax { display: block; margin-top: 2px; font-family: var(--wlf-font-body) !important; font-size: 12px !important; font-weight: 400; color: var(--hnn-grau) !important; }
body.hnn-woo .cart_totals small.includes_tax .woocommerce-Price-amount { font-family: var(--wlf-font-body); font-size: inherit; color: inherit; }

/* Nicht lieferbare Farben/Größen: sichtbar, aber ausgegraut */
.wlf-swatch.is-aus, .hnn-farbwahl.is-aus .hnn-farbwahl__kreis { filter: grayscale(1); opacity: .5; cursor: not-allowed; }
.wlf-swatch.is-aus { position: relative; pointer-events: auto; }
.wlf-swatch.is-aus:hover { transform: none; }
.wlf-swatch.is-aus::after, .hnn-farbwahl.is-aus .hnn-farbwahl__kreis::after { content: ""; position: absolute; left: 12%; right: 12%; top: 50%; height: 1.5px; background: #0a0a0a; transform: rotate(-45deg); opacity: .7; }
.hnn-farbwahl.is-aus .hnn-farbwahl__kreis { position: relative; }
.hnn-farbwahl.is-aus { cursor: not-allowed; }
.hnn-farbwahl.is-aus .hnn-farbwahl__name { opacity: .45; }
.hnn-chipwahl.is-aus { opacity: .4; text-decoration: line-through; cursor: not-allowed; background: transparent; }
.hnn-chipwahl.is-aus:hover { transform: none; box-shadow: none; }

/* Gutachten: Liste je Marke, eine Zeile pro Modell mit Foto */
.hnn-gl { display: grid; gap: 10px; }
body.hnn-glass .hnn-gut-inhalt .hnn-gl__zeile { border-radius: 24px !important; overflow: hidden; }
.hnn-gl__kopf { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto auto 28px; align-items: center; gap: 8px 22px; padding: 10px 22px 10px 10px; cursor: pointer; list-style: none; }
.hnn-gl__kopf::-webkit-details-marker { display: none; }
.hnn-gl__kopf:hover .hnn-gl__name { text-decoration: underline; text-underline-offset: 4px; }
.hnn-gl__bild { position: relative; display: block; width: 84px; height: 84px; border-radius: 18px; background: #f3f3f1; overflow: hidden; }
.hnn-gl__bild img { width: 100%; height: 100%; object-fit: contain; display: block; }
.hnn-gl__bild.is-leer::after { content: ""; position: absolute; inset: 22px; border: 2px solid rgba(10, 10, 10, .18); border-radius: 50%; box-shadow: inset 0 0 0 7px #f3f3f1, inset 0 0 0 9px rgba(10, 10, 10, .18); }
.hnn-gl__text { display: grid; gap: 3px; min-width: 0; }
.hnn-gl__marke { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-gl__name { font-family: var(--wlf-font-display); font-size: clamp(20px, 2vw, 26px); font-weight: 700; letter-spacing: -.03em; color: var(--hnn-tinte); overflow-wrap: anywhere; }
.hnn-gl__zoll { font-family: var(--hnn-mono); font-size: 13px; color: var(--hnn-grau); white-space: nowrap; }
.hnn-gl__zahl { font-size: 13.5px; color: var(--hnn-grau); white-space: nowrap; }
.hnn-gl__zahl b { font-family: var(--hnn-mono); font-weight: 500; color: var(--hnn-tinte); }
.hnn-gl__pfeil { width: 28px; height: 28px; border-radius: 50%; background: #f3f3f1; position: relative; transition: transform .2s ease, background .2s ease; }
.hnn-gl__pfeil::after { content: ""; position: absolute; left: 9px; top: 9px; width: 7px; height: 7px; border-right: 2px solid var(--hnn-tinte); border-bottom: 2px solid var(--hnn-tinte); transform: rotate(45deg); }
.hnn-gl__zeile[open] .hnn-gl__pfeil { transform: rotate(180deg); background: var(--hnn-tinte); }
.hnn-gl__zeile[open] .hnn-gl__pfeil::after { border-color: #fff; }
.hnn-gl__auf { display: grid; gap: 18px; padding: 6px 22px 22px 104px; }
.hnn-gl__zolltitel { margin: 0 0 8px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-gl__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hnn-gl__liste a { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(10, 10, 10, .14); background: #fff; font-family: var(--hnn-mono); font-size: 12.5px; color: var(--hnn-tinte); text-decoration: none; transition: border-color .15s ease, background .15s ease; }
.hnn-gl__liste a:hover { border-color: var(--hnn-tinte); background: #f3f3f1; }
.hnn-gl__shop { margin: 0; }
.hnn-gl__shop a { font-weight: 600; font-size: 14.5px; color: var(--hnn-tinte); }
@media (max-width: 720px) {
  .hnn-gl__kopf { grid-template-columns: 72px minmax(0, 1fr) 28px; padding: 10px 14px 10px 10px; gap: 6px 14px; }
  .hnn-gl__bild { width: 72px; height: 72px; grid-row: span 2; }
  .hnn-gl__zoll, .hnn-gl__zahl { grid-column: 2; font-size: 12.5px; }
  .hnn-gl__zoll { display: none; }
  .hnn-gl__pfeil { grid-column: 3; grid-row: 1 / span 2; }
  .hnn-gl__auf { padding: 4px 16px 18px; }
}

/* Karten: Swatch-Reihe bleibt einzeilig (max. 3 + Plus), Preis wird nie abgeschnitten */
.wlf-swatches { flex-wrap: nowrap !important; white-space: nowrap; max-width: 100%; }
.wlf-swatch--mehr { flex: none; width: 24px; height: 24px; }
body.hnn .wlf-model-card__side { flex: none; }
body.hnn .wlf-model-card__main { flex: 1 1 auto; min-width: 0; }

/* Nicht lieferbare Modelle: ausgegraut am Ende, mit Hinweis statt Passform-Kennzeichen */
.wlf-model-card.is-ausverkauft .wlf-model-card__media img, .wlf-model-card.is-ausverkauft .wlf-model-card__rad { filter: grayscale(1); opacity: .55; }
.wlf-model-card.is-ausverkauft .wlf-model-card__title, .wlf-model-card.is-ausverkauft .wlf-model-card__marke, .wlf-model-card.is-ausverkauft .wlf-model-card__farbname, .wlf-model-card.is-ausverkauft .wlf-model-card__sizes { opacity: .6; }
.wlf-fit-badge--aus .wlf-fit-badge__punkt { background: #9a9da3; box-shadow: 0 0 0 3px rgba(154, 157, 163, .22); }
body.hnn .wlf-model-card__media .wlf-fit-badge--aus { color: var(--hnn-grau) !important; background: rgba(255, 255, 255, .9) !important; }
.hnn-pdp2__lager--aus { color: var(--hnn-grau) !important; }
.hnn-pdp2__lager--aus::before { background: #9a9da3 !important; box-shadow: 0 0 0 3px rgba(154, 157, 163, .25) !important; }
.hnn-pdp2__lagerhinweis { display: block; margin-top: 4px; font-size: 12.5px; color: #9a6200; }
body.hnn .hnn-chipwahl.is-aus.is-aktuell { opacity: .8; text-decoration: none; background: transparent !important; color: var(--hnn-grau) !important; border-color: var(--hnn-tinte) !important; }

/* ==========================================================================
   Suchleiste auf Innenseiten (Felgen, Konfigurator): hell statt dunkel.
   Gilt nur im .hnn-suchband; die Suche im Startseiten-Kopf bleibt auf dem Foto.
   ========================================================================== */
body.hnn .hnn-suchband .hnn-suche.hnn-suche--leiste {
  background: #fff !important; color: var(--hnn-tinte);
  border: 1px solid rgba(10, 10, 10, .08);
  box-shadow: 0 20px 50px -34px rgba(10, 10, 10, .35);
}
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment__tabs { background: #f3f3f1 !important; box-shadow: none !important; }
body.hnn .hnn-suchband .hnn-suche .af-fitment__tab { color: var(--hnn-grau) !important; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment__tab.is-active { background: var(--hnn-tinte) !important; color: #fff !important; box-shadow: none !important; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-field { background: #f3f3f1 !important; box-shadow: none !important; border: 1px solid transparent !important; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-field:hover { background: #ecece9 !important; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-field:focus-within, body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-field.ist-offen { background: #fff !important; border-color: var(--hnn-tinte) !important; box-shadow: none !important; }
body.hnn .hnn-suchband .hnn-suche .af-fitment .wlf-field__label { color: var(--hnn-grau-2) !important; }
body.hnn .hnn-suchband .hnn-suche .af-dd__trigger, body.hnn .hnn-suchband .hnn-suche .af-fitment .wlf-field__input { color: var(--hnn-tinte) !important; color-scheme: light; }
body.hnn .hnn-suchband .hnn-suche .af-fitment .wlf-field__input::placeholder { color: rgba(10, 10, 10, .28); }
body.hnn .hnn-suchband .hnn-suche .af-fitment__cascade .wlf-field::after { color: var(--hnn-grau-2); }
body.hnn .hnn-suchband .hnn-suche .af-fitment__schein-hint { color: var(--hnn-grau) !important; }
.af-dd-feld:has(.af-dd__trigger:focus-visible) { box-shadow: none; }
/* Fahrzeugleiste (gewähltes Fahrzeug) */
.hnn-suchband .hnn-fahrzeugleiste { color: var(--hnn-tinte); }
.hnn-suchband .hnn-fahrzeugleiste__fahrzeug span { color: var(--hnn-grau-2); }
.hnn-suchband .hnn-fahrzeugleiste__schalter { color: var(--hnn-tinte) !important; }
.hnn-suchband .hnn-fahrzeugleiste__schalter i { background: rgba(10, 10, 10, .16); }
.hnn-suchband .hnn-fahrzeugleiste__reset { color: var(--hnn-grau) !important; }

/* Absenden: runde Kapsel, der Kreis bleibt immer rund (kein Ei) */
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit {
  width: auto !important; min-width: 200px; height: 56px !important; min-height: 56px; justify-self: start;
  padding: 0 70px 0 26px !important; border-radius: 999px !important; box-shadow: none !important;
  background: var(--hnn-rot) !important; color: #fff !important; transform: none;
}
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit::after {
  content: '→'; position: absolute; top: 50%; bottom: auto; right: 6px; left: auto; width: 44px; height: 44px; aspect-ratio: 1; flex: none;
  margin: -22px 0 0; transform: none; border-radius: 50%; background: #fff; color: var(--hnn-tinte); font-size: 18px; font-weight: 600; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit:hover:not(:disabled) { background: var(--hnn-tinte) !important; color: #fff !important; transform: none; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit:hover:not(:disabled)::after { background: var(--hnn-rot); color: #fff; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit:disabled { opacity: 1; background: #ecece9 !important; color: var(--hnn-grau-2) !important; cursor: not-allowed; }
body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit:disabled::after { background: #fff; color: var(--hnn-grau-2); }
@media (max-width: 1100px) {
  body.hnn-glass .hnn-suchband .hnn-suche .af-fitment .wlf-fitment-search__submit { width: 100% !important; justify-self: stretch; }
}

/* Auswahlliste (Portal am Body) hell, wenn sie aus der hellen Suchleiste kommt */
.af-dd--hell { color: var(--hnn-tinte); background: rgba(255, 255, 255, .98); border: 1px solid rgba(10, 10, 10, .1); box-shadow: 0 30px 70px -28px rgba(10, 10, 10, .38), 0 6px 20px -8px rgba(10, 10, 10, .18); -webkit-backdrop-filter: none; backdrop-filter: none; }
.af-dd--hell .af-dd__suche { background: #f3f3f1; box-shadow: none; }
.af-dd--hell .af-dd__suche:focus-within { background: #fff; box-shadow: inset 0 0 0 1px var(--hnn-tinte); }
.af-dd--hell .af-dd__suche svg { stroke: var(--hnn-grau-2); }
.af-dd--hell .af-dd__eingabe { color: var(--hnn-tinte) !important; }
.af-dd--hell .af-dd__eingabe::placeholder { color: rgba(10, 10, 10, .35); }
.af-dd--hell .af-dd__zahl, .af-dd--hell .af-dd__zusatz, .af-dd--hell .af-dd__leer, .af-dd--hell .af-dd__titel { color: var(--hnn-grau-2); }
.af-dd--hell .af-dd__gruppe { background: linear-gradient(180deg, rgba(255, 255, 255, .98) 70%, rgba(255, 255, 255, 0)); color: var(--hnn-grau-2); }
.af-dd--hell .af-dd__opt { color: var(--hnn-tinte); }
body.hnn-glass .af-dd--hell .af-dd__opt.ist-aktiv, .af-dd--hell .af-dd__opt.ist-aktiv { background: #f3f3f1; }
.af-dd--hell .af-dd__opt.ist-gewaehlt { color: var(--hnn-tinte); }
.af-dd--hell mark { color: var(--hnn-tinte); }
.af-dd--hell .af-dd__liste { scrollbar-color: rgba(10, 10, 10, .25) transparent; }
.af-dd--hell.af-dd--sheet { background: #fff; }
.af-dd--hell .af-dd__zu { background: #f3f3f1; }
.af-dd--hell .af-dd__zu svg { stroke: var(--hnn-tinte); }
.af-dd--hell .af-dd__griff { background: rgba(10, 10, 10, .2); }

/* Konfigurator Schritt 1: Fahrzeugliste (Marke → Modell → Generation → Motorisierung) */
.hnn-kr__leer { padding: 0; background: none; border: 0; border-radius: 0; max-width: 720px; }
.hnn-kr__leer p { margin-bottom: 0; }
.hnn-fl { margin-top: 22px; padding: clamp(18px, 2.4vw, 30px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; }
.hnn-fl__kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; margin: 0 0 16px; }
.hnn-fl__titel { margin: 0; font-family: var(--wlf-font-display); font-size: clamp(20px, 2vw, 26px); font-weight: 700; letter-spacing: -.03em; color: var(--hnn-tinte); }
.hnn-fl__kopf p { margin: 0; font-size: 14px; color: var(--hnn-grau); }
.hnn-fl__spalten { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hnn-fl__spalte { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 14px 12px 12px; background: #f3f3f1; border-radius: 22px; opacity: .6; transition: opacity .2s ease; }
.hnn-fl__spalte.is-bereit { opacity: 1; }
.hnn-fl__spaltentitel { margin: 0 4px; display: flex; align-items: center; gap: 8px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau); }
.hnn-fl__spaltentitel b { font-weight: 500; color: var(--hnn-rot); }
.hnn-fl__suche { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border-radius: 999px; background: #fff; border: 1px solid transparent; }
.hnn-fl__suche:focus-within { border-color: var(--hnn-tinte); }
.hnn-fl__suche svg { flex: none; width: 15px; height: 15px; fill: none; stroke: var(--hnn-grau-2); stroke-width: 2; stroke-linecap: round; }
.hnn-fl__suche input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0 !important; outline: none !important; background: transparent !important; box-shadow: none !important; font: inherit; font-size: 14px; color: var(--hnn-tinte); }
.hnn-fl__suche input:disabled { cursor: not-allowed; }
.hnn-fl__liste { list-style: none; margin: 0; padding: 0; max-height: 340px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.hnn-fl__buchstabe { position: sticky; top: 0; z-index: 1; padding: 8px 10px 3px; background: #f3f3f1; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .1em; color: var(--hnn-grau-2); }
.hnn-fl__hinweis { padding: 14px 10px; font-size: 13.5px; color: var(--hnn-grau-2); }
.hnn-fl__eintrag { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin: 1px 0; padding: 10px 12px; border: 0 !important; border-radius: 12px; background: transparent; font: inherit; font-size: 14.5px; line-height: 1.3; text-align: left; color: var(--hnn-tinte) !important; text-decoration: none !important; cursor: pointer; transition: background .12s ease; }
.hnn-fl__eintrag span { min-width: 0; overflow-wrap: anywhere; }
.hnn-fl__eintrag em { flex: none; font-style: normal; font-family: var(--hnn-mono); font-size: 11.5px; color: var(--hnn-grau-2); }
.hnn-fl__eintrag:hover { background: #fff; }
.hnn-fl__eintrag.is-gewaehlt { background: var(--hnn-tinte); color: #fff !important; }
.hnn-fl__eintrag.is-gewaehlt em { color: rgba(255, 255, 255, .65); }
a.hnn-fl__eintrag::after { content: '→'; flex: none; margin-left: auto; color: var(--hnn-grau-2); }
a.hnn-fl__eintrag:hover { background: var(--hnn-tinte); color: #fff !important; }
a.hnn-fl__eintrag:hover::after, a.hnn-fl__eintrag:hover em { color: #fff; }
@media (max-width: 1100px) { .hnn-fl__spalten { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .hnn-fl__spalten { grid-template-columns: minmax(0, 1fr); }
  .hnn-fl__spalte:not(.is-bereit) { display: none; }
  .hnn-fl__liste { max-height: 280px; }
}
/* Auswahlliste der hellen Suchleiste: vollständig deckend */
body.hnn .af-dd.af-dd--hell { background: #fff !important; }
/* Einträge mit Zusatz (Jahre, PS): Zusatz steht unter dem Namen */
.hnn-fl__eintrag:has(em) { flex-direction: column; align-items: flex-start; gap: 3px; }
.hnn-fl__eintrag:has(em) em { text-align: left; }
a.hnn-fl__eintrag:has(em)::after { content: none; }

/* Konfigurator: eine Karte für die Fahrzeugwahl (Liste oder Schlüsselnummer) */
.hnn-fl { margin-top: 24px; }
.hnn-fl__kopf { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 14px 24px; margin: 0 0 18px; }
.hnn-fl__kopf > div:first-child p { margin: 4px 0 0; font-size: 14.5px; color: var(--hnn-grau); }
.hnn-fl__tabs { display: inline-flex; padding: 4px; gap: 2px; border-radius: 999px; background: #f3f3f1; }
.hnn-fl__tabs button { height: 40px; padding: 0 20px; border: 0 !important; border-radius: 999px; background: transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--hnn-grau); cursor: pointer; transition: background .2s ease, color .2s ease; }
.hnn-fl__tabs button.is-aktiv { background: var(--hnn-tinte); color: #fff; }
.hnn-fl__hinweis { margin: 0 0 12px; font-size: 14px; color: var(--hnn-grau); }
.hnn-fl__panel[hidden] { display: none; }
.hnn-fl__schein { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 44px); align-items: center; padding: clamp(4px, 1vw, 12px) 0 6px; }
.hnn-fl__form { display: grid; gap: 18px; max-width: 520px; }
.hnn-fl__formtitel { margin: 0; font-family: var(--wlf-font-display); font-size: clamp(19px, 1.8vw, 24px); font-weight: 700; letter-spacing: -.03em; color: var(--hnn-tinte); }
.hnn-fl__felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.hnn-fl__feld { display: grid; gap: 8px; padding: 14px 18px 16px; border-radius: 22px; background: #f3f3f1; border: 1px solid transparent; transition: border-color .15s ease, background .15s ease; }
.hnn-fl__feld:focus-within { background: #fff; border-color: var(--hnn-tinte); }
.hnn-fl__feld span { font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau); }
.hnn-fl__feld span b { font-weight: 500; color: var(--hnn-rot); margin-right: 4px; }
.hnn-fl__feld span i { font-style: normal; color: var(--hnn-grau-2); }
.hnn-fl__feld input { width: 100%; padding: 0; border: 0 !important; outline: none !important; background: transparent !important; box-shadow: none !important; font-family: var(--hnn-mono); font-size: 30px; letter-spacing: .14em; color: var(--hnn-tinte); }
.hnn-fl__feld input::placeholder { color: rgba(10, 10, 10, .2); }
.hnn-fl__los { position: relative; display: inline-flex; align-items: center; justify-self: start; height: 58px; min-width: 260px; padding: 0 72px 0 28px; border: 0 !important; border-radius: 999px; background: var(--hnn-rot); color: #fff; font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; transition: background .2s ease; }
.hnn-fl__los i { position: absolute; right: 7px; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%; background: #fff; color: var(--hnn-tinte); font-style: normal; font-size: 18px; display: flex; align-items: center; justify-content: center; }
.hnn-fl__los:hover { background: var(--hnn-tinte); }
.hnn-fl__los:hover i { background: var(--hnn-rot); color: #fff; }
.hnn-fl__notiz { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--hnn-grau); }
.hnn-fl__schein-bild { display: flex; justify-content: center; }
.hnn-fl__karte { width: min(100%, 440px); padding: 20px 22px 22px; border-radius: 26px; background: linear-gradient(160deg, #f3f3f1, #e7e7e3); border: 1px solid rgba(10, 10, 10, .08); box-shadow: 0 24px 50px -32px rgba(10, 10, 10, .45); transform: rotate(-1.5deg); }
.hnn-fl__karte-kopf { display: flex; justify-content: space-between; margin: 0 0 14px; font-family: var(--hnn-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau); }
.hnn-fl__karte-zeilen { display: grid; gap: 8px; margin: 0 0 14px; }
.hnn-fl__karte-zeilen i { display: block; height: 9px; border-radius: 9px; background: rgba(10, 10, 10, .1); }
.hnn-fl__karte-zeilen i.kurz { width: 55%; }
.hnn-fl__karte-felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.hnn-fl__karte-felder .ziel { position: relative; display: grid; gap: 2px; padding: 10px 14px 12px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 2px var(--hnn-rot); }
.hnn-fl__karte-felder small { font-family: var(--hnn-mono); font-size: 10.5px; color: var(--hnn-rot); }
.hnn-fl__karte-felder b { font-family: var(--hnn-mono); font-size: 24px; font-weight: 500; letter-spacing: .12em; color: var(--hnn-tinte); }
.hnn-fl__karte-felder em { font-style: normal; font-family: var(--hnn-mono); font-size: 10px; letter-spacing: .1em; color: var(--hnn-grau-2); }
@media (max-width: 900px) {
  .hnn-fl__schein { grid-template-columns: minmax(0, 1fr); }
  .hnn-fl__schein-bild { order: -1; }
  .hnn-fl__karte { width: min(100%, 360px); }
}
@media (max-width: 520px) {
  .hnn-fl__tabs { width: 100%; }
  .hnn-fl__tabs button { flex: 1; padding: 0 10px; font-size: 13px; }
  .hnn-fl__felder { grid-template-columns: minmax(0, 1fr); }
  .hnn-fl__los { width: 100%; }
}

/* Markenlogos in der Fahrzeugliste */
.hnn-fl__spalte[data-spalte="brand"] .hnn-fl__eintrag { justify-content: flex-start; gap: 12px; padding-block: 7px; }
.hnn-fl__logo { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #fff; font-style: normal; font-family: var(--hnn-mono); font-size: 13px; color: var(--hnn-grau-2); overflow: hidden; }
.hnn-fl__logo img { width: 24px; height: 24px; object-fit: contain; display: block; }
.hnn-fl__eintrag.is-gewaehlt .hnn-fl__logo { box-shadow: 0 0 0 2px rgba(255, 255, 255, .2); }

/* ===== HSN/TSN-Reiter in der Suchleiste: breiter, mit Fundstelle rechts ===== */
.af-fitment__schein-hilfe { display: none; }
@media (min-width: 900px) {
  body.hnn .hnn-suchband .af-fitment__schein-wrap { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; align-items: center; padding: 8px 6px 4px; }
  body.hnn.hnn-glass .hnn-suchband .hnn-suche.hnn-suche--leiste .af-fitment__hsn-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; align-items: start; }
  body.hnn .hnn-suchband .af-fitment__schein-wrap { align-items: center; }
  body.hnn .hnn-suchband .af-fitment__hsn-row .wlf-fitment-search__submit { grid-column: 1 / -1; justify-self: start; }
  body.hnn.hnn-glass .hnn-suchband .hnn-suche .af-fitment__schein .wlf-field__input { padding: 6px 0 4px !important; font-family: var(--hnn-mono) !important; font-size: 30px !important; letter-spacing: .14em; }
  body.hnn .hnn-suchband .af-fitment__schein .wlf-field__input::placeholder { letter-spacing: .14em; }
  body.hnn .hnn-suchband .af-fitment__schein-hint { display: none; }
  .hnn-suchband .af-fitment__schein-hilfe { display: grid; gap: 14px; padding: 20px 24px 22px; border-radius: 24px; background: #f3f3f1; }
  .af-fitment__schein-hilfe-titel { margin: 0; font-family: var(--wlf-font-display); font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: var(--hnn-tinte); }
  .af-fitment__karte { padding: 14px 16px 16px; border-radius: 18px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); }
  .af-fitment__karte-kopf { display: flex; justify-content: space-between; margin: 0 0 10px; font-family: var(--hnn-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau); }
  .af-fitment__karte-felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .af-fitment__karte-felder .ziel { display: grid; gap: 2px; padding: 8px 12px 10px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 2px var(--hnn-rot); }
  .af-fitment__karte-felder small { font-family: var(--hnn-mono); font-size: 10.5px; color: var(--hnn-rot); }
  .af-fitment__karte-felder b { font-family: var(--hnn-mono); font-size: 20px; font-weight: 500; letter-spacing: .12em; color: var(--hnn-tinte); }
  .af-fitment__schein-schritte { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; counter-reset: s; }
  .af-fitment__schein-schritte li { position: relative; padding-left: 28px; font-size: 13.5px; line-height: 1.5; color: var(--hnn-grau); counter-increment: s; }
  .af-fitment__schein-schritte li::before { content: counter(s); position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--hnn-tinte); color: #fff; font-family: var(--hnn-mono); font-size: 11px; display: grid; place-items: center; }
}

/* FAQ: Antwort bündig mit der Frage (gleicher Innenabstand zum Block) */
body.hnn-glass .hnn-faq__item p { padding-inline: 14px; }
body.hnn-glass .hnn-faq__item summary { padding-block: 20px; }
body.hnn-glass .hnn-faq__item[open] summary { padding-bottom: 12px; }

/* Garage: Markenlogo + Entfernen-Knopf sauber in der Zeile */
body.hnn .af-garage__item { grid-template-columns: minmax(0, 1fr) auto; gap: 0 !important; padding-right: 10px; }
body.hnn .af-garage__link { flex-direction: row; align-items: center; gap: 12px; padding: 10px 8px 10px 10px; }
body.hnn .af-garage__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body.hnn .af-garage__logo { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: #fff; font-style: normal; font-family: var(--hnn-mono); font-size: 14px; color: var(--hnn-grau-2); overflow: hidden; }
body.hnn .af-garage__logo img { width: 26px; height: 26px; object-fit: contain; display: block; }
body.hnn .af-garage__del { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0 !important; border-radius: 50%; background: rgba(255, 255, 255, .1) !important; color: rgba(255, 255, 255, .75) !important; transition: background .15s ease, color .15s ease; }
body.hnn .af-garage__del:hover { background: #fff !important; color: var(--hnn-tinte) !important; }
body.hnn .af-garage__del svg { display: block; }
body.hnn .af-garage__head .af-iconbtn { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); }
body.hnn .af-garage__head .af-iconbtn:hover { background: rgba(255, 255, 255, .2); }

/* Konfigurator: Jetzt kaufen (zweitrangig), Anfrage, Saisonwahl, Reifenlabel */
.hnn-btn--rand { background: transparent; border: 1.5px solid var(--hnn-tinte); color: var(--hnn-tinte) !important; }
.hnn-btn--rand:hover { background: var(--hnn-tinte); color: #fff !important; }
.hnn-kr__kaufzeile { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.hnn-kr__kaufzeile .hnn-btn { width: 100%; min-width: 0; justify-content: space-between; height: 60px; margin: 0; font-size: 15px; white-space: nowrap; }
.hnn-kr__anfrage { display: grid; justify-items: center; gap: 2px; margin: 14px 0 0; text-align: center; }
.hnn-kr__anfrage small { font-size: 12px; color: var(--hnn-grau-2); }
.hnn-kr__mehr { margin: 18px 0 0; text-align: center; }

.hnn-kr__eu { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.hnn-kr__eu a { margin-left: 4px; font-size: 12px; color: var(--hnn-grau) !important; }
@media (max-width: 520px) { .hnn-kr__kaufzeile .hnn-btn__pfeil { display: none; } }

/* Konfigurator: fünf Schritte, Kombinationen, Ausstattung (RDKS, Montage) */
.hnn-kr__schritte { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hnn-kr__schritte li > a, .hnn-kr__schritte li > span { padding: 0 16px; font-size: 14px; }
.hnn-kr__pp:empty { display: none; }
@media (max-width: 900px) {
	.hnn-kr__schritte { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Reifen: Empfehlung statt Auswahlzwang */
.hnn-kr__emp { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto; gap: 20px; align-items: center; padding: 16px 24px 16px 16px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 28px; }
.hnn-kr__emp-text { display: grid; gap: 4px; min-width: 0; }
.hnn-kr__emp-text small { font-family: var(--hnn-mono, monospace); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau, #6b6b6b); }
.hnn-kr__emp-text strong { font-size: 17px; letter-spacing: -.02em; }
.hnn-kr__emp-text em { font-style: normal; font-family: var(--hnn-mono, monospace); font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
.hnn-kr__emp-preis { text-align: right; display: grid; }
.hnn-kr__emp-preis strong { font-size: 20px; letter-spacing: -.03em; }
.hnn-kr__emp-preis small { font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
@media (max-width: 780px) {
	.hnn-kr__emp { grid-template-columns: 72px minmax(0, 1fr); }
	.hnn-kr__emp-preis { text-align: left; grid-column: 2; }
	.hnn-kr__emp .hnn-btn { grid-column: 1 / -1; justify-content: space-between; }
}
.hnn-kr__badge { font-style: normal; margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: #1f9d55; color: #fff; font-family: var(--hnn-mono, monospace); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }

/* Reifenschritt: Filterzeilen und kompakte Liste */
.hnn-kr__kopf .hnn-kr__ohne { font-size: 14px; color: var(--hnn-grau, #6b6b6b); }
.hnn-rl { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 8px; }
.hnn-rl li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 8px 24px; align-items: center; padding: 14px 16px 14px 24px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 20px; }
.hnn-rl__name { display: grid; gap: 2px; min-width: 0; }
.hnn-rl__name small { font-family: var(--hnn-mono, monospace); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau, #6b6b6b); }
.hnn-rl__name strong { font-size: 16px; font-weight: 600; letter-spacing: -.02em; }
.hnn-rl__name > span:not(.hnn-rl__daten) { font-family: var(--hnn-mono, monospace); font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
.hnn-rl .hnn-kr__eu { margin: 0; }
.hnn-rl__preis { display: grid; justify-items: end; min-width: 92px; }
.hnn-rl__preis strong { font-family: var(--hnn-mono, monospace); font-size: 17px; font-weight: 500; letter-spacing: -.02em; }
.hnn-rl__preis small { font-size: 11px; color: var(--hnn-grau, #6b6b6b); }
@media (max-width: 900px) {
	.hnn-rl li { grid-template-columns: minmax(0, 1fr) auto; padding: 14px 16px; }
	.hnn-rl .hnn-kr__eu { grid-column: 1 / -1; grid-row: 2; }
	.hnn-rl__preis { justify-items: end; }
	.hnn-rl .hnn-btn { grid-column: 1 / -1; justify-content: space-between; }
}

/* Konfigurator: Farb-Swatches neben den Zollgrößen */
.hnn-kr__wechsel { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px 22px; }
.hnn-kr__wechsel .hnn-waehler__opt { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hnn-kr__swatch { position: relative; display: block; flex: none; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; background: var(--sw, #999); box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(10, 10, 10, .2); transition: transform .2s; }
.hnn-kr__swatch img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.75); }
a.hnn-kr__swatch:hover { transform: scale(1.1); }
.hnn-kr__swatch.is-aktuell { box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px var(--hnn-tinte); }
.hnn-kr__swatch.is-aus { filter: grayscale(1); opacity: .45; cursor: not-allowed; }
@media (min-width: 901px) { .hnn-kr__gewaehlt { grid-template-columns: auto minmax(0, 1fr) auto auto; } .hnn-kr__wechsel { flex-wrap: nowrap; } }

/* EU-Reifenlabel: Skala A (dunkelgrün) bis E (rot) */
.hnn-eu { --c: #8a8f98; display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px 0 8px; border-radius: 8px; font-family: var(--hnn-mono); font-size: 12px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, #fff); border: 1px solid color-mix(in srgb, var(--c) 40%, #fff); }
.hnn-eu svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hnn-eu em { font-style: normal; font-family: var(--hnn-sans, inherit); font-size: 11.5px; color: var(--hnn-grau, #555); }
.hnn-eu b { font-weight: 700; color: var(--c); }
.hnn-eu--A { --c: #0f8a45; } .hnn-eu--B { --c: #5fa326; } .hnn-eu--C { --c: #b9920a; } .hnn-eu--D { --c: #d9731a; } .hnn-eu--E { --c: #d63a2b; }

/* Freigabe-Symbole an Zoll- und Reifengrößen */
.hnn-st { display: inline-flex; margin-left: 6px; vertical-align: -3px; }
.hnn-st svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.hnn-st--frei { color: #1f9d55; } .hnn-st--eintrag { color: #d98a0b; }
.hnn-chipwahl.is-aktuell .hnn-st--frei { color: #7fe0a6; } .hnn-chipwahl.is-aktuell .hnn-st--eintrag { color: #ffc766; }
.hnn-kr__passform { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 14px; margin: -14px 0 26px; }
.hnn-kr__passform .hnn-fzpille { flex: 0 1 auto; }
.hnn-kr__auflagen { flex: 1 1 320px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 18px; padding: 0 16px; font-size: 14px; }
.hnn-kr__auflagen summary { cursor: pointer; padding: 12px 0; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.hnn-kr__auflagen summary::after { content: "+"; font-family: var(--hnn-mono); }
.hnn-kr__auflagen[open] summary::after { content: "–"; }
.hnn-kr__auflagen ul { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px; max-height: 320px; overflow: auto; }
.hnn-kr__auflagen li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; color: var(--hnn-grau, #555); line-height: 1.45; }
.hnn-kr__auflagen li b { font-family: var(--hnn-mono); font-size: 12px; color: var(--hnn-tinte); }
.hnn-kr__auflagen .hnn-link { display: inline-block; margin: 0 0 12px; }
.hnn-kr__checks .hnn-kr__auflagen { margin-top: 12px; }
@media (min-width: 1101px) { .hnn-rl li { grid-template-columns: 64px minmax(0, 1fr) auto auto auto; } }
.hnn-rl__bild { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 14px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); }
.hnn-rl__bild img { width: 44px; height: 44px; object-fit: contain; }
.hnn-rl .hnn-kr__eu { flex-wrap: nowrap; }
@media (max-width: 1100px) { .hnn-rl li { grid-template-columns: 64px minmax(0, 1fr) auto; } .hnn-rl .hnn-kr__eu { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; } .hnn-rl .hnn-btn { grid-column: 1 / -1; } }
@media (max-width: 900px) { .hnn-kr__legende { margin-left: 0; } .hnn-kr__passform { margin-top: 0; } }
.hnn-kr__st { display: inline-flex; align-items: center; white-space: nowrap; }
.hnn-kr__st .hnn-st { margin: 0 5px 0 0; }
@media (max-width: 520px) {
	.hnn-rl li { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 8px 12px; }
	.hnn-rl__bild { width: 44px; height: 44px; border-radius: 12px; }
	.hnn-rl__bild img { width: 34px; height: 34px; }
	.hnn-rl__preis { min-width: 0; }
}

/* Konfigurator: Ladeanzeige */
.hnn-lade__balken { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 100001; background: var(--hnn-rot, #ff3b1f); transform: scaleX(0); transform-origin: 0 50%; opacity: 0; pointer-events: none; }
.hnn-lade__balken.is-aktiv { opacity: 1; animation: hnn-balken 12s cubic-bezier(.1, .6, .2, 1) forwards; }
@keyframes hnn-balken { 0% { transform: scaleX(0); } 20% { transform: scaleX(.45); } 60% { transform: scaleX(.8); } 100% { transform: scaleX(.95); } }
.hnn-lade { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 20px; background: rgba(240, 240, 238, .55); backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .2s; }
.hnn-lade.is-sichtbar { opacity: 1; visibility: visible; }
.hnn-lade__box { display: grid; justify-items: center; gap: 10px; max-width: 360px; padding: 28px 32px; text-align: center; background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 28px; box-shadow: 0 24px 60px -24px rgba(10, 10, 10, .35); }
.hnn-lade__box strong { font-size: 17px; letter-spacing: -.02em; }
.hnn-lade__box small { font-size: 13.5px; line-height: 1.45; color: var(--hnn-grau, #6b6b6b); }
.hnn-lade__box small:empty { display: none; }
.hnn-lade__spinner { display: inline-block; flex: none; width: 34px; height: 34px; border-radius: 50%; border: 3px solid rgba(10, 10, 10, .12); border-top-color: var(--hnn-rot, #ff3b1f); animation: hnn-dreh .8s linear infinite; }
.hnn-lade__spinner--klein { width: 16px; height: 16px; border-width: 2px; vertical-align: -3px; }
@keyframes hnn-dreh { to { transform: rotate(360deg); } }
.is-konf-laden .hnn-kr { cursor: progress; }
.is-konf-laden .hnn-kr a { pointer-events: none; }
.hnn-btn.is-laden, .hnn-chipwahl.is-laden { opacity: .85; }
.hnn-btn.is-laden .hnn-btn__pfeil { font-size: 0; position: relative; }
.hnn-btn.is-laden .hnn-btn__pfeil::after { content: ""; position: absolute; inset: 50% auto auto 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: hnn-dreh .8s linear infinite; }
.hnn-chipwahl.is-laden::after { content: ""; display: inline-block; width: 12px; height: 12px; margin-left: 8px; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; animation: hnn-dreh .8s linear infinite; vertical-align: -2px; }
@media (prefers-reduced-motion: reduce) { .hnn-lade__spinner, .hnn-btn.is-laden .hnn-btn__pfeil::after { animation-duration: 2.4s; } .hnn-lade__balken.is-aktiv { animation: none; transform: scaleX(.6); } }

/* Reifenauswahl: Größen als Kacheln, Saison als Segment */
.hnn-seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 4px; background: rgba(10, 10, 10, .06); border-radius: 999px; }
.hnn-seg a { padding: 8px 18px; border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--hnn-grau, #555) !important; text-decoration: none !important; transition: background .15s, color .15s; }
.hnn-seg a:hover { color: var(--hnn-tinte) !important; }
.hnn-seg a.is-aktuell { background: #fff; color: var(--hnn-tinte) !important; box-shadow: 0 1px 4px rgba(10, 10, 10, .18); }

/* Reifenwahl: ruhige Zeile mit Größen-Auswahl und Saison */
.hnn-gw { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 0 0 20px; }
.hnn-gd { position: relative; }
.hnn-gd summary { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 16px 0 18px; list-style: none; cursor: pointer; background: #fff; border: 1px solid rgba(10, 10, 10, .12); border-radius: 999px; font-size: 14px; transition: border-color .15s; }
.hnn-gd summary::-webkit-details-marker { display: none; }
.hnn-gd summary:hover, .hnn-gd[open] summary { border-color: var(--hnn-tinte); }
.hnn-gd__label { font-family: var(--hnn-mono, monospace); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau, #6b6b6b); }
.hnn-gd summary strong { font-family: var(--hnn-mono, monospace); font-weight: 500; font-size: 14px; letter-spacing: -.02em; }
.hnn-gd summary .hnn-st { margin: 0; }
.hnn-gd__pfeil { width: 7px; height: 7px; margin: -3px 2px 0 2px; border: solid var(--hnn-grau, #6b6b6b); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); transition: transform .2s; }
.hnn-gd[open] .hnn-gd__pfeil { transform: rotate(-135deg); margin-top: 3px; }
.hnn-gd__liste { position: absolute; z-index: 20; top: calc(100% + 8px); left: 0; min-width: 400px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid rgba(10, 10, 10, .1); border-radius: 18px; box-shadow: 0 24px 50px -20px rgba(10, 10, 10, .35); }
.hnn-gd__liste a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; align-items: center; padding: 10px 12px; border-radius: 12px; color: var(--hnn-tinte) !important; text-decoration: none !important; font-size: 14px; }
.hnn-gd__liste a:hover { background: rgba(10, 10, 10, .05); }
.hnn-gd__liste a.is-aktuell { background: rgba(10, 10, 10, .07); font-weight: 600; }
.hnn-gd__g { white-space: nowrap; font-family: var(--hnn-mono, monospace); font-size: 13.5px; }
.hnn-gd__g em { font-style: normal; font-family: var(--hnn-sans, inherit); font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
.hnn-gd__s { display: inline-flex; align-items: center; font-size: 12.5px; color: var(--hnn-grau, #555); }
.hnn-gd__s .hnn-st { margin: 0 5px 0 0; }
.hnn-gd__emp { grid-column: 1 / -1; font-style: normal; font-size: 11.5px; font-weight: 600; color: #1f9d55; }
@media (max-width: 520px) { .hnn-gd__g { white-space: normal; } .hnn-gd__liste { min-width: 0; width: calc(100vw - 52px); } }

/* Saison-Badge in der Reifenliste */
.hnn-rl__daten { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 3px; }
.hnn-rl__daten > span:last-child { font-family: var(--hnn-mono, monospace); font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
.hnn-sb { --c: #8a8f98; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px 0 9px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: -.005em; color: var(--c); background: color-mix(in srgb, var(--c) 14%, #fff); border: 1px solid color-mix(in srgb, var(--c) 38%, #fff); }
.hnn-sb svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.hnn-sb--s { --c: #c7790a; } .hnn-sb--w { --c: #2377d4; } .hnn-sb--g { --c: #0f8a6a; }

.af-stickybuy__info small { font-size: 11px; font-weight: 400; opacity: .7; }

/* Kartenpreis: eine ruhige Zeile unter Titel und Farben, nicht neben dem Titel */
.wlf-model-card__satzpreis { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin-top: 10px; }
.wlf-model-card__satzpreis strong { font-family: var(--hnn-mono, monospace); font-size: 16px; font-weight: 500; letter-spacing: -.02em; color: var(--hnn-tinte); }
.wlf-model-card__satzpreis small { font-size: 12px; color: var(--hnn-grau, #6b6b6b); }

/* Preishinweis (PAngV): dezent, aber lesbar und immer am Preis */
.af-ph { font-family: var(--wlf-font-body); font-size: 11.5px; line-height: 1.4; font-weight: 400; letter-spacing: 0; color: var(--hnn-grau, #6b6b6b); white-space: nowrap; }
.af-ph a { color: inherit !important; text-decoration: underline; text-decoration-color: rgba(10, 10, 10, .3); text-underline-offset: 2px; }
.af-ph a:hover { color: var(--hnn-tinte) !important; text-decoration-color: currentColor; }
.af-ph--karte { display: block; margin-top: 2px; }
.wlf-model-card__satzpreis + .af-ph--karte { margin-top: 3px; }
.hnn-kr__preis .af-ph { display: block; margin-top: 2px; text-align: right; }
.hnn-rl__hinweis { margin: 16px 4px -4px; font-size: 12.5px; color: var(--hnn-grau, #6b6b6b); }
.hnn-rl__hinweis .af-ph { font-size: inherit; }
.af-stickybuy__info .af-ph { display: block; font-size: 11px; opacity: .75; }
.hnn-kr__summe small .af-ph { font-size: inherit; white-space: normal; }

/* Zubehör: Abstand zum Footer, Nabendeckel als Grid-Karten mit Farb-Swatches und Platzhalter */
.hnn-zub-ende { height: clamp(64px, 8vw, 120px); }
.hnn-zkarte--deckel .wlf-model-card__link { display: block; cursor: default; }
.hnn-zkarte--deckel .wlf-model-card__media { display: block !important; padding: 14px 14px 0 !important; aspect-ratio: auto !important; }
.hnn-deckelbild { display: grid; place-items: center; aspect-ratio: 1; border-radius: 20px; background: linear-gradient(160deg, rgba(10, 10, 10, .035), rgba(10, 10, 10, .09)); }
.hnn-deckelbild svg { width: 58%; height: auto; filter: drop-shadow(0 10px 14px rgba(10, 10, 10, .18)); }
.hnn-deckelbild .d-ring { fill: rgba(10, 10, 10, .14); }
.hnn-deckelbild .d-kappe { fill: var(--sw, #9a9da3); transition: fill .25s; }
.hnn-deckelbild .d-licht { fill: none; stroke: rgba(255, 255, 255, .35); stroke-width: 2; }
.hnn-deckelbild .d-mitte { fill: rgba(10, 10, 10, .16); }
.hnn-deckelbild .d-loch { fill: rgba(255, 255, 255, .55); }
.hnn-zkarte--deckel .wlf-swatches { margin-top: 6px; padding-left: 4px; }
.hnn-zkarte--deckel .hnn-zdetail { color: var(--hnn-grau-2); text-decoration: none; cursor: default; }

/* Leerzustand „keine passenden Felgen“: Karte über die volle Breite */
.hnn-keine { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(18px, 3vw, 36px); align-items: center; padding: clamp(22px, 3.2vw, 40px); background: #fff; border: 1px solid rgba(10, 10, 10, .08); border-radius: 30px; box-shadow: 0 18px 40px -30px rgba(10, 10, 10, .35); }
.hnn-keine__ikon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 22px; background: rgba(10, 10, 10, .05); color: var(--hnn-tinte); }
.hnn-keine__ikon svg { width: 34px; height: 34px; }
.hnn-keine__text .hnn-h3 { margin: 0 0 6px; }
.hnn-keine__text p { margin: 0; color: var(--hnn-grau); max-width: 62ch; }
@media (max-width: 720px) { .hnn-keine { grid-template-columns: 1fr; justify-items: start; } .hnn-keine .hnn-btn { width: 100%; } }
body.hnn-glass .hnn-keine .hnn-keine__text .hnn-h3 { max-width: none !important; width: auto; font-size: clamp(20px, 2.2vw, 26px) !important; line-height: 1.2; text-transform: none !important; letter-spacing: -.01em; margin: 0 0 8px; }
.hnn-zkarte--deckel .wlf-model-card__main { display: grid; gap: 4px; }
.hnn-zkarte--deckel .wlf-swatches { margin-top: 8px; }
.hnn-deckelfarbe { display: block; margin: 2px 0 0 4px; font-size: 13px; color: var(--hnn-grau); }

/* Reifen: Preisklassen (Budget) und Markenfilter */
.hnn-bud { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 0 0 18px; }
.hnn-bud__stufen { display: flex; flex-wrap: wrap; gap: 8px; }
.hnn-bud__stufen a { display: grid; gap: 1px; padding: 9px 18px 10px; background: #fff; border: 1px solid rgba(10, 10, 10, .1); border-radius: 18px; color: var(--hnn-tinte) !important; text-decoration: none !important; transition: border-color .15s, background .15s; }
.hnn-bud__stufen a b { font-size: 14px; font-weight: 600; }
.hnn-bud__stufen a small { font-family: var(--hnn-mono); font-size: 11.5px; color: var(--hnn-grau-2); letter-spacing: .02em; }
.hnn-bud__stufen a:hover { border-color: var(--hnn-tinte); }
.hnn-bud__stufen a.is-aktuell { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff !important; }
.hnn-bud__stufen a.is-aktuell small { color: rgba(255, 255, 255, .7); }
.hnn-bud__markenliste { max-height: 360px; overflow: auto; }
.hnn-bud__gruppe { padding: 12px 14px 4px; font-family: var(--hnn-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--hnn-grau-2); }

/* Felgenliste im Konfigurator: Filterleiste, Preisblock, Pfeil */
.hnn-ff { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 0 0 16px; }
.hnn-ff__gruppe { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hnn-ff__label { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--hnn-grau-2); margin-right: 2px; }
.hnn-ff .hnn-chip.is-aktiv { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff; }
.hnn-ff__sw { width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: var(--sw, #999); box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(10, 10, 10, .22); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.hnn-ff__sw:hover { transform: scale(1.12); }
.hnn-ff__sw.is-aktiv { box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px var(--hnn-tinte); }
.hnn-ff__sort { margin-left: auto; }
.hnn-seg button { padding: 8px 16px; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--hnn-grau, #555); cursor: pointer; transition: background .15s, color .15s; }
.hnn-seg button:hover { color: var(--hnn-tinte); }
.hnn-seg button.is-aktuell { background: #fff; color: var(--hnn-tinte); box-shadow: 0 1px 4px rgba(10, 10, 10, .18); }
.hnn-ff__reset { border: 0; background: none; cursor: pointer; font: inherit; font-size: 13.5px; }
.hnn-kr__nichts { padding: 18px 22px; border-radius: 22px; background: #fff; border: 1px solid rgba(10, 10, 10, .08); color: var(--hnn-grau); }
.hnn-kr__modelle li[hidden] { display: none; }
.hnn-kr__modelle a { grid-template-columns: 112px minmax(0, 1fr) auto auto; }
.hnn-kr__preis { gap: 1px; font-family: var(--wlf-font-body); text-align: right; }
.hnn-kr__preis small { font-family: var(--hnn-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; }
.hnn-kr__preis b { font-family: var(--wlf-font-display); font-size: clamp(26px, 2.6vw, 34px); font-weight: 700; letter-spacing: -.04em; line-height: 1.05; }
.hnn-kr__preis em { font-style: normal; font-size: 13px; color: var(--hnn-grau); }
.hnn-kr__los { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--hnn-tinte); color: #fff; font-size: 18px; transition: background .2s, transform .25s; }
.hnn-kr__modelle a:hover .hnn-kr__los { background: var(--hnn-rot); transform: translateX(3px); }
@media (max-width: 720px) { .hnn-kr__modelle a { grid-template-columns: 84px minmax(0, 1fr); } .hnn-kr__preis { grid-column: 1 / -1; justify-items: start; text-align: left; } .hnn-kr__los { display: none; } .hnn-ff__sort { margin-left: 0; } }
.hnn-ff [hidden], .hnn-kr__nichts[hidden] { display: none !important; }

/* Reifenschritt: Größe, Saison, Preisklasse und Marke in einer Leiste */
.hnn-reifenleiste { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin: 0 0 20px; }
.hnn-reifenleiste > .hnn-gw, .hnn-reifenleiste > .hnn-bud { display: contents; }

/* Felgenliste: Farbpunkte auf der Karte + Auswahl-Dialog */
.hnn-kr__sws { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 2px; }
.hnn-kr__sws:empty { display: none; }
.hnn-kr__sws i { width: 20px; height: 20px; border-radius: 50%; background: var(--sw, #999); box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(10, 10, 10, .22); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.hnn-kr__sws i:hover { transform: scale(1.15); }
.hnn-kr__sws i.is-aktiv { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--hnn-tinte); }
.hnn-kr__bild img { transition: opacity .15s; }
dialog.hnn-wahl { width: min(760px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 30px; background: #fff; color: var(--hnn-tinte); box-shadow: 0 40px 90px -30px rgba(10, 10, 10, .55); overflow: auto; }
dialog.hnn-wahl::backdrop { background: rgba(10, 10, 10, .5); backdrop-filter: blur(3px); }
.hnn-wahl__kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 26px 28px 8px; }
.hnn-wahl__kopf small { font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-wahl__kopf h2 { margin: 2px 0 0; }
.hnn-wahl__zu { width: 40px; height: 40px; flex: none; border: 1px solid rgba(10, 10, 10, .12); border-radius: 50%; background: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
.hnn-wahl__zu:hover { border-color: var(--hnn-tinte); }
.hnn-wahl__inhalt { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; padding: 8px 28px 20px; align-items: center; }
.hnn-wahl__bild { aspect-ratio: 1; display: grid; place-items: center; background: #f4f4f1; border-radius: 24px; padding: 14px; }
.hnn-wahl__bild img { max-width: 100%; max-height: 100%; object-fit: contain; }
.hnn-wahl__block { margin: 0 0 18px; }
.hnn-wahl__label { margin: 0 0 8px; font-family: var(--hnn-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-wahl__label b { color: var(--hnn-tinte); text-transform: none; letter-spacing: 0; font-weight: 600; margin-left: 6px; }
.hnn-wahl__zolle, .hnn-wahl__farben { display: flex; flex-wrap: wrap; gap: 8px; }
.hnn-wahl__zoll { display: grid; gap: 1px; padding: 9px 16px 10px; text-align: left; background: #fff; border: 1px solid rgba(10, 10, 10, .14); border-radius: 18px; cursor: pointer; font: inherit; color: var(--hnn-tinte); transition: border-color .15s, background .15s; }
.hnn-wahl__zoll b { font-size: 16px; font-weight: 600; }
.hnn-wahl__zoll small { font-family: var(--hnn-mono); font-size: 11px; color: var(--hnn-grau-2); }
.hnn-wahl__zoll:hover:not(:disabled) { border-color: var(--hnn-tinte); }
.hnn-wahl__zoll.is-aktiv { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff; }
.hnn-wahl__zoll.is-aktiv small { color: rgba(255, 255, 255, .72); }
.hnn-wahl__zoll:disabled, .hnn-wahl__farben .hnn-ff__sw:disabled { opacity: .35; cursor: not-allowed; }
.hnn-wahl__zoll:disabled { background: #f4f4f1; text-decoration: line-through; }
.hnn-wahl__farben .hnn-ff__sw { width: 32px; height: 32px; }
.hnn-wahl__farben .hnn-ff__sw:disabled { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(10, 10, 10, .15); position: relative; }
.hnn-wahl__hinweis { margin: 0; }
.hnn-wahl__fuss { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 28px 26px; border-top: 1px solid rgba(10, 10, 10, .08); }
.hnn-wahl__preis { display: grid; }
.hnn-wahl__preis small { font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2); }
.hnn-wahl__preis b { font-family: var(--hnn-mono); font-size: 26px; font-weight: 600; }
.hnn-wahl__preis em { font-style: normal; font-size: 12.5px; color: var(--hnn-grau-2); }
.hnn-wahl__weiter { width: auto; text-decoration: none !important; }
@media (max-width: 640px) {
  .hnn-wahl__inhalt { grid-template-columns: 1fr; }
  .hnn-wahl__bild { aspect-ratio: 16 / 10; }
  .hnn-wahl__weiter { width: 100%; justify-content: space-between; }
}

/* Statusicons an Farbpunkten: eintragungsfrei (Haken) / mit Eintragung (Gutachten) */
.hnn-kr__sws i, .hnn-wahl__farben .hnn-ff__sw { position: relative; }
.hnn-kr__sws { gap: 10px; }
.hnn-st-b { position: absolute; right: -5px; bottom: -5px; width: 13px; height: 13px; display: grid; place-items: center; border-radius: 50%; box-shadow: 0 0 0 1.5px #fff; text-decoration: none; }
.hnn-st-b svg { width: 9px; height: 9px; }
.hnn-st-b--frei, .hnn-st-t--frei { background: #1f9d55; }
.hnn-st-b--eintrag, .hnn-st-t--eintrag { background: #d98a1c; }
.hnn-wahl__farben .hnn-st-b { width: 16px; height: 16px; right: -5px; bottom: -5px; }
.hnn-wahl__farben .hnn-st-b svg { width: 11px; height: 11px; }
.hnn-wahl__farben { gap: 12px; }
.hnn-st-t { display: inline-grid; place-items: center; width: 14px; height: 14px; border-radius: 50%; margin-right: 5px; vertical-align: -3px; }
.hnn-st-t svg { width: 10px; height: 10px; }

/* ── Einheitliche Filterleisten (Felgen + Reifen): gleiche Höhe, Pillenform, Rand ── */
.hnn-reifenleiste, .hnn-ff { --ctl: 48px; --ctl-rand: 1px solid rgba(10, 10, 10, .12); gap: 12px; align-items: center; }
.hnn-ff { gap: 12px; margin: 0 0 18px; }
.hnn-reifenleiste .hnn-gd summary,
.hnn-reifenleiste .hnn-bud__stufen a,
.hnn-ff__gruppe { box-sizing: border-box; height: var(--ctl); border: var(--ctl-rand); border-radius: 999px; background: #fff; }
.hnn-reifenleiste .hnn-gd summary { padding: 0 18px; gap: 10px; }
.hnn-reifenleiste .hnn-gd summary:hover, .hnn-reifenleiste .hnn-gd[open] summary,
.hnn-reifenleiste .hnn-bud__stufen a:hover { border-color: var(--hnn-tinte); }
/* Segment (Saison, Sortierung) */
.hnn-reifenleiste .hnn-seg, .hnn-ff .hnn-seg { box-sizing: border-box; height: var(--ctl); padding: 4px; gap: 2px; flex-wrap: nowrap; align-items: stretch; background: rgba(10, 10, 10, .06); border: 1px solid transparent; }
.hnn-reifenleiste .hnn-seg a, .hnn-ff .hnn-seg button { display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; line-height: 1; white-space: nowrap; }
.hnn-ff__sort { margin-left: auto; }
/* Preisklassen: Name und Preis in einer Zeile */
.hnn-reifenleiste .hnn-bud__stufen { gap: 8px; flex-wrap: wrap; }
.hnn-reifenleiste .hnn-bud__stufen a { display: inline-flex; align-items: center; gap: 10px; padding: 0 18px; white-space: nowrap; }
.hnn-reifenleiste .hnn-bud__stufen a b { font-size: 14px; font-weight: 600; line-height: 1; }
.hnn-reifenleiste .hnn-bud__stufen a small { font-size: 12px; line-height: 1; }
/* Filtergruppen der Felgenliste als Pillen */
.hnn-ff__gruppe { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: 8px; padding: 0 8px 0 18px; }
.hnn-ff__gruppe:has(.hnn-ff__sw) { padding-right: 18px; gap: 12px; }
.hnn-ff__label { margin: 0 4px 0 0; white-space: nowrap; }
.hnn-ff .hnn-chip { box-sizing: border-box; height: 34px; min-width: 46px; padding: 0 12px; border: 0; border-radius: 999px; background: rgba(10, 10, 10, .06); color: var(--hnn-tinte); font-family: var(--hnn-mono); font-size: 13px; cursor: pointer; transition: background .15s, color .15s; }
.hnn-ff .hnn-chip:hover { background: rgba(10, 10, 10, .12); }
.hnn-ff .hnn-chip.is-aktiv { background: var(--hnn-tinte); color: #fff; }
.hnn-ff__sw { width: 24px; height: 24px; }
.hnn-ff__reset { height: var(--ctl); display: inline-flex; align-items: center; padding: 0 6px; }
.hnn-ff__reset[hidden] { display: none; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .hnn-ff__sort { margin-left: 0; }
}
@media (max-width: 640px) {
  .hnn-reifenleiste, .hnn-ff { gap: 10px; }
  .hnn-reifenleiste > .hnn-gw, .hnn-reifenleiste > .hnn-bud { display: contents; }
  .hnn-reifenleiste .hnn-gd, .hnn-reifenleiste .hnn-gd summary { width: 100%; box-sizing: border-box; }
  .hnn-reifenleiste .hnn-gd summary { justify-content: flex-start; }
  .hnn-reifenleiste .hnn-gd__pfeil { margin-left: auto; }
  .hnn-reifenleiste .hnn-seg { width: 100%; overflow-x: auto; scrollbar-width: none; }
  .hnn-reifenleiste .hnn-seg::-webkit-scrollbar { display: none; }
  .hnn-reifenleiste .hnn-seg a { flex: 1 0 auto; padding: 0 14px; }
  .hnn-reifenleiste .hnn-bud__stufen { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .hnn-reifenleiste .hnn-bud__stufen a { justify-content: center; padding: 0 10px; gap: 8px; min-width: 0; }
  .hnn-reifenleiste .hnn-bud__stufen a small { font-size: 11px; }
  .hnn-ff__gruppe { width: 100%; flex-wrap: wrap; height: auto; min-height: var(--ctl); padding: 7px 14px; border-radius: 26px; box-sizing: border-box; }
  .hnn-ff .hnn-seg { width: 100%; }
  .hnn-ff .hnn-seg button { flex: 1; padding: 0 8px; }
  .hnn-ff__reset { width: 100%; justify-content: center; }
}
@media (max-width: 380px) {
  .hnn-reifenleiste .hnn-bud__stufen a { flex-direction: column; gap: 2px; height: auto; min-height: var(--ctl); padding: 6px 8px; }
}
.hnn-reifenleiste .hnn-bud__stufen a.is-aktuell { background: var(--hnn-tinte); border-color: var(--hnn-tinte); color: #fff !important; }
.hnn-reifenleiste .hnn-bud__stufen a.is-aktuell small { color: rgba(255, 255, 255, .72); }

/* Reifenleiste: kompakt, damit alles in eine Zeile passt */
.hnn-reifenleiste { gap: 10px; flex-wrap: wrap; }
.hnn-reifenleiste .hnn-gd summary { padding: 0 14px; gap: 8px; }
.hnn-reifenleiste .hnn-seg a { padding: 0 13px; font-size: 13.5px; }
.hnn-reifenleiste .hnn-bud__stufen { flex-wrap: nowrap; gap: 6px; }
.hnn-reifenleiste .hnn-bud__stufen a { padding: 0 14px; gap: 8px; }
.hnn-reifenleiste .hnn-bud__stufen a small { font-size: 11.5px; }
@media (min-width: 1200px) { .hnn-reifenleiste { flex-wrap: nowrap; } .hnn-reifenleiste .hnn-gd, .hnn-reifenleiste .hnn-seg, .hnn-reifenleiste .hnn-bud__stufen { flex: 0 0 auto; } .hnn-reifenleiste .hnn-bud__marke { margin-left: auto; } }
@media (max-width: 640px) { .hnn-reifenleiste .hnn-bud__stufen { display: grid; flex-wrap: wrap; } }
@media (min-width: 1200px) and (max-width: 1360px) {
  .hnn-reifenleiste { gap: 8px; }
  .hnn-reifenleiste .hnn-seg a { padding: 0 10px; }
  .hnn-reifenleiste .hnn-bud__stufen a { padding: 0 11px; gap: 6px; }
  .hnn-reifenleiste .hnn-gd summary { padding: 0 12px; }
}

/* Reifenschritt: Standardempfehlung */
.hnn-rl__abschnitt { margin: 22px 0 8px; }
.hnn-rl__abschnitt h3 { margin: 0 0 2px; font-size: 20px; }
.hnn-rl__abschnitt p { margin: 0; font-size: 13.5px; color: var(--hnn-grau-2, #6b6b6b); }
.hnn-rl__abschnitt--rest { margin-top: 28px; }
.hnn-rl__etikett { display: block; width: fit-content; justify-self: start; align-self: start; margin: 0 0 6px; padding: 3px 10px; border-radius: 999px; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; background: rgba(10, 10, 10, .07); color: #333; }
.hnn-rl__etikett--budget { background: #e6f4ea; color: #1b6b3a; }
.hnn-rl__etikett--mittel { background: #e8eefc; color: #274a9c; }
.hnn-rl__etikett--premium { background: #f6ecd6; color: #7a5710; }

/* Fahrzeugsuche: Markenlogos im Dropdown (Startseite) */
.af-dd__logo { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #fff; overflow: hidden; font-family: var(--hnn-mono, monospace); font-size: 12px; color: #777; margin-right: 12px; box-shadow: inset 0 0 0 1px rgba(10, 10, 10, .08); }
.af-dd__logo img { width: 22px; height: 22px; object-fit: contain; display: block; }
.af-dd__opt:has(.af-dd__logo) { align-items: center; }
.af-dd__logo--btn { width: 24px; height: 24px; border-radius: 7px; margin-right: 10px; }
.af-dd__logo--btn img { width: 18px; height: 18px; }
.af-dd__wert.hat-logo { display: flex; align-items: center; -webkit-line-clamp: unset; line-clamp: unset; }
.af-dd__wertname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ═════════ Responsive-Durchgang 10.11.2026 ═════════ */
/* Kopfband: Zusage kürzen statt abschneiden, Telefon bleibt tippbar */
@media (max-width: 560px) {
  body.hnn-glass .hnn-strip__inner { gap: 8px; }
  body.hnn-glass .hnn-strip__item { font-size: 10.5px; letter-spacing: .04em; }
  body.hnn-glass .hnn-strip__item--mark { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.hnn-glass .hnn-strip__fill { display: none; }
  body.hnn-glass .hnn-strip a[href^="tel"] { flex: none; white-space: nowrap; }
}
/* Kopf auf kleinen Telefonen: alles passt in 320 px */
@media (max-width: 380px) {
  .af-header__inner { gap: 4px !important; }
  .af-header__inner .af-iconbtn { width: 36px; height: 36px; }
  .af-header__inner .hnn-head-cta { width: 40px; height: 40px; min-width: 0; padding: 0; }
  .af-header__inner .hnn-logo, .af-header__inner .af-logo, .af-header__inner a[rel="home"] { max-width: 96px; min-width: 0; }
  .af-header__inner a[rel="home"] img { max-width: 100%; height: auto; }
}
/* Felgenübersicht: Größenfilter bricht um statt die Seite zu verbreitern */
.hnn-uebersicht .hnn-chips--zoll { flex: 0 1 auto; max-width: 100%; flex-wrap: wrap; }
@media (max-width: 720px) { .hnn-uebersicht .hnn-chips--zoll { flex: 1 1 100%; } }
/* Marken-Dropdown: bündig zur rechten Kante, nie breiter als der Bildschirm */
.hnn-bud__marke .hnn-gd__liste { left: auto; right: 0; min-width: 0; width: min(380px, calc(100vw - 32px)); }
@media (max-width: 900px) { .hnn-reifenleiste .hnn-gd .hnn-gd__liste { min-width: 0; width: min(420px, calc(100vw - 32px)); } }
/* Touch: größere Trefferflächen für kleine Schalter */
@media (pointer: coarse) {
  .hnn-ff__sw, .hnn-kr__sws i, .hnn-hero__punkt { position: relative; }
  .hnn-ff__sw::after, .hnn-kr__sws i::after, .hnn-hero__punkt::after { content: ''; position: absolute; inset: -9px; }
  .hnn-kr__sws { gap: 14px; }
}
@media (max-width: 560px) {
  body.hnn .hnn-strip__inner { gap: 8px; }
  body.hnn .hnn-strip__item { font-size: 10.5px; letter-spacing: .04em; }
  body.hnn .hnn-strip__item--mark { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.hnn .hnn-strip__fill { display: none; }
  body.hnn .hnn-strip a[href^="tel"] { flex: none; white-space: nowrap; }
}
@media (max-width: 380px) {
  body.hnn .wlf-container.af-header__inner { gap: 6px !important; padding-left: 12px !important; padding-right: 8px !important; }
  body.hnn .af-header__tools { gap: 0; }
  body.hnn .af-header__tools .af-iconbtn { width: 34px; height: 34px; }
  body.hnn .hnn-btn--head.hnn-head-cta { width: 40px; min-width: 0; padding-inline: 0; justify-content: center; }
  body.hnn .af-header__brand, body.hnn .wlf-site-header__brand { min-width: 0; }
}
@media (max-width: 340px) { body.hnn .af-header__tools .af-garage { display: none; } }

/* Aktionspreise per Link-Gutschein */
.af-aktion__alt { color: var(--hnn-grau-2, #8a8a8a); font-weight: 400; text-decoration: line-through; text-decoration-thickness: 1px; margin-right: 4px; }
.af-aktion__neu { text-decoration: none; background: none; color: var(--hnn-rot-text, #d52b10); font-weight: inherit; }
.hnn-pdp2__satzpreis--aktion .af-aktion__alt { font-size: .55em; }
.hnn-kr__preis .af-aktion__alt { font-family: var(--hnn-mono); font-size: 14px; letter-spacing: 0; }
.hnn-wahl__preis .af-aktion__alt { font-family: var(--hnn-mono); font-size: 14px; }
.wlf-model-card__satzpreis .af-aktion__alt { font-size: 12px; color: var(--hnn-grau, #6b6b6b); }
.wlf-model-card__satzpreis strong.af-aktion__neu, .hnn-kr__preis b { color: inherit; }
.hnn-pdp2__satzpreis--aktion .af-aktion__neu, .wlf-model-card__satzpreis strong.af-aktion__neu { color: var(--hnn-rot-text, #d52b10); }
.af-aktion__badge { display: inline-block; padding: 2px 9px; border-radius: 999px; background: color-mix(in srgb, var(--hnn-rot-text, #d52b10) 14%, transparent); color: var(--hnn-rot-text, #d52b10); font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.af-paket__teile .af-aktion__alt { font-size: .9em; }
.hnn-strip__item--aktion { display: inline-flex; align-items: center; gap: 9px; min-width: 0; overflow: hidden; padding: 3px 14px 3px 4px; border-radius: 999px; background: var(--hnn-rot-text, #d52b10); color: #fff !important; font-weight: 600; }
.hnn-strip__item--aktion b { flex: none; padding: 2px 9px; border-radius: 999px; background: rgba(255, 255, 255, .22); color: #fff; font-weight: 600; letter-spacing: .1em; }
.hnn-strip__item--aktion span { overflow: hidden; text-overflow: ellipsis; }
.hnn-strip__item--mark ~ .hnn-strip__item--aktion ~ .hnn-strip__item--wide:not(a) { display: none; }
.af-paket__teile li em .af-aktion__alt { margin: 0; font-size: .85em; }

.af-testhinweis { position: fixed; left: 16px; bottom: 16px; z-index: 60; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; max-width: calc(100vw - 96px); padding: 8px 8px 8px 12px; border: 1px solid rgba(10, 10, 10, .08); border-radius: 999px; background: rgba(255, 255, 255, .9); backdrop-filter: blur(10px); box-shadow: 0 10px 30px -18px rgba(10, 10, 10, .5); font-size: 12px; line-height: 1.3; color: var(--hnn-grau, #555); }
.af-testhinweis__tag { padding: 2px 8px; border-radius: 999px; background: rgba(10, 10, 10, .07); font-family: var(--hnn-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-tinte, #0a0a0a); }
.af-testhinweis__link { padding: 5px 12px; border-radius: 999px; background: var(--hnn-tinte, #0a0a0a); color: #fff; font-weight: 600; text-decoration: none; white-space: nowrap; }
.af-testhinweis__link:hover { background: var(--hnn-rot, #ff3b1f); color: #fff; }
@media (max-width: 600px) { .af-testhinweis { left: 10px; bottom: 10px; border-radius: 18px; } }

/* ---- Warenkorb: Zeilen als Karten, Menge unter dem Produkt ---- */
body.hnn-woo.woocommerce-cart table.cart thead { display: none; }
body.hnn-woo.woocommerce-cart table.cart, body.hnn-woo.woocommerce-cart table.cart tbody { display: block; width: 100%; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item {
  display: grid; align-items: start; gap: 12px 16px; padding: 22px 0;
  grid-template-columns: 96px minmax(0, 1fr) auto auto;
  grid-template-areas: "thumb name name remove" "thumb qty price sub";
  border-top: 1px solid rgba(10, 10, 10, .08);
}
body.hnn-woo.woocommerce-cart table.cart tr.cart_item:first-child { border-top: 0; padding-top: 4px; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item > td { display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; text-align: left; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item > td::before { content: none !important; display: none !important; }
body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail { grid-area: thumb; }
body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail img, body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail .af-leerbild { width: 96px; height: 96px; border-radius: 20px; }
body.hnn-woo.woocommerce-cart table.cart td.product-name { grid-area: name; min-width: 0; }
body.hnn-woo.woocommerce-cart table.cart td.product-remove { grid-area: remove; justify-self: end; }
body.hnn-woo.woocommerce-cart table.cart td.product-quantity { grid-area: qty; align-self: center; }
body.hnn-woo.woocommerce-cart table.cart td.product-price { grid-area: price; align-self: center; text-align: right; color: var(--hnn-grau, #555); font-size: 13.5px; }
body.hnn-woo.woocommerce-cart table.cart td.product-subtotal { grid-area: sub; align-self: center; text-align: right; font-weight: 600; }
body.hnn-woo.woocommerce-cart table.cart td.product-price .af-aktion__alt, body.hnn-woo.woocommerce-cart table.cart td.product-subtotal .af-aktion__alt { display: block; margin: 0; font-size: 12px; font-weight: 400; }
body.hnn-woo.woocommerce-cart table.cart td.product-subtotal ins { display: block; }
body.hnn-woo.woocommerce-cart table.cart tr:not(.cart_item), body.hnn-woo.woocommerce-cart table.cart tr:not(.cart_item) > td { display: block; width: 100%; }
body.hnn-woo.woocommerce-cart table.cart .af-paket__teile { margin-top: 12px; }
body.hnn-woo.woocommerce-cart table.cart .af-paket__teile li { padding: 8px 0; }
body.hnn-woo .af-paket__teile li em { display: flex; align-items: baseline; justify-content: flex-end; gap: 8px; }
body.hnn-woo .af-paket__teile li em .af-aktion__alt { margin: 0; font-size: .85em; }
@media (max-width: 600px) {
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "thumb remove" "name name" "qty sub"; gap: 14px 12px; }
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item > td.product-price { display: none !important; }
  body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail img, body.hnn-woo.woocommerce-cart table.cart td.product-thumbnail .af-leerbild { width: 80px; height: 80px; }
  body.hnn-woo.woocommerce-cart table.cart td.product-subtotal { font-size: 16px; }
}

/* Paketzeile: Preis je Satz entfällt, die Zwischensumme genügt (Menge steht links davon) */
body.hnn-woo.woocommerce-cart table.cart tr.af-paket > td.product-price { display: none !important; }
body.hnn-woo.woocommerce-cart table.cart tr.af-paket { grid-template-areas: "thumb name name remove" "thumb qty sub sub"; }
@media (max-width: 600px) { body.hnn-woo.woocommerce-cart table.cart tr.af-paket { grid-template-areas: "thumb remove" "name name" "qty sub"; } }

/* Kasse: Paketzeile über die volle Breite, Summe darunter */
body.hnn-woo #order_review table.shop_table tr.af-paket > td { padding: 14px 0 !important; }
body.hnn-woo #order_review .af-paket__summe { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 10px 0 0; padding-top: 10px; border-top: 1px solid rgba(10, 10, 10, .12); font-size: 13px; color: var(--hnn-grau, #555); }
body.hnn-woo #order_review .af-paket__summe b { font-family: var(--hnn-mono); font-size: 15px; color: var(--hnn-tinte, #0a0a0a); }
body.hnn-woo #order_review table.shop_table { table-layout: fixed; width: 100%; }
body.hnn-woo #order_review .af-paket__teile li span { overflow-wrap: anywhere; }
@media (max-width: 768px) {
  body.hnn-woo #order_review table.shop_table tr.af-paket > td.product-name { display: block !important; width: 100% !important; text-align: left; }
  body.hnn-woo #order_review table.shop_table tr.af-paket > td.product-name::before { content: none !important; display: none !important; }
}
body.hnn-woo.woocommerce-cart table.cart tr.cart_item > td.product-name, body.hnn-woo.woocommerce-cart table.cart tr.cart_item > td.product-name > * { text-align: left !important; }

/* ══ Paketkarte (Komplettrad / Felgen-Satz): Warenkorb ══ */
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket {
  grid-template-columns: 104px minmax(0, 1fr) auto;
  grid-template-areas: "thumb marke remove" "thumb title remove" "parts parts parts" "qty qty sub";
  gap: 6px 18px; padding: 26px 0; align-items: center;
}
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket > td.product-name { display: contents !important; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket td.product-thumbnail { align-self: start; grid-row: 1 / span 2; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket td.product-thumbnail img { width: 104px; height: 104px; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket .af-paket__marke { grid-area: marke; align-self: end; justify-self: start; margin: 0; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket td.product-name > a { grid-area: title; align-self: start; font-size: 19px; line-height: 1.25; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket .af-paket__teile { grid-area: parts; display: block; margin: 16px 0 8px; padding: 4px 20px; background: #f6f6f4; border-radius: 20px; font-size: 14px; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket .af-paket__teile li { border-top: 1px solid rgba(10, 10, 10, .07); padding: 12px 0; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket .af-paket__teile li:first-child { border-top: 0; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket > td.product-quantity { display: flex !important; align-items: center; gap: 12px; }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket > td.product-quantity::before { content: 'Sätze'; display: inline !important; font-family: var(--hnn-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--hnn-grau-2, #888); }
body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket > td.product-subtotal { font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
@media (max-width: 600px) {
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "thumb remove" "marke marke" "title title" "parts parts" "qty sub"; row-gap: 8px; }
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket td.product-thumbnail { grid-row: auto; }
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket td.product-thumbnail img { width: 84px; height: 84px; }
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket .af-paket__teile { padding: 2px 14px; margin: 8px 0 6px; font-size: 13px; }
  body.hnn-woo.woocommerce-cart table.cart tr.cart_item.af-paket > td.product-subtotal { font-size: 19px; }
}
/* Kasse: gleiche Teileliste wie im Warenkorb */
body.hnn-woo #order_review .af-paket__teile { margin: 14px 0 0; padding: 2px 14px; background: #f6f6f4; border-radius: 16px; }
body.hnn-woo #order_review .af-paket__teile li { border-top: 1px solid rgba(10, 10, 10, .07); padding: 10px 0; }
body.hnn-woo #order_review .af-paket__teile li:first-child { border-top: 0; }
body.hnn-woo #order_review .af-paket__summe { margin-top: 12px; }

/* Minicart: Gutschein und Summe */
.af-mini-cart__rabatt { color: var(--hnn-rot-text, #d52b10); font-size: .92em; }
.af-mini-cart__summe { padding-top: 8px; border-top: 1px solid rgba(10, 10, 10, .12); }
.af-mini-cart__summe strong { font-size: 1.1em; }
.af-mini-cart .af-paket__teile { padding: 2px 12px; background: #f6f6f4; border-radius: 14px; }
.af-mini-cart .af-paket__teile li:first-child { border-top: 0 !important; }

/* Produktseite: Komplettrad-Konfigurator unter „In den Warenkorb“ */
.hnn-pdp2__komplett { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; padding: 12px 14px 12px 24px; border: 1.5px solid var(--hnn-tinte, #0a0a0a); border-radius: 999px; background: transparent; color: var(--hnn-tinte, #0a0a0a); text-decoration: none; transition: background .2s, color .2s; }
.hnn-pdp2__komplett span { display: grid; gap: 1px; min-width: 0; }
.hnn-pdp2__komplett b { font-size: 15px; font-weight: 600; }
.hnn-pdp2__komplett small { font-size: 12px; font-weight: 400; color: var(--hnn-grau, #666); line-height: 1.3; }
.hnn-pdp2__komplett i { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--hnn-tinte, #0a0a0a); color: #fff; font-style: normal; transition: background .2s; }
.hnn-pdp2__komplett:hover { background: var(--hnn-tinte, #0a0a0a); color: #fff; }
.hnn-pdp2__komplett:hover small { color: rgba(255, 255, 255, .72); }
.hnn-pdp2__komplett:hover i { background: var(--hnn-rot, #ff3b1f); }
@media (max-width: 600px) { .hnn-pdp2__komplett { padding-left: 18px; } .hnn-pdp2__komplett small { font-size: 11.5px; } }
.hnn-pdp2__kauf .hnn-pdp2__komplett, .hnn-pdp2__kauf .hnn-pdp2__komplett b { color: var(--hnn-tinte, #0a0a0a); }
.hnn-pdp2__kauf .hnn-pdp2__komplett:hover, .hnn-pdp2__kauf .hnn-pdp2__komplett:hover b { color: #fff; }
.hnn-pdp2__kauf .hnn-pdp2__komplett small { color: var(--hnn-grau, #666); }
.hnn-pdp2__kauf .hnn-pdp2__komplett:hover small { color: rgba(255, 255, 255, .72); }

/* Hinweis „nur Einzelfelgen“ (weniger als 4 Stück in jeder Farbe) */
.wlf-model-card__einzeln { display: flex; align-items: center; gap: 7px; margin-top: 6px; font-size: 12px; line-height: 1.3; color: var(--hnn-grau, #666); }
.wlf-model-card__einzeln i { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #e0a020; box-shadow: 0 0 0 3px rgba(224, 160, 32, .2); }

/* Konfigurator: Modelle ohne Satz-Bestand nennen */
.hnn-kr__ohnesatz { display: flex; align-items: flex-start; gap: 10px; margin: 18px 4px 0; font-size: 13px; line-height: 1.45; color: var(--hnn-grau, #666); }
.hnn-kr__ohnesatz i { flex: none; width: 7px; height: 7px; margin-top: 6px; border-radius: 50%; background: #e0a020; box-shadow: 0 0 0 3px rgba(224, 160, 32, .2); }
/* Produktseite: Satz-Knopf bei zu wenig Bestand */
.hnn-menge button:disabled { opacity: .4; cursor: not-allowed; }

.hnn-strip__item--aktion span { color: #fff; }
@media (max-width: 979px) {
  .hnn-strip__item--mark:has(+ .hnn-strip__item--aktion) { display: none; }
  .hnn-strip__item--aktion { flex: 1 1 auto; max-width: calc(100% - 140px); }
}

/* ==========================================================================
   13.11.26 · Modellkarten: gleiche Ausrichtung in jeder Kartenhöhe, Einzelfelgen-Link
   Vorher stand der Text mittig im Fuß der Karte: bei unterschiedlich langem Inhalt (Farbwahl,
   Hinweis) begannen Marke und Titel auf anderer Höhe. Jetzt: oben bündig, Pfeil unten rechts.
   ========================================================================== */
body.hnn-glass .wlf-model-grid { align-items: stretch; }
body.hnn-glass .wlf-model-card { display: flex; flex-direction: column; }
body.hnn-glass .wlf-model-card__link { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 100%; }
body.hnn-glass .wlf-model-card__media { flex: none; }
body.hnn-glass .wlf-model-card__body { flex: 1 1 auto; align-items: flex-end !important; padding: 0 14px 14px 0 !important; }
body.hnn-glass .wlf-model-card__body::after { align-self: flex-end !important; margin-top: auto; }
body.hnn-glass .wlf-model-card__row { align-self: stretch; display: flex; flex-direction: column; justify-content: flex-start; padding: 16px 6px 12px 22px !important; }
body.hnn-glass .wlf-model-card__main { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
body.hnn-glass .wlf-model-card__marke { margin: 0; }
body.hnn-glass .wlf-model-card__title { margin: 0; }
body.hnn-glass .wlf-model-card__satzpreis { margin-top: 4px; }
body.hnn-glass .wlf-model-card__einzeln { margin-top: 2px; max-width: 26ch; }
/* Der Übersichtsbereich ist ein Flex-Container mit festen order-Werten (Filter 1, Zoll 2, Raster 3).
   Ohne eigene Position landete der Link ganz vorn neben den Filtern (13.11.26): jetzt unter dem Raster. */
.hnn-uebersicht .wlf-model-grid__einzel { order: 4; flex: 0 0 100%; width: 100%; margin: 4px 0 0; text-align: center; font-size: 13px; line-height: 1.4; }
.hnn-uebersicht .wlf-model-grid__einzel a { color: var(--hnn-grau, #6b6b66); text-decoration: underline; text-decoration-color: rgba(10, 10, 10, .25); text-underline-offset: 3px; }
.hnn-uebersicht .wlf-model-grid__einzel a:hover, .hnn-uebersicht .wlf-model-grid__einzel a:focus-visible { color: #0a0a0a; text-decoration-color: currentColor; }

/* 13.11.26: Zollgröße im Produkttitel (UA25 19 Zoll) — gleiche Zeile, ruhiger als der Modellname. */
.hnn-pdp2__titel .hnn-pdp2__zoll { font-size: .42em; font-weight: 500; letter-spacing: 0; color: var(--hnn-grau, #6b6b66); white-space: nowrap; vertical-align: .32em; margin-left: .18em; }

/* 13.11.26: Hinweis, wenn die Größe aus der Adresse in der aktuellen Auswahl fehlt — nach den Zoll-Chips, vor dem Raster. */
.hnn-uebersicht .hnn-zoll-hinweis { order: 2; flex: 0 0 100%; width: 100%; margin: 0; font-size: 13px; line-height: 1.4; color: var(--hnn-grau, #6b6b66); }

/* 13.11.26: Land für Privatkunden ausgeblendet (Wert DE bleibt im Formular), siehe af_land_ausblenden(). */
.woocommerce .af-feld-aus, .woocommerce-checkout .af-feld-aus, .woocommerce-account .af-feld-aus { display: none !important; }