/* ============================================================================= HUSQVARNA — MARKENREGELN ----------------------------------------------------------------------------- Lag bis zum 14.08.2026 im WPCode-Snippet „Husky Marken-Tokens (CI)" (5462), sitewide im Kopf. Grundlage: BSO/Husky-Port/DESIGNANWEISUNG-HUSKY-CI.md. Die VARIABLEN dieses Snippets stehen jetzt im Markenpaket mu-plugins/spf-brand-husky.php und kommen ueber SPF_Brand auf `:root`. Hier bleiben nur die echten Regeln — das, was sich nicht als Farbwert ausdruecken laesst. Eingereiht wird die Datei ausschliesslich dort, wo das Markenpaket sie ueber den Palettenschluessel `stylesheet` nennt; auf KTM laedt sie nicht. Prioritaet 99, weil die Regeln als Snippet am Ende des Kopfes standen und gegen die Komponenten des Plugins gewinnen muessen. Die Abschnitte 3 bis 5 sind ausdruecklich Bruecken und keine Dauerloesung: Sie fallen weg, sobald die jeweilige Quelle selbst markenfaehig ist. ============================================================================= */ /* ---------- 1) Marke ---------- */ /* ---------- 2) Aliasse ---------- */ /* Namen, die fremder Code erwartet. Bewusst nur Weiterleitungen — damit die portierten Snippets 1:1 gegen die KTM-Originale diffbar bleiben. */ /* ---------- 3) Header ---------- */ /* Das Header-Code-Element bringt eigene Tokens mit (--o Akzent, --oh Hover, --bg Grundflaeche). Sein Inline-CSS laedt SPAETER als dieses Snippet, deshalb html body + !important. */ /* Bruecke ENTFERNT am 05.08.2026: das Header-Code-Element setzt seine Tokens jetzt selbst aus den Markenwerten (--o:var(--brand-accent), --oh:var(--brand-accent-dark), --bg:#ffffff) und laedt keine KTM-Schriften mehr. Ein Override von aussen ist damit ueberfluessig. Falls hier je wieder Orange auftaucht, liegt es im Template und gehoert dort korrigiert, nicht hier ueberschrieben. */ /* Signaturkante: 4px Gelb statt Akzent (CI §5) */ #ktmps-header{ border-bottom-color: var(--brand-signal) !important; } /* Schrift und Mixed Case im Header (CI §2) */ #ktmps-header, #ktmps-header *:not(svg):not(path){ font-family: var(--brand-font-head) !important; } /* `bso-beta` seit dem 31.08.2026 in der Ausnahmeliste. Sie zaehlt bisher „badge", „pill" und „tag" auf — also genau die Gattung, zu der der Beta-Zusatz neben dem Logo gehoert: eine Auszeichnung, kein Text im Kopf. Er heisst nur nicht so. Ohne den Zusatz hier stuende auf Husqvarna „Beta" und auf KTM „BETA"; der Hinweis ist aber technischer Natur und soll auf beiden Shops gleich gelesen werden. Die Schriftfamilie bleibt dagegen die des Kopfes — die Zeile darueber setzt sie mit `!important`, und das ist CI §2 und richtig so. */ html body #ktmps-header *:not([class*="badge"]):not([class*="pill"]):not([class*="tag"]):not(.bso-beta){ text-transform: none !important; letter-spacing: normal !important; } /* Header-Logo im Darkmode: erledigt das SPF-Plugin ab 2.1.57 selbst (Style-Block „spf-header-night-logo" setzt --spf-hd-logo je Blog auf Husky-PS-Logo-Weiss.svg, Anhang 6083). Unsere Umbiegung ist damit weg. */ /* ---------- 4) SPF Landing-Hero: CTA-Notbremse ---------- */ /* SPF 2.1.60 haelt --spflh-orange als Alias auf --spflh-sig. Auf KTM war das Orange mit weisser Schrift, auf Husky wird daraus Gelb mit weisser Schrift: 1,07:1 — der Haupt-CTA auf der Startseite ist damit unlesbar. Die CTA-Regeln im Plugin muessten --spflh-fill / --spflh-fill-ink nutzen statt des Alias. Bis das dort korrigiert ist, faengt dieser Block es ab. CI: Gelb ist Signatur, nie Flaeche. Flaechen sind blau mit weisser Schrift. */ /* Nur noch --main: Der Sekundaerknopf wird seit spf-buttons.css (12.08.2026) im Plugin selbst richtig gefuellt — --spf-brand-night (Husky: Signalgelb) mit --spf-brand-night-ink als Schrift (10,7:1). Diese Notbremse liess ihn stattdessen auf Blau springen, waehrend die Ruheschrift gelb blieb. HINWEIS zur CI: Damit ist Gelb im Hover eine Flaeche. Der Vermerk oben ("Gelb ist Signatur, nie Flaeche") gilt weiterhin fuer Layoutflaechen; fuer diesen Knopf ist es Kilis ausdrueckliche Vorgabe, damit der Hover nicht die Farbe wechselt. */ .spflh .spflh-cta--main{ background: var(--brand-accent, #273A60); color: var(--brand-on-accent, #FFFFFF); border-color: var(--brand-accent, #273A60); } @media (hover:hover){ .spflh .spflh-cta--main:hover{ background: var(--brand-accent-dark, #1D2C49); color: var(--brand-on-accent, #FFFFFF); border-color: var(--brand-accent-dark, #1D2C49); }} /* Formsprache */ /* Formsprache: Husqvarna arbeitet mit geraden Kanten. Die schraege Unterkante der Hero-Buehne ist KTM-Erbe und wird hier begradigt. Im Plugin steckt sie als clip-path auf .spflh. */ .spflh.spflh{ clip-path: none !important; } /* ---------- 4c) Sektionsmarker auf dunklem Grund ---------- */ /* Der Marker ist eine 3px-Signaturkante unter der Ueberschrift; die Geometrie steht in den jeweiligen Bricks-Templates. Hier nur die Farbe: auf dunklem Grund traegt Markenblau nicht (1,5:1), dort uebernimmt Signalgelb. Selektoren: Landing (s2/s3), Produktseite, Kategorieseite. Das Newsletterband ist dauerhaft dunkel und setzt Gelb direkt im Template. */ body.spf-night .s2-sec-head::before, body.spf-night .s3-sec-head::before, body.spf-night .ktmpdp__title::before, body.spf-night .ktmpdp__xtitle::before, body.spf-night .ktmcat__h1::before{ background: var(--brand-signal, #FFED00); } /* ---------- 5) WooCommerce ---------- */ /* Bricks liefert fuer Woo-Buttons ein neutrales Grau (#E4E7E9) aus. KTM ueberschreibt das in den Theme Styles; Theme Styles wandern beim Template-Import nicht mit. Bis sie auf Husky gepflegt sind: hier. */ a.add_to_cart_button, a.add_to_cart_button:visited, button.single_add_to_cart_button, a.product_type_external{ background-color: var(--brand-accent) !important; color: var(--brand-on-accent) !important; } @media (hover:hover){ a.add_to_cart_button:hover, button.single_add_to_cart_button:hover, a.product_type_external:hover{ background-color: var(--brand-accent-dark) !important; color: var(--brand-on-accent) !important; }} /* ---------- 6) BSO Consent — entfallen am 27.08.2026 ---------- */ /* Hier stand ein `:root`-Block, der `--bsoc-accent` und `--bsoc-accent-text` mit Prioritaet 99 selbst setzte. Der Grund dafuer ist weggefallen: bso-consent setzt den Token seit 1.0.20 aus seiner EINSTELLUNG (`BSOC_Banner::print_inline_css()`), nicht mehr aus einem festen #1c5fa5, und `BSOC_Settings::brand_defaults()` traegt fuer Husky bereits #273a60. Der Block hat danach nichts mehr repariert, sondern nur noch jede Einstellung im Banner lautlos ueberstimmt. Nachgemessen vor dem Entfernen: Im ausgelieferten HTML von /husky/ steht `--bsoc-accent: #273a60`, und nach dem Abschalten der Regel zur Laufzeit bleibt der Token bei #273a60 — der Wert war identisch, das Entfernen also farbneutral. */ /* ---------- 7) Typografie global ---------- */ /* CI §2: Corporate Font ist Helvetica Neue LT Pro, Systemersatz Arial — das Manual erlaubt den Stack ohne Webfont ausdruecklich, es ist also keine Monotype-Weblizenz noetig. Kein Blender Pro (KTM-Hausschrift), kein Roboto Condensed, kein Oswald. Warum als Durchgriff und nicht je Regel: die Fremdschriften kommen nicht aus einer handvoll Regeln, sondern aus den Komponenten selbst — .spfcp/.spfsr/.spfcard (SPF-Plugin), .ktmps/.ktmpdp/.ktm-nl (KTM-Erbe in den Templates) und dem @font-face „Blender Pro" im Legacy-Theme des Plugins (spf-garage-hub). Ein Rewrite in ~50 Dateien waere weder vollstaendig noch nachfuehrbar; hier stehen sie an einer Stelle. Icon-Fonts (dashicons, Font Awesome, Ionicons, WooCommerce) sind ausgenommen — sie brauchen ihre eigene Familie. */ html, body, button, input, select, textarea, optgroup{ font-family: var(--brand-font-body) !important; } /* Gemessen am 05.08.2026 nach SPF 2.1.57: nur noch die Kategorie- und Suchflaechen des Plugins (.spfcp / .spfsr) sowie der Landing-Hero (.spflh) und das Garagen-Panel (#spf-gpanel / #spf-gside) bringen eine eigene Schrift mit bzw. einen Systemstack mit Roboto-Fallback (Roboto Condensed). Ohne die folgende Regel fallen dort 97 Elemente zurueck. Alles Uebrige zieht die Marke inzwischen selbst aus --spf-brand-head / --spf-brand-cond, und Blender kommt gar nicht mehr vor — der frühere Rundumschlag auf .ktmps/.ktmpdp/.ktm-nl/.brxe- ist damit entfallen. */ [class*="spfcp"], [class*="spfsr"], [class*="spflh"], [class*="spfcp"] *:not(i):not(svg):not(path):not([class*="icon"]):not([class*="fa-"]), [class*="spfsr"] *:not(i):not(svg):not(path):not([class*="icon"]):not([class*="fa-"]), [class*="spflh"] *:not(i):not(svg):not(path):not([class*="icon"]):not([class*="fa-"]), #spf-gpanel, #spf-gside, #spf-gpanel *:not(i):not(svg):not(path):not([class*="icon"]):not([class*="fa-"]), #spf-gside *:not(i):not(svg):not(path):not([class*="icon"]):not([class*="fa-"]){ font-family: var(--brand-font-body) !important; } h1,h2,h3,h4,h5,h6, [class*="__title"],[class*="sechead"],[class*="sec-title"],[class*="__name"]{ font-family: var(--brand-font-head) !important; } /* Mixed Case: die CI verlangt Headlines in Gross-/Kleinschreibung, KTM arbeitet durchgehend mit Versalien. Badges, Pills und Tags bleiben bewusst versal — das sind Marker, keine Headlines. */ h1,h2,h3,h4,h5,h6, [class*="__title"],[class*="sechead"],[class*="sec-title"], [class*="__label"],[class*="__cta"],[class*="__btn"],button{ text-transform: none !important; letter-spacing: normal !important; } /* ---------- 8) Dunkle Flaechen ---------- */ /* Footer und Newsletter sind in BEIDEN Modi dunkel. Markenblau als Schrift erreicht dort nur rund 1,5:1 — das verletzt die Kontrasttabelle in §1. Regel: auf dunklem Grund ist Text weiss und die Signatur gelb; Fuellungen bleiben Markenblau mit weisser Schrift (11,3:1). Siehe auch §5. */ .ktm-nl__privacy a{ color:#FFFFFF !important; text-decoration:underline; } @media (hover:hover){ .ktm-nl__privacy a:hover{ color: var(--brand-signal) !important; }} .ktm-nl__email:focus{ border-color: var(--brand-signal) !important; } /* Dasselbe fuer das Formular aus dem Mail-Plugin (seit 19.08.2026). Dessen Grundstellung faerbt den Link mit `--brand-accent` — auf Husky ist das das Markenblau, und das erreicht auf der dunklen Flaeche rund 1,5:1. Ohne diese drei Zeilen waere der Datenschutz-Link im Fussbereich praktisch unlesbar. Die helle Fassung im Kundenkonto ist nicht betroffen und bleibt aussen vor. */ .ktm-nl .bsonl__einwilligung a{ color:#FFFFFF !important; text-decoration:underline; } @media (hover:hover){ .ktm-nl .bsonl__einwilligung a:hover{ color: var(--brand-signal) !important; }} .ktm-nl .bsonl__mail:focus{ border-color: var(--brand-signal) !important; } /* „Nach oben" (Bricks-Element): Fuellung Markenblau, Pfeil und Text weiss. Die Voreinstellung setzt schwarze Schrift — auf Orange ging das, auf Dunkelblau sind es 1,9:1. */ .brxe-back-to-top{ background-color: var(--brand-accent) !important; color: var(--brand-on-accent) !important; } .brxe-back-to-top *{ color: var(--brand-on-accent) !important; } html.spf-night .spfsr-title__q, body.spf-night .spfsr-title__q{ color: var(--brand-signal) !important; } /* Footer-Navigation: der Footer hat je Breakpoint eigene Elemente. Statt in jeder Variante die Farbe zu pflegen, hier einmal ueber die Klasse. Ohne !important, damit der Hover des Widerrufs-Buttons (gelb gefuellt, blaue Schrift) seine eigene Regel behalten kann. */ #brx-footer a.footer-navlink{ color:#FFFFFF; } /* ============================================================================= PRODUKTSEITE — markenspezifische Reste (uebernommen 14.08.2026) ----------------------------------------------------------------------------- Aus dem WPCode-Snippet „Husky PDP markenspezifisch + Nachtlogo" (6084). Von dessen urspruenglich 93 Regeln waren beim Umzug noch diese uebrig; 67 waren mit der KTM-Fassung identisch und liegen laengst einmal im Plugin (spf-product-layout.css), 15 zielten auf Kopfklassen, die es nicht mehr gibt. Was bleibt, sind die Stellen OHNE gemeinsames Token mit KTM: - `spf-chip__low`: KTM #e07c00, Husky Signalgelb — kein Token deckt beides. - Die Regeln mit eingebettetem SVG (Platzhalterbild, leere Buehne). Dort steckt die Farbe im Data-URI, und in einem `url()` greift `var()` nicht. ==> Sauber wird das erst, wenn die Grafik als Maske liegt und die Farbe von aussen kommt. Eigener Schritt, hier bewusst nicht mitgemacht: Ein Umzug soll nichts umbauen. - `.spf-ersetzt-link`, das es nur auf Husky gibt. ==> Die Regeln fuer `.spf-ersetzt-link` sind mangels Daten nicht am lebenden Objekt geprueft: Auf dem Shop trug beim Umzug kein Artikel gepflegte Nachfolger (siehe [[Ersetzt-durch Nachfolgerliste]]). ============================================================================= */ /* KNAPP-FAHNE — HUSKY TRAEGT NIE ORANGE (02.09.2026) Die Fahne an den Groessen-Chips („Nur noch 1") kommt aus `spf-product-page.css` und traegt dort KTM-Orange. Hier bekommt sie die Husky-Signatur. Dass das noetig ist, hat Kili am 02.09.2026 gemeldet: „Bei Husky fehlt das husky styling, da darf kein orange rein." ⚠️ ICH HATTE DIESE REGEL AM SELBEN TAG ENTFERNT, MIT EINER FALSCHEN BEGRUENDUNG. Sie lautete: Die Fahne meldet einen Zustand, und Zustandsfarben sind in beiden Shops dieselben — wie die gruen/rote Verfuegbarkeitszeile daneben. Der Vergleich hinkt. Gruen und Rot gehoeren keiner Marke; Orange gehoert der Schwestermarke und ist im Husqvarna-Shop ein Markenbruch, egal was es bedeutet. Eine Farbe ist nicht deshalb neutral, weil ihre Bedeutung es ist. ZWEI FASSUNGEN, NICHT EINE. Anders als bei KTM traegt hier nicht dieselbe Farbe durch beide Modi — das ist die bestehende Systematik der Palette (siehe `SPF_Brand::DEFAULTS`): Husqvarna-Blau kommt auf der Nachtbuehne nur auf 1,7:1, dort ist Gelb die CI-Signatur. Deshalb `--spf-brand`/`--spf-brand-ink` im Hellen und `--spf-brand-night`/`-night-ink` im Dunkeln, statt fester Werte: Aendert sich die Palette, zieht die Fahne mit. Gemessen: hell #273a60 mit weisser Schrift — Schrift 11,29:1, Flaeche gegen den weissen Chip 11,29:1. Dunkel #ffed00 mit blauer Schrift — Schrift 9,33:1, Flaeche gegen den Chip (#1a1c1e) 14,13:1. Beide Fassungen liegen damit deutlich ueber der KTM-Fassung. Und warum nicht Gelb auch im Hellmodus: Signalgelb gegen den weissen Chip sind 1,21:1 — die Fahne waere als Form praktisch unsichtbar. Genau dafuer hat die Palette zwei Ebenen. */ .spf-chip .spf-chip__low{ --spf-knapp-bg: var(--spf-brand, #273a60); --spf-knapp-ink: var(--spf-brand-ink, #ffffff); } body.spf-night .spf-chip .spf-chip__low{ --spf-knapp-bg: var(--spf-brand-night, #ffed00); --spf-knapp-ink: var(--spf-brand-night-ink, #273a60); } /* Ersetzt-Zeile: Nachfolger-Link in der Meta-Zeile (JS-Snippet 278086 baut um) */ .spf-ersetzt-link{color:var(--brand-accent) !important;text-decoration:none;font-weight:600} /* Husky: Markenblau auf dunklem Grund erreicht nur ~1,5:1. Auf dunklen Flaechen ist die Signatur laut CI §5 Gelb. */ body.spf-night .spf-ersetzt-link{color:var(--brand-signal) !important} @media (hover:hover){ .spf-ersetzt-link:hover{text-decoration:underline}} /* "Kein Bild"-Placeholder im Marken-Stil (Akzent-Slash + KEIN BILD), ersetzt das graue Woo-Berg-Icon per content-Swap. Eigene Variante fuer Night; die Bildflaeche (imgwrap/stage) wird bei Placeholder-Bildern im Night dunkel. */ img[src*="woocommerce-placeholder"]{content:url("data:image/svg+xml;utf8,KEIN BILD")} body.spf-night img[src*="woocommerce-placeholder"]{content:url("data:image/svg+xml;utf8,KEIN BILD") !important} body.spf-night .spfcard__imgwrap:has(img[src*="woocommerce-placeholder"]), body.spf-night .ktmpdp__stage:has(img[src*="woocommerce-placeholder"]), body.spf-night .ktmpdp__thumb:has(img[src*="woocommerce-placeholder"]){background:#17181a !important} /* Hinweis Husky: der Slash im Inline-SVG kann keine CSS-Variable nutzen. Hell = Markenblau #273A60, dunkel = Signalgelb #FFED00 (CI §1: Gelb nur als Signatur, hier auf neutraler dunkler Flaeche gut lesbar). PDP-Galerie ohne Bild: eigener Leerzustand (.ktmpdp__stage--empty mit "Kein Bild"-Span) bekommt denselben Marken-Placeholder als Hintergrund. */ .ktmpdp__stage--empty{background-color:#f5f5f4 !important;background-image:url("data:image/svg+xml;utf8,KEIN BILD") !important;background-size:cover !important;background-position:center !important} .ktmpdp__stage--empty span{display:none} body.spf-night .ktmpdp__stage--empty{background-color:#17181a !important;background-image:url("data:image/svg+xml;utf8,KEIN BILD") !important} /* Dieselbe Markenform fuer die gemeinsame Platzhalter-Komponente (`.spf-keinbild`, spf-global.css): Husqvarna fuehrt den Balken gerade und die Schrift aufrecht — genau wie in den beiden SVGs darueber. KTM bleibt schraeg und kursiv. Die Farbe kommt aus `--spf-brand` und wandert von selbst mit; hier ist NUR die Form zu setzen, nie eine Farbe. Dieses Blatt reiht SPF_Brand mit Prioritaet 99 ein, also nach spf-global.css — gleiche Spezifitaet genuegt. */ .spf-keinbild::before{transform:none} .spf-keinbild::after{font-style:normal} /* ---------- 9) Ersatzteilfinder im Nachtmodus ---------- Gefunden am 14.08.2026, nachdem hell/dunkel beim ersten Besuch der Geraeteeinstellung folgt: Der Auswahlschritt („Kategorie", die Badges der Karten) faerbt seine Beschriftungen mit der Markenfarbe. Auf KTM ist das Orange auf dem Nachtgrund #17181a — 6,05:1, unauffaellig. Auf Husky ist es Markenblau: **1,57:1**, also praktisch unlesbar. Es ist derselbe Fall wie an den uebrigen dunklen Stellen (§8): Auf dunklem Grund traegt Blau nicht, dort uebernimmt die Signatur. Gemessen danach: Gelb auf #17181a liegt bei rund 15:1. Der saubere Ort waere spf-selector-app.css mit einem eigenen Nacht-Token — dann braeuchte es hier nichts. Solange die Datei die Markenfarbe direkt setzt, faengt es das Markenblatt ab. ==> mit der Selector-Sitzung klaeren. */ body.spf-night .spfsel-lbl, html.spf-night .spfsel-lbl, body.spf-night .spfsel-scard__badge, html.spf-night .spfsel-scard__badge{ color: var(--brand-signal, #FFED00) !important; } /* ============================================================================= PRODUKTSEITE v2 — gemischte Schreibung ----------------------------------------------------------------------------- Der neue Aufbau (spf-product-v2.css) setzt Versalien, wo KTM sie fuehrt: Brotkrume, Titel, Abschnittskoepfe, Beschriftungen. Die CI verlangt fuer Husqvarna Gross-/Kleinschreibung (§2). Die Namen sind deutsch (`__titel`) und werden von der allgemeinen Regel weiter oben nicht getroffen, die auf `[class*="__title"]` zielt — deshalb hier ausdruecklich. `.docs__typ` bleibt versal: „PDF" ist ein Marker, keine Ueberschrift. ========================================================================== */ .ppv2 .bc, .ppv2 .kk__eyebrow, .ppv2 .kk__titel, .ppv2 .sek__titel, .ppv2 .sek__alle, .ppv2 .meta__l, .ppv2 .ktmpdp__qtylabel, .ppv2 .spf-required__head, .ppv2 .ersetzt__h{ text-transform: none !important; letter-spacing: .02em; } /* ============================================================================= LANDING-HERO v2 — gemischte Schreibung ----------------------------------------------------------------------------- Der neue Hero (spf-landing-hero-v2.css) setzt Versalien, wo KTM sie fuehrt. Die Klassen heissen deutsch und werden von den allgemeinen Regeln oben ([class*="__title"] usw.) nicht getroffen — deshalb ausdruecklich. Der OEM-Marker in den Vorschlaegen bleibt versal (Marker, keine Headline). ========================================================================== */ .spflh2-titel, .spflh2-label, .spflh2-kopfzeile, .spflh2-los, .spflh2-quick a{ text-transform: none !important; letter-spacing: .02em; }