:root {
--f-menu-ink: #140e06;
--f-menu-hover: var(--f-sky-deep, #6293b4);
--f-menu-line: #e6e4dc;
--f-menu-row-h: 76px;
--f-menu-strip-h: 56px;
--f-menu-compact-h: 64px;
--f-menu-gut: 30px;
--f-menu-strip-end: 9px;
}
@media (max-width: 1200px) {
:root { --f-menu-row-h: 68px; --f-menu-gut: 20px; }
}
.f-menu { display: none; }
@media (min-width: 1025px) {
.f-menu { display: flex; min-width: 0; }
}
.f-menu .f-menu__list { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.f-menu .f-menu__item { position: static; display: block; margin: 0 10px 0 0; padding: 0; list-style: none; }
.f-menu .f-menu__link {
display: block;
width: auto;
min-height: 0;
margin: 0;
padding: 10px 18px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: #3d291d;
font: inherit;
font-size: 16px;
font-weight: 400;
line-height: 1;
letter-spacing: 0;
text-align: center;
text-decoration: none;
text-transform: none;
white-space: nowrap;
cursor: pointer;
transition: none;
-webkit-tap-highlight-color: transparent;
}
.f-menu .f-menu__link:is(:hover, :focus, :active) { background: transparent; color: #3d291d; transform: none; box-shadow: none; text-decoration: none; }
.f-menu .f-menu__item.is-current > .f-menu__link { text-decoration: underline; }
.f-menu .f-menu__item.is-open > .f-menu__link,
.f-menu:not(.is-ready) .f-menu__item--mega:is(:hover, :focus-within) > .f-menu__link { color: #f00f00; }
.f-menu .f-menu__link:focus-visible { outline: 3px solid #007c91; outline-offset: -3px; }
@media (max-width: 1200px) {
.f-menu .f-menu__item { margin-right: 0; }
.f-menu .f-menu__link { padding: 10px 14px; }
}
.f-menu .f-menu__panel {
position: absolute;
top: 100%;
right: 0;
left: 0;
z-index: 3;
max-height: calc(100vh - 76px);
max-height: calc(100dvh - 76px);
overflow: auto;
overscroll-behavior: contain;
border-radius: 0 0 10px 10px;
background: rgb(255 255 255 / .9);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
box-shadow: 0 0 10px rgb(102 105 107 / .1);
color: #3d291d;
text-align: left;
cursor: auto;
opacity: 0;
visibility: hidden;
transform: translateY(-8px);
pointer-events: none;
transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.f-menu .f-menu__item.is-open > .f-menu__panel,
.f-menu:not(.is-ready) .f-menu__item--mega:is(:hover, :focus-within) > .f-menu__panel { opacity: 1;
visibility: visible;
transform: none;
pointer-events: auto;
transition-delay: 0s;
}
.f-menu .f-menu__in {
box-sizing: border-box;
display: flex;
gap: 20px;
width: 100%;
max-width: 1920px;
margin: 0 auto;
padding: 20px 30px;
}
@media (max-width: 1200px) {
.f-menu .f-menu__panel { max-height: calc(100vh - 68px); max-height: calc(100dvh - 68px); }
.f-menu .f-menu__in { padding-inline: 20px; }
}
.f-menu .f-menu__groups { display: grid; flex: 1 1 auto; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; min-width: 0; align-content: start; }
.f-menu .f-menu__title { margin: 0; color: #3d291d; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: 0; text-transform: none; }
.f-menu .f-menu__title-link { color: inherit; text-decoration: none; transition: none; }
.f-menu .f-menu__title-link:is(:hover, [aria-current="page"]) { color: #f00f00; text-decoration: none; }
.f-menu .f-menu__links { margin: 12px 0 0; padding: 0; list-style: none; }
.f-menu .f-menu__links > li { margin: 0 0 10px; padding: 0; list-style: none; }
.f-menu .f-menu__links > li:last-child { margin-bottom: 0; }
.f-menu .f-menu__sublink { display: block; color: #676767; font-size: 16px; font-weight: 400; line-height: 1.2; text-decoration: none; transition: none; }
.f-menu .f-menu__sublink:is(:hover, [aria-current="page"]) { color: #f00f00; text-decoration: none; }
.f-menu .f-menu__all {
display: inline-flex;
align-items: center;
gap: 4px;
margin-top: 16px;
color: #3d291d;
font-size: 14px;
font-weight: 600;
line-height: 20px;
text-decoration: none;
transition: none;
}
.f-menu .f-menu__all:hover { color: #f00f00; text-decoration: none; }
.f-menu .f-menu-ico { display: block; flex: none; }
.f-menu :is(.f-menu__title-link, .f-menu__sublink, .f-menu__all, .f-menu__cat-link, .f-menu__photo):focus-visible { outline: 3px solid #007c91; outline-offset: 2px; }
.f-menu .f-menu__photo {
position: relative;
display: block;
flex: 0 0 430px;
align-self: stretch;
min-height: 200px;
overflow: hidden;
border-radius: 10px;
}
.f-menu .f-menu__photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
@media (max-width: 1200px) {
.f-menu .f-menu__photo { flex-basis: 280px; }
}
.f-menu .f-menu__cats { display: grid; flex: 1 1 auto; grid-auto-rows: min-content; grid-template-columns: 230px minmax(0, 1fr); column-gap: 40px; min-width: 0; }
.f-menu .f-menu__cat { display: contents; }
.f-menu .f-menu__cat-link {
grid-column: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
min-height: 0;
margin: 0;
padding: 9px 0;
border: 0;
border-bottom: 1px solid rgb(61 41 29 / .1);
border-radius: 0;
background: transparent;
box-shadow: none;
color: #3d291d;
font: inherit;
font-size: 18px;
font-weight: 400;
line-height: 1.35;
text-align: left;
text-decoration: none;
text-transform: none;
cursor: pointer;
transition: none;
}
.f-menu .f-menu__cat-link:is(:hover, :focus, :active) { background: transparent; color: #3d291d; transform: none; box-shadow: none; text-decoration: none; }
.f-menu .f-menu__cat.is-active > .f-menu__cat-link,
.f-menu .f-menu__cat > .f-menu__cat-link[aria-current="page"] { color: #f00f00; }
.f-menu .f-menu__cat-link .f-menu-ico { opacity: .6; }
.f-menu .f-menu__all--cats { grid-column: 1; justify-self: start; margin-top: 14px; }
.f-menu .f-menu__pane { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: flex-start; gap: 24px 0; min-width: 0; }
.f-menu .f-menu__cat > .f-menu__pane { grid-column: 2; grid-row: 1 / span 40; }
.f-menu .f-menu__cat:not(.is-active) > .f-menu__pane {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
}
.f-menu .f-menu__col { flex: 0 0 auto; box-sizing: border-box; width: 220px; padding-right: 20px; }
.f-menu .f-menu__col--brands { width: 340px; }
.f-menu .f-menu__col--brands .f-menu__links { display: grid; grid-auto-flow: column; grid-template-rows: repeat(6, auto); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
.f-menu .f-menu__col--brands .f-menu__links > li { margin: 0; }
.f-menu .f-menu__col--shortcuts { width: 180px; }
.f-menu .f-menu__subgroup + .f-menu__subgroup { margin-top: 22px; }
.f-menu .f-menu__pane .f-menu__photo { flex: 1 1 240px; max-width: 340px; min-height: 240px; margin-left: auto; background: #f6f6f6; }
@media (max-width: 1279px) {
.f-menu .f-menu__cats { grid-template-columns: 200px minmax(0, 1fr); column-gap: 30px; }
.f-menu .f-menu__pane .f-menu__photo { display: none; }
}
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
.f-menu .f-menu__item[data-f-menu-strip-link] > .f-menu__panel { display: none; }
.f-menu:not(.is-ready) .f-menu__item[data-f-menu-strip-link]:is(:hover, :focus-within) > .f-menu__link { color: #3d291d; }
}
.f-strip { display: none; }
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
.f-strip {
position: absolute;
top: 100%;
right: 0;
left: 0;
z-index: 1; box-sizing: border-box;
display: block;
height: var(--f-menu-strip-h);
border-top: 1px solid var(--f-menu-line);
border-bottom: 1px solid var(--f-menu-line);
background: #fff;
color: var(--f-menu-ink);
text-align: left;
}
}
.f-strip .f-strip__in {
box-sizing: border-box;
height: 100%;
max-width: 1920px; margin: 0 auto;
padding: 0 calc(var(--f-menu-gut) + var(--f-menu-strip-end)) 0 var(--f-menu-gut);
}
.f-strip .f-strip__nav { display: block; height: 100%; margin: 0; padding: 0; }
.f-strip .f-strip__list { display: flex; align-items: stretch; justify-content: space-between; height: 100%; margin: 0; padding: 0; list-style: none; }
.f-strip .f-strip__item { position: static; display: flex; margin: 0; padding: 0; list-style: none; }
.f-strip .f-strip__item--small { position: relative; } .f-strip .f-strip__link {
position: relative;
display: flex;
align-items: center;
box-sizing: border-box;
height: 100%;
min-height: 44px;
margin: 0;
padding: 0;
color: var(--f-menu-ink);
font: inherit;
font-size: 16px;
font-weight: 300;
line-height: 1.2;
letter-spacing: 0;
white-space: nowrap;
text-decoration: none;
text-transform: none;
transition: color .15s ease;
-webkit-tap-highlight-color: transparent;
}
.f-strip .f-strip__link:is(:hover, :focus, :active) { color: var(--f-menu-ink); text-decoration: none; outline: 0; }
.f-strip .f-strip__link:hover { color: var(--f-menu-hover); }
.f-strip .f-strip__link::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--f-menu-ink); opacity: 0; }
.f-strip .f-strip__item:is(.is-current, .is-open) > .f-strip__link { font-weight: 400; }
.f-strip .f-strip__item:is(.is-current, .is-open) > .f-strip__link::after { opacity: 1; }
.f-strip:not(.is-ready) .f-strip__item:is(:hover, :focus-within) > .f-strip__link[aria-haspopup]::after { opacity: 1; }
.f-strip .f-strip__text { display: inline-flex; flex-direction: column; }
.f-strip .f-strip__text::after { content: attr(data-text); height: 0; overflow: hidden; font-weight: 400; visibility: hidden; pointer-events: none; user-select: none; }
.f-strip .f-strip__link:focus-visible .f-strip__text { outline: 2px solid var(--f-menu-hover); outline-offset: 4px; }
.f-strip .f-strip__panel {
position: absolute;
top: calc(100% + 1px); right: 0;
left: 0;
z-index: 2;
max-height: calc(100vh - 160px);
max-height: calc(100dvh - 160px);
overflow: auto;
overscroll-behavior: contain;
background: #fff;
box-shadow: 0 20px 40px rgb(20 14 6 / .1);
color: var(--f-menu-ink);
text-align: left;
cursor: auto;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .15s ease, visibility 0s linear .15s;
}
.f-strip .f-strip__item.is-open > .f-strip__panel,
.f-strip:not(.is-ready) .f-strip__item:is(:hover, :focus-within) > .f-strip__panel { opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0s;
}
.f-strip .f-strip__panel--small { left: auto; width: 520px; max-width: calc(100vw - 2 * var(--f-menu-gut)); }
.f-strip .f-strip__panel-in {
box-sizing: border-box;
max-width: 1920px;
margin: 0 auto;
padding: 32px calc(var(--f-menu-gut) + var(--f-menu-strip-end)) 40px var(--f-menu-gut);
}
.f-strip .f-strip__panel--small .f-strip__panel-in { padding: 28px 28px 32px 32px; }
.f-strip .f-menu__pane { display: flex; align-items: stretch; gap: 64px; min-width: 0; }
.f-strip .f-menu__col { flex: 0 0 auto; min-width: 0; }
.f-strip .f-menu__title { margin: 0 0 16px; color: var(--f-menu-ink); font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: 0; text-transform: none; }
.f-strip .f-menu__links { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.f-strip .f-menu__links > li { margin: 0; padding: 0; list-style: none; }
.f-strip .f-menu__col--brands .f-menu__links { grid-auto-flow: column; grid-template-rows: repeat(6, auto); column-gap: 40px; } .f-strip .f-menu__subgroup + .f-menu__subgroup { margin-top: 28px; }
.f-strip :is(.f-menu__sublink, .f-menu__title-link, .f-menu__all) {
color: var(--f-menu-ink);
font-size: 15px;
font-weight: 300;
line-height: 1.3;
letter-spacing: 0;
text-decoration: none;
transition: color .15s ease;
}
.f-strip .f-menu__title-link { font-size: inherit; font-weight: inherit; }
.f-strip .f-menu__all { display: inline-flex; align-items: center; gap: 2px; margin-top: 20px; font-weight: 400; }
.f-strip :is(.f-menu__sublink, .f-menu__title-link, .f-menu__all):is(:hover, :focus, :active) { color: var(--f-menu-ink); text-decoration: none; }
.f-strip :is(.f-menu__sublink, .f-menu__title-link, .f-menu__all):hover { color: var(--f-menu-hover); }
.f-strip :is(.f-menu__sublink, .f-menu__title-link)[aria-current="page"] { font-weight: 400; text-decoration: underline; text-underline-offset: 4px; }
.f-strip :is(.f-menu__sublink, .f-menu__title-link, .f-menu__all, .f-menu__photo):focus-visible { outline: 2px solid var(--f-menu-hover); outline-offset: 4px; }
.f-strip .f-menu-ico { display: block; flex: none; }
.f-strip .f-menu__photo {
position: relative;
display: block;
flex: 0 1 340px;
min-width: 200px;
min-height: 220px;
margin-left: auto;
overflow: hidden;
border-radius: 10px;
background: #f6f6f6;
}
.f-strip .f-menu__photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
.f-strip .f-strip__panel--small .f-menu__photo { flex-basis: 220px; min-height: 200px; }
@media (max-width: 1279px) {
.f-strip .f-strip__panel--full .f-menu__photo { display: none; } }
.f-strip .f-strip__dim {
position: absolute;
top: calc(100% + 1px);
right: 0;
left: 0;
z-index: 1;
height: 100vh;
background: rgb(20 14 6 / .25);
opacity: 0;
transition: opacity .15s ease;
}
.f-strip .f-strip__dim[hidden] { display: none; }
.f-strip .f-strip__dim.is-open { opacity: 1; }
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
html.f-head-compact .f-strip,
html.f-head-compact .f-strip .f-strip__in { display: contents; }
html.f-head-compact .f-strip .f-strip__nav { grid-row: 1; grid-column: 2; align-self: stretch; min-width: 0; height: auto; }
html.f-head-compact .f-strip .f-strip__list { column-gap: 20px; }
html.f-head-compact .f-strip .f-strip__link { font-size: 15px; line-height: 1.15; white-space: normal; }
html.f-head-compact .f-strip .f-strip__link::after { bottom: 0; }
html.f-head-compact .f-strip :is(.f-strip__panel, .f-strip__dim) { top: 100%; }
html.f-head-compact .f-strip .f-strip__panel { max-height: calc(100vh - var(--f-menu-compact-h) - 16px); max-height: calc(100dvh - var(--f-menu-compact-h) - 16px); }
}
@keyframes f-head-in {
from { transform: translateY(-100%); }
to { transform: none; }
}
.f-menu-burger[data-f-menu-burger],
.f-menu-burger[data-f-menu-burger]:is(:hover, :focus, :active) {
position: relative;
display: inline-flex;
flex: none;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 38px;
min-width: 38px;
height: 38px;
min-height: 38px;
margin: 0;
padding: 8px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: #3d291d;
cursor: pointer;
transform: none;
-webkit-tap-highlight-color: transparent;
}
.f-menu-burger[data-f-menu-burger]:focus-visible { outline: 3px solid #007c91; outline-offset: 2px; }
.f-menu-burger .f-menu-burger__in { position: relative; display: block; width: 100%; height: 1px; margin-top: -.5px; transition: transform .5s cubic-bezier(.645, .045, .355, 1); }
.f-menu-burger .f-menu-burger__bar {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 1px;
background: #3d291d;
transform-origin: 40% 50%;
transition: transform .4s cubic-bezier(.645, .045, .355, 1), opacity .2s cubic-bezier(.645, .045, .355, 1) .2s;
}
.f-menu-burger .f-menu-burger__bar:nth-child(1) { transform: translate3d(0, -6px, 0); }
.f-menu-burger .f-menu-burger__bar:nth-child(3) { transform: translate3d(0, 6px, 0); }
.f-menu-burger[aria-expanded="true"] .f-menu-burger__in { transform: rotate(180deg) translate3d(0, -1px, 0); }
.f-menu-burger[aria-expanded="true"] .f-menu-burger__bar { transition: transform .3s cubic-bezier(.645, .045, .355, 1) .1s, opacity .2s cubic-bezier(.645, .045, .355, 1); }
.f-menu-burger[aria-expanded="true"] .f-menu-burger__bar:nth-child(1) { transform: rotate(135deg) translate3d(-3.7556px, -1.5556px, 0); }
.f-menu-burger[aria-expanded="true"] .f-menu-burger__bar:nth-child(2) { opacity: 0; transform: rotate(45deg); }
.f-menu-burger[aria-expanded="true"] .f-menu-burger__bar:nth-child(3) { transform: rotate(45deg) translate3d(-.6444px, -1.5556px, 0); }
html.f-menu-lock { scrollbar-gutter: stable; }
html.f-menu-lock body { overflow: hidden; }
.f-menu-backdrop {
position: absolute;
top: 100%;
left: 0;
z-index: 3;
width: 100%;
height: 100vh;
height: 100dvh;
background: rgb(20 14 6 / .45);
opacity: 0;
transition: opacity .6s;
touch-action: none; }
.f-menu-backdrop[hidden] { display: none; }
.f-menu-backdrop.is-open { opacity: 1; }
.f-menu-drawer {
position: absolute;
top: 100%;
left: 0;
z-index: 4;
box-sizing: border-box;
display: flex;
flex-direction: column;
width: 100%;
max-width: 280px;
max-height: calc(100vh - 80px);
max-height: calc(100dvh - 80px);
padding: 20px;
overflow: auto;
overscroll-behavior: contain;
border-radius: 0 10px 10px 0;
background: #fff;
box-shadow: 0 0 10px rgb(102 105 107 / .1);
color: #3d291d;
text-align: left;
transform: translateX(-100%);
transition: transform .6s;
}
.f-menu-drawer[hidden] { display: none; }
.f-menu-drawer.is-open { transform: none; }
.f-menu-drawer:focus { outline: 0; } @media (max-width: 1024px), (hover: none), (pointer: coarse) {
.f-menu-drawer { max-width: 400px; }
}
@media (max-width: 767px) {
.f-menu-drawer {
max-width: none;
height: calc(100vh - var(--f-menu-drawer-top, 68px));
height: calc(100dvh - var(--f-menu-drawer-top, 68px)); max-height: none;
border-radius: 0;
box-shadow: none;
}
}
.f-menu-drawer .f-menu-drawer__nav { display: block; margin: 0; padding: 0; }
.f-menu-drawer .f-menu-drawer__list { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__list > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__item--top { display: none; }
@media (max-width: 1024px), (hover: none), (pointer: coarse) {
.f-menu-drawer .f-menu-drawer__item--top { display: block; }
}
.f-menu-drawer .f-menu-drawer__link {
display: flex;
flex: 1 1 auto;
align-items: center;
justify-content: space-between;
width: 100%;
min-height: 0;
margin: 0;
padding: 10px 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: #3d291d;
font: inherit;
font-size: 20px;
font-weight: 400;
line-height: 1;
letter-spacing: -.8px;
text-align: left;
text-decoration: none;
text-transform: none;
cursor: pointer;
transition: none;
-webkit-tap-highlight-color: transparent;
}
.f-menu-drawer .f-menu-drawer__link:is(:hover, :focus, :active) { background: transparent; color: #3d291d; transform: none; box-shadow: none; text-decoration: none; }
.f-menu-drawer :is(.f-menu-drawer__item.is-current > .f-menu-drawer__link, .f-menu-drawer__item.is-current > .f-menu-drawer__row > .f-menu-drawer__link, .f-menu-drawer__link[aria-current="page"]) { color: #f00f00; }
.f-menu-drawer .f-menu-drawer__row { display: flex; align-items: center; }
.f-menu-drawer .f-menu-drawer__toggle .f-menu-ico { width: 18px; height: auto; margin-left: 10px; color: #3d291d; transition: transform .3s; }
.f-menu-drawer .f-menu-drawer__toggle[aria-expanded="true"] .f-menu-ico { transform: rotate(180deg); }
.f-menu-drawer .f-menu-drawer__row > .f-menu-drawer__toggle,
.f-menu-drawer .f-menu-drawer__row > .f-menu-drawer__toggle:is(:hover, :focus, :active) {
display: inline-flex;
flex: none;
align-items: center;
justify-content: center;
width: auto;
min-width: 44px;
min-height: 40px;
margin: 0;
padding: 0 0 0 16px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: #3d291d;
cursor: pointer;
transform: none;
justify-content: flex-end;
}
.f-menu-drawer :is(.f-menu-drawer__link, .f-menu-drawer__toggle, .f-menu-drawer__title, .f-menu-drawer__sublink, .f-menu-drawer__info-link):focus-visible { outline: 3px solid #007c91; outline-offset: 2px; }
.f-menu-drawer .f-menu-drawer__panel[hidden] { display: none; }
.f-menu-drawer .f-menu-drawer__group { margin: 0 0 20px 10px; padding: 4px 0 10px; }
.f-menu-drawer .f-menu-drawer__group:last-child { margin-bottom: 0; }
.f-menu-drawer .f-menu-drawer__title { display: block; margin: 0; color: #3d291d; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: 0; text-decoration: none; }
.f-menu-drawer a.f-menu-drawer__title:is(:hover, :focus) { color: #3d291d; text-decoration: none; }
.f-menu-drawer a.f-menu-drawer__title[aria-current="page"] { color: #f00f00; }
.f-menu-drawer .f-menu-drawer__sub { margin: 0 0 0 20px; padding: 10px 0 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__panel > .f-menu-drawer__sub { margin-left: 10px; padding-bottom: 10px; }
.f-menu-drawer .f-menu-drawer__sub > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__sublink { display: block; padding: 4px 0; color: #676767; font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: 0; text-decoration: none; transition: none; }
.f-menu-drawer .f-menu-drawer__sublink:is(:hover, :focus) { color: #676767; text-decoration: none; }
.f-menu-drawer .f-menu-drawer__sublink[aria-current="page"] { color: #f00f00; }
.f-menu-drawer .f-menu-drawer__sublink.f-menu-drawer__all { color: #3d291d; font-weight: 600; }
.f-menu-drawer .f-menu-drawer__item--shop { padding-bottom: 10px; }
.f-menu-drawer .f-menu-drawer__cats { margin: 2px 0 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__cats > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__cat-link,
.f-menu-drawer .f-menu-drawer__cat-link:is(:hover, :focus, :active) {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
box-sizing: border-box;
width: 100%;
min-height: 44px;
margin: 0;
padding: 8px 0 8px 14px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: var(--f-menu-ink);
font: inherit;
font-size: 17px;
font-weight: 300;
line-height: 1.25;
letter-spacing: 0;
text-align: left;
text-decoration: none;
text-transform: none;
cursor: pointer;
transform: none;
transition: none;
-webkit-tap-highlight-color: transparent;
}
.f-menu-drawer .f-menu-drawer__cat-link .f-menu-ico { width: 20px; height: 20px; opacity: .7; }
.f-menu-drawer .f-menu-drawer__cat.is-current > .f-menu-drawer__cat-link { font-weight: 400; box-shadow: inset 2px 0 0 var(--f-menu-ink); }
.f-menu-drawer .f-menu-drawer__item--cta { margin-top: 16px; padding-top: 20px; border-top: 1px solid var(--f-menu-line); }
.f-menu-drawer .f-menu-drawer__cta,
.f-menu-drawer .f-menu-drawer__cta:is(:hover, :focus, :active, :visited) {
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 100%;
min-height: 48px;
margin: 0 0 8px;
padding: 10px 16px;
border: 0;
border-radius: 5px;
background: #8dc9f7;
color: rgb(0 0 0 / .7);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
text-align: center;
text-decoration: none;
transition: none;
}
.f-menu-drawer .f-menu-drawer__cta:hover { background: #81c3f6; }
.f-menu-drawer .f-menu-drawer__cta:active { background: #75bef5; }
.f-menu-drawer.is-l2 { overflow: hidden; }
.f-menu-drawer .f-menu-drawer__l2 {
position: absolute;
inset: 0;
z-index: 2;
box-sizing: border-box;
overflow: auto;
overscroll-behavior: contain;
padding: 0 20px 28px;
background: #fff;
color: var(--f-menu-ink);
transform: translateX(100%);
transition: transform .3s ease;
}
.f-menu-drawer .f-menu-drawer__l2[hidden] { display: none; }
.f-menu-drawer .f-menu-drawer__l2.is-open { transform: none; }
.f-menu-drawer .f-menu-drawer__l2-bar {
position: sticky;
top: 0;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
min-height: 56px;
margin: 0 -20px;
padding: 0 6px 0 8px;
border-bottom: 1px solid var(--f-menu-line);
background: #fff;
}
.f-menu-drawer :is(.f-menu-drawer__back, .f-menu-drawer__x),
.f-menu-drawer :is(.f-menu-drawer__back, .f-menu-drawer__x):is(:hover, :focus, :active) {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 2px;
box-sizing: border-box;
width: auto;
min-width: 44px;
min-height: 44px;
margin: 0;
padding: 0 8px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: var(--f-menu-ink);
font: inherit;
font-size: 16px;
font-weight: 400;
line-height: 1;
text-transform: none;
cursor: pointer;
transform: none;
transition: none;
}
.f-menu-drawer :is(.f-menu-drawer__back, .f-menu-drawer__x) .f-menu-ico { display: block; flex: none; }
.f-menu-drawer .f-menu-drawer__l2-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 20px 0 24px; }
.f-menu-drawer .f-menu-drawer__l2-title { margin: 0; color: var(--f-menu-ink); font-size: 22px; font-weight: 400; line-height: 1.2; letter-spacing: -.2px; }
.f-menu-drawer .f-menu-drawer__l2-all,
.f-menu-drawer .f-menu-drawer__l2-all:is(:hover, :focus, :active) { flex: none; color: var(--f-menu-ink); font-size: 15px; font-weight: 400; line-height: 1.3; text-decoration: underline; text-underline-offset: 4px; }
.f-menu-drawer .f-menu-drawer__l2-sec { margin: 0 0 28px; }
.f-menu-drawer .f-menu-drawer__l2-sec:last-child { margin-bottom: 0; }
.f-menu-drawer .f-menu-drawer__l2-h { margin: 0 0 12px; color: var(--f-menu-ink); font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: 0; }
.f-menu-drawer .f-menu-drawer__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__chips > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__chip,
.f-menu-drawer .f-menu-drawer__chip:is(:hover, :focus, :active) {
display: inline-flex;
align-items: center;
box-sizing: border-box;
min-height: 40px;
padding: 8px 14px;
border: 1px solid var(--f-menu-line);
border-radius: 999px;
background: #fff;
color: var(--f-menu-ink);
font-size: 15px;
font-weight: 300;
line-height: 1.2;
text-decoration: none;
-webkit-tap-highlight-color: transparent;
}
.f-menu-drawer .f-menu-drawer__chip[aria-current="page"] { border-color: var(--f-menu-ink); font-weight: 400; }
.f-menu-drawer .f-menu-drawer__l2-list { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__l2-list > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__l2-link,
.f-menu-drawer .f-menu-drawer__l2-link:is(:hover, :focus, :active) {
display: flex;
align-items: center;
box-sizing: border-box;
min-height: 44px;
padding: 10px 0;
border-bottom: 1px solid var(--f-menu-line);
color: var(--f-menu-ink);
font-size: 16px;
font-weight: 300;
line-height: 1.3;
text-decoration: none;
}
.f-menu-drawer .f-menu-drawer__l2-link[aria-current="page"] { font-weight: 400; }
.f-menu-drawer .f-menu-drawer__more,
.f-menu-drawer .f-menu-drawer__more:is(:hover, :focus, :active) {
display: inline-flex;
align-items: center;
gap: 2px;
min-height: 40px;
margin-top: 8px;
color: var(--f-menu-ink);
font-size: 15px;
font-weight: 400;
line-height: 1.3;
text-decoration: none;
}
.f-menu-drawer .f-menu-drawer__more .f-menu-ico { display: block; flex: none; }
.f-menu-drawer :is(.f-menu-drawer__cat-link, .f-menu-drawer__cta, .f-menu-drawer__back, .f-menu-drawer__x, .f-menu-drawer__l2-all, .f-menu-drawer__chip, .f-menu-drawer__l2-link, .f-menu-drawer__more):focus-visible { outline: 2px solid var(--f-menu-hover); outline-offset: 2px; }
.f-menu-drawer .f-menu-drawer__info { flex: none; margin: 16px -20px -20px; padding: 6px 20px 12px; list-style: none; background: #f6f6f6; }
.f-menu-drawer .f-menu-drawer__info > li { margin: 0; padding: 0; list-style: none; }
.f-menu-drawer .f-menu-drawer__info > li + li { border-top: 1px solid #e5e5e5; }
.f-menu-drawer .f-menu-drawer__info-link {
display: flex;
align-items: center;
gap: 12px;
min-height: 48px;
padding: 8px 0;
color: #3d291d;
font-size: 15px;
font-weight: 400;
line-height: 1.35;
letter-spacing: 0;
text-decoration: none;
}
.f-menu-drawer a.f-menu-drawer__info-link:is(:hover, :focus) { color: #3d291d; text-decoration: none; }
.f-menu-drawer .f-menu-drawer__info-ico { display: inline-flex; flex: none; }
.f-menu-drawer .f-menu-drawer__info-ico .f-menu-ico { width: 20px; height: 20px; }
.f-menu-drawer .f-menu-drawer__info-text { flex: 1 1 auto; min-width: 0; }
@media (prefers-reduced-motion: reduce) {
.f-menu .f-menu__panel,
.f-menu-drawer,
.f-menu-backdrop,
.f-menu-burger .f-menu-burger__in,
.f-menu-burger .f-menu-burger__bar,
.f-menu-drawer .f-menu-drawer__toggle .f-menu-ico,
.f-menu-drawer .f-menu-drawer__l2,
.f-strip :is(.f-strip__link, .f-strip__panel, .f-strip__dim, .f-menu__sublink, .f-menu__title-link, .f-menu__all) { transition: none; }
.f-menu .f-menu__panel { transform: none; }
}
@media (forced-colors: active) {
.f-menu .f-menu__panel,
.f-strip .f-strip__panel,
.f-menu-drawer { border: 1px solid CanvasText; }
.f-menu-burger .f-menu-burger__bar { background: CanvasText; }
.f-strip .f-strip__link::after { background: CanvasText; }
}
@media print {
.f-menu, .f-menu-burger, .f-menu-drawer, .f-menu-backdrop, .f-strip { display: none !important; }
}
