/* kogblackfriday skin: built by cli/build-css.php from views/css/src (do not edit) */
/* 10-tokens.css */
@font-face {
font-family: "Anton";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../../fonts/anton-latin-ext.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0100-02AF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+1E00-1EFF, U+2000-206F, U+2074, U+20A0-20CF, U+2113, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Anton Fallback";
src: local("Impact"), local("Arial Narrow Bold"), local("ArialNarrow-Bold");
size-adjust: 97%;
ascent-override: 121%;
descent-override: 34%;
line-gap-override: 0%;
}
@font-face {
font-family: "Bungee";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../../fonts/bungee-latin-ext.woff2") format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Bungee";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../../fonts/bungee-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Bungee Fallback";
src: local("Arial Black"), local("Arial-BlackItalic"), local("Impact");
size-adjust: 96%;
ascent-override: 98%;
descent-override: 22%;
line-gap-override: 0%;
}
.kog-bf {
--bf-font-display: "Bungee", "Bungee Fallback", "Arial Black", Impact, sans-serif;
--bf-ink-0: #0b0b0c;
--bf-ink-1: #141416;
--bf-ink-2: #1d1d20;
--bf-ink-3: #26262b;
--bf-black: #000000;
--bf-plate: #ffffff;
--bf-red: #e2201f;
--bf-red-display: #fe4d41;
--bf-red-hover: #c4020b;
--bf-red-press: #ab0008;
--bf-red-text: #fe4d41;
--bf-red-paper: #c4020b;
--bf-red-tint: #fee9e6;
--bf-red-ink: #940307;
--bf-red-soft: rgba(226, 32, 31, .22);
--bf-red-deep: #3d0e0a;
--bf-wine: #7c0205;
--bf-text: #ffffff;
--bf-text-2: #d4d4d8;
--bf-muted: #a1a1aa;
--bf-line: #2e2e33;
--bf-line-strong: #4a4a52;
--bf-line-input: #7a7a84;
--bf-success: #3ddc84;
--bf-success-bg: #0c2416;
--bf-info: #5ab8ff;
--bf-info-bg: #0d2233;
--bf-warning: #ffb020;
--bf-warning-bg: #2a1d05;
--bf-danger: #ff8a80;
--bf-danger-bg: #2a0c0e;
--bf-focus: #ffffff;
--bf-stripe: repeating-linear-gradient(135deg, var(--bf-red) 0 8px, #0b0b0c 8px 16px);
--kog-text: #ffffff;
--kog-text-2: #d4d4d8;
--kog-card-title: #ffffff;
--kog-muted: #a1a1aa;
--kog-line: #2e2e33;
--kog-line-strong: #4a4a52;
--kog-line-input: #7a7a84;
--kog-soft: #1d1d20;
--kog-surface: #141416;
--kog-green-text: var(--bf-red);
--kog-sale: var(--bf-red);
--kog-sale-bg: var(--bf-red-deep);
--kog-success-bg: #0c2416;
--kog-danger: #ff8a80;  --kog-danger-bg: #2a0c0e;
--kog-warning: #ffb020; --kog-warning-bg: #2a1d05;
--kog-info: #5ab8ff;    --kog-info-bg: #0d2233;
--kog-focus: #ffffff;
--kog-focus-ring: rgba(255, 255, 255, .35);
--kog-sh-1: 0 1px 2px rgba(0, 0, 0, .5);
--kog-sh-2: 0 4px 12px rgba(0, 0, 0, .55);
--kog-sh-3: 0 12px 32px rgba(0, 0, 0, .7);
--kogm-text: #ffffff;
--kogm-muted: #a1a1aa;
--kogm-line: #2e2e33;
--kogm-soft: #1d1d20;
--kogm-green-bg: #0c2416;
color-scheme: dark;
background-color: var(--bf-ink-0);
color: var(--bf-text);
}
html:has(> body.kog-bf) {
background: #0b0b0c;
color-scheme: dark;
}
.kog-bf #wrapper,
.kog-bf #main,
.kog-bf #content {
background-color: transparent;
}
.kog-bf #wrapper {
background-color: var(--bf-ink-0);
}
.kog-bf main {
background-color: var(--bf-ink-0);
}
.kog-bf:is(
#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores, [id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)
) #content-wrapper,
.kog-bf .modal-content,
.kog-bf .kog-notice-dialog,
.kog-bf .kog-legal-notice,
.kog-bf .kogconsent-dialog,
.kog-bf .kogconsent-modal__dialog,
.kog-bf .kogquote,
.kog-bf #product .kog-pdp-tabs__panels,
.kog-bf #product .kog-pdp-tabs .tab-content,
.kog-bf .kog-paper {
--kog-text: #1f2523;
--kog-text-2: #3d4743;
--kog-card-title: #222;
--kog-muted: #5b6661;
--kog-line: #e3e8e6;
--kog-line-strong: #c9d1ce;
--kog-line-input: #8c9590;
--kog-soft: #f6f8f7;
--kog-surface: #ffffff;
--kog-green-text: #008848;
--kog-sale: #d92d20;
--kog-sale-bg: #fdecea;
--kog-success-bg: #eef8f2;
--kog-danger: #b42318;  --kog-danger-bg: #fef3f2;
--kog-warning: #b54708; --kog-warning-bg: #fff6e6;
--kog-info: #0b6aa2;    --kog-info-bg: #eef6fb;
--kog-focus: #0b6aa2;
--kog-focus-ring: rgba(11, 106, 162, .25);
--kog-sh-1: 0 1px 2px rgba(16, 24, 40, .06);
--kog-sh-2: 0 4px 12px rgba(16, 24, 40, .08);
--kog-sh-3: 0 12px 32px rgba(16, 24, 40, .16);
--kogm-text: #222;
--kogm-muted: #5b6661;
--kogm-line: #e3e8e6;
--kogm-soft: #f6f8f7;
--kogm-green-bg: #eef8f2;
--bf-focus: #0b6aa2;
color-scheme: light;
color: var(--kog-text);
background-color: #ffffff;
}
.kog-bf.kogcfg-page {
--kc-ink: #1f2523;
--kc-ink-2: #3d4743;
--kc-mute: #5b6661;
--kc-line: #e3e8e6;
--kc-line-2: #c9d1ce;
--kc-input: #8c9590;
--kc-soft: #f6f8f7;
--kc-paper: #ffffff;
--kc-green-t: #008848;
--kc-green-bg: #eef8f2;
--kc-bad: #b42318;
--kc-bad-bg: #fef3f2;
--kc-warn: #b54708;
--kc-warn-bg: #fff6e6;
--kc-info: #0b6aa2;
--kc-info-bg: #eef6fb;
--kc-focus: #0b6aa2;
--kc-focus-ring: rgba(11, 106, 162, .25);
--kc-sh-1: 0 1px 2px rgba(16, 24, 40, .06);
--kc-sh-2: 0 4px 12px rgba(16, 24, 40, .08);
--kc-sh-3: 0 12px 32px rgba(16, 24, 40, .16);
}
.kog-bf:is(
#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores, [id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)
) #content-wrapper {
border-radius: 12px;
padding: 24px;
margin: 0 15px 32px;
flex: 1 1 100%;
max-width: calc(100% - 30px);
}
@media (max-width: 767.98px) {
.kog-bf:is(
#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores, [id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)
) #content-wrapper {
padding: 16px;
border-radius: 0;
margin-left: 0;
margin-right: 0;
max-width: 100%;
}
}
.kog-bf :is(a, button, summary, [tabindex], [role="button"], [role="tab"], input, select, textarea, .btn):focus-visible {
outline: 2px solid #ffffff;
outline-offset: 2px;
box-shadow: 0 0 0 4px #0b0b0c;
}
.kog-bf:is(
#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores, [id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)
) #content-wrapper :is(a, button, summary, [tabindex], [role="button"], [role="tab"], input, select, textarea, .btn):focus-visible,
.kog-bf :is(.modal-content, .kog-notice-dialog, .kog-legal-notice, .kogconsent-dialog, .kogquote, .kog-paper) :is(a, button, summary, [tabindex], [role="button"], [role="tab"], input, select, textarea, .btn):focus-visible {
outline: 2px solid #0b6aa2;
outline-offset: 2px;
box-shadow: none;
}
.kog-bf :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]), select, textarea):focus-visible,
.kog-bf:is(
#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores, [id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)
) #content-wrapper :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]), select, textarea):focus-visible,
.kog-bf :is(.modal-content, .kog-notice-dialog, .kog-legal-notice, .kogconsent-dialog, .kogquote, .kog-paper) :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]), select, textarea):focus-visible {
outline: none;
box-shadow: 0 0 0 3px var(--bf-red-soft);
}
.kog-bf .kog-sec__title::before,
.kog-bf .products-section-title::before {
content: "";
display: inline-block;
width: 24px;
height: 3px;
margin: 0 10px 4px 0;
vertical-align: middle;
background: var(--bf-red);
}
.kog-bf ::selection {
background: var(--bf-red);
color: #ffffff;
}
.kog-bf input:-webkit-autofill,
.kog-bf select:-webkit-autofill {
-webkit-text-fill-color: #1f2523;
box-shadow: 0 0 0 1000px #ffffff inset;
}
@media (forced-colors: active) {
.kog-bf .kog-bfbar__tag,
.kog-bf .kog-bfhero__cta,
.kog-bf .kog-bfhero__tile {
border: 1px solid CanvasText;
}
}
.kog-bf.kogcfg-page #wrapper { background-color: var(--bf-ink-0); }
/* 20-chrome.css */
.kog-bf .kog-bfbar {
background: var(--bf-red);
color: #fff;
font-size: 14px;
line-height: 20px;
}
.kog-bf .kog-bfbar__in {
display: flex;
align-items: center;
gap: 16px;
min-height: 40px;
padding-top: 4px;
padding-bottom: 4px;
}
.kog-bf .kog-bfbar__tag {
flex: none;
padding: 2px 10px;
border-radius: 4px;
background: var(--bf-ink-0);
color: #fff;
font-family: var(--bf-font-display);
font-weight: 400;
font-size: 14px;
line-height: 20px;
letter-spacing: .06em;
white-space: nowrap;
}
.kog-bf .kog-bfbar__text {
flex: 1 1 auto;
min-width: 0;
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #fff;
font-weight: 600;
}
.kog-bf .kog-bfbar__count {
flex: none;
margin: 0;
color: #fff;
font-weight: 600;
white-space: nowrap;
}
.kog-bf .kog-bfbar__time {
display: inline-block;
min-width: 11ch;
font-variant-numeric: tabular-nums;
font-weight: 800;
}
.kog-bf .kog-bfbar__link,
.kog-bf #header .kog-bfbar__link,
.kog-bf .header-banner .kog-bfbar__link {
flex: none;
display: inline-flex;
align-items: center;
min-height: 32px;
color: #fff;
font-weight: 700;
text-decoration: underline;
text-underline-offset: 3px;
white-space: nowrap;
}
.kog-bf .kog-bfbar__link::after {
content: "\203A";
margin-left: 6px;
font-size: 18px;
line-height: 1;
}
.kog-bf .kog-bfbar__link:hover {
color: #fff;
text-decoration-thickness: 2px;
}
.kog-bf .kog-bfbar .kog-bfbar__link:focus-visible {
outline: 2px solid #fff;
outline-offset: 2px;
box-shadow: 0 0 0 4px #0b0b0c;
}
@media (max-width: 767.98px) {
.kog-bf .kog-bfbar { font-size: 13px; }
.kog-bf .kog-bfbar__in { gap: 10px; min-height: 36px; }
.kog-bf .kog-bfbar__count-label { display: none; }
.kog-bf .kog-bfbar__in:has(.kog-bfbar__count) .kog-bfbar__text { display: none; }
.kog-bf .kog-bfbar__in:has(.kog-bfbar__count) .kog-bfbar__count { flex: 1 1 auto; }
}
@media (max-width: 575.98px) {
.kog-bf .kog-bfbar__text {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: normal;
line-height: 17px;
}
}
@media (max-width: 420px) {
.kog-bf .kog-bfbar__link { font-size: 0; }
.kog-bf .kog-bfbar__link::before { content: attr(data-short); font-size: 13px; }
.kog-bf .kog-bfbar__link::after { font-size: 18px; }
}
.kog-bf#index .kog-home-main > .kog-bfhero {
order: 0;
position: relative;
margin: var(--kog-s-4) 0 var(--kog-s-6);
border-radius: 12px;
background: var(--bf-ink-0);
overflow: hidden;
isolation: isolate;
border: 1px solid var(--bf-line);
}
.kog-bf .kog-bfhero::before {
content: "";
position: absolute;
top: 0; left: 0; right: 0;
height: 6px;
background: var(--bf-stripe);
}
.kog-bf .kog-bfhero::after {
content: "";
position: absolute;
z-index: -1;
top: 6px; right: 0;
width: 70%; height: 45%;
background: radial-gradient(ellipse 100% 100% at 100% 0, rgba(124, 2, 5, .75) 0, transparent 100%);
pointer-events: none;
}
.kog-bf .kog-bfhero__in {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 14px;
padding: 36px 20px 28px;
min-height: 360px;
align-content: center;
}
.kog-bf .kog-bfhero__kicker {
margin: 0;
color: var(--bf-red-text);
font-family: var(--bf-font-display);
font-size: 16px;
font-weight: 400;
line-height: 20px;
letter-spacing: .12em;
text-transform: uppercase;
}
.kog-bf .kog-bfhero__title {
margin: 0;
color: #fff;
font-family: var(--bf-font-display);
font-size: clamp(76px, 25vw, 150px);
font-weight: 400;
line-height: .98;
letter-spacing: .01em;
text-transform: uppercase;
}
.kog-bf .kog-bfhero__w1,
.kog-bf .kog-bfhero__accent { display: block; }
.kog-bf .kog-bfhero__accent { color: var(--bf-red); }
.kog-bf .kog-bfhero__text {
margin: 0;
max-width: 52ch;
color: var(--bf-text-2);
font-size: 16px;
line-height: 1.5;
}
.kog-bf .kog-bfhero__ctas {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 6px;
}
.kog-bf .kog-bfhero__cta {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 52px;
padding: 0 24px;
border: 1.5px solid transparent;
border-radius: 8px;
font-family: var(--bf-font-display);
font-size: 19px;
font-weight: 400;
letter-spacing: .06em;
text-transform: uppercase;
text-decoration: none;
text-align: center;
}
.kog-bf .kog-bfhero__cta--primary {
background: var(--bf-red);
border-color: var(--bf-red);
color: #fff;
}
.kog-bf .kog-bfhero__cta--primary::after { content: "\203A"; margin-left: 8px; font-size: 22px; line-height: 1; }
.kog-bf .kog-bfhero__cta--primary:hover { background: var(--bf-red-hover); border-color: var(--bf-red-hover); color: #fff; }
.kog-bf .kog-bfhero__cta--primary:active { background: var(--bf-red-press); border-color: var(--bf-red-press); }
.kog-bf .kog-bfhero__cta--ghost {
background: transparent;
border-color: #fff;
color: #fff;
}
.kog-bf .kog-bfhero__cta--ghost:hover { background: var(--bf-ink-2); color: #fff; }
.kog-bf .kog-bfhero__cta--ghost:active { background: var(--bf-ink-3); }
.kog-bf .kog-bfhero__count {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px;
margin-top: 8px;
}
.kog-bf .kog-bfhero__count-label {
color: var(--bf-text-2);
font-size: 12px;
font-weight: 600;
letter-spacing: .14em;
text-transform: uppercase;
}
.kog-bf .kog-bfhero__tiles {
display: flex;
align-items: flex-start;
gap: 0;
min-width: 0;
}
.kog-bf .kog-bfhero__tile {
display: flex;
flex-direction: column;
align-items: center;
min-width: 2.6em;
color: #fff;
}
.kog-bf .kog-bfhero__tile + .kog-bfhero__tile::before {
content: ":";
position: absolute;
top: 0;
left: 0;
transform: translateX(-50%);
color: var(--bf-red);
font-family: var(--bf-font-display, inherit);
font-size: var(--bf-cd, 36px);
font-weight: 400;
line-height: var(--bf-cd, 36px);
opacity: .9;
}
.kog-bf .kog-bfhero__tile { position: relative; padding: 0 16px; }
.kog-bf .kog-bfhero__tiles { --bf-cd: 38px; }
.kog-bf .kog-bfhero__tile b {
font-family: var(--bf-font-display, inherit);
font-size: var(--bf-cd, 36px);
font-weight: 400;
line-height: var(--bf-cd, 36px);
letter-spacing: .02em;
font-variant-numeric: tabular-nums;
}
.kog-bf .kog-bfhero__tile small {
margin-top: 6px;
color: var(--bf-muted);
font-size: 10px;
letter-spacing: .14em;
text-transform: uppercase;
line-height: 1;
}
.kog-bf .kog-bfhero__tile:first-child { padding-left: 0; align-items: flex-start; }
@media (min-width: 768px) {
.kog-bf .kog-bfhero__in { padding: 48px 40px 40px; min-height: 320px; }
.kog-bf .kog-bfhero__title { font-size: clamp(88px, 9.5vw, 144px); line-height: 1; }
.kog-bf .kog-bfhero__w1,
.kog-bf .kog-bfhero__accent { display: inline; }
.kog-bf .kog-bfhero__ctas { flex-direction: row; flex-wrap: wrap; }
.kog-bf .kog-bfhero__text { font-size: 18px; }
}
@media (min-width: 992px) {
.kog-bf .kog-bfhero__in {
grid-template-columns: minmax(0, 1fr) auto;
column-gap: 40px;
align-items: center;
}
.kog-bf .kog-bfhero__in > * { grid-column: 1; }
.kog-bf .kog-bfhero__in > .kog-bfhero__count {
grid-column: 2;
grid-row: 1 / span 5;
align-self: center;
padding-left: 32px;
border-left: 1px solid var(--bf-line);
}
.kog-bf .kog-bfhero::after { display: none; }
.kog-bf .kog-bfhero__tiles { --bf-cd: 46px; }
}
@media (max-width: 420px) {
.kog-bf .kog-bfhero__in { padding-left: 16px; padding-right: 16px; }
}
.kog-bf .kog-bfhero__pic { display: contents; }
.kog-bf .kog-bfhero .kog-bfhero__img {
display: block;
width: 100%;
height: auto;
max-height: 340px;
object-fit: cover;
background: var(--bf-ink-1);
}
@media (max-width: 767.98px) {
.kog-bf .kog-bfhero--img-desktop .kog-bfhero__img { display: none; }
}
@media (min-width: 992px) {
.kog-bf .kog-bfhero--img .kog-bfhero__in {
grid-template-columns: minmax(0, 1fr);
width: 50%;
min-height: 400px;
padding-right: 32px;
}
.kog-bf .kog-bfhero--img .kog-bfhero__in > .kog-bfhero__count {
grid-column: 1;
grid-row: auto;
width: 100%;
max-width: 360px;
}
.kog-bf .kog-bfhero--img .kog-bfhero__title { font-size: clamp(72px, 6.5vw, 108px); }
.kog-bf .kog-bfhero--img .kog-bfhero__w1,
.kog-bf .kog-bfhero--img .kog-bfhero__accent { display: block; }
.kog-bf .kog-bfhero .kog-bfhero__img {
position: absolute;
top: 6px;
right: 0;
bottom: 0;
width: 50%;
height: calc(100% - 6px);
max-height: none;
}
}
.kog-bf #header { background: var(--bf-ink-1); }
.kog-bf #header a { color: var(--bf-text); }
.kog-bf #header a:hover { color: var(--bf-red-text); }
.kog-bf #header .kog-skip-link { background: var(--bf-ink-1); color: #fff; }
.kog-bf #header .kog-hd-bar {
background: var(--bf-black);
border-bottom: 1px solid var(--bf-line);
}
.kog-bf #header .kog-hd-bar a,
.kog-bf #header .kog-hd-contact a,
.kog-bf #header .kog-hd-contact__item { color: var(--bf-text-2); }
.kog-bf #header .kog-hd-bar a:hover,
.kog-bf #header .kog-hd-contact a:hover { color: #fff; text-decoration: underline; }
.kog-bf #header .kog-hd-contact__item--phone::before { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-links a:hover { color: #fff; }
.kog-bf #header .kog-hd-main__bar {
background: var(--bf-ink-1);
border-bottom: 1px solid var(--bf-red);
box-shadow: 0 1px 0 var(--bf-red);
}
.kog-bf #header.kog-hd--stuck .kog-hd-main__bar {
box-shadow: 0 1px 0 var(--bf-red), var(--kog-sh-2);
}
.kog-bf #header .kog-hd-logo__text { color: #fff; }
.kog-bf #header .kog-hd-act { color: #fff; }
.kog-bf #header .kog-hd-act:hover,
.kog-bf #header .kog-hd-tools.is-open .kog-hd-act--tools { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-act--tools .kog-hd-act__icon,
.kog-bf #header .kog-hd-act--phone .kog-hd-act__icon { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-cart__count { background: var(--bf-red); color: #fff; }
.kog-bf #header .kog-hd-produse__btn { background: var(--bf-red); color: #fff; }
.kog-bf #header .kog-hd-produse__sub { opacity: 1; }
.kog-bf #header .kog-hd-produse__btn:hover,
.kog-bf #header .kog-hd-produse__btn[aria-expanded="true"] { background: var(--bf-red-hover); color: #fff; }
.kog-bf #header .kog-hd-lang__btn:hover { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-lang__current { color: var(--bf-text); }
.kog-bf #header .kog-hd-lang__menu { background: var(--bf-ink-2); border: 1px solid var(--bf-line-strong); }
.kog-bf #header .kog-hd-lang__menu .dropdown-item { color: var(--bf-text); }
.kog-bf #header .kog-hd-lang__menu .dropdown-item:hover,
.kog-bf #header .kog-hd-lang__menu .dropdown-item:focus-visible { color: #fff; background: var(--bf-ink-3); }
.kog-bf #header .kog-hd-lang__menu .current .dropdown-item { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-tools__list { background: var(--bf-ink-2); border: 1px solid var(--bf-line-strong); }
.kog-bf #header .kog-hd-tools__item a { color: var(--bf-text); }
.kog-bf #header .kog-hd-tools__item a::before { color: var(--bf-red-text); }
.kog-bf #header .kog-hd-tools__item a:hover,
.kog-bf #header .kog-hd-tools__item a:focus-visible { color: #fff; background: var(--bf-ink-3); }
.kog-bf #header .kog-hd-secure::before { color: var(--bf-success); }
.kog-bf #header .kog-hd-menu__links .top-menu a[data-depth="0"] { color: var(--bf-text); }
.kog-bf #header .kog-hd-menu__links .top-menu > li.current > a[data-depth="0"],
.kog-bf #header .kog-hd-menu__links .top-menu a[data-depth="0"]:hover { color: var(--bf-red-text); box-shadow: inset 0 -2px 0 var(--bf-red); }
.kog-bf #header .kog-hd-lang-slot .kog-hd-lang__btn { color: var(--bf-text); }
.kog-bf .kog-hd-menu { background: var(--bf-ink-1); }
.kog-bf .kogs .kogs-field {
--ks-l: #8c9590;
--ks-m: #5b6661;
--ks-t: #1f2523;
--ks-f: #0b6aa2;
--ks-fr: rgba(11, 106, 162, .25);
background: #fff;
border-color: #fff;
}
.kog-bf .kogs .kogs-btn { background: var(--bf-red); color: #fff; }
.kog-bf .kogs .kogs-btn:hover,
.kog-bf .kogs .kogs-btn:active { background: var(--bf-red-hover); box-shadow: none; }
.kog-bf .kogs .kogs-field:has(.kogs-input:focus-visible) {
outline: 2px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 4px #0b0b0c;
}
.kog-bf .kogs .kogs-panel {
background: var(--bf-ink-1);
border: 1px solid var(--bf-line-strong);
box-shadow: var(--kog-sh-3);
}
.kog-bf .kogs .kogs-h { color: var(--bf-muted); }
.kog-bf .kogs .kogs-clear { color: var(--bf-red-text); }
.kog-bf .kogs .kogs-a { color: var(--bf-text); }
.kog-bf .kogs .kogs-opt.kogs-on .kogs-a,
.kog-bf .kogs .kogs-a:hover { background: var(--bf-ink-2); }
.kog-bf .kogs .kogs-img { background: #fff; border-radius: 6px; flex-basis: 56px; margin: 4px 0; }
.kog-bf .kogs .kogs-meta { color: var(--bf-muted); }
.kog-bf .kogs .kogs-price { color: var(--bf-text); }
.kog-bf .kogs .kogs-old { color: var(--bf-muted); }
.kog-bf .kogs .kogs-disc { background: var(--bf-red); color: #fff; }
.kog-bf .kogs .kogs-name mark { color: #fff; font-weight: 800; box-shadow: inset 0 -2px 0 var(--bf-red); }
.kog-bf .kogs .kogs-name mark.kog-hl { color: #fff; box-shadow: none; text-decoration-color: var(--bf-red); }
.kog-bf .kogs .kogs-chip,
.kog-bf .kogs-info .kogs-chip { background: var(--bf-ink-3); border: 1px solid var(--bf-line-strong); color: var(--bf-text); }
.kog-bf .kogs .kogs-chip:hover { border-color: #fff; }
.kog-bf .kogs .kogs-more,
.kog-bf .kogs .kogs-more:hover,
.kog-bf .kogs .kogs-more:focus-visible { background: var(--bf-red); color: #fff !important;  }
.kog-bf .kogs .kogs-more:hover { background: var(--bf-red-hover); }
.kog-bf .kogs .kogs-fix { background: var(--bf-warning-bg); }
.kog-bf .kogs .kogs-fix a,
.kog-bf .kogs .kogs-brand { color: var(--bf-red-text); }
.kog-bf .kogs .kogs-none { color: var(--bf-text-2); }
.kog-bf .kogs-ov { background: var(--bf-ink-1); }
.kog-bf .kogs-ov .kogs-ovtop { border-bottom: 1px solid var(--bf-line-strong); }
.kog-bf .kogs-ov .kogs-back { color: #fff; }
.kog-bf .kogs-ov .kogs-input {
--ks-t: #1f2523; --ks-m: #5b6661;
background: #fff; color: #1f2523; border-color: #fff;
}
.kog-bf .kogs-info { background: var(--bf-ink-2); border: 1px solid var(--bf-line-strong); color: var(--bf-text-2); }
.kog-bf .kogs-info a { color: var(--bf-red-text); }
.kog-bf .kogm-btn { background: var(--bf-red); color: #fff; }
.kog-bf .kogm-btn:hover,
.kog-bf .kogm.is-open .kogm-btn { background: var(--bf-red-hover); color: #fff; }
.kog-bf .kogm-burger { color: #fff; }
.kog-bf .kogm-burger:hover { color: var(--bf-red-text); }
.kog-bf .kogm-mega { background: var(--bf-ink-1); border: 1px solid var(--bf-line-strong); box-shadow: 0 18px 40px rgba(0, 0, 0, .7); }
.kog-bf .kogm-mega::before { border-left-color: var(--bf-line); }
.kog-bf .kogm-panel { background: var(--bf-ink-2); border-bottom-color: var(--bf-line); }
.kog-bf .kogm-toplink,
.kog-bf .kogm-everything { color: var(--bf-text); }
.kog-bf .kogm-thumb { background: #fff; border: 1px solid #fff; border-radius: 6px; color: #1f2523; }
.kog-bf .kogm-chev,
.kog-bf .kogm-ulink .kogm-arrow { color: var(--bf-muted); }
.kog-bf .kogm-top.is-current > .kogm-row .kogm-toplink,
.kog-bf .kogm-top.is-open > .kogm-row .kogm-toplink,
.kog-bf .kogm-toplink:hover,
.kog-bf .kogm-toplink:focus-visible { color: var(--bf-red-text); }
.kog-bf .kogm-top.is-active > .kogm-row .kogm-toplink {
background: var(--bf-ink-2); border-left-color: var(--bf-red); color: var(--bf-red-text);
}
.kog-bf .kogm-top.is-active > .kogm-row .kogm-thumb { border-color: #fff; }
.kog-bf .kogm-top.is-active > .kogm-row .kogm-chev { color: var(--bf-red-text); }
.kog-bf .kogm-everything { color: var(--bf-red-text); border-top-color: var(--bf-line); }
.kog-bf .kogm-everything:hover,
.kog-bf .kogm-everything:focus-visible { color: #fff; }
.kog-bf .kogm-card { background: var(--bf-ink-2); border: 1px solid var(--bf-line); color: var(--bf-text); }
.kog-bf .kogm-card:hover,
.kog-bf .kogm-card:focus-visible { border-color: var(--bf-red); box-shadow: none; color: var(--bf-text); }
.kog-bf .kogm-photo,
.kog-bf .kogm-photo img { background: #fff; color: #1f2523; }
.kog-bf .kogm-photo { border-radius: 6px; }
.kog-bf .kogm-cmeta { color: var(--bf-muted); }
.kog-bf .kogm-price:empty::before { background: var(--bf-ink-3); }
.kog-bf .kogm-pnow { color: var(--bf-text); font-family: var(--bf-font-display); font-weight: 400; letter-spacing: 0; }
.kog-bf .kogm-price:has(.kogm-pold) .kogm-pnow { color: var(--bfc-rt); }
.kog-bf .kogm-pold { color: var(--bf-muted); }
.kog-bf .kogm-stitle,
.kog-bf .kogm-stitle a { color: var(--bf-text); }
.kog-bf .kogm-stitle a:hover,
.kog-bf .kogm-stitle a:focus-visible,
.kog-bf .kogm-all,
.kog-bf .kogm-all:hover,
.kog-bf .kogm-all:focus-visible,
.kog-bf .kogm-ulink:hover,
.kog-bf .kogm-ulink:focus-visible { color: var(--bf-red-text); }
.kog-bf .kogm-promo { background: var(--bf-ink-2); border: 1px solid var(--bf-line-strong); color: var(--bf-text); }
.kog-bf .kogm-promo:hover,
.kog-bf .kogm-promo:focus-visible { border-color: var(--bf-red); box-shadow: none; color: var(--bf-text); }
.kog-bf .kogm-promo-t { color: #fff; }
.kog-bf .kogm-promo-p { color: var(--bf-text-2); }
.kog-bf .kogm-promo-btn { background: var(--bf-red); color: #fff; }
.kog-bf .kogm-promo:hover .kogm-promo-btn,
.kog-bf .kogm-promo:focus-visible .kogm-promo-btn { background: var(--bf-red-hover); }
.kog-bf .kogm-top.is-active > .kogm-row,
.kog-bf .kogm-row { border-bottom-color: var(--bf-line); }
.kog-bf .kogm-acc { border-left-color: var(--bf-line); color: var(--bf-text); }
.kog-bf .kogm-useful-t { color: var(--bf-muted); border-bottom-color: var(--bf-line); }
.kog-bf .kogm-ulink { color: var(--bf-text); border-bottom-color: var(--bf-line); }
.kog-bf .kogm-dhead { background: var(--bf-red); color: #fff; }
.kog-bf .kogm-dclose { color: #fff; }
.kog-bf .kogm-backdrop { background: rgba(0, 0, 0, .8); }
.kog-bf #header .kog-mc { background: var(--bf-ink-1); color: var(--bf-text); border: 1px solid var(--bf-line-strong); }
.kog-bf #header .kog-mc__thumb { background: #fff; border-radius: 6px; }
.kog-bf #header .kog-mc__remove:hover { background: var(--bf-ink-3); color: var(--bf-danger); }
.kog-bf #header .kog-mc__link:hover .kog-mc__name { color: var(--bf-red-text); }
.kog-bf #header .kog-mc__more,
.kog-bf #header .kog-mc__empty-link { color: var(--bf-red-text); }
.kog-bf #header .kog-mc__btn.btn-primary,
.kog-bf #header .kog-mc__btn.btn-primary:hover,
.kog-bf #header .kog-mc__btn.btn-primary:focus { color: #fff; }
.kog-bf #header .kog-mc__btn.btn-secondary,
.kog-bf #header .kog-mc__btn.btn-secondary:hover,
.kog-bf #header .kog-mc__btn.btn-secondary:focus { color: #fff; }
.kog-bf .breadcrumb { background: transparent; }
.kog-bf .breadcrumb li,
.kog-bf .breadcrumb li a,
.kog-bf .breadcrumb li::after { color: var(--bf-text-2); }
.kog-bf .breadcrumb li:last-child,
.kog-bf .breadcrumb li:last-child span { color: #fff; }
.kog-bf .breadcrumb li a:hover { color: var(--bf-red-text); }
.kog-bf .kogann-bar { --kogann-ink: #5ab8ff; --kogann-surface: #0d2233; --kogann-line: #1f4a6b; }
.kog-bf .kogann-bar--success, .kog-bf .kogann-bar.is-success, .kog-bf .kogann-bar[data-severity="success"] { --kogann-ink: #3ddc84; --kogann-surface: #0c2416; --kogann-line: #1d5a38; }
.kog-bf .kogann-bar--warning, .kog-bf .kogann-bar.is-warning, .kog-bf .kogann-bar[data-severity="warning"] { --kogann-ink: #ffb020; --kogann-surface: #2a1d05; --kogann-line: #5c4210; }
.kog-bf .kogann-bar--danger, .kog-bf .kogann-bar--error, .kog-bf .kogann-bar.is-danger, .kog-bf .kogann-bar[data-severity="danger"] { --kogann-ink: #ff8a80; --kogann-surface: #2a0c0e; --kogann-line: #6b2226; }
.kog-bf .kogann-bar .kogann-bar__close:hover { background: rgba(255, 255, 255, .08); }
.kog-bf .kogann-bar .kogann-bar__close:active { background: rgba(255, 255, 255, .14); }
.kog-bf .btn-primary,
.kog-bf .btn-primary:hover,
.kog-bf .btn-primary:focus,
.kog-bf .btn-primary:active {
--kog-green-text: var(--bf-red);
--kog-surface: #ffffff;
}
.kog-bf .btn-primary.disabled,
.kog-bf .btn-primary:disabled {
--kog-green-text: var(--bf-red);
}
.kog-bf .btn-danger,
.kog-bf .btn-danger:hover,
.kog-bf .btn-danger:focus,
.kog-bf .btn-danger:active {
--kog-danger: #b42318;
--kog-surface: #ffffff;
}
.kog-bf .koght-tab[aria-selected="true"]::after { background: var(--bf-red); height: 3px; }
.kog-bf .koght-tab:hover::after { background: var(--bf-line-strong); }
.kog-bf .koght-more-label { color: var(--bf-red-text); }
.kog-bf .koght-more:hover,
.kog-bf .koght-more:focus-visible { border-color: var(--bf-red); background: var(--bf-ink-2); }
.kog-bf .koght-arrow { background: var(--bf-ink-2); border-color: var(--bf-line-strong); color: #fff; }
.kog-bf .koght-arrow:hover:not(:disabled) { background: var(--bf-ink-3); border-color: #fff; color: #fff; }
.kog-bf .koght-arrow:disabled { color: var(--bf-line-strong); }
.kog-bf .koght-tabs-next::before { background: var(--bf-ink-2); border-color: var(--bf-line-strong); }
.kog-bf .koght-testi-dots i { background: var(--bf-line-strong); }
.kog-bf .koght-help .kog-hs-tools strong,
.kog-bf .koght-help .kog-hs-mini-wa,
.kog-bf .koght-help .kog-hs-contact a,
.kog-bf .koght-help .kog-hs-mini-tel:hover,
.kog-bf .koght-help a.kog-hs-wa,
.kog-bf .koght-cats__link:hover .koght-cats__name,
.kog-bf .koght-status-link { color: var(--bf-red-text); }
.kog-bf .koght-help a.kog-hs-wa { border-color: var(--bf-red-text); background: transparent; }
.kog-bf .koght-help a.kog-hs-call { background: var(--bf-red); color: #fff; }
.kog-bf .koght-help .kog-hs-cfg:hover { background: var(--bf-ink-3); }
.kog-bf .kogrv-gattr { color: var(--bf-muted); }
.kog-bf .kogrv-place-link,
.kog-bf .kogrv-notice a,
.kog-bf .kogrv-more { color: var(--bf-red-text); }
.kog-bf .kogrv-place-link:hover,
.kog-bf .kogrv-place-link:focus-visible,
.kog-bf .kogrv-notice a:hover { color: #fff; }
.kog-bf .kogrv-about { color: var(--bf-muted); }
.kog-bf .kogbr-all,
.kog-bf .kogbr-all:hover,
.kog-bf .kogbr-all:focus-visible { color: var(--bf-red-text); }
.kog-bf .kogbr-link { background: #fff; box-shadow: 0 0 0 4px #fff; border-radius: 4px; }
.kog-bf #footer .kog-footer-before { background: var(--bf-ink-1); border-bottom-color: var(--bf-line); }
.kog-bf .kog-b2b-strip { background: var(--bf-ink-1); border-color: var(--bf-line-strong); }
.kog-bf .kog-b2b-strip__cta { color: var(--bf-red-text); }
.kog-bf .kog-b2b-strip__cta:hover { color: #fff; }
.kog-bf .kog-b2b-line a:hover { color: var(--bf-red-text); }
.kog-bf #footer {
position: relative;
background-color: var(--bf-ink-0);
border-top-color: var(--bf-black);
color: var(--bf-text-2);
}
.kog-bf #footer::before {
content: "";
position: absolute;
z-index: 2;
top: 0; left: 0; right: 0;
height: 6px;
background: var(--bf-stripe);
pointer-events: none;
}
.kog-bf #footer .kog-footer__title,
.kog-bf #footer .kog-footer__title a,
.kog-bf #footer .kog-contact__heading,
.kog-bf #footer .kog-social__title { color: #fff; }
.kog-bf #footer .kog-footer__title,
.kog-bf #footer .kog-contact__heading { position: relative; }
.kog-bf #footer .kog-footer__title::before,
.kog-bf #footer .kog-contact__heading::before {
content: "";
position: absolute;
top: -12px; left: 0;
width: 24px; height: 3px;
background: var(--bf-red);
}
.kog-bf #footer a { color: var(--bf-text-2); }
.kog-bf #footer .kog-footer__list a:hover,
.kog-bf #footer .kog-contact__phone:hover, .kog-bf #footer .kog-contact__mail:hover,
.kog-bf #footer .kog-contact__phone:focus-visible, .kog-bf #footer .kog-contact__mail:focus-visible { color: #fff; text-decoration: underline; }
.kog-bf #footer .kog-contact__icon,
.kog-bf #footer .kog-footer-help__icon { color: var(--bf-red-text); }
.kog-bf #footer .kog-contact__group .kog-contact__action,
.kog-bf #footer .kog-contact__map:hover, .kog-bf #footer .kog-contact__map:focus-visible,
.kog-bf #footer .kog-social__link:hover, .kog-bf #footer .kog-social__link:focus-visible,
.kog-bf #footer .kog-footer-bar__social .kog-social__link:hover,
.kog-bf #footer .kog-footer-bar__cookies:hover { color: var(--bf-red-text); }
.kog-bf #footer .kog-footer-bar { background: var(--bf-black); border-top-color: var(--bf-line); color: var(--bf-muted); }
.kog-bf #footer .kog-footer-bar a { color: var(--bf-text-2); }
.kog-bf #footer .kog-footer-help__btn:hover { color: #fff; }
.kog-bf #footer.js-kog-footer .kog-contact__group--accordion .kog-footer__toggle { color: #fff; }
.kog-bf .kog-top { background-color: var(--bf-ink-2); color: #fff; border: 1px solid var(--bf-line-strong); }
.kog-bf .kog-top:hover { background-color: var(--bf-red); color: #fff; }
.kog-bf .kogconsent-banner { background: var(--bf-ink-2); border: 1px solid var(--bf-line-strong); color: var(--bf-text); }
.kog-bf .kogconsent-banner .kogconsent-btn:hover { background: var(--bf-red-hover); border-color: var(--bf-red-hover); color: #fff; }
.kog-bf .kogconsent-banner .kogconsent-btn:active { background: var(--bf-red-press); }
.kog-bf .kogconsent-banner .kogconsent-btn--quiet { background: var(--bf-ink-2); border-color: var(--bf-line-input); color: #fff; }
.kog-bf .kogconsent-banner .kogconsent-btn--quiet:hover,
.kog-bf .kogconsent-banner .kogconsent-btn--quiet:active { background: var(--bf-ink-3); border-color: #fff; color: #fff; }
.kog-bf .kogconsent-banner .kogconsent-link,
.kog-bf .kogconsent-banner a.kogconsent-link,
.kog-bf .kogconsent-banner a.kogconsent-link:visited,
.kog-bf .kogconsent-banner a.kogconsent-link:focus { color: var(--bf-text-2); text-decoration: underline; }
.kog-bf .kogconsent-banner .kogconsent-link:hover { color: #fff; }
.kog-bf .kogconsent-dialog .kogconsent-btn { background: var(--bf-red); border-color: var(--bf-red); color: #fff; }
.kog-bf .kogconsent-dialog .kogconsent-btn:hover { background: var(--bf-red-hover); border-color: var(--bf-red-hover); }
.kog-bf .kogconsent-dialog .kogconsent-btn--quiet { background: #fff; border-color: #8c9590; color: #1f2523; }
.kog-bf .kogconsent-dialog .kogconsent-btn--quiet:hover { background: #f6f8f7; border-color: #3d4743; color: #1f2523; }
.kog-bf .kogconsent-dialog .kogconsent-switch:checked { background: var(--bf-red); border-color: var(--bf-red); }
.kog-bf .kogconsent-modal__backdrop { background: rgba(0, 0, 0, .8); }
.kog-bf .kogwa { box-shadow: 0 2px 4px rgba(0, 0, 0, .4), 0 6px 16px rgba(0, 0, 0, .5); }
.kog-bf .kogquote .kogquote__btn--primary { --kog-green-text: var(--bf-red); --kog-surface: #ffffff; }
.kog-bf .kogquote .kogquote__btn--secondary { --kog-green-text: var(--bf-red-paper); }
.kog-bf .modal-backdrop,
.kog-bf .modal-backdrop.in,
.kog-bf .modal-backdrop.show { background: #000; opacity: .8; }
.kog-bf .modal-header { background: var(--bf-ink-1); color: #fff; border-bottom: 0; border-radius: 12px 12px 0 0; }
.kog-bf .modal-header .modal-title,
.kog-bf .modal-header h1, .kog-bf .modal-header h2, .kog-bf .modal-header h3, .kog-bf .modal-header h4,
.kog-bf .modal-header .close, .kog-bf .modal-header .close span { color: #fff; opacity: 1; }
.kog-bf #blockcart-modal .modal-header { position: relative; background: var(--bf-ink-1); }
.kog-bf #blockcart-modal .modal-header::before {
content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px;
background: var(--bf-stripe); border-radius: 12px 12px 0 0;
}
.kog-bf .kog-notice-dialog__head { background: var(--bf-ink-1); color: #fff; }
.kog-bf .kog-notice-dialog__head .kog-notice-dialog__title,
.kog-bf .kog-notice-dialog__close { color: #fff; }
.kog-bf #notifications .alert,
.kog-bf .notifications-container .alert { background: var(--bf-ink-2); border-color: var(--bf-line-strong); color: #fff; }
.kog-bf #notifications .alert-success, .kog-bf .notifications-container .alert-success { border-left: 4px solid var(--bf-success); }
.kog-bf #notifications .alert-danger, .kog-bf .notifications-container .alert-danger { border-left: 4px solid var(--bf-danger); }
.kog-bf #notifications .alert-warning, .kog-bf .notifications-container .alert-warning { border-left: 4px solid var(--bf-warning); }
.kog-bf#pagenotfound h1,
.kog-bf#pagenotfound .page-title,
.kog-bf#pagenotfound .page-header h1 { color: #fff; }
.kog-bf#pagenotfound .page-not-found { color: var(--bf-text-2); }
.kog-bf .kog-404__code { color: var(--bf-red); font-weight: 900; letter-spacing: -.03em; font-size: clamp(64px, 18vw, 120px); }
.kog-bf .kog-404__lead,
.kog-bf .kog-404__subtitle { color: var(--bf-text-2); }
.kog-bf .kog-404__form .form-control { background: #fff; border-color: #fff; color: #1f2523; }
.kog-bf .kog-404__form .form-control::placeholder { color: #5b6661; opacity: 1; }
.kog-bf #main .kog-404__cat { background: var(--bf-ink-1); border-color: var(--bf-line-strong); color: #fff; }
.kog-bf #main .kog-404__cat:hover,
.kog-bf #main .kog-404__cat:focus-visible { border-color: var(--bf-red); color: var(--bf-red-text); }
.kog-bf dialog::backdrop,
.kog-bf .kog-notice-dialog::backdrop { background: rgba(0, 0, 0, .8); }
.kog-bf:is(#my-account, #identity, #addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking,
#order-follow, #authentication, #registration, #password, #cms, #sitemap, #contact, #stores,
[id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)) #content-wrapper#content-wrapper {
--kog-green-text: #007a40;
}
#cms.kog-bf #main .page-content.page-cms.kog-doc .kog-doc__toc-list .is-current > a,
.kog-bf .kog-acc-nav__link[aria-current="page"] {
background: var(--kog-sale-bg);
color: var(--bf-red-paper);
}
.kog-bf .kog-acc-nav__link[aria-current="page"] .kog-acc-icon { color: var(--bf-red-paper); }
/* 30-commerce.css */
.kog-bf {
--bfc-rt: var(--bf-red-text);
--bfc-ok: var(--bf-success);
}
.kog-bf:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #my-account, #identity,
#addresses, #address, #history, #order-detail, #order-slip, #discount, #guest-tracking, #order-follow,
#cms, #sitemap, #contact, #stores,
[id^="module-"]:not(#module-kogcompare-compare, #module-kogblackfriday-offers)) #content-wrapper#content-wrapper,
.kog-bf .modal-content,
.kog-bf#product .kog-pdp-tabs .tabs .tab-content {
--bfc-rt: var(--bf-red-paper);
--bfc-ok: #008848;
}
.kog-bf .product-flags li.product-flag.kog-bf {
display: inline-block;
order: -2;
border-color: var(--bf-ink-0);
border-radius: var(--kog-r-xs);
background: var(--bf-ink-0);
color: #fff;
font-family: var(--bf-font-display);
font-weight: 400;
letter-spacing: .05em;
}
.kog-bf .product-flags:has(> li.kog-bf):has(> li:is(.discount, .discount-amount, .discount-percentage)) > li.kog-bf {
border-radius: var(--kog-r-xs) var(--kog-r-xs) 0 0;
}
.kog-bf .product-flags:has(> li.kog-bf) > li:is(.discount, .discount-amount, .discount-percentage) {
order: -1;
margin-top: calc(-1 * var(--kog-s-1));
border-radius: 0 0 var(--kog-r-xs) var(--kog-r-xs);
}
.kog-bf .kog-card .product-flags li.product-flag.kog-bf {
max-width: calc(100cqw - 46px);
white-space: normal;
}
@container kogcard (max-width: 169px) {
.kog-bf .kog-card .product-flags li.product-flag.kog-bf {
padding: 2px 5px;
font-size: 12px;
line-height: 13px;
letter-spacing: .03em;
}
}
@container kogcard (max-width: 149.98px) {
.kog-bf .kog-card .product-flags li.product-flag.kog-bf { width: min-content; }
}
.kog-bf .product-cover .product-flags > li.kog-bf,
.kog-bf .quickview .product-flags > li.kog-bf {
border-radius: var(--kog-r-xs);
}
.kog-bf .product-flags li.product-flag:is(.discount, .discount-amount, .discount-percentage, .on-sale),
.kog-bf .kog-badge--sale {
--kog-surface: #fff;
}
.kog-bf .product-flags li.product-flag.new,
.kog-bf .kog-badge--new {
border-color: var(--bfc-ok);
color: var(--bfc-ok);
}
.kog-bf .product-flags li.product-flag.out_of_stock,
.kog-bf .kog-badge--dark {
--kog-text-2: #3f3f46;
--kog-surface: #fff;
}
@media (forced-colors: active) {
.kog-bf .product-flags li.product-flag { border: 1px solid CanvasText; }
}
.kog-bf .kog-card__media {
background: var(--bf-plate);
}
.kog-bf .kog-card .kog-card__title a:hover {
color: var(--bfc-rt);
}
.kog-bf .kog-card--sale .kog-card__now,
.kog-bf .kog-card--sale .kog-card__now .price {
color: var(--bfc-rt);
}
.kog-bf .kog-card .kog-card__now {
font-family: var(--bf-font-display);
font-size: 24px;
font-weight: 400;
letter-spacing: .02em;
}
.kog-bf #wrapper .kog-sec__head .kog-sec__title,
.kog-bf #wrapper .koght-head .koght-title,
.kog-bf #wrapper .kogbr-head .kogbr-title {
font-family: var(--bf-font-display);
font-weight: 400;
font-size: 28px;
line-height: 32px;
letter-spacing: .03em;
text-transform: uppercase;
}
.kog-bf .kog-card__cart:not(.kog-card__cart--view),
.kog-bf .kog-card__cart:is(:hover, :focus-visible) {
--kog-surface: #fff;
}
.kog-bf .kog-card__cart {
border-color: var(--bf-red);
}
.kog-bf .kog-card__cart:not(.kog-card__cart--view):not(:disabled) {
background-color: var(--bf-red);
}
.kog-bf .kog-card__cart:not(.kog-card__cart--view):not(:disabled):is(:hover, :focus-visible) {
background-color: var(--bf-red-hover);
border-color: var(--bf-red-hover);
background-image: none;
}
.kog-bf .kog-card__cart:not(.kog-card__cart--view):not(:disabled):active {
background-color: var(--bf-red-press);
border-color: var(--bf-red-press);
background-image: none;
}
.kog-bf a.kog-card__cart--view:is(:hover, :focus-visible) {
border-color: var(--bf-red-hover);
background-color: var(--bf-red-hover);
background-image: none;
}
.kog-bf .kog-card__cart:disabled,
.kog-bf .kog-card__cart[disabled] {
background: var(--bf-ink-3);
border-color: var(--bf-ink-3);
color: var(--bf-muted);
}
.kog-bf .kog-card__qv:is(:hover, :focus-visible) {
border-color: var(--bfc-rt);
color: var(--bfc-rt);
}
@media (hover: hover) and (pointer: fine) {
.kog-bf .kog-card:hover {
border-color: var(--bf-red);
box-shadow: 0 10px 24px rgba(0, 0, 0, .6);
}
.kog-bf #products.kog-view-list .kog-card:hover {
box-shadow: none;
}
}
.kog-bf .kog-noimg {
--kog-surface: #fff;
--kog-soft: #f6f8f7;
--kog-line-input: #8c9590;
--kog-muted: #5b6661;
}
.kog-bf .kog-volt--card {
border-color: #e3e8e6;
background: rgba(255, 255, 255, .94);
color: #1f2523;
}
.kog-bf .kog-warranty--card {
--kog-text: #1f2523;
--kog-line: #e3e8e6;
--kog-green-text: #008848;
background: rgba(255, 255, 255, .94);
color: #1f2523;
}
.kog-bf .kog-warranty--pdp {
border-color: var(--bf-line-strong);
}
.kog-bf .kog-warranty svg {
stroke: var(--bf-success);
}
.kog-bf .kog-warranty--card svg {
stroke: #008848;
}
.kog-bf .kog-card__media > .kogcmp-btn--card {
--kog-text-2: #3d4743;
--kog-line-strong: #c9d1ce;
--kog-surface: #fff;
--kog-success-bg: #eef8f2;
color: #3d4743;
}
.kog-bf .kog-card__media > .kogcmp-btn--card:hover {
border-color: var(--bf-red-paper);
color: var(--bf-red-paper);
}
.kog-bf .kog-card__media > .kogcmp-btn--card[aria-pressed="true"] {
border-color: var(--bf-ink-0);
background: var(--bf-ink-0);
color: #fff;
}
.kog-bf .kog-card__media > .kogcmp-btn--card {
width: 28px;
padding: 0;
justify-content: center;
}
.kog-bf .kog-card__media > .kogcmp-btn--card .kogcmp-btn__txt {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.kog-bf #wrapper .products.kog-grid.is-kog-loading::after {
background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .06), rgba(255, 255, 255, 0));
}
.kog-bf .faceted-overlay {
background: rgba(0, 0, 0, .55);
}
.kog-bf .kog-added {
background: var(--bf-red);
color: #fff;
}
.kog-bf #wrapper .kog-sec__all,
.kog-bf #wrapper .kog-sec__all:hover {
color: var(--bfc-rt);
}
.kog-bf #wrapper .kog-sec__tab[aria-selected="true"] {
border-bottom-color: var(--bf-red);
}
.kog-bf #wrapper .kog-sec__tab:hover {
border-bottom-color: var(--bf-line-strong);
}
.kog-bf #wrapper .kog-sec__arrow:hover:not(:disabled) {
border-color: var(--bf-red);
background: var(--bf-ink-2);
}
.kog-bf:is(#category, #search, #manufacturer, #supplier, #prices-drop, #new-products, #best-sales) #wrapper,
.kog-bf#product #wrapper {
background: var(--bf-ink-0);
}
.kog-bf #wrapper .kog-desc.is-folded .kog-desc__text::after {
background: linear-gradient(transparent, var(--bf-ink-0));
}
.kog-bf #wrapper :is(.kog-desc__text, #manufacturer-short_description, #manufacturer-description) a,
.kog-bf #wrapper .kog-desc__toggle {
color: var(--bfc-rt);
}
.kog-bf #wrapper :is(.kog-desc__text, #manufacturer-short_description, #manufacturer-description) a:hover {
color: #fff;
}
.kog-bf #wrapper .kog-sort .kog-sort__btn,
.kog-bf #wrapper .kog-toolbar__btn {
background: var(--bf-ink-3);
}
.kog-bf #wrapper .kog-sort .kog-sort__btn:hover,
.kog-bf #wrapper .kog-toolbar__btn:hover {
border-color: var(--bf-text-2);
}
.kog-bf #wrapper .kog-sort .select-list.current {
color: var(--bf-red-text);
}
.kog-bf #wrapper .kog-toolbar__viewbtn[aria-pressed="true"] {
border-color: var(--bf-red);
}
.kog-bf #wrapper .kog-active__chip {
border-color: var(--bf-line-strong);
background: var(--bf-ink-3);
color: #fff;
}
.kog-bf #wrapper .kog-active__chip:hover,
.kog-bf #wrapper .kog-active__chip--all:hover {
border-color: var(--bf-text-2);
background: var(--bf-ink-2);
color: #fff;
}
.kog-bf #wrapper .kog-active__chip svg {
color: var(--bf-text-2);
}
.kog-bf #wrapper .kog-active__chip--all {
background: transparent;
color: var(--bf-text-2);
}
.kog-bf #wrapper .kog-pager .page-list li.current a {
--kog-surface: #fff;
border-color: var(--bf-red);
background: var(--bf-red);
}
.kog-bf #wrapper .kog-pager .page-list a:hover {
border-color: var(--bf-red);
background: var(--bf-ink-2);
}
.kog-bf #wrapper .kog-pager .page-list li.current a:hover {
background: var(--bf-red-hover);
}
.kog-bf #wrapper .kog-pager .page-list a.disabled {
color: var(--bf-line-strong);
}
.kog-bf #wrapper #left-column #search_filters.kog-facets {
border-color: var(--bf-line);
}
.kog-bf #wrapper .kog-facets__heading {
background: var(--bf-ink-2);
border-bottom-color: var(--bf-line);
}
.kog-bf #wrapper #search_filters .facet .kog-facet__title,
.kog-bf:is(#category, #search, #manufacturer, #supplier, #prices-drop, #new-products, #best-sales) #left-column #search_filters .facet .facet-title {
color: var(--bf-text);
}
.kog-bf #wrapper .kog-facets .kog-facets__clearbtn {
border-color: var(--bf-text-2);
background: transparent;
}
.kog-bf #wrapper .kog-facets .kog-facets__clearbtn:hover {
border-color: #fff;
background: var(--bf-ink-2);
}
.kog-bf #wrapper .kog-facet__check {
background: var(--bf-ink-3);
}
.kog-bf #wrapper .kog-facet__check:hover {
border-color: var(--bf-text-2);
}
.kog-bf #wrapper .kog-facet__check:checked {
--kog-surface: #fff;
border-color: var(--bf-red);
background: var(--bf-red);
}
.kog-bf #wrapper #search_filters .facet .kog-facet__label a.kog-facet__link:hover .kog-facet__text {
color: var(--bf-red-text);
}
.kog-bf #wrapper #search_filters .ui-slider-horizontal {
background: var(--bf-line-strong);
}
.kog-bf #wrapper #search_filters .ui-slider .ui-slider-range {
background: var(--bf-red);
}
.kog-bf #wrapper #search_filters .ui-slider .ui-slider-handle {
border-color: #fff;
background: var(--bf-red);
box-shadow: 0 0 0 1px var(--bf-red), var(--kog-sh-1);
}
.kog-bf #wrapper .kog-facet__dropdown .select-title {
background: var(--bf-ink-3);
}
.kog-bf #wrapper .kog-facet__dropdown .select-list:hover {
background: var(--bf-ink-2);
}
@media (max-width: 991.98px) {
.kog-bf.kog-filters-open .kog-filters-backdrop,
.kog-bf body.kog-filters-open .kog-filters-backdrop {
background: rgba(0, 0, 0, .75);
}
.kog-bf #wrapper #left-column #search_filters_wrapper.kog-filters {
border-right: 2px solid var(--bf-red);
}
}
.kog-bf .kog-cover {
background: var(--bf-plate);
border-color: var(--bf-line);
}
.kog-bf .kog-cover img {
background: transparent;
}
.kog-bf .kog-cover .kog-noimg {
border-radius: inherit;
}
.kog-bf .kog-thumbs .product-images > li.thumb-container .thumb,
.kog-bf .kog-thumbs .product-images > li.thumb-container .thumb:not(.selected) {
background: var(--bf-plate);
border-color: var(--bf-line-strong);
}
.kog-bf .kog-thumbs .product-images > li.thumb-container .thumb:hover {
border-color: var(--bf-text-2);
}
.kog-bf .kog-thumbs .product-images > li.thumb-container .thumb.selected {
border: 2px solid var(--bf-red);
box-shadow: none;
}
.kog-bf .kog-zoom {
--kog-line: #4a4a52;
}
.kog-bf .kog-pdp-meta__logo {
padding: 4px 10px;
background: var(--bf-plate);
border-radius: var(--kog-r-sm);
}
.kog-bf a.kog-pdp-meta__value:hover {
color: var(--bf-red-text);
}
.kog-bf .kog-price .product-price.has-discount .current-price-value {
color: var(--bf-red-text);
}
.kog-bf .kog-price .current-price-value {
font-family: var(--bf-font-display);
font-size: 36px;
font-weight: 400;
letter-spacing: .02em;
}
.kog-bf .kog-price .kog-price__was .regular-price {
color: var(--bf-muted);
}
.kog-bf .product-actions .kog-buy {
border-color: var(--bf-line-strong);
border-radius: var(--kog-r-lg);
background: var(--bf-ink-1);
}
.kog-bf .js-product-add-to-cart .product-quantity > .qty:not(:has(.bootstrap-touchspin)),
.kog-bf .js-product-add-to-cart .bootstrap-touchspin {
background: var(--bf-ink-3);
}
.kog-bf .js-product-add-to-cart .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin,
.kog-bf .js-product-add-to-cart .qty #quantity_wanted {
background: var(--bf-ink-3);
}
.kog-bf .js-product-add-to-cart .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin:hover {
background: var(--bf-ink-2);
}
.kog-bf .js-product-add-to-cart .add > .btn.btn-primary.add-to-cart {
--kog-surface: #fff;
background-color: var(--bf-red);
}
.kog-bf .js-product-add-to-cart .add > .btn.btn-primary.add-to-cart:not(:disabled):not(.disabled):is(:hover, :focus-visible) {
background-color: var(--bf-red-hover);
background-image: none;
}
.kog-bf .js-product-add-to-cart .add > .btn.btn-primary.add-to-cart:not(:disabled):not(.disabled):active {
background-color: var(--bf-red-press);
background-image: none;
}
.kog-bf .js-product-add-to-cart .add > .btn.btn-primary.add-to-cart:is(:disabled, .disabled),
.kog-bf .js-product-add-to-cart .add > .btn.btn-primary.add-to-cart:is(:disabled, .disabled):is(:hover, :focus-visible, :active) {
background-color: var(--bf-ink-3);
color: var(--bf-muted);
}
.kog-bf .js-product-add-to-cart #product-availability .product-available {
color: var(--bf-success);
}
.kog-bf .kog-buy .product-discounts > .table-product-discounts thead tr th {
background: var(--bf-ink-2);
}
.kog-bf .kog-copy.is-done,
.kog-bf .kog-copy__tip {
color: var(--bf-success);
}
.kog-bf .kogcmp-btn:hover {
border-color: var(--bf-red-text);
color: var(--bf-red-text);
}
.kog-bf .kogcmp-btn[aria-pressed="true"] {
border-color: var(--bf-success);
background: var(--bf-success-bg);
color: var(--bf-success);
}
.kog-bf .kog-card__media > .kogcmp-btn--card[aria-pressed="true"] {
border-color: var(--bf-ink-0);
background: var(--bf-ink-0);
color: #fff;
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs {
border-color: var(--bf-line-strong);
background: var(--bf-ink-1);
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link,
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link:hover,
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link.active {
color: var(--bf-text-2);
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link:hover {
background: var(--bf-ink-3);
color: #fff;
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link.active {
background: var(--bf-red);
box-shadow: none;
color: #fff;
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link .kogcompat-tablink__count {
background: var(--bf-ink-3);
color: var(--bf-text-2);
}
.kog-bf#product .kog-pdp-tabs .tabs .nav-tabs .nav-link.active .kogcompat-tablink__count {
background: rgba(0, 0, 0, .28);
color: #fff;
}
.kog-bf#product .kog-pdp-tabs .tabs .tab-content {
--kog-text: #1f2523;
--kog-text-2: #3d4743;
--kog-card-title: #222;
--kog-muted: #5b6661;
--kog-line: #e3e8e6;
--kog-line-strong: #c9d1ce;
--kog-line-input: #8c9590;
--kog-soft: #f6f8f7;
--kog-surface: #ffffff;
--kog-green-text: #008848;
--kog-sale: #d92d20;
--kog-sale-bg: #fdecea;
--kog-success-bg: #eef8f2;
--kog-danger: #b42318;  --kog-danger-bg: #fef3f2;
--kog-warning: #b54708; --kog-warning-bg: #fff6e6;
--kog-info: #0b6aa2;    --kog-info-bg: #eef6fb;
--kog-focus: #0b6aa2;
--kog-focus-ring: rgba(11, 106, 162, .25);
margin-top: var(--kog-s-3);
padding: var(--kog-s-5);
border-radius: var(--kog-r-lg);
background: #fff;
color: #1f2523;
color-scheme: light;
}
.kog-bf#product .kog-pdp-tabs .tabs .tab-content > .tab-pane {
padding: 0;
}
@media (max-width: 767.98px) {
.kog-bf#product .kog-pdp-tabs .tabs .tab-content {
padding: var(--kog-s-4);
}
}
.kog-bf#product #description .product-description a,
.kog-bf#product .product-short-description a {
color: var(--bf-red-paper);
}
.kog-bf#product .kog-pdp-tabs .tab-content #description .product-description a {
color: var(--bf-red-paper);
}
.kog-bf#product .kog-pdp-tabs .tab-content .kog-file__name:hover {
color: var(--bf-red-paper);
}
.kog-bf#product .product-short-description a {
color: var(--bf-red-text);
}
.kog-bf .kog-sbar {
border-top-color: var(--bf-red);
box-shadow: 0 -4px 12px rgba(0, 0, 0, .5);
}
.kog-bf .kog-sbar__img {
background: var(--bf-plate);
}
@media (min-width: 992px) {
.kog-bf .kog-sbar {
border-top: 0;
border-bottom: 2px solid var(--bf-red);
box-shadow: 0 4px 12px rgba(0, 0, 0, .5);
}
}
.kog-bf .kog-sbar__btn {
--kog-surface: #fff;
}
.kog-bf .kog-sbar__was:not(:empty) ~ .kog-sbar__price {
color: var(--bf-red-text);
}
.kog-bf .kogcompat {
--kc-accent: var(--bf-red-text);
--kc-on-accent: #fff;
--kc-surface: var(--bf-ink-1);
--kc-soft: var(--bf-ink-2);
--kc-row-hover: var(--bf-ink-2);
--kc-rec-bg: var(--bf-ink-3);
--kc-rec-bg-soft: var(--bf-ink-2);
--kc-badge-rec-bg: var(--bf-ink-3);
--kc-badge-rec-fg: #fff;
--kc-badge-value-bg: var(--bf-info-bg);
--kc-badge-value-fg: var(--bf-info);
--kc-feat-rec-line: var(--bf-red);
}
.kog-bf .kogcompat__chip:hover {
background: var(--bf-ink-3);
color: #fff;
}
.kog-bf .kogcompat__chip[aria-pressed="true"] {
background: var(--bf-ink-3);
box-shadow: 0 0 0 1px var(--bf-red);
}
.kog-bf .kogcompat-feat--rec .kogcompat-buy__btn,
.kog-bf .kogcompat__bar-cart,
.kog-bf .kogcompat-buy__btn:hover {
background: var(--bf-red);
border-color: var(--bf-red);
color: #fff;
}
@media (hover: hover) {
.kog-bf .kogcompat-row:hover .kogcompat-buy__btn {
background: var(--bf-red);
border-color: var(--bf-red);
color: #fff;
}
}
.kog-bf .kogcompat-feat--rec .kogcompat-buy__btn:hover,
.kog-bf .kogcompat__bar-cart:hover {
background: var(--bf-red-hover);
border-color: var(--bf-red-hover);
box-shadow: none;
}
.kog-bf .kogcompat-buy__btn {
background: transparent;
border-color: var(--bf-red-text);
color: var(--bf-red-text);
}
.kog-bf .kogcompat-buy__old ~ .kogcompat-buy__now {
color: var(--bf-red-text);
}
.kog-bf .kogcompat__fbtn[data-active] {
border-color: var(--bf-red-text);
}
.kog-bf .kogcmp-tray {
border-color: var(--bf-line-strong);
border-top: 2px solid var(--bf-red);
}
.kog-bf .kogcmp-tray__img {
background: var(--bf-plate);
}
.kog-bf .kogcmp-tray .kogcmp-tray__go {
--kog-surface: #fff;
}
.kog-bf .kogcmp-tray__x {
background: var(--bf-ink-3);
}
.kog-bf .kogcmp-tray__x:hover {
color: var(--bf-red-text);
border-color: var(--bf-red-text);
}
.kog-bf .kogcmp-pc__img {
border-radius: var(--kog-r-md);
background: var(--bf-plate);
}
.kog-bf .kogcmp-pc__img img {
padding: 4%;
box-sizing: border-box;
}
.kog-bf .kogcmp-pc__name:hover,
.kog-bf .kogcmp-pg__copy:hover,
.kog-bf .kogcmp-slot__a:hover,
.kog-bf .kogcmp-empty__ic {
color: var(--bf-red-text);
}
.kog-bf .kogcmp-pg__copy:hover,
.kog-bf .kogcmp-slot__a:hover {
border-color: var(--bf-red-text);
}
.kog-bf .kogcmp-pc__x:hover,
.kog-bf .kogcmp-pc__x:focus-visible {
color: var(--bf-red-text);
}
.kog-bf .kogcmp-pc__old ~ .kogcmp-pc__now {
color: var(--bf-red-text);
}
.kog-bf .kogcmp-table > thead > tr > *,
.kog-bf .kogcmp-corner {
background: var(--bf-ink-2);
}
.kog-bf .kogcmp-sw__track::after {
background: #fff;
}
.kog-bf .kogcmp-sw__in:checked + .kogcmp-sw__track {
background: var(--bf-red);
}
.kog-bf .kogcmp-legend__sw {
background: var(--bf-red-deep);
box-shadow: inset 3px 0 0 var(--bf-red), inset 0 0 0 1px var(--bf-line);
}
.kog-bf .kogcmp-table .kogcmp-row.is-diff > td {
background: var(--bf-red-deep);
color: #fff;
}
.kog-bf .kogcmp-table .kogcmp-row.is-diff > th[scope="row"] {
background: var(--bf-red-deep);
box-shadow: inset 3px 0 0 var(--bf-red), 1px 0 0 var(--bf-line);
}
.kog-bf .kogcmp-table .kogcmp-row.is-diff > td.kogcmp-slot-cell {
background: var(--bf-ink-2);
}
.kog-bf .kogcmp-table .kogcmp-sec th {
background: var(--bf-ink-2);
}
.kog-bf:is(#cart, #checkout, #order-confirmation) #content-wrapper#content-wrapper {
--kog-green-text: var(--bf-red-paper);
--kog-green: var(--bf-red);
--kog-success-bg: var(--bf-red-tint);
}
.kog-bf #blockcart-modal .modal-content {
--kog-green-text: var(--bf-red-paper);
--kog-green: var(--bf-red);
}
.kog-bf:is(#cart, #checkout, #order-confirmation) #content-wrapper :is(
.kog-cartline__total .gift,
section.checkout-step.-reachable.-complete:not(.-current) h1 .done,
#content-hook_order_confirmation .card-title .done,
.kog-asel__tag,
.kog-guar, .kog-garan, .kog-notice-link, .kog-legal-notice
),
.kog-bf#order-confirmation #content-hook_order_confirmation.card,
.kog-bf #blockcart-modal .kog-cartmodal__check {
--kog-green-text: #008848;
--kog-green: #00a859;
--kog-success-bg: #eef8f2;
}
.kog-bf:is(#cart, #checkout, #order-confirmation) #content-wrapper .btn-primary,
.kog-bf #blockcart-modal .btn-primary {
--kog-surface: #fff;
}
.kog-bf#cart .cart-grid-right .cart-summary.card,
.kog-bf#checkout #js-checkout-summary {
border-top: 4px solid var(--bf-red);
}
.kog-bf #blockcart-modal.kog-cartmodal .modal-content {
border: 0;
}
.kog-bf #blockcart-modal .kog-cartmodal__head {
--kog-text: #fff;
--kog-text-2: #d4d4d8;
--kog-surface: var(--bf-ink-1);
position: relative;
border-bottom: 0;
background: var(--bf-ink-1);
color: #fff;
}
.kog-bf #blockcart-modal .kog-cartmodal__head::before {
content: "";
position: absolute;
top: 0;
right: 0;
left: 0;
height: 6px;
background: var(--bf-stripe);
}
.kog-bf #blockcart-modal .kog-cartmodal__title {
padding-top: 6px;
}
.kog-bf #blockcart-modal .kog-cartmodal__check {
color: var(--bf-success);
}
.kog-bf #blockcart-modal .kog-cartmodal__close {
margin-top: 6px;
color: #fff;
}
.kog-bf #blockcart-modal .kog-cartmodal__close:hover {
background: var(--bf-ink-3);
}
.kog-bf #blockcart-modal .kog-cartmodal__close:focus-visible {
outline-color: #fff;
box-shadow: none;
}
.kog-bf .kog-b2b-badge {
border-color: var(--kog-info);
color: var(--kog-info);
}
.kog-bf .kog-b2b-line a:hover,
.kog-bf .kog-b2b-strip__cta {
color: var(--bf-red-text);
}
.kog-bf .cart-summary-line.kog-b2b-total .value {
color: var(--kog-info);
}
@media (max-width: 767.98px) {
.kog-bf .kog-price .current-price-value { font-size: 32px; }
}
/* 40-staff.css */
.kog-bf .kog-bfpv {
position: fixed;
left: 84px;
bottom: 16px;
z-index: 989;
max-width: min(560px, calc(100vw - 24px));
padding: 8px 12px;
border: 2px solid var(--bf-red);
border-radius: 8px;
background: #0b0b0c;
color: #ffffff;
font-size: 13px;
font-weight: 600;
line-height: 1.4;
box-shadow: 0 4px 12px rgba(0, 0, 0, .55);
}
.kog-bf .kog-bfpv .kog-bfpv__exit {
display: inline-block;
min-height: 24px;
margin-left: 6px;
color: #ffffff;
text-decoration: underline;
white-space: nowrap;
}
.kog-bf .kog-bfpv .kog-bfpv__exit:hover { color: var(--bf-red-text); }
.kog-bf .kog-bfpv .kog-bfpv__exit:focus-visible {
outline: 2px solid #ffffff;
outline-offset: 2px;
box-shadow: 0 0 0 4px #0b0b0c;
}
@media (max-width: 575.98px) {
.kog-bf .kog-bfpv { font-size: 12px; left: 8px; bottom: 96px; max-width: calc(100vw - 16px); }
}
/* 60-v3.css */
.kog-bf#index .kog-home-main > .kog-bfx { order: 0; }
.kog-bf#index .kog-home-main > .kog-bft,
.kog-bf#index .kog-home-main > .kog-bf-rail { order: 1; }
.kog-bf .kog-bfx {
position: relative;
margin: var(--kog-s-4) 0 var(--kog-s-6);
border-radius: 12px;
background: #000;
overflow: hidden;
isolation: isolate;
color: #fff;
}
.kog-bf .kog-bfx::before {
content: "";
display: block;
height: 8px;
background: var(--bf-stripe);
}
.kog-bf .kog-bfx__stage {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 28px;
padding: 28px 16px 24px;
}
.kog-bf .kog-bfx__copy {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
min-width: 0;
}
.kog-bf .kog-bfx__kicker {
margin: 0;
color: var(--bf-red-text);
font-family: var(--bf-font-display);
font-size: 12px;
font-weight: 400;
line-height: 18px;
letter-spacing: .08em;
}
.kog-bf .kog-bfx__title {
margin: 0;
color: #fff;
font-family: var(--bf-font-display);
font-size: clamp(48px, 15.5vw, 72px);
font-weight: 400;
line-height: .96;
letter-spacing: 0;
}
.kog-bf .kog-bfx__w1,
.kog-bf .kog-bfx__accent { display: block; }
.kog-bf .kog-bfx__accent { color: var(--bf-red); }
.kog-bf .kog-bfx__stamp {
display: inline-flex;
flex-direction: column;
align-items: flex-start;
margin: 4px 0 0;
padding: 10px 16px 12px;
background: var(--bf-red);
color: #fff;
transform: rotate(-3deg);
transform-origin: 0 100%;
box-shadow: 0 10px 24px rgba(0, 0, 0, .55);
}
.kog-bf .kog-bfx__upto {
font-family: var(--bf-font-display);
font-size: 14px;
line-height: 18px;
letter-spacing: .06em;
}
.kog-bf .kog-bfx__max {
font-family: var(--bf-font-display);
font-size: 56px;
line-height: 56px;
letter-spacing: 0;
white-space: nowrap;
}
.kog-bf .kog-bfx__mid { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.kog-bf .kog-bfx__text {
margin: 0;
max-width: 46ch;
color: var(--bf-text-2);
font-size: 16px;
line-height: 1.5;
}
.kog-bf .kog-bfx__count { display: flex; flex-direction: column; gap: 8px; }
.kog-bf .kog-bfx__count-label {
color: var(--bf-text-2);
font-size: 12px;
font-weight: 600;
letter-spacing: .14em;
text-transform: uppercase;
}
.kog-bf .kog-bfx__tiles { --bf-cd: 30px; display: flex; align-items: flex-start; }
.kog-bf .kog-bfx__tile {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
min-width: 2.3em;
padding: 0 12px;
}
.kog-bf .kog-bfx__tile:first-child { padding-left: 0; align-items: flex-start; }
.kog-bf .kog-bfx__tile + .kog-bfx__tile::before {
content: ":";
position: absolute;
top: 0;
left: 0;
transform: translateX(-50%);
color: var(--bf-red);
font-family: var(--bf-font-display);
font-size: var(--bf-cd);
line-height: var(--bf-cd);
}
.kog-bf .kog-bfx__tile b {
font-family: var(--bf-font-display);
font-size: var(--bf-cd);
font-weight: 400;
line-height: var(--bf-cd);
font-variant-numeric: tabular-nums;
}
.kog-bf .kog-bfx__tile small {
margin-top: 6px;
color: var(--bf-muted);
font-size: 10px;
line-height: 1;
letter-spacing: .14em;
text-transform: uppercase;
}
.kog-bf .kog-bfx__ctas { display: flex; flex-direction: column; gap: 10px; width: 100%; }
.kog-bf .kog-bfx__cta {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 52px;
padding: 0 24px;
border: 1.5px solid transparent;
border-radius: 8px;
font-size: 17px;
font-weight: 800;
line-height: 1.2;
text-align: center;
text-decoration: none;
}
.kog-bf .kog-bfx__cta--primary { background: var(--bf-red); border-color: var(--bf-red); color: #fff; }
.kog-bf .kog-bfx__cta--primary::after { content: "\203A"; margin-left: 10px; font-size: 24px; line-height: 1; }
.kog-bf .kog-bfx__cta--primary:hover,
.kog-bf .kog-bfx__cta--primary:focus-visible { background: var(--bf-red-hover); border-color: var(--bf-red-hover); color: #fff; text-decoration: none; }
.kog-bf .kog-bfx__cta--primary:active { background: var(--bf-red-press); border-color: var(--bf-red-press); }
.kog-bf .kog-bfx__cta--ghost { background: transparent; border-color: #fff; color: #fff; }
.kog-bf .kog-bfx__cta--ghost:hover,
.kog-bf .kog-bfx__cta--ghost:focus-visible { background: var(--bf-ink-2); color: #fff; text-decoration: none; }
.kog-bf .kog-bfx__deals {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 70%;
gap: 14px;
margin: 0 -16px;
padding: 10px 16px 6px;
list-style: none;
overflow-x: auto;
scroll-snap-type: x mandatory;
scroll-padding: 0 16px;
scrollbar-width: none;
}
.kog-bf .kog-bfx__deals::-webkit-scrollbar { display: none; }
.kog-bf .kog-bfx__deal { min-width: 0; scroll-snap-align: start; }
.kog-bf .kog-bfx__deal-link {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 8px;
color: #fff;
text-decoration: none;
}
.kog-bf .kog-bfx__plate {
display: block;
aspect-ratio: 1 / 1;
padding: 8%;
border-radius: 10px;
background: var(--bf-plate);
overflow: hidden;
}
.kog-bf .kog-bfx__plate img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
transition: transform .5s cubic-bezier(.16, 1, .3, 1);
}
.kog-bf .kog-bfx__off {
position: absolute;
top: -8px;
left: -6px;
padding: 4px 10px 5px;
background: var(--bf-red);
color: #fff;
font-family: var(--bf-font-display);
font-size: 18px;
line-height: 22px;
white-space: nowrap;
transform: rotate(-4deg);
box-shadow: 0 6px 14px rgba(0, 0, 0, .45);
}
.kog-bf .kog-bfx__name {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
min-height: 2.7em;
color: #fff;
font-size: 14px;
font-weight: 600;
line-height: 1.35;
}
.kog-bf .kog-bfx__prices { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.kog-bf .kog-bfx__old { color: var(--bf-muted); font-size: 13px; text-decoration-thickness: 1px; }
.kog-bf .kog-bfx__new { color: var(--bf-red-text); font-size: 20px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kog-bf .kog-bfx__save { display: none; }
.kog-bf .kog-bfx__deal-link:hover .kog-bfx__plate img { transform: scale(1.05); }
.kog-bf .kog-bfx__deal-link:hover .kog-bfx__name { text-decoration: underline; text-underline-offset: 3px; }
.kog-bf .kog-bfx__deal-link:focus-visible { outline: 2px solid #fff; outline-offset: 4px; border-radius: 10px; }
@media (min-width: 576px) {
.kog-bf .kog-bfx__ctas { flex-direction: row; flex-wrap: wrap; width: auto; }
.kog-bf .kog-bfx__deals { grid-auto-columns: 44%; }
}
@media (min-width: 768px) {
.kog-bf .kog-bfx__stage { padding: 40px 32px 32px; gap: 32px; }
.kog-bf .kog-bfx__kicker { font-size: 14px; }
.kog-bf .kog-bfx__title { font-size: clamp(72px, 10vw, 96px); }
.kog-bf .kog-bfx__w1,
.kog-bf .kog-bfx__accent { display: inline; }
.kog-bf .kog-bfx__max { font-size: 64px; line-height: 64px; }
.kog-bf .kog-bfx__tiles { --bf-cd: 36px; }
.kog-bf .kog-bfx__deals {
grid-auto-flow: row;
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-auto-columns: auto;
margin: 0;
padding: 10px 0 0;
overflow: visible;
}
}
@media (min-width: 992px) {
.kog-bf .kog-bfx__stage {
grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
column-gap: 48px;
align-items: center;
padding: 44px 44px 40px;
}
.kog-bf .kog-bfx__copy { gap: 14px; }
.kog-bf .kog-bfx__title { font-size: clamp(72px, 6.7vw, 98px); }
.kog-bf .kog-bfx__w1,
.kog-bf .kog-bfx__accent { display: block; }
.kog-bf .kog-bfx__mid { flex-direction: row; align-items: center; gap: 28px; margin-top: 16px; }
.kog-bf .kog-bfx__mid .kog-bfx__stamp { flex: 0 0 auto; margin: 0; }
.kog-bf .kog-bfx__mid .kog-bfx__text { font-size: 16px; }
.kog-bf .kog-bfx__deals {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 22px 20px;
}
.kog-bf .kog-bfx__deal--lead { grid-column: 1 / -1; }
.kog-bf .kog-bfx__deal:not(.kog-bfx__deal--lead) .kog-bfx__plate { aspect-ratio: 5 / 4; padding: 6%; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__deal-link {
grid-template-columns: minmax(0, 46%) minmax(0, 1fr);
grid-template-rows: auto auto 1fr;
column-gap: 22px;
align-items: start;
}
.kog-bf .kog-bfx__deal--lead .kog-bfx__plate { grid-row: 1 / span 3; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__name { -webkit-line-clamp: 3; min-height: 0; font-size: 17px; margin-top: 30px; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__prices { flex-direction: column; align-items: flex-start; gap: 4px; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__old { font-size: 15px; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__new { font-size: 30px; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__off { font-size: 26px; line-height: 30px; padding: 6px 14px 7px; }
.kog-bf .kog-bfx__deal--lead .kog-bfx__save {
display: inline-block;
justify-self: start;
margin-top: 6px;
padding: 6px 10px;
border: 1px solid var(--bf-red);
border-radius: 6px;
color: #fff;
font-size: 14px;
}
.kog-bf .kog-bfx__deal--lead .kog-bfx__save b { font-weight: 800; }
}
@media (min-width: 1200px) {
.kog-bf .kog-bfx__stage { padding: 40px 56px 40px; column-gap: 64px; }
.kog-bf .kog-bfx__max { font-size: 64px; line-height: 64px; }
.kog-bf .kog-bfx__tiles { --bf-cd: 40px; }
}
@media (min-width: 992px) {
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__stage {
grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
grid-template-rows: auto auto auto 1fr;
align-items: start;
}
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__copy { display: contents; }
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__kicker { grid-column: 1; grid-row: 1; }
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__title { grid-column: 1; grid-row: 2; }
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__mid { grid-column: 1; grid-row: 3; }
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__count { grid-column: 2; grid-row: 2 / span 2; align-self: end; justify-self: start; }
.kog-bf .kog-bfx:not(.kog-bfx--deals) .kog-bfx__ctas { grid-column: 2; grid-row: 4; align-self: start; }
}
@media (prefers-reduced-motion: no-preference) {
.kog-bf .kog-bfx__stamp { animation: kogbfx-stamp .75s cubic-bezier(.16, 1, .3, 1) .2s both; }
.kog-bf .kog-bfx__deal { animation: kogbfx-rise .8s cubic-bezier(.16, 1, .3, 1) both; animation-delay: calc(.32s + var(--i, 0) * .09s); }
}
@media (prefers-reduced-motion: reduce) {
.kog-bf .kog-bfx__plate img { transition: none; }
}
@keyframes kogbfx-stamp {
0% { opacity: 0; transform: rotate(-9deg) scale(1.7); }
60% { opacity: 1; }
100% { opacity: 1; transform: rotate(-3deg) scale(1); }
}
@keyframes kogbfx-rise {
from { opacity: 0; transform: translateY(26px); }
to { opacity: 1; transform: none; }
}
.kog-bf .kog-bft { margin: 0 0 var(--kog-s-7); }
.kog-bf #wrapper .kog-bft__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kog-bf #wrapper .kog-bft__head .kog-bft__title { margin-bottom: 0; }
.kog-bf .kog-bft__all { white-space: nowrap; }
.kog-bf .kog-bft__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 4px 20px;
margin: 16px 0 0;
padding: 0;
list-style: none;
}
.kog-bf .kog-bft__item { min-width: 0; }
.kog-bf .kog-bft__tile {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 10px;
height: 100%;
min-height: 140px;
padding: 14px 4px 12px;
border-top: 1px solid var(--bf-line-strong);
color: #fff;
text-decoration: none;
transition: border-color .2s ease, transform .3s cubic-bezier(.16, 1, .3, 1);
}
.kog-bf .kog-bft__name {
font-family: var(--bf-font-display);
font-size: 13px;
line-height: 18px;
overflow-wrap: anywhere;
}
.kog-bf .kog-bft__deal { display: flex; flex-direction: column; }
.kog-bf .kog-bft__upto { color: var(--bf-muted); font-family: var(--bf-font-display); font-size: 11px; line-height: 14px; letter-spacing: .06em; }
.kog-bf .kog-bft__pct {
color: var(--bf-red-display);
font-family: var(--bf-font-display);
font-size: 34px;
line-height: 38px;
white-space: nowrap;
}
.kog-bf .kog-bft__count { color: var(--bf-text-2); font-size: 13px; line-height: 1.3; }
.kog-bf .kog-bft__tile:hover,
.kog-bf .kog-bft__tile:focus-visible { border-top-color: var(--bf-red); color: #fff; text-decoration: none; }
.kog-bf .kog-bft__tile:hover .kog-bft__name { text-decoration: underline; text-underline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
.kog-bf .kog-bft__tile:hover { transform: translateY(-3px); }
}
@media (min-width: 768px) {
.kog-bf .kog-bft__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 28px; }
.kog-bf .kog-bft__tile { min-height: 160px; padding: 18px 2px 16px; }
.kog-bf .kog-bft__name { font-size: 15px; line-height: 20px; }
.kog-bf .kog-bft__pct { font-size: 44px; line-height: 48px; }
}
.kog-bf .kog-bfo {
margin: 0 0 var(--kog-s-5);
border-radius: 12px;
background: #000;
overflow: hidden;
}
.kog-bf .kog-bfo::before { content: ""; display: block; height: 6px; background: var(--bf-stripe); }
.kog-bf .kog-bfo__top {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 16px 20px;
padding: 20px 16px 16px;
}
.kog-bf .kog-bfo__head { min-width: 0; }
.kog-bf .kog-bfo__title {
display: flex;
flex-direction: column;
gap: 4px;
margin: 0;
color: #fff;
font-family: var(--bf-font-display);
font-weight: 400;
}
.kog-bf .kog-bfo__kicker { color: var(--bf-red-text); font-size: 13px; line-height: 18px; letter-spacing: .06em; text-transform: uppercase; }
.kog-bf .kog-bfo__h { font-size: clamp(26px, 7.4vw, 48px); line-height: 1.02; overflow-wrap: anywhere; }
.kog-bf .kog-bfo__count { margin: 8px 0 0; color: var(--bf-text-2); font-size: 15px; }
.kog-bf .kog-bfo__stamp {
display: inline-flex;
flex-direction: column;
margin: 0;
padding: 8px 12px 10px;
background: var(--bf-red);
color: #fff;
transform: rotate(-3deg);
font-family: var(--bf-font-display);
}
.kog-bf .kog-bfo__upto { font-size: 11px; line-height: 14px; letter-spacing: .06em; }
.kog-bf .kog-bfo__max { font-size: 34px; line-height: 36px; white-space: nowrap; }
.kog-bf .kog-bfo__count-down {
grid-column: 1 / -1;
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 4px 12px;
color: var(--bf-text-2);
font-size: 14px;
}
.kog-bf .kog-bfo__cd-label { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.kog-bf .kog-bfo__cd { color: #fff; font-size: 18px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kog-bf .kog-bfo__cd b { font-weight: 800; }
.kog-bf .kog-bfo__filters {
display: flex;
flex-direction: column;
gap: 12px;
padding: 14px 16px 16px;
border-top: 1px solid var(--bf-line);
}
.kog-bf .kog-bfo__group { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kog-bf .kog-bfo__glabel { flex: 0 0 auto; width: 84px; color: var(--bf-muted); font-size: 13px; font-weight: 600; }
.kog-bf .kog-bfo__chips {
display: flex;
gap: 8px;
min-width: 0;
margin: 0 -16px 0 0;
padding: 2px 16px 2px 2px;
list-style: none;
overflow-x: auto;
scrollbar-width: thin;
}
.kog-bf .kog-bfo__chips li { flex: 0 0 auto; }
.kog-bf .kog-bfo__chip {
display: inline-flex;
align-items: center;
gap: 6px;
min-height: 36px;
padding: 0 14px;
border: 1px solid var(--bf-line-strong);
border-radius: 999px;
background: var(--bf-ink-1);
color: #fff;
font-size: 14px;
font-weight: 600;
white-space: nowrap;
text-decoration: none;
}
.kog-bf .kog-bfo__n { color: var(--bf-muted); font-weight: 500; font-variant-numeric: tabular-nums; }
.kog-bf .kog-bfo__chip:hover,
.kog-bf .kog-bfo__chip:focus-visible { border-color: #fff; color: #fff; text-decoration: none; }
.kog-bf .kog-bfo__chip.is-current { border-color: var(--bf-red); background: var(--bf-red); color: #fff; }
.kog-bf .kog-bfo__chip.is-current .kog-bfo__n { color: #fff; }
@media (min-width: 768px) {
.kog-bf .kog-bfo__top { padding: 28px 28px 20px; grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 32px; }
.kog-bf .kog-bfo__count-down { grid-column: auto; flex-direction: column; gap: 4px; padding-left: 28px; border-left: 1px solid var(--bf-line); }
.kog-bf .kog-bfo__max { font-size: 48px; line-height: 50px; }
.kog-bf .kog-bfo__upto { font-size: 13px; }
.kog-bf .kog-bfo__filters { padding: 16px 28px 20px; }
.kog-bf .kog-bfo__chips { flex-wrap: wrap; overflow: visible; margin-right: 0; padding-right: 0; }
}
.kog-bf .kog-bfdeal {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px 14px;
margin: 12px 0 4px;
padding: 14px 14px 12px;
border-radius: 8px;
background: #000;
position: relative;
overflow: hidden;
}
.kog-bf .kog-bfdeal::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--bf-stripe); }
.kog-bf .kog-bfdeal__tag {
padding: 3px 8px 4px;
background: var(--bf-red);
color: #fff;
font-family: var(--bf-font-display);
font-size: 13px;
line-height: 18px;
letter-spacing: .02em;
}
.kog-bf .kog-bfdeal__save { color: #fff; font-size: 16px; line-height: 1.35; }
.kog-bf .kog-bfdeal__save b { font-weight: 800; }
.kog-bf .kog-bfdeal__pct { color: var(--bf-red-text); font-weight: 800; white-space: nowrap; }
.kog-bf .kog-bfdeal__count { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; color: var(--bf-text-2); font-size: 13px; }
.kog-bf .kog-bfdeal__cl { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.kog-bf .kog-bfdeal__time { color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kog-bf .kog-price:has(.kog-bfdeal) .kog-price__save { display: none; }
.kog-bf .kog-bf-cartsave {
display: block;
margin: 0 0 10px;
padding: 10px 12px;
border-radius: 8px;
background: var(--bf-red-tint);
color: var(--bf-red-ink);
font-size: 15px;
font-weight: 600;
line-height: 1.35;
}
.kog-bf .kog-bf-cartsave b { color: var(--bf-red-ink); font-weight: 800; white-space: nowrap; }
.kog-bf #header .kog-hd-bar .kog-hd-links li > a.kog-bf-navlink {
color: #fff;
font-weight: 800;
text-decoration: none;
background: var(--bf-red);
padding: 3px 10px;
border-radius: 4px;
}
.kog-bf #header .kog-hd-bar .kog-hd-links li > a.kog-bf-navlink:hover,
.kog-bf #header .kog-hd-bar .kog-hd-links li > a.kog-bf-navlink:focus-visible { background: var(--bf-red-hover); color: #fff; text-decoration: none; }
/* 70-gross-only.css */
.kog-bf-gross .product-without-taxes,
.kog-bf-gross .kog-price__net,
.kog-bf-gross .kognx-price__net,
.kog-bf-gross .kognx-qty__net,
.kog-bf-gross .kognx-buy__net {
display: none !important;
}
/* 75-campaign-text.css */
.kog-bf .kog-bfbar__short { display: none; }
@media (max-width: 767.98px) {
.kog-bf .kog-bfbar__in:has(.kog-bfbar__short) { flex-wrap: wrap; row-gap: 2px; padding-top: 4px; padding-bottom: 4px; }
.kog-bf .kog-bfbar__short {
display: block;
order: 10;
flex: 1 0 100%;
margin: 0;
color: #fff;
font-weight: 600;
font-size: 13px;
line-height: 17px;
white-space: normal;
}
}
.kog-bf .kog-bfx__vat { font-size: 12px; font-weight: 400; opacity: .85; white-space: nowrap; }
.kog-bf .kognx-cat {
background: var(--bf-ink-2);
color: var(--bf-text-2);
border: 1px solid var(--bf-line-strong);
}
.kog-bf .kognx-cat .kognx-cat__link { color: var(--bf-text); text-decoration: underline; }
.kog-bf .kognx-cat .kognx-cat__link:hover { color: var(--bf-red-text); }
/* 76-brand-banners.css */
.kog-bf .kog-home-featured { display: none; }
.kog-bf .kog-bfbrands { display: grid; gap: 16px; margin: 8px 0 40px; }
.kog-bf .kog-bfbrand {
display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 40px; align-items: center;
padding: 40px; border: 1px solid var(--bf-line-strong); border-radius: 16px; background: var(--bf-ink-1); color: var(--bf-text);
}
.kog-bf .kog-bfbrand__copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.kog-bf .kog-bfbrand__logo { display: block; height: 54px; width: auto; max-width: 100%; filter: brightness(0) invert(1); }
.kog-bf .kog-bfbrand__word { font: 400 30px/1 var(--bf-font-display); letter-spacing: .01em; }
.kog-bf .kog-bfbrand__pct { margin: 28px 0 0; font: 400 120px/.9 var(--bf-font-display); color: var(--bf-red-display); white-space: nowrap; letter-spacing: -.01em; }
.kog-bf .kog-bfbrand__line { margin: 18px 0 0; font-size: 22px; line-height: 1.25; color: var(--bf-text-2); }
.kog-bf .kog-bfbrand__line strong { color: var(--bf-text); font-weight: 800; font-size: 28px; }
.kog-bf .kog-bfbrand__cta {
display: inline-flex; align-items: center; gap: 8px; min-height: 48px; margin-top: 28px; padding: 12px 24px; border-radius: 8px;
background: var(--bf-red); color: #fff; font-weight: 700; font-size: 16px; text-decoration: none;
}
.kog-bf .kog-bfbrand__cta:hover, .kog-bf .kog-bfbrand__cta:focus-visible { background: var(--bf-red-hover); color: #fff; text-decoration: none; }
.kog-bf .kog-bfbrand__faces { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.kog-bf .kog-bfbrand__faces li { display: flex; }
.kog-bf .kog-bfbrand__face {
display: flex; flex-direction: column; width: 100%; padding: 10px 10px 14px; border: 1px solid var(--bf-line); border-radius: 12px;
background: var(--bf-ink-2); text-decoration: none; transition: border-color .15s;
}
.kog-bf .kog-bfbrand__face:hover, .kog-bf .kog-bfbrand__face:focus-visible { border-color: var(--bf-red); text-decoration: none; }
.kog-bf .kog-bfbrand__plate { display: block; aspect-ratio: 1 / 1; padding: 10px; border-radius: 8px; background: var(--bf-plate); }
.kog-bf .kog-bfbrand__plate img { display: block; width: 100%; height: 100%; object-fit: contain; }
.kog-bf .kog-bfbrand__cap { margin-top: 12px; padding: 0 4px; font-size: 15px; font-weight: 700; line-height: 1.25; color: var(--bf-text); }
@media (max-width: 1199.98px) {
.kog-bf .kog-bfbrand { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 575.98px) {
.kog-bf .kog-bfbrand { padding: 22px 16px; border-radius: 12px; }
.kog-bf .kog-bfbrand__logo { height: 34px; }
.kog-bf .kog-bfbrand__pct { margin-top: 20px; font-size: 84px; }
.kog-bf .kog-bfbrand__line { font-size: 18px; }
.kog-bf .kog-bfbrand__line strong { font-size: 22px; }
.kog-bf .kog-bfbrand__copy { align-items: stretch; }
.kog-bf .kog-bfbrand__copy > .kog-bfbrand__logo, .kog-bf .kog-bfbrand__copy > .kog-bfbrand__word { align-self: flex-start; }
.kog-bf .kog-bfbrand__cta { justify-content: center; }
.kog-bf .kog-bfbrand__faces { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kog-bf .kog-bfbrand__cap { font-size: 14px; }
}
.kog-bf#index .kog-home-main > .kog-bfbrands { order: 1; }
/* 90-trial-bungee.css */
.kog-bf .kog-bfbar__tag { font-size: 11px; line-height: 20px; letter-spacing: .04em; padding: 2px 8px; }
.kog-bf .kog-bfhero__kicker { font-size: 12px; line-height: 18px; letter-spacing: .08em; }
.kog-bf .kog-bfhero__title { font-size: clamp(34px, 11.2vw, 64px); line-height: 1.08; letter-spacing: 0; overflow-wrap: anywhere; }
.kog-bf .kog-bfhero__cta { font-size: 14px; letter-spacing: .03em; }
.kog-bf .kog-bfhero__tiles { --bf-cd: 28px; }
.kog-bf .kog-bfhero__tile b { letter-spacing: 0; }
.kog-bf .kog-bfhero__tile { min-width: 2.4em; padding: 0 12px; }
.kog-bf .kog-bfhero__tile:first-child { padding-left: 0; }
@media (min-width: 768px) {
.kog-bf .kog-bfhero__title { font-size: clamp(48px, 6.4vw, 92px); line-height: 1.05; }
}
@media (min-width: 992px) {
.kog-bf .kog-bfhero__tiles { --bf-cd: 34px; }
.kog-bf .kog-bfhero--img .kog-bfhero__title { font-size: clamp(44px, 4.6vw, 72px); }
}
.kog-bf .product-flags li.product-flag.kog-bf { letter-spacing: .02em; font-size: 12px; }
@container kogcard (max-width: 169px) {
.kog-bf .kog-card .product-flags li.product-flag.kog-bf {
padding: 2px 5px;
font-size: 9px;
line-height: 12px;
letter-spacing: .01em;
}
}
.kog-bf .kog-card .kog-card__now { font-size: 17px; letter-spacing: 0; }
.kog-bf .kog-price .current-price-value { font-size: 27px; letter-spacing: 0; }
@media (max-width: 767.98px) {
.kog-bf .kog-price .current-price-value { font-size: 24px; }
}
.kog-bf #wrapper .kog-sec__head .kog-sec__title,
.kog-bf #wrapper .koght-head .koght-title,
.kog-bf #wrapper .kogbr-head .kogbr-title {
font-size: 20px;
line-height: 28px;
letter-spacing: .01em;
overflow-wrap: anywhere;
}
@media (max-width: 575px) {
.kog-bf #wrapper .kog-sec__head .kog-sec__title,
.kog-bf #wrapper .koght-head .koght-title,
.kog-bf #wrapper .kogbr-head .kogbr-title { font-size: 16px; line-height: 24px; }
}