/* Bodyfit Hilfe-Center – Erscheinungsbild wie Chat-Dana („edel“, Daniel 29.09.2026)
   Elfenbein, Schwarz, Haarlinien, klassische Serife, gesperrte Kapitälchen, Petrol nur als Akzent.
   Alles unter .kb-body-wrapper, damit andere HubSpot-Seiten (z. B. Angebote) unberührt bleiben.
   Quelle der Werte: Dana/shop_berater/index.html (:root). Stand 11.10.2026 */

.kb-body-wrapper {
  --bf-bg:#f6f3ee; --bf-surface:#ffffff; --bf-surface-2:#fbf9f6; --bf-ink:#161616; --bf-ink-2:#3a3835; --bf-muted:#77726b;
  --bf-line:#e3ded5; --bf-hair:#d6d0c5; --bf-brand:#0f3b4c; --bf-brand-2:#155366; --bf-brand-soft:#e7eff1;
  --bf-head:#0a0a0a; --bf-head-ink:#f6f3ee; --bf-head-muted:rgba(246,243,238,.58); --bf-head-line:rgba(246,243,238,.22);
  --bf-serif:"Cormorant Garamond","Cormorant",Garamond,Georgia,serif;
  --bf-sans:"Instrument Sans","Inter",-apple-system,"Helvetica Neue",Arial,sans-serif;
  --bf-caps:500 10.5px/1.2 "Inter",-apple-system,sans-serif;
  background:var(--bf-bg) !important; color:var(--bf-ink) !important;
  font:15.5px/1.7 var(--bf-sans) !important; -webkit-font-smoothing:antialiased;
}
html, body { background:#f6f3ee !important; }
.kb-body-wrapper p, .kb-body-wrapper li, .kb-body-wrapper td, .kb-body-wrapper span, .kb-body-wrapper label,
.kb-body-wrapper input, .kb-body-wrapper button, .kb-body-wrapper a { font-family:var(--bf-sans); }

/* ---------- Kopfzeile: schwarz, schmal, ruhig ---------- */
.kb-body-wrapper header.header, .kb-body-wrapper header.header > div, .kb-body-wrapper .header__top,
.kb-body-wrapper .header__container, .kb-body-wrapper #hs_cos_wrapper_knowledgebase_header { background:var(--bf-head) !important; }
.kb-body-wrapper .header__bottom { background:var(--bf-head) !important; padding:12px 24px !important; border-bottom:1px solid #000; }
.kb-body-wrapper .header__wrapper--top { background:var(--bf-head) !important; border:0 !important; border-bottom:1px solid var(--bf-head-line) !important; }
.kb-body-wrapper .header__wrapper--top .header__language-switcher-current-label,
.kb-body-wrapper .header__wrapper--top .header__language-switcher-label,
.kb-body-wrapper .header__wrapper--top .header__language-switcher-icon,
.kb-body-wrapper .header__wrapper--top svg { color:var(--bf-head-muted) !important; fill:var(--bf-head-muted) !important;
  font:var(--bf-caps) !important; letter-spacing:.2em !important; text-transform:uppercase; }
.kb-body-wrapper .header__wrapper--bottom { background:var(--bf-head) !important; border-bottom:1px solid #000 !important;
  padding-top:10px !important; padding-bottom:10px !important; }
.kb-body-wrapper .header__logo-image { width:46px !important; height:46px !important; max-width:46px !important;
  border-radius:50% !important; object-fit:cover; display:block; }
.kb-body-wrapper .header__logo-link { display:flex !important; align-items:center; gap:16px; text-decoration:none !important; }
.kb-body-wrapper .header__logo-link::after { content:"Hilfe-Center"; color:var(--bf-head-ink); font:var(--bf-caps);
  font-size:12px; letter-spacing:.34em; text-transform:uppercase; white-space:nowrap; }
.kb-body-wrapper .header__button, .kb-body-wrapper a.header__button {
  background:transparent !important; color:var(--bf-head-ink) !important; border:1px solid var(--bf-head-line) !important;
  border-radius:2px !important; font:var(--bf-caps) !important; letter-spacing:.24em !important; text-transform:uppercase;
  padding:11px 18px !important; box-shadow:none !important; }
.kb-body-wrapper .header__button:hover { border-color:var(--bf-head-ink) !important; }
.kb-body-wrapper .header__menu-toggle svg { fill:var(--bf-head-ink) !important; }

/* ---------- Begrüßung + Suche: Elfenbein statt schwarzem Band ---------- */
.kb-body-wrapper .hs-kb-search-input-wrapper { background:var(--bf-bg) !important; background-image:none !important;
  padding:56px 20px 44px !important; text-align:center; border-bottom:1px solid var(--bf-line); }
.kb-body-wrapper .hs-kb-search-input-wrapper::before { content:"Bodyfit · Hilfe-Center"; display:block; color:var(--bf-muted);
  font:var(--bf-caps); letter-spacing:.34em; text-transform:uppercase; margin-bottom:18px; }
.kb-body-wrapper .hs-kb-search-input-wrapper::after { content:"Kitzbühel · Schloss Tillysburg · Mallorca"; display:block;
  color:var(--bf-muted); font:var(--bf-caps); letter-spacing:.28em; text-transform:uppercase; margin-top:26px; }
.kb-body-wrapper .hs-search-field { max-width:640px; margin:0 auto; }
.kb-body-wrapper .hs-search-field__label { display:block !important; color:var(--bf-ink) !important;
  font:300 clamp(34px,5vw,52px)/1.08 var(--bf-serif) !important; letter-spacing:.005em; text-align:center;
  margin:0 0 30px !important; }
.kb-body-wrapper .hs-search-field__label::after { content:""; display:block; width:40px; height:1px; background:var(--bf-hair);
  margin:24px auto 0; }
.kb-body-wrapper .hs-search-field__bar { display:flex !important; }
.kb-body-wrapper .hs-search-field__input { background:var(--bf-surface) !important; color:var(--bf-ink) !important;
  border:1px solid var(--bf-hair) !important; border-right:0 !important; border-radius:2px 0 0 2px !important;
  height:52px !important; padding:0 18px !important; font:15px var(--bf-sans) !important; box-shadow:none !important; }
.kb-body-wrapper .hs-search-field__input::placeholder { color:var(--bf-muted); }
.kb-body-wrapper .hs-search-field__input:focus { outline:none !important; border-color:var(--bf-ink) !important; }
.kb-body-wrapper .hs-search-field__button { background:var(--bf-head) !important; color:var(--bf-head-ink) !important;
  border:1px solid var(--bf-head) !important; border-radius:0 2px 2px 0 !important; height:52px !important; min-width:56px; }
.kb-body-wrapper .hs-search-field__button svg { fill:var(--bf-head-ink) !important; }
.kb-body-wrapper .hs-search-field__suggestions { background:var(--bf-surface) !important; border:1px solid var(--bf-line) !important;
  border-radius:2px !important; text-align:left; }

/* ---------- Startseite: Kategorien als ruhige Kacheln ---------- */
.kb-body-wrapper .hs-kb-home-list { max-width:900px; margin:44px auto 64px !important; padding:0 20px;
  display:flex !important; flex-wrap:wrap !important; justify-content:center !important; gap:14px !important; }
/* 3 je Reihe; eine unvollständige letzte Reihe steht mittig (Daniel 11.10.) */
.kb-body-wrapper .hs-kb-home-list__category { width:calc((100% - 28px) / 3) !important; min-width:0 !important; max-width:none !important;
  flex:0 0 calc((100% - 28px) / 3) !important; margin:0 !important; padding:0 !important; }
@media (max-width:900px) { .kb-body-wrapper .hs-kb-home-list__category { width:calc((100% - 14px) / 2) !important; flex-basis:calc((100% - 14px) / 2) !important; } }
.kb-body-wrapper .hs-kb-home-list__category-link { width:100% !important; box-sizing:border-box; display:flex !important; align-items:flex-end; min-height:112px; height:100%;
  background:var(--bf-surface) !important; border:1px solid var(--bf-line) !important; border-radius:2px !important;
  padding:22px 24px !important; text-decoration:none !important; transition:border-color .2s, transform .2s; }
.kb-body-wrapper .hs-kb-home-list__category-link:hover { border-color:var(--bf-brand) !important; transform:translateY(-1px); }
.kb-body-wrapper .hs-kb-home-list__icon, .kb-body-wrapper .hs-kb-home-list__empty-icon { display:none !important; }
.kb-body-wrapper .hs-kb-home-list__text__category-title { color:var(--bf-ink) !important;
  font:400 25px/1.15 var(--bf-serif) !important; margin:0 !important; }
.kb-body-wrapper .hs-kb-home-list__category-link:hover .hs-kb-home-list__text__category-title { color:var(--bf-brand) !important; }

/* ---------- Inhaltsseiten: Brotkrumen, Seitenleiste, Artikel ---------- */
.kb-body-wrapper .hs-kb-breadcrumb-container, .kb-body-wrapper .hs-kb-breadcrumbs { background:transparent !important; }
.kb-body-wrapper .hs-kb-breadcrumbs, .kb-body-wrapper .hs-kb-breadcrumbs a, .kb-body-wrapper .hs-kb-breadcrumb_item {
  color:var(--bf-muted) !important; font:var(--bf-caps) !important; letter-spacing:.2em !important; text-transform:uppercase; text-decoration:none !important; }
.kb-body-wrapper .hs-kb-breadcrumbs a:hover { color:var(--bf-brand) !important; }

.kb-body-wrapper .hs-kb-sidebar { border-right:1px solid var(--bf-line) !important; }
.kb-body-wrapper .hs-kb-category-accordion_link, .kb-body-wrapper .hs-kb-category_accordion_nav_list_item a {
  color:var(--bf-ink-2) !important; font:14px/1.5 var(--bf-sans) !important; text-decoration:none !important; background:transparent !important; }
.kb-body-wrapper .hs-kb-category_accordion_nav_list_item { border-radius:2px !important; }
.kb-body-wrapper .hs-kb-category-accordion_link--active, .kb-body-wrapper .hs-kb-category-accordion_link--active > a,
.kb-body-wrapper .hs-kb-category_accordion_nav_list_item--has-children.hs-kb-category-accordion_link--active {
  background:var(--bf-surface) !important; color:var(--bf-brand) !important; }
.kb-body-wrapper .hs-kb-category_accordion_nav_list a:hover { color:var(--bf-brand) !important; }

.kb-body-wrapper h1 { font:300 clamp(32px,4.4vw,46px)/1.12 var(--bf-serif) !important; color:var(--bf-ink) !important; letter-spacing:.005em; }
.kb-body-wrapper .knowledgebase-post h2, .kb-body-wrapper .hs-kb-content h2 { font:400 28px/1.2 var(--bf-serif) !important;
  color:var(--bf-ink) !important; margin:36px 0 12px !important; padding-top:20px; border-top:1px solid var(--bf-line); }
.kb-body-wrapper .knowledgebase-post h3, .kb-body-wrapper .hs-kb-content h3 { font:500 21px/1.25 var(--bf-serif) !important; color:var(--bf-ink) !important; }
.kb-body-wrapper .knowledgebase-post h1 + h2, .kb-body-wrapper .knowledgebase-post h1 + p { border-top:0; }
.kb-body-wrapper .knowledgebase-post, .kb-body-wrapper .knowledgebase-post p, .kb-body-wrapper .knowledgebase-post li {
  color:var(--bf-ink-2) !important; font-size:15.5px !important; line-height:1.75 !important; }
.kb-body-wrapper .knowledgebase-post strong { color:var(--bf-ink) !important; font-weight:600; }
.kb-body-wrapper .knowledgebase-post ul, .kb-body-wrapper .knowledgebase-post ol { padding-left:1.2em; }
.kb-body-wrapper .knowledgebase-post li { margin:0 0 6px; }
.kb-body-wrapper .knowledgebase-post li::marker { color:var(--bf-brand); }
.kb-body-wrapper .knowledgebase-post a, .kb-body-wrapper .hs-kb-content a:not(.hs-kb-category-article-list__link) {
  color:var(--bf-brand) !important; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.kb-body-wrapper .knowledgebase-post a:hover { color:var(--bf-ink) !important; }

/* Untertitel unter der Überschrift: kursive Serife wie Danas Frage */
.kb-body-wrapper #hs_cos_wrapper_kb-article-module-4 h2, .kb-body-wrapper h2#hs_cos_wrapper_kb-article-module-4_ {
  font:italic 400 22px/1.4 var(--bf-serif) !important; color:var(--bf-ink-2) !important; padding-top:0 !important;
  border-top:0 !important; margin:6px 0 26px !important; }
/* Kurzantwort: ruhige Karte wie Danas Antwortblase */
.kb-body-wrapper #hs_cos_wrapper_kb-article-module-5_ > p:first-child {
  background:var(--bf-surface); border:1px solid var(--bf-line); border-left:2px solid var(--bf-brand);
  border-radius:2px; padding:16px 20px; margin:0 0 8px; color:var(--bf-ink) !important; }
.kb-body-wrapper #hs_cos_wrapper_kb-article-module-5_ > h2:first-child { border-top:0; padding-top:0; }

/* Seitenleiste: keine grauen Flächen */
.kb-body-wrapper .hs-kb-sidebar li, .kb-body-wrapper .hs-kb-sidebar a, .kb-body-wrapper .hs-kb-sidebar ul,
.kb-body-wrapper .hs-kb-anchor_toggle { background:transparent !important; }
.kb-body-wrapper .hs-kb-category-accordion_link--active > a, .kb-body-wrapper .hs-kb-category-accordion_link--active > .hs-kb-anchor_toggle,
.kb-body-wrapper .hs-kb-anchor_toggle--active { color:var(--bf-brand) !important; font-weight:500 !important; }
.kb-body-wrapper .toggle_icon--arrow, .kb-body-wrapper .hs-kb-sidebar svg { fill:var(--bf-muted) !important; color:var(--bf-muted) !important; }

/* Unterseiten: Begrüßung kompakt, wie Danas „compact“-Kopf */
.kb-body-wrapper:not(:has(.hs-kb-home-list)) .hs-kb-search-input-wrapper { padding:30px 20px 28px !important; }
.kb-body-wrapper:not(:has(.hs-kb-home-list)) .hs-kb-search-input-wrapper::after { display:none; }
.kb-body-wrapper:not(:has(.hs-kb-home-list)) .hs-kb-search-input-wrapper::before { margin-bottom:12px; }
.kb-body-wrapper:not(:has(.hs-kb-home-list)) .hs-search-field__label { font-size:clamp(26px,3vw,32px) !important; margin-bottom:18px !important; }
.kb-body-wrapper:not(:has(.hs-kb-home-list)) .hs-search-field__label::after { display:none; }
.kb-body-wrapper .hs-kb-breadcrumb-container { margin-top:28px !important; }

/* Artikellisten in Kategorien */
.kb-body-wrapper .hs-kb-category-listing h1, .kb-body-wrapper .hs-kb-category-listing h2 { border-top:0; }
.kb-body-wrapper .hs-kb-category-article-list { border:1px solid var(--bf-line) !important; border-radius:2px !important;
  background:var(--bf-surface) !important; }
.kb-body-wrapper .hs-kb-category-article-list li, .kb-body-wrapper .hs-kb-category-article-list--bordered li {
  border-color:var(--bf-line) !important; }
.kb-body-wrapper .hs-kb-category-article-list__link { color:var(--bf-ink) !important; font:17px/1.4 var(--bf-sans) !important;
  text-decoration:none !important; }
.kb-body-wrapper .hs-kb-category-article-list__link:hover { color:var(--bf-brand) !important; }
.kb-body-wrapper .hs-kb-subcategory-listing h2, .kb-body-wrapper .hs-kb-subcategory-listing h3 {
  font:var(--bf-caps) !important; letter-spacing:.28em !important; text-transform:uppercase; color:var(--bf-muted) !important;
  border-top:0; padding-top:0; }

/* Feedback und verwandte Artikel */
.kb-body-wrapper .hs-kb-feedback, .kb-body-wrapper .hs-kb-related-articles { background:var(--bf-surface-2) !important;
  border:1px solid var(--bf-line) !important; border-radius:2px !important; }
.kb-body-wrapper .hs-kb-feedback { padding:20px 24px !important; }
.kb-body-wrapper .hs-kb-feedback * { border-top:0 !important; border-bottom:0 !important; }
.kb-body-wrapper .hs-kb-feedback, .kb-body-wrapper .hs-kb-feedback p, .kb-body-wrapper .hs-kb-feedback span {
  font:400 19px/1.3 var(--bf-serif); color:var(--bf-ink) !important; }
.kb-body-wrapper .hs-kb-feedback button, .kb-body-wrapper .hs-kb-feedback .button {
  background:transparent !important; color:var(--bf-ink) !important; border:1px solid var(--bf-hair) !important;
  border-radius:2px !important; font:var(--bf-caps) !important; letter-spacing:.2em !important; text-transform:uppercase; box-shadow:none !important; }
.kb-body-wrapper .hs-kb-feedback button:hover { border-color:var(--bf-ink) !important; }
.kb-body-wrapper .hs-kb-related-articles h2, .kb-body-wrapper .hs-kb-related-articles h3 {
  font:var(--bf-caps) !important; letter-spacing:.28em !important; text-transform:uppercase; color:var(--bf-muted) !important; border:0; padding:0; }

/* ---------- Fußzeile: dezent – eine ruhige Zeile mit Haarlinie (Daniel 11.10.: „Fußzeile bitte dezenter“) ---------- */
.kb-body-wrapper footer { background:var(--bf-bg) !important; border-top:1px solid var(--bf-line) !important; }
.kb-body-wrapper .footer__bottom { display:flex !important; align-items:center !important; justify-content:space-between !important;
  gap:16px; max-width:1100px; margin:0 auto !important; padding:18px 24px 22px !important; min-height:0 !important;
  border:0 !important; }
.kb-body-wrapper footer > div, .kb-body-wrapper footer .footer__bottom > div { border:0 !important; }
.kb-body-wrapper footer .hs_cos_wrapper, .kb-body-wrapper footer .widget-type-rich_text { display:flex; align-items:center; margin:0 !important; }
.kb-body-wrapper .footer__bottom--left, .kb-body-wrapper .footer__bottom--right { display:flex !important; align-items:center !important;
  gap:14px; margin:0 !important; padding:0 !important; }
.kb-body-wrapper .footer__bottom--right { flex-direction:row-reverse; }
/* Fußzeilen-Logo = rundes Petrol-Logo wie oben (Daniel 11.10.), nur kleiner */
.kb-body-wrapper footer .hs-image-widget, .kb-body-wrapper footer img { width:36px !important; height:36px !important; max-width:36px !important;
  border-radius:50% !important; object-fit:cover; opacity:.9; display:block; transition:opacity .2s; }
.kb-body-wrapper footer a:hover img { opacity:1; }
.kb-body-wrapper #hs_cos_wrapper_footer_address { display:none !important; }
.kb-body-wrapper footer p, .kb-body-wrapper footer span { color:var(--bf-muted) !important; font:var(--bf-caps) !important;
  font-size:9.5px !important; letter-spacing:.22em !important; text-transform:uppercase; margin:0 !important; }
.kb-body-wrapper footer p[style], .kb-body-wrapper footer div[style*="text-align"] { text-align:left !important; }
.kb-body-wrapper .hs-kb-social_follow { display:flex; gap:4px; margin:0 !important; }
.kb-body-wrapper .hs-kb-social_follow__link { background:transparent !important; border:0 !important; width:26px !important; height:26px !important;
  min-width:0 !important; padding:0 !important; display:inline-flex !important; align-items:center; justify-content:center; }
.kb-body-wrapper .hs-kb-social_follow__link svg { fill:var(--bf-muted) !important; width:13px !important; height:13px !important; }
.kb-body-wrapper .hs-kb-social_follow__link:hover svg { fill:var(--bf-brand) !important; }
@media (max-width:767px) {
  .kb-body-wrapper .footer__bottom { flex-direction:column; gap:10px; padding:18px 16px 24px !important; }
  .kb-body-wrapper .footer__bottom--right { flex-direction:column; gap:6px; }
}

/* ---------- Handy ---------- */
@media (max-width:767px) {
  .kb-body-wrapper .header__logo-link::after { font-size:10.5px; letter-spacing:.26em; }
  .kb-body-wrapper .hs-kb-search-input-wrapper { padding:40px 16px 32px !important; }
  .kb-body-wrapper .hs-kb-search-input-wrapper::after { letter-spacing:.18em; font-size:9.5px; }
  .kb-body-wrapper .hs-kb-home-list { padding:0 16px; margin:28px auto 44px !important; }
  .kb-body-wrapper .hs-kb-home-list__category { width:100% !important; flex-basis:100% !important; }
  .kb-body-wrapper .hs-kb-home-list__category-link { min-height:84px; }
  .kb-body-wrapper .hs-kb-sidebar { border-right:0 !important; border-bottom:1px solid var(--bf-line) !important; }
}