/* ==========================================================================
   Redesign 2026 - Hildebrandt's Auktionshaus
   Tokens, Header, Footer und Startseite nach Figma
   ========================================================================== */

:root {
  --hb-bg-page: #f7f3ec;
  --hb-bg-subtle: #ede6d9;
  --hb-bg-surface: #ffffff;
  --hb-bg-note: #f1e6d6;
  --hb-bg-success: #e3eadf;
  --hb-bg-action: #2e4636;
  --hb-bg-inverse: #1c2a21;

  --hb-text-primary: #1e1d1a;
  --hb-text-secondary: #57534a;
  --hb-text-accent: #8b5a2b;
  --hb-text-action: #2e4636;
  --hb-text-on-action: #f7f3ec;
  --hb-text-success: #2f6b3f;
  --hb-text-ornament: #b08a3e;
  --hb-text-secondary-action: #5a3e2b;
  --hb-text-inverse: #f7f3ec;

  --hb-border-subtle: #d6cdbd;
  --hb-border-strong: #8a8273;
  --hb-border-accent: #8b5a2b;
  --hb-border-ornament: #b08a3e;
  --hb-border-secondary: #5a3e2b;

  --hb-radius-sm: 4px;
  --hb-radius-md: 8px;

  --hb-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --hb-font-sans: "Source Sans 3", "Open Sans", Arial, sans-serif;

  --hb-gutter: 80px;
}

@media (max-width: 991.98px) {
  :root { --hb-gutter: 20px; }
}

/* --------------------------------------------------------------------------
   Grundlagen (nur Startseite: heller Seitenhintergrund statt Foto)
   -------------------------------------------------------------------------- */
body.hb-page-start {
  background-image: none;
  background-color: var(--hb-bg-page);
  font-family: var(--hb-font-sans);
  color: var(--hb-text-primary);
}

.hb-container {
  max-width: 1440px;
  margin: 0 auto;
  padding-left: var(--hb-gutter);
  padding-right: var(--hb-gutter);
}

/* Icons: Lucide-SVGs als Maske, Farbe ueber currentColor */
.hb-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
}
.hb-icon-20 { width: 20px; height: 20px; }
.hb-icon-18 { width: 18px; height: 18px; }
.hb-icon-32 { width: 32px; height: 32px; }
.hb-icon-phone       { -webkit-mask-image: url(/img/redesign/icons/phone.svg);       mask-image: url(/img/redesign/icons/phone.svg); }
.hb-icon-globe       { -webkit-mask-image: url(/img/redesign/icons/globe.svg);       mask-image: url(/img/redesign/icons/globe.svg); }
.hb-icon-bookmark    { -webkit-mask-image: url(/img/redesign/icons/bookmark.svg);    mask-image: url(/img/redesign/icons/bookmark.svg); }
.hb-icon-user        { -webkit-mask-image: url(/img/redesign/icons/user.svg);        mask-image: url(/img/redesign/icons/user.svg); }
.hb-icon-search      { -webkit-mask-image: url(/img/redesign/icons/search.svg);      mask-image: url(/img/redesign/icons/search.svg); }
.hb-icon-menu        { -webkit-mask-image: url(/img/redesign/icons/menu.svg);        mask-image: url(/img/redesign/icons/menu.svg); }
.hb-icon-dot         { -webkit-mask-image: url(/img/redesign/icons/dot.svg);         mask-image: url(/img/redesign/icons/dot.svg); }
.hb-icon-calendar    { -webkit-mask-image: url(/img/redesign/icons/calendar.svg);    mask-image: url(/img/redesign/icons/calendar.svg); }
.hb-icon-clock       { -webkit-mask-image: url(/img/redesign/icons/clock.svg);       mask-image: url(/img/redesign/icons/clock.svg); }
.hb-icon-gavel       { -webkit-mask-image: url(/img/redesign/icons/gavel.svg);       mask-image: url(/img/redesign/icons/gavel.svg); }
.hb-icon-arrow-right { -webkit-mask-image: url(/img/redesign/icons/arrow-right.svg); mask-image: url(/img/redesign/icons/arrow-right.svg); }
.hb-icon-monitor     { -webkit-mask-image: url(/img/redesign/icons/monitor.svg);     mask-image: url(/img/redesign/icons/monitor.svg); }
.hb-icon-percent     { -webkit-mask-image: url(/img/redesign/icons/percent.svg);     mask-image: url(/img/redesign/icons/percent.svg); }
.hb-icon-package     { -webkit-mask-image: url(/img/redesign/icons/package.svg);     mask-image: url(/img/redesign/icons/package.svg); }
.hb-icon-users       { -webkit-mask-image: url(/img/redesign/icons/users.svg);       mask-image: url(/img/redesign/icons/users.svg); }
.hb-icon-info        { -webkit-mask-image: url(/img/redesign/icons/info.svg);        mask-image: url(/img/redesign/icons/info.svg); }
.hb-icon-map-pin     { -webkit-mask-image: url(/img/redesign/icons/map-pin.svg);     mask-image: url(/img/redesign/icons/map-pin.svg); }
.hb-icon-mail        { -webkit-mask-image: url(/img/redesign/icons/mail.svg);        mask-image: url(/img/redesign/icons/mail.svg); }
.hb-icon-facebook    { -webkit-mask-image: url(/img/redesign/icons/facebook.svg);    mask-image: url(/img/redesign/icons/facebook.svg); }

/* Typografie-Bausteine */
.hb-overline {
  font-family: var(--hb-font-sans);
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.96px;
  text-transform: uppercase;
  color: var(--hb-text-accent);
  margin: 0;
}
.hb-h2 {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 34px;
  line-height: 42px;
  color: var(--hb-text-primary);
  margin: 0;
}
.hb-h3 {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 26px;
  line-height: 34px;
  color: var(--hb-text-primary);
  margin: 0;
}
.hb-h4 {
  font-family: var(--hb-font-sans);
  font-weight: 700;
  font-size: 21px;
  line-height: 28px;
  color: var(--hb-text-primary);
  margin: 0;
}
.hb-body-l { font-size: 20px; line-height: 32px; color: var(--hb-text-secondary); margin: 0; }
.hb-body   { font-size: 18px; line-height: 29px; color: var(--hb-text-secondary); margin: 0; }
.hb-small  { font-size: 16px; line-height: 24px; color: var(--hb-text-secondary); margin: 0; }
.hb-text-primary { color: var(--hb-text-primary); }
.hb-strong { font-weight: 600; }
@media (max-width: 991.98px) {
  .hb-h2 { font-size: 28px; line-height: 36px; }
  .hb-h3 { font-size: 22px; line-height: 30px; }
}

/* Links und Buttons */
.hb-link {
  color: var(--hb-text-action);
  font-weight: 600;
  text-decoration: underline;
  text-underline-position: from-font;
}
.hb-link:hover, .hb-link:focus { color: var(--hb-text-action); text-decoration: underline; }

.hb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--hb-font-sans);
  font-weight: 600;
  font-size: 18px;
  line-height: 24px;
  border-radius: var(--hb-radius-sm);
  text-decoration: none;
  border: 0;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.hb-btn:focus { outline: none; box-shadow: 0 0 0 2px var(--hb-bg-page), 0 0 0 4px var(--hb-text-accent); }
.hb-btn-primary {
  background: var(--hb-bg-action);
  color: var(--hb-text-on-action);
  padding: 16px 28px;
}
.hb-btn-primary:hover, .hb-btn-primary:focus { background: #24382b; color: var(--hb-text-on-action); text-decoration: none; }
.hb-btn-secondary {
  background: transparent;
  color: var(--hb-text-secondary-action);
  border: 2px solid var(--hb-border-secondary);
  padding: 14px 26px;
}
.hb-btn-secondary.hb-btn-m { padding: 10px 22px; }
.hb-btn-secondary:hover, .hb-btn-secondary:focus { background: rgba(90, 62, 43, .06); color: var(--hb-text-secondary-action); text-decoration: none; }
.hb-btn-text {
  background: transparent;
  color: var(--hb-text-action);
  padding: 16px 0;
}
.hb-btn-text.hb-btn-m { padding: 12px 0; }
.hb-btn-text:hover, .hb-btn-text:focus { color: var(--hb-text-action); text-decoration: underline; }
.hb-btn-block { display: flex; width: 100%; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.hb-header {
  background: var(--hb-bg-page);
  font-family: var(--hb-font-sans);
  color: var(--hb-text-primary);
}
.hb-servicebar {
  background: var(--hb-bg-subtle);
  padding: 13px 0;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
}
.hb-servicebar .hb-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.hb-service-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--hb-text-primary);
  text-decoration: none;
  white-space: nowrap;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  cursor: pointer;
}
.hb-service-item:hover, .hb-service-item:focus { color: var(--hb-text-primary); text-decoration: none; }
.hb-service-item .hb-muted { color: var(--hb-text-secondary); }
.hb-service-item .hb-phone-number { color: var(--hb-text-action); text-decoration: underline; text-underline-position: from-font; }
.hb-service-links { display: flex; align-items: center; gap: 32px; }
.hb-service-links .dropdown-menu { font-family: var(--hb-font-sans); }

.hb-mainbar {
  border-bottom: 1px solid var(--hb-border-subtle);
  padding-top: 8px;
}
.hb-mainbar .hb-container {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.hb-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 8px;
  text-decoration: none;
  color: var(--hb-text-primary);
}
.hb-logo:hover, .hb-logo:focus { text-decoration: none; color: var(--hb-text-primary); }
.hb-logo img {
  height: 80px;
  width: auto;
  mix-blend-mode: multiply;
}
.hb-wordmark {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 18px;
  line-height: 22px;
  white-space: nowrap;
}
.hb-nav {
  display: flex;
  align-items: flex-end;
  gap: 28px;
}
.hb-nav-item {
  display: inline-flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 13px;
  font-weight: 600;
  font-size: 18px;
  line-height: 24px;
  color: var(--hb-text-primary);
  text-decoration: none;
  white-space: nowrap;
}
.hb-nav-item::after {
  content: "";
  display: block;
  height: 3px;
  width: 100%;
  background: var(--hb-border-accent);
  opacity: 0;
}
.hb-nav-item:hover, .hb-nav-item:focus { color: var(--hb-text-primary); text-decoration: none; }
.hb-nav-item:hover::after { opacity: .4; }
.hb-nav-item.is-active::after { opacity: 1; }
.hb-header-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 16px 11px 12px;
  border: 1.5px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
  background: transparent;
  font-family: var(--hb-font-sans);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-primary);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.hb-header-action:hover, .hb-header-action:focus { color: var(--hb-text-primary); text-decoration: none; background: rgba(0,0,0,.03); }
.hb-nav .hb-header-action { margin-left: 8px; margin-bottom: 8px; }
.hb-mobile-actions { display: none; gap: 8px; }
.hb-nav-account { display: none; }

@media (min-width: 992px) {
  .hb-nav.collapse { display: flex !important; }
}
@media (max-width: 991.98px) {
  .hb-servicebar { display: none; }
  .hb-mainbar { padding: 12px 0; border-bottom: 1px solid var(--hb-border-subtle); }
  .hb-mainbar .hb-container { align-items: center; }
  .hb-logo { padding-bottom: 0; }
  .hb-logo img { height: 56px; }
  .hb-wordmark { display: none; }
  .hb-mobile-actions { display: flex; }
  .hb-nav {
    flex-basis: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 8px 0 16px;
  }
  .hb-nav-item { padding: 12px 0; border-bottom: 1px solid var(--hb-border-subtle); }
  .hb-nav-item::after { display: none; }
  .hb-nav-item.is-active { color: var(--hb-text-accent); }
  .hb-nav .hb-header-action { margin: 16px 0 0; align-self: flex-start; }
  .hb-nav-account { display: flex; flex-direction: column; margin-top: 16px; padding-top: 8px; border-top: 2px solid var(--hb-border-subtle); }
  .hb-nav-account .hb-overline { padding: 8px 0; }
  .hb-nav-account form { margin: 0; }
  .hb-nav-account .hb-nav-item { font-weight: 400; }
  .hb-nav-account button.hb-nav-item { background: none; border: 0; border-bottom: 1px solid var(--hb-border-subtle); width: 100%; text-align: left; font-family: inherit; }
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.hb-footer {
  background: var(--hb-bg-inverse);
  color: var(--hb-text-inverse);
  font-family: var(--hb-font-sans);
  padding: 64px 0 40px;
}
.hb-footer-columns {
  display: flex;
  gap: 48px;
}
.hb-footer-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.hb-footer .hb-overline { color: var(--hb-text-ornament); }
.hb-footer-title {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 22px;
  line-height: 30px;
  margin: 0;
}
.hb-footer p, .hb-footer a { color: var(--hb-text-inverse); font-size: 18px; line-height: 29px; margin: 0; }
.hb-footer a { text-decoration: none; }
.hb-footer a:hover, .hb-footer a:focus { color: var(--hb-text-inverse); text-decoration: underline; }
.hb-footer a.hb-underline { text-decoration: underline; text-underline-position: from-font; }
.hb-footer .hb-small { color: var(--hb-text-inverse); font-size: 16px; line-height: 24px; }
.hb-footer-divider { height: 1px; background: var(--hb-text-inverse); opacity: .25; margin: 48px 0; }
.hb-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.hb-footer-bottom p, .hb-footer-bottom a { font-size: 16px; line-height: 24px; }
.hb-footer-social { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.hb-footer-social a { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 991.98px) {
  .hb-footer { padding: 48px 0 32px; }
  .hb-footer-columns { flex-direction: column; gap: 32px; }
  .hb-footer-divider { margin: 32px 0; }
}

/* --------------------------------------------------------------------------
   Startseite
   -------------------------------------------------------------------------- */
.hb-start { font-family: var(--hb-font-sans); color: var(--hb-text-primary); }
.hb-section { padding: 96px 0; }
.hb-section-flush-top { padding-top: 0; }
.hb-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 48px;
}
.hb-section-header { display: flex; flex-direction: column; gap: 12px; max-width: 760px; }
.hb-brass-line { width: 40px; height: 2px; background: var(--hb-border-ornament); }
.hb-brass-line-sm { width: 32px; }
@media (max-width: 991.98px) {
  .hb-section { padding: 64px 0; }
  .hb-section-head { flex-direction: column; align-items: flex-start; margin-bottom: 24px; }
}

/* Hero */
.hb-hero { padding: 64px 0 96px; }
.hb-hero .hb-container { display: flex; gap: 64px; align-items: flex-start; }
.hb-hero-text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.hb-hero-title {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 56px;
  line-height: 64px;
  color: var(--hb-text-primary);
  margin: 0;
}
.hb-hero-image { flex: 0 0 560px; width: 560px; display: flex; flex-direction: column; gap: 12px; }
.hb-hero-image img {
  width: 100%;
  height: 700px;
  object-fit: cover;
  border-radius: var(--hb-radius-sm);
  display: block;
}
.hb-hero-mobile-image { display: none; }
@media (max-width: 1199.98px) {
  .hb-hero-image { flex-basis: 420px; width: 420px; }
  .hb-hero-image img { height: 560px; }
}
@media (max-width: 991.98px) {
  .hb-hero { padding: 32px 0 48px; }
  .hb-hero .hb-container { flex-direction: column; gap: 20px; }
  .hb-hero-text { gap: 20px; }
  .hb-hero-title { font-size: 38px; line-height: 46px; }
  .hb-hero-image { display: none; }
  .hb-hero-mobile-image { display: block; width: 100%; height: 220px; object-fit: cover; }
}

/* Auction Teaser */
.hb-teaser {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 8px;
}
.hb-teaser-title { font-family: var(--hb-font-serif); font-weight: 600; font-size: 26px; line-height: 34px; margin: 0; }
.hb-facts { display: flex; flex-direction: column; gap: 8px; }
.hb-fact { display: flex; align-items: center; gap: 12px; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-fact .hb-icon { color: var(--hb-text-secondary-action); }
.hb-divider { height: 1px; background: var(--hb-border-subtle); }
.hb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
@media (max-width: 991.98px) {
  .hb-teaser { padding: 24px; margin-top: 0; }
  .hb-teaser-title { font-size: 22px; line-height: 30px; }
}

/* Status Badge */
.hb-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px 4px 10px;
  border-radius: var(--hb-radius-sm);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  background: var(--hb-bg-subtle);
  color: var(--hb-text-secondary);
  white-space: nowrap;
}
.hb-badge-success { background: var(--hb-bg-success); color: var(--hb-text-success); }
.hb-badge-sold { background: var(--hb-bg-note); color: var(--hb-text-secondary-action); }

/* Auf einen Blick */
.hb-facts-bar { background: var(--hb-bg-subtle); padding: 48px 0; }
.hb-facts-bar .hb-container { display: flex; gap: 24px; }
.hb-fact-item { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.hb-fact-item .hb-icon { color: var(--hb-text-secondary-action); }
@media (max-width: 991.98px) {
  .hb-facts-bar { padding: 40px 0; }
  .hb-facts-bar .hb-container { flex-direction: column; gap: 24px; }
}

/* Hinweise aus dem CMS (Seiteninhalt "start") */
.hb-cms {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  font-size: 18px;
  line-height: 29px;
  color: var(--hb-text-secondary);
}
.hb-cms h1, .hb-cms h2, .hb-cms h3 { font-family: var(--hb-font-serif); color: var(--hb-text-primary); margin: 0 0 12px; }
.hb-cms h1 { font-size: 26px; line-height: 34px; }
.hb-cms h2 { font-size: 21px; line-height: 28px; font-family: var(--hb-font-sans); font-weight: 700; margin-top: 16px; }
.hb-cms p:last-child { margin-bottom: 0; }

/* Lot Cards */
.hb-lot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.hb-lot {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
}
.hb-lot-image {
  position: relative;
  aspect-ratio: 408 / 306;
  background: var(--hb-bg-subtle);
  display: block;
}
.hb-lot-image img { width: 100%; height: 100%; object-fit: contain; display: block; }
.hb-lot-image .hb-badge { position: absolute; top: 16px; left: 16px; }
.hb-lot-body { padding: 24px; display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; }
.hb-lot-meta { font-size: 16px; line-height: 24px; color: var(--hb-text-secondary); margin: 0; }
.hb-lot-title {
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--hb-text-primary);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hb-lot-title a { color: inherit; text-decoration: none; }
.hb-lot-title a:hover { text-decoration: underline; color: inherit; }
.hb-prices { display: flex; gap: 16px; }
.hb-price { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hb-price-label { font-size: 16px; line-height: 24px; color: var(--hb-text-secondary); margin: 0; }
.hb-price-value { font-weight: 600; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); margin: 0; white-space: nowrap; }
.hb-price-value-strong { font-weight: 700; font-size: 24px; line-height: 30px; }
.hb-lot-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hb-bidders { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; color: var(--hb-text-secondary); }
.hb-bidders .hb-icon { color: var(--hb-text-secondary-action); }
.hb-merken {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 13px 0;
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-action);
  background: none;
  border: 0;
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
}
.hb-merken:hover, .hb-merken:focus { color: var(--hb-text-action); text-decoration: underline; }
.hb-lot .hb-btn-secondary { margin-top: auto; }
@media (max-width: 991.98px) {
  .hb-lot-grid { grid-template-columns: 1fr; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .hb-lot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Sammelgebiete */
.hb-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-bottom: 48px; }
.hb-category {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: var(--hb-text-primary);
  text-decoration: none;
}
.hb-category:hover, .hb-category:focus { text-decoration: none; color: var(--hb-text-primary); border-color: var(--hb-border-strong); }
.hb-category-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 8px; margin-top: auto; color: var(--hb-text-action); font-weight: 600; font-size: 16px; line-height: 22px; }
.hb-note-box {
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 24px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.hb-note-box-text { display: flex; flex-direction: column; gap: 4px; }
@media (max-width: 991.98px) {
  .hb-category-grid { grid-template-columns: 1fr; margin-bottom: 16px; }
  .hb-category { padding: 24px; }
  .hb-note-box { flex-direction: column; align-items: stretch; padding: 24px; }
  .hb-note-box .hb-btn { width: 100%; }
}

/* So funktioniert's */
.hb-how { background: var(--hb-bg-surface); }
.hb-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-bottom: 48px; }
.hb-step { border-top: 1px solid var(--hb-border-strong); padding-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.hb-step-number { font-family: var(--hb-font-serif); font-weight: 600; font-size: 56px; line-height: 64px; color: var(--hb-text-ornament); margin: 0; }
.hb-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 48px; }
.hb-info-card {
  background: var(--hb-bg-page);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-table { display: flex; flex-direction: column; }
.hb-table-head { display: flex; justify-content: space-between; padding-bottom: 4px; font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-secondary); }
.hb-table-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--hb-border-subtle);
  font-size: 18px;
  line-height: 29px;
  color: var(--hb-text-primary);
}
.hb-table-row span:last-child { font-weight: 600; white-space: nowrap; }
.hb-table-row-total { border-bottom: 0; border-top: 2px solid var(--hb-text-primary); font-weight: 600; }
.hb-table-row-total span:last-child { font-weight: 700; font-size: 21px; line-height: 28px; }
@media (max-width: 991.98px) {
  .hb-steps { grid-template-columns: 1fr; gap: 24px; margin-bottom: 32px; }
  .hb-info-grid { grid-template-columns: 1fr; margin-bottom: 32px; }
  .hb-info-card { padding: 24px; }
}

/* Persoenlich fuer Sie da */
.hb-about { display: flex; gap: 64px; align-items: flex-start; margin-bottom: 48px; }
.hb-about-text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.hb-about-text .hb-section-header { max-width: none; }
.hb-contact-card {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 400px;
  max-width: 100%;
}
.hb-contact-row { display: flex; align-items: flex-start; gap: 12px; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-contact-row .hb-icon { color: var(--hb-text-secondary-action); margin-top: 2px; }
.hb-contact-row a { color: var(--hb-text-action); text-decoration: underline; text-underline-position: from-font; }
.hb-about-image { flex: 0 0 560px; width: 560px; display: flex; flex-direction: column; gap: 12px; }
.hb-about-image img { width: 100%; height: 600px; object-fit: cover; object-position: 60% center; border-radius: var(--hb-radius-sm); display: block; }
.hb-cta-box {
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
}
.hb-cta-text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.hb-cta-actions { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
@media (max-width: 1199.98px) {
  .hb-about-image { flex-basis: 420px; width: 420px; }
  .hb-about-image img { height: 480px; }
}
@media (max-width: 991.98px) {
  .hb-about { flex-direction: column; gap: 24px; margin-bottom: 24px; }
  .hb-about-image { width: 100%; flex-basis: auto; }
  .hb-about-image img { height: 240px; }
  .hb-contact-card { width: 100%; padding: 24px; }
  .hb-cta-box { flex-direction: column; align-items: stretch; padding: 24px; }
  .hb-cta-actions .hb-btn { width: 100%; }
}

/* Zuletzt abgeschlossen */
.hb-auction-list { border-bottom: 1px solid var(--hb-border-subtle); }
.hb-auction-row {
  border-top: 1px solid var(--hb-border-subtle);
  padding: 28px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.hb-auction-info { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
@media (max-width: 991.98px) {
  .hb-auction-row { flex-direction: column; align-items: flex-start; gap: 8px; padding: 20px 0; }
}

/* Leerzustand ohne Auktion */
.hb-empty {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
}

/* ==========================================================================
   Aktuelle Auktion (Figma "Aktuelle Auktion - Uebersicht")
   ========================================================================== */
body.hb-page {
  background-image: none;
  background-color: var(--hb-bg-page);
  font-family: var(--hb-font-sans);
  color: var(--hb-text-primary);
}
.hb-icon-16 { width: 16px; height: 16px; }
.hb-icon-chevron-left  { -webkit-mask-image: url(/img/redesign/icons/chevron-left.svg);  mask-image: url(/img/redesign/icons/chevron-left.svg); }
.hb-icon-chevron-right { -webkit-mask-image: url(/img/redesign/icons/chevron-right.svg); mask-image: url(/img/redesign/icons/chevron-right.svg); }
.hb-icon-help          { -webkit-mask-image: url(/img/redesign/icons/help.svg);          mask-image: url(/img/redesign/icons/help.svg); }
.hb-icon-x             { -webkit-mask-image: url(/img/redesign/icons/x.svg);             mask-image: url(/img/redesign/icons/x.svg); }

.hb-h1 {
  font-family: var(--hb-font-serif);
  font-weight: 600;
  font-size: 44px;
  line-height: 52px;
  color: var(--hb-text-primary);
  margin: 0;
}
.hb-link-plain { color: var(--hb-text-action); text-decoration: underline; text-underline-position: from-font; }
.hb-link-plain:hover, .hb-link-plain:focus { color: var(--hb-text-action); }
.hb-badge-danger { background: #f3e1dc; color: #8a2e22; }

/* Breadcrumb */
.hb-breadcrumb { padding: 8px 0; font-size: 16px; line-height: 24px; }
.hb-breadcrumb .hb-container { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hb-breadcrumb a { color: var(--hb-text-action); text-decoration: none; padding: 12px 0; }
.hb-breadcrumb a:hover { text-decoration: underline; color: var(--hb-text-action); }
.hb-breadcrumb .hb-icon { color: var(--hb-text-secondary); }
.hb-breadcrumb-current { color: var(--hb-text-secondary); padding: 12px 0; }

/* Auktionskopf */
.hb-auction-head { background: var(--hb-bg-subtle); padding: 48px 0; }
.hb-auction-head .hb-container { display: flex; gap: 48px; align-items: flex-start; }
.hb-auction-head-text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.hb-auction-data { display: flex; flex-wrap: wrap; gap: 8px 32px; }
.hb-auction-datum { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-auction-datum .hb-icon { color: var(--hb-text-secondary-action); }
.hb-auction-costs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 18px; line-height: 29px; color: var(--hb-text-secondary); margin: 0; }
.hb-auction-costs .hb-icon { color: var(--hb-text-secondary-action); }
.hb-countdown {
  flex: 0 0 320px;
  width: 320px;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hb-countdown-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-secondary); margin: 0; }
.hb-countdown-value { font-weight: 700; font-size: 24px; line-height: 30px; color: var(--hb-text-primary); margin: 0; }
@media (max-width: 991.98px) {
  .hb-h1 { font-size: 32px; line-height: 40px; }
  .hb-auction-head { padding: 32px 0; }
  .hb-auction-head .hb-container { flex-direction: column; gap: 16px; align-items: stretch; }
  .hb-auction-data { flex-direction: column; gap: 8px; }
  .hb-auction-datum { align-items: flex-start; }
  .hb-auction-datum .hb-icon { margin-top: 2px; }
  .hb-countdown { width: 100%; flex-basis: auto; }
}

/* Inhalt */
.hb-auction-content { padding: 48px 0 96px; }
.hb-auction-content .hb-container { display: flex; flex-direction: column; gap: 32px; }
.hb-notice {
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 20px 24px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.hb-notice > .hb-icon { color: var(--hb-text-secondary-action); margin-top: 2px; }
.hb-notice-content { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-notice-content p { margin: 0; }
.hb-notice-title { font-weight: 600; }
.hb-notice-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding-top: 8px; }
.hb-btn-primary.hb-btn-m { padding: 12px 24px; }

.hb-search { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.hb-search-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-primary); margin: 0; }
.hb-search-row { display: flex; gap: 12px; align-items: stretch; }
.hb-search-field {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  height: 56px;
  padding: 0 16px;
  background: var(--hb-bg-surface);
  border: 1.5px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
}
.hb-search-field .hb-icon { color: var(--hb-text-secondary); }
.hb-search-field input {
  flex: 1 1 0;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: var(--hb-font-sans);
  font-size: 18px;
  line-height: 29px;
  color: var(--hb-text-primary);
}
.hb-search-field input::placeholder { color: var(--hb-text-secondary); opacity: 1; }
.hb-search-field:focus-within { box-shadow: 0 0 0 2px var(--hb-bg-page), 0 0 0 4px var(--hb-text-accent); }
.hb-search-row .hb-btn { flex: 0 0 auto; }

.hb-results { display: flex; flex-direction: column; gap: 24px; }
.hb-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.hb-active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.hb-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 10px 10px 14px;
  background: var(--hb-bg-subtle);
  border: 1px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-primary);
  text-decoration: none;
}
.hb-chip:hover, .hb-chip:focus { color: var(--hb-text-primary); text-decoration: none; border-color: var(--hb-text-primary); }

/* Gebotsformular in der Karte (nur angemeldet) */
.hb-lot-mybid { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.hb-bid-form { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.hb-bid-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-primary); margin: 0; }
.hb-bid-row { display: flex; gap: 8px; }
.hb-input {
  flex: 1 1 0;
  min-width: 0;
  height: 48px;
  padding: 0 14px;
  background: var(--hb-bg-surface);
  border: 1.5px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
  font-family: var(--hb-font-sans);
  font-size: 18px;
  color: var(--hb-text-primary);
  text-align: right;
}
.hb-input:focus { outline: none; box-shadow: 0 0 0 2px var(--hb-bg-page), 0 0 0 4px var(--hb-text-accent); }

/* Pagination */
.hb-pagination { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.hb-pagination-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.hb-pg-numbers { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.hb-pg-item, .hb-pg-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 48px;
  height: 48px;
  border-radius: var(--hb-radius-sm);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  text-decoration: none;
}
.hb-pg-item { background: var(--hb-bg-surface); border: 1px solid var(--hb-border-strong); color: var(--hb-text-primary); padding: 0 8px; }
.hb-pg-item:hover, .hb-pg-item:focus { color: var(--hb-text-primary); text-decoration: none; border-color: var(--hb-text-primary); }
.hb-pg-item-current { background: var(--hb-bg-action); border-color: var(--hb-bg-action); color: var(--hb-text-on-action); }
.hb-pg-dots { display: inline-flex; align-items: center; padding: 0 4px; color: var(--hb-text-secondary); }
.hb-pg-nav { border: 1px solid var(--hb-border-subtle); color: var(--hb-text-secondary); padding: 0 20px 0 12px; }
.hb-pg-nav-next { border: 2px solid var(--hb-border-secondary); color: var(--hb-text-secondary-action); padding: 0 12px 0 20px; }
.hb-pg-nav:hover, .hb-pg-nav:focus { text-decoration: none; background: rgba(0,0,0,.03); }
.hb-pg-nav-disabled { opacity: .45; pointer-events: none; }
.hb-pagination .hb-small { text-align: center; }

/* Hilfe */
.hb-help {
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 24px 32px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  font-size: 18px;
  line-height: 29px;
  color: var(--hb-text-secondary);
}
.hb-help .hb-icon { color: var(--hb-text-secondary-action); }

@media (max-width: 991.98px) {
  .hb-auction-content { padding: 32px 0 64px; }
  .hb-search-row { flex-direction: column; }
  .hb-search-row .hb-btn { width: 100%; }
  .hb-help { padding: 24px; flex-direction: column; align-items: flex-start; gap: 8px; }
  .hb-pg-nav span:not(.hb-icon) { display: none; }
  .hb-pg-nav { padding: 0 12px; }
}

/* Bild-Modal im Redesign (Bootstrap-Modal bleibt) */
.hb-page .modal-content { border-radius: var(--hb-radius-md); font-family: var(--hb-font-sans); }
.hb-page .modal-article-images-cardgroup .card { max-width: 160px; }

/* ==========================================================================
   Abgelaufene Auktionen (Figma "Abgelaufene Auktionen")
   ========================================================================== */
.hb-icon-56 { width: 56px; height: 56px; }
.hb-icon-chevron-down { -webkit-mask-image: url(/img/redesign/icons/chevron-down.svg); mask-image: url(/img/redesign/icons/chevron-down.svg); }
.hb-icon-book-open    { -webkit-mask-image: url(/img/redesign/icons/book-open.svg);    mask-image: url(/img/redesign/icons/book-open.svg); }
.hb-icon-feather      { -webkit-mask-image: url(/img/redesign/icons/feather.svg);      mask-image: url(/img/redesign/icons/feather.svg); }
.hb-icon-fish         { -webkit-mask-image: url(/img/redesign/icons/fish.svg);         mask-image: url(/img/redesign/icons/fish.svg); }

.hb-archive-intro { max-width: 820px; }
.hb-archive-content { padding: 48px 0 96px; }
.hb-archive-content .hb-container { display: flex; flex-direction: column; gap: 64px; }

/* Jahresauswahl */
.hb-year-select { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hb-year-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-primary); min-width: 48px; }
.hb-year-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.hb-year-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border: 1px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
  background: var(--hb-bg-surface);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-primary);
  text-decoration: none;
}
.hb-year-tab:hover, .hb-year-tab:focus { color: var(--hb-text-primary); text-decoration: none; border-color: var(--hb-text-primary); }
.hb-year-tab.is-active { background: var(--hb-bg-action); border-color: var(--hb-bg-action); color: var(--hb-text-on-action); }
.hb-year-dropdown { display: none; position: relative; width: 100%; margin: 0; }
.hb-select {
  width: 100%;
  height: 56px;
  padding: 0 48px 0 16px;
  background: var(--hb-bg-surface);
  border: 1.5px solid var(--hb-border-strong);
  border-radius: var(--hb-radius-sm);
  font-family: var(--hb-font-sans);
  font-size: 18px;
  color: var(--hb-text-primary);
  -webkit-appearance: none;
  appearance: none;
}
.hb-year-dropdown .hb-icon { position: absolute; right: 16px; top: 50%; margin-top: -12px; color: var(--hb-text-secondary); pointer-events: none; }

/* Jahresgruppen und Auktionskarten */
.hb-year-list { display: flex; flex-direction: column; gap: 64px; }
.hb-year-group { display: flex; flex-direction: column; gap: 24px; }
.hb-year-group.collapse:not(.show) { display: none; }
.hb-year-group.collapse.show { display: flex; }
.hb-year-head { display: flex; align-items: baseline; gap: 16px; }
.hb-year-title { font-family: var(--hb-font-serif); font-weight: 600; font-size: 34px; line-height: 42px; color: var(--hb-text-primary); margin: 0; }
.hb-auction-card {
  display: flex;
  align-items: stretch;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  overflow: hidden;
}
.hb-auction-cover {
  flex: 0 0 320px;
  width: 320px;
  background: var(--hb-bg-subtle);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
}
.hb-auction-cover .hb-icon { color: var(--hb-text-secondary-action); }
.hb-auction-number { font-family: var(--hb-font-serif); font-weight: 600; font-size: 72px; line-height: 80px; color: var(--hb-text-ornament); margin: 0; }
.hb-auction-cover-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-secondary); margin: 0; }
.hb-auction-card-body { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 32px 40px; }
.hb-auction-datum-regular { font-weight: 400; margin: 0; }
.hb-auction-card-btn { align-self: flex-start; margin-top: 8px; }
.hb-year-more { align-self: flex-start; }
@media (max-width: 991.98px) {
  .hb-archive-content { padding: 32px 0 64px; }
  .hb-archive-content .hb-container { gap: 40px; }
  .hb-year-select { flex-direction: column; align-items: stretch; gap: 8px; }
  .hb-year-tabs { display: none; }
  .hb-year-dropdown { display: block; }
  .hb-year-list { gap: 40px; }
  .hb-year-group { gap: 16px; }
  .hb-year-title { font-size: 28px; line-height: 36px; }
  .hb-auction-card { flex-direction: column; }
  .hb-auction-cover { width: 100%; flex-basis: auto; padding: 24px; }
  .hb-auction-card-body { padding: 24px; }
  .hb-auction-card-btn, .hb-year-more { align-self: stretch; }
}

/* ==========================================================================
   Direktverkauf (Figma "Direktverkauf - Uebersicht")
   ========================================================================== */
.hb-icon-tag          { -webkit-mask-image: url(/img/redesign/icons/tag.svg);          mask-image: url(/img/redesign/icons/tag.svg); }
.hb-icon-shopping-bag { -webkit-mask-image: url(/img/redesign/icons/shopping-bag.svg); mask-image: url(/img/redesign/icons/shopping-bag.svg); }
.hb-icon-check        { -webkit-mask-image: url(/img/redesign/icons/check.svg);        mask-image: url(/img/redesign/icons/check.svg); }

/* Einleitung */
.hb-shop-head { display: flex; flex-direction: column; gap: 16px; }
.hb-search-head { max-width: 900px; width: 100%; margin-top: 8px; }

/* Mobile Warenkorb-Leiste */
.hb-cart-bar { background: var(--hb-bg-success); display: none; }
.hb-cart-bar[hidden] { display: none !important; }
.hb-cart-bar .hb-container { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 4px; padding-bottom: 4px; }
.hb-cart-bar-info { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-cart-bar-info .hb-icon { color: var(--hb-text-action); }

/* Layout: Filter links, Artikel rechts */
.hb-shop-layout { display: flex; gap: 48px; align-items: flex-start; }
.hb-shop-results { flex: 1 1 0; min-width: 0; }
.hb-filter { flex: 0 0 300px; width: 300px; display: flex; flex-direction: column; gap: 16px; }
.hb-filter-group { border-top: 1px solid var(--hb-border-subtle); padding-top: 16px; display: flex; flex-direction: column; gap: 8px; }
.hb-filter-title { font-weight: 700; font-size: 18px; line-height: 26px; color: var(--hb-text-primary); margin: 0 0 4px; }
.hb-filter-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.hb-filter-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 12px 10px 0;
  border-left: 3px solid transparent;
  font-size: 18px;
  line-height: 24px;
  color: var(--hb-text-primary);
  text-decoration: none;
}
.hb-filter-item:hover, .hb-filter-item:focus { color: var(--hb-text-primary); text-decoration: none; background: rgba(0,0,0,.03); }
.hb-filter-item.is-active { background: var(--hb-bg-subtle); border-left-color: var(--hb-border-accent); font-weight: 600; padding-left: 20px; }
.hb-filter-item .hb-icon { color: var(--hb-text-secondary); margin-left: 4px; }
.hb-filter-spacer { display: inline-block; width: 16px; margin-left: 4px; }
.hb-filter-name { flex: 1 1 0; min-width: 0; }
.hb-filter-count { font-size: 16px; line-height: 22px; color: var(--hb-text-secondary); white-space: nowrap; }
.hb-filter-children { padding-left: 36px; }
.hb-filter-children .hb-filter-item { min-height: 44px; padding-top: 8px; padding-bottom: 8px; }
.hb-filter-children .hb-filter-item.is-active { padding-left: 12px; }
.hb-shop-dropdown { display: none; }
.hb-shop-dropdown .hb-search-label { display: block; margin-bottom: 8px; }
.hb-shop-dropdown .hb-select-chevron { top: auto; bottom: 16px; margin-top: 0; }

/* Produktkarte */
.hb-product-category { text-decoration: none; }
.hb-product-category:hover, .hb-product-category:focus { color: var(--hb-text-accent); text-decoration: underline; }
.hb-lot-title-3 { -webkit-line-clamp: 3; }
.hb-product .hb-price { gap: 2px; }
.hb-product.is-in-cart { border: 2px solid var(--hb-text-action); }
.hb-btn-disabled { opacity: .55; pointer-events: none; }
.hb-lot .hb-btn-block { white-space: normal; text-align: center; }

@media (max-width: 991.98px) {
  .hb-cart-bar { display: block; }
  .hb-shop-layout { flex-direction: column; gap: 24px; }
  .hb-filter { display: none; }
  .hb-shop-dropdown { display: block; width: 100%; }
  .hb-shop-results { width: 100%; }
}

/* ==========================================================================
   Positionsdetail (Figma "Positionsdetail")
   ========================================================================== */
.hb-icon-printer { -webkit-mask-image: url(/img/redesign/icons/printer.svg); mask-image: url(/img/redesign/icons/printer.svg); }
.hb-icon-zoom-in { -webkit-mask-image: url(/img/redesign/icons/zoom-in.svg); mask-image: url(/img/redesign/icons/zoom-in.svg); }

.hb-icon-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  font-family: var(--hb-font-sans);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-action);
  text-decoration: none;
  background: none;
  border: 0;
  cursor: pointer;
}
.hb-icon-link:hover, .hb-icon-link:focus { color: var(--hb-text-action); text-decoration: underline; }
.hb-icon-link-lg { font-size: 18px; line-height: 24px; }

/* Navigation oben */
.hb-detail-nav .hb-container { display: block; }
.hb-breadcrumb-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hb-detail-paging { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.hb-detail-prevnext { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }

/* Hauptbereich */
.hb-detail-main { padding: 24px 0 64px; }
.hb-detail-main .hb-container { display: flex; gap: 48px; align-items: flex-start; }
.hb-gallery { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.hb-gallery-main {
  display: block;
  position: relative;
  aspect-ratio: 712 / 534;
  background: var(--hb-bg-subtle);
  border-radius: var(--hb-radius-sm);
  overflow: hidden;
  cursor: zoom-in;
}
.hb-gallery-main img { width: 100%; height: 100%; object-fit: contain; display: block; }
.hb-gallery-thumbs { display: flex; gap: 12px; flex-wrap: wrap; }
.hb-gallery-thumb {
  width: 96px;
  height: 72px;
  padding: 0;
  background: var(--hb-bg-subtle);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-sm);
  overflow: hidden;
  cursor: pointer;
}
.hb-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hb-gallery-thumb.is-active { border: 3px solid var(--hb-text-action); }
.hb-gallery-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.hb-detail-info { flex: 0 0 520px; width: 520px; display: flex; flex-direction: column; gap: 24px; }
.hb-bid-panel {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
.hb-bid-price { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.hb-bid-price-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-secondary); margin: 0; }
.hb-bid-price-value { font-weight: 700; font-size: 40px; line-height: 48px; color: var(--hb-text-primary); margin: 0; }
.hb-bid-panel .hb-facts { width: 100%; }
.hb-fact-top { align-items: flex-start; }
.hb-fact-top .hb-icon { margin-top: 2px; }
.hb-bid-panel .hb-divider { width: 100%; }
.hb-bid-block { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.hb-bid-block .hb-bid-form { gap: 8px; }
.hb-bid-block .hb-bid-form .hb-btn { margin-top: 8px; }
.hb-input-wrap { position: relative; display: flex; align-items: center; }
.hb-input-lg { width: 100%; height: 56px; font-size: 18px; text-align: left; padding-right: 44px; }
.hb-input-suffix { position: absolute; right: 16px; font-weight: 600; font-size: 18px; color: var(--hb-text-secondary); pointer-events: none; }
.hb-bid-error { display: flex; align-items: center; gap: 6px; color: #8a2e22; }
.hb-bid-error[hidden] { display: none; }
.hb-notice-success { background: var(--hb-bg-success); }
.hb-notice-success > .hb-icon { color: var(--hb-text-success); }
.hb-notice-success .hb-notice-title { color: var(--hb-text-success); }
.hb-notice-danger { background: #f3e1dc; }
.hb-notice-danger > .hb-icon { color: #8a2e22; }
.hb-notice-danger .hb-notice-title { color: #8a2e22; }
.hb-bid-actions { display: flex; flex-wrap: wrap; gap: 0 24px; width: 100%; }

/* Details */
.hb-detail-details { padding: 0 0 96px; }
.hb-detail-details .hb-container { display: flex; gap: 48px; align-items: flex-start; }
.hb-detail-description { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.hb-detail-description p { white-space: pre-line; }
.hb-detail-side { flex: 0 0 520px; width: 520px; display: flex; flex-direction: column; gap: 24px; }
.hb-cost-card {
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hb-cost-card .hb-table-row-total span:last-child { font-size: 21px; }
.hb-lot-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hb-detail-related { padding-top: 0; }

/* Prüf-Dialog */
.hb-bid-modal .modal-dialog { max-width: 640px; }
.hb-bid-modal-content { padding: 32px; display: flex; flex-direction: column; gap: 20px; font-family: var(--hb-font-sans); color: var(--hb-text-primary); border-radius: var(--hb-radius-md); }
.hb-bid-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.hb-icon-link-btn { padding: 4px 0; }
.hb-bid-modal-article { display: flex; gap: 16px; align-items: center; }
.hb-bid-modal-article img { width: 120px; height: 90px; object-fit: contain; background: var(--hb-bg-subtle); border-radius: var(--hb-radius-sm); flex: 0 0 auto; }
.hb-bid-modal-article p { margin: 0; }
.hb-bid-modal-title { font-size: 18px; line-height: 26px; }
.hb-bid-modal-amount { background: var(--hb-bg-note); border-radius: var(--hb-radius-md); padding: 16px 24px; }
.hb-bid-modal-amount p { margin: 0; }
.hb-bid-modal-value { font-weight: 700; font-size: 34px; line-height: 42px; }
.hb-checkbox { display: flex; align-items: flex-start; gap: 12px; margin: 0; font-size: 18px; line-height: 29px; cursor: pointer; }
.hb-checkbox input { width: 24px; height: 24px; margin-top: 3px; accent-color: var(--hb-bg-action); flex: 0 0 auto; }
.hb-bid-modal-actions { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; }

@media (max-width: 1199.98px) {
  .hb-detail-info, .hb-detail-side { flex-basis: 440px; width: 440px; }
  .hb-lot-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .hb-detail-paging { flex-direction: column; align-items: flex-start; gap: 0; }
  .hb-detail-main { padding: 8px 0 48px; }
  .hb-detail-main .hb-container, .hb-detail-details .hb-container { flex-direction: column; gap: 24px; }
  .hb-detail-info, .hb-detail-side { width: 100%; flex-basis: auto; }
  .hb-bid-panel, .hb-cost-card { padding: 24px; }
  .hb-bid-price-value { font-size: 34px; line-height: 42px; }
  .hb-gallery-thumb { width: 72px; height: 54px; }
  .hb-detail-details { padding-bottom: 64px; }
  .hb-lot-grid-4 { grid-template-columns: 1fr; }
  .hb-bid-modal-content { padding: 24px; }
  .hb-bid-modal-actions { flex-direction: column-reverse; }
  .hb-bid-modal-actions .hb-btn { width: 100%; }
}
@media print {
  .hb-header, .hb-footer, .hb-detail-nav, .hb-bid-actions, .hb-detail-related, .hb-gallery-bar { display: none !important; }
}

/* ==========================================================================
   Anmelden / Registrieren (Figma "Anmelden / Registrieren - Einstieg")
   ========================================================================== */
.hb-icon-eye { -webkit-mask-image: url(/img/redesign/icons/eye.svg); mask-image: url(/img/redesign/icons/eye.svg); }

.hb-auth-content { padding: 48px 0 96px; }
.hb-auth-content .hb-container { display: flex; flex-direction: column; gap: 40px; }
.hb-auth-title { display: flex; flex-direction: column; gap: 16px; }
.hb-auth-cards { display: flex; gap: 32px; align-items: stretch; }
.hb-auth-card {
  flex: 1 1 0;
  min-width: 0;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.hb-auth-card .hb-notice { width: 100%; margin-top: auto; }

/* Formularfelder */
.hb-form { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; margin: 0; }
.hb-field { width: 100%; display: flex; flex-direction: column; gap: 8px; }
.hb-field-label { font-weight: 600; font-size: 16px; line-height: 22px; color: var(--hb-text-primary); margin: 0; }
.hb-field .hb-input-wrap { width: 100%; }
.hb-field > .hb-input { flex: 0 0 auto; width: 100%; }
.hb-input-password { padding-right: 130px; }
.hb-password-toggle {
  position: absolute;
  right: 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 8px;
  background: none;
  border: 0;
  font-family: var(--hb-font-sans);
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--hb-text-action);
  cursor: pointer;
}
.hb-password-toggle:hover, .hb-password-toggle:focus { text-decoration: underline; }
.hb-field.has-error .hb-input { border-color: #8a2e22; }
.hb-field-error { display: flex; align-items: center; gap: 6px; font-size: 16px; line-height: 24px; color: #8a2e22; margin: 0; }
.hb-checkbox-row { padding: 12px 0; }
.hb-auth-forgot { align-self: flex-start; }

/* Vorteile */
.hb-check-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; width: 100%; }
.hb-check-list li { display: flex; align-items: flex-start; gap: 12px; font-size: 18px; line-height: 29px; color: var(--hb-text-primary); }
.hb-check-list .hb-icon { color: var(--hb-text-success); margin-top: 2px; }

@media (max-width: 991.98px) {
  .hb-auth-content { padding: 24px 0 64px; }
  .hb-auth-content .hb-container { gap: 24px; }
  .hb-auth-cards { flex-direction: column; gap: 24px; }
  .hb-auth-card { padding: 24px; }
  .hb-help { flex-direction: column; align-items: flex-start; }
}

/* ==========================================================================
   Registrieren (Figma "Registrieren - Formular / mit Fehlern / Erfolg")
   ========================================================================== */
.hb-icon-36 { width: 36px; height: 36px; }
.hb-icon-shield-check { -webkit-mask-image: url(/img/redesign/icons/shield-check.svg); mask-image: url(/img/redesign/icons/shield-check.svg); }
.hb-icon-mail-check   { -webkit-mask-image: url(/img/redesign/icons/mail-check.svg);   mask-image: url(/img/redesign/icons/mail-check.svg); }

.hb-register-content { padding: 32px 0 96px; }
.hb-register-content .hb-container { display: flex; gap: 96px; align-items: flex-start; }
.hb-register-form { flex: 0 1 640px; width: 640px; max-width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 48px; }
.hb-register-fields { gap: 48px; }
.hb-fieldset { width: 100%; border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.hb-fieldset legend { padding: 0; margin: 0 0 4px; width: 100%; }
.hb-field-row { display: flex; gap: 16px; width: 100%; }
.hb-field-plz { flex: 0 0 180px; width: 180px; }
.hb-field-row .hb-field:not(.hb-field-plz) { flex: 1 1 0; min-width: 0; }
.hb-select-wrap { position: relative; width: 100%; }
.hb-select-wrap .hb-select-chevron { position: absolute; right: 12px; top: 50%; margin-top: -12px; color: var(--hb-text-secondary); pointer-events: none; }
.hb-field.has-error .hb-select { border-color: #8a2e22; }
.hb-register-submit { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.hb-register-login { display: flex; align-items: center; gap: 8px; }

/* Fehlerzusammenfassung */
.hb-error-summary {
  width: 100%;
  background: var(--hb-bg-surface);
  border: 1.5px solid #8a2e22;
  border-radius: var(--hb-radius-md);
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hb-error-summary:focus { outline: none; box-shadow: 0 0 0 2px var(--hb-bg-page), 0 0 0 4px var(--hb-text-accent); }
.hb-error-summary-title { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 21px; line-height: 28px; color: #8a2e22; margin: 0; }
.hb-error-summary-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.hb-error-summary-list a { color: #8a2e22; font-size: 18px; line-height: 29px; text-decoration: none; }
.hb-error-summary-list a:hover, .hb-error-summary-list a:focus { color: #8a2e22; text-decoration: underline; }

/* Passwortregeln */
.hb-requirements { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.hb-requirements[hidden] { display: none; }
.hb-requirements li { display: flex; align-items: center; gap: 6px; font-size: 16px; line-height: 24px; color: #8a2e22; }
.hb-requirements li .hb-icon-check { display: none; }
.hb-requirements li.is-ok { color: var(--hb-text-success); }
.hb-requirements li.is-ok .hb-icon-x { display: none; }
.hb-requirements li.is-ok .hb-icon-check { display: inline-block; }

/* Seitenleiste */
.hb-register-aside {
  flex: 0 0 400px;
  width: 400px;
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: sticky;
  top: 24px;
}
.hb-register-aside p { margin: 0; }
.hb-aside-divider { width: 100%; height: 1px; background: var(--hb-border-strong); opacity: .4; }
.hb-aside-row { display: flex; gap: 12px; align-items: flex-start; }
.hb-aside-row .hb-icon { color: var(--hb-text-action); margin-top: 2px; flex: 0 0 auto; }
.hb-aside-row div { display: flex; flex-direction: column; gap: 4px; }

/* Erfolg */
.hb-verify-content { padding: 64px 0 128px; }
.hb-verify-content .hb-container { display: flex; justify-content: center; }
.hb-verify-card {
  width: 760px;
  max-width: 100%;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 56px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.hb-verify-card .hb-notice { width: 100%; }
.hb-verify-symbol { width: 72px; height: 72px; border-radius: 36px; background: var(--hb-bg-success); display: flex; align-items: center; justify-content: center; color: var(--hb-text-success); }

@media (max-width: 1199.98px) {
  .hb-register-content .hb-container { gap: 48px; }
  .hb-register-aside { flex-basis: 320px; width: 320px; }
}
@media (max-width: 991.98px) {
  .hb-register-content { padding: 8px 0 64px; }
  .hb-register-content .hb-container { flex-direction: column; gap: 32px; }
  .hb-register-form { width: 100%; flex-basis: auto; gap: 32px; }
  .hb-register-fields { gap: 32px; }
  .hb-field-row { gap: 12px; }
  .hb-field-plz { flex-basis: 120px; width: 120px; }
  .hb-register-aside { width: 100%; flex-basis: auto; position: static; padding: 24px; }
  .hb-verify-content { padding: 32px 0 64px; }
  .hb-verify-card { padding: 24px; }
  .hb-verify-card .hb-actions .hb-btn { width: 100%; }
}

/* ==========================================================================
   Kontakt (Figma "Kontakt" / "Kontakt - Nachricht gesendet")
   ========================================================================== */
.hb-contact-content { padding: 64px 0 96px; }
.hb-contact-content .hb-container { display: flex; gap: 64px; align-items: flex-start; }
.hb-contact-card {
  flex: 1 1 0;
  min-width: 0;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.hb-contact-card .hb-notice { width: 100%; }
.hb-contact-card .hb-form { gap: 24px; }
.hb-textarea, .hb-field > .hb-textarea, textarea.hb-input { display: block; width: 100%; max-width: 100%; min-width: 100%; box-sizing: border-box; height: 200px; min-height: 200px; padding: 12px 16px; resize: vertical; text-align: left; line-height: 29px; font-family: var(--hb-font-sans); }
.hb-contact-aside { flex: 0 0 480px; width: 480px; display: flex; flex-direction: column; gap: 24px; }

/* Telefon-Box */
.hb-phone-box {
  width: 100%;
  background: var(--hb-bg-note);
  border-radius: var(--hb-radius-md);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hb-phone-box p { margin: 0; }
.hb-phone-box-head { display: flex; align-items: center; gap: 12px; font-weight: 700; font-size: 21px; line-height: 28px; color: var(--hb-text-primary); margin: 0; }
.hb-phone-box-head .hb-icon { width: 28px; height: 28px; color: var(--hb-text-action); }
.hb-phone-box-number { font-weight: 700; font-size: 24px; line-height: 30px; color: var(--hb-text-action); text-decoration: none; }
.hb-phone-box-number:hover, .hb-phone-box-number:focus { color: var(--hb-text-action); text-decoration: underline; }
.hb-phone-box-mobile { display: none; }

/* Kontaktdaten */
.hb-contact-details {
  width: 100%;
  background: var(--hb-bg-surface);
  border: 1px solid var(--hb-border-subtle);
  border-radius: var(--hb-radius-md);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.hb-contact-group { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.hb-contact-group .hb-contact-row a { font-weight: 600; }

/* Schnelle Antworten */
.hb-quick-links {
  width: 100%;
  background: var(--hb-bg-subtle);
  border-radius: var(--hb-radius-md);
  padding: 28px 28px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.hb-quick-links p { margin: 0; }

@media (max-width: 1199.98px) {
  .hb-contact-content .hb-container { gap: 40px; }
  .hb-contact-aside { flex-basis: 380px; width: 380px; }
}
@media (max-width: 991.98px) {
  .hb-contact-content { padding: 24px 0 64px; }
  .hb-contact-content .hb-container { flex-direction: column; gap: 24px; }
  .hb-contact-card { width: 100%; padding: 24px; }
  .hb-contact-aside { width: 100%; flex-basis: auto; }
  .hb-phone-box-mobile { display: flex; }
  .hb-phone-box-desktop { display: none; }
  .hb-phone-box, .hb-contact-details, .hb-quick-links { padding: 24px; }
  .hb-contact-card .hb-actions .hb-btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   Bootstrap Material Design umhuellt Eingabefelder per Script mit .bmd-form-group
   (inline-block, padding-top). Im Redesign wird dieser Container neutralisiert,
   damit Suchfeld, Gebotsfeld und Formulare ihre volle Breite behalten.
   -------------------------------------------------------------------------- */
.hb-start .bmd-form-group, .hb-header .bmd-form-group, .hb-bid-modal .bmd-form-group {
  display: block;
  position: static;
  width: 100%;
  margin: 0;
  padding: 0;
}
.hb-search-field .bmd-form-group, .hb-bid-row .bmd-form-group { flex: 1 1 0; min-width: 0; width: auto; }
.hb-search-field .bmd-form-group input, .hb-bid-row .bmd-form-group .hb-input, .hb-start .bmd-form-group > .hb-input, .hb-start .bmd-form-group > .hb-select { width: 100%; flex: 0 0 auto; }
.hb-search-field input { width: 100%; }
