/* One source of truth for the component's palette and typography. */
:root {
    --dakm4-paper: #EFEDDE;
    --dakm4-ink: #422F23;
    --dakm4-rule: rgba(66, 47, 35, .18);
    --dakm4-backdrop: rgba(18, 17, 16, .48);
    --dakm4-font-ui: "HV Fitzgerald", Georgia, serif;
    --dakm4-font-submenu: "zai Italic Hand Calligraphy", cursive;
}

body .dakm4-trigger,
body [data-dakm4-open] {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--dakm4-ink);
    -webkit-text-fill-color: var(--dakm4-ink);
    font-family: var(--dakm4-font-ui);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .045em;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

body .dakm4-trigger[aria-expanded="true"] {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

body .dakm4-trigger:focus-visible {
    outline: 1px solid var(--dakm4-ink);
    outline-offset: 4px;
}

body .dakm4-trigger:is(:hover, :focus, :active),
body [data-dakm4-open]:is(:hover, :focus, :active) {
    background: transparent;
    color: var(--dakm4-ink);
    -webkit-text-fill-color: var(--dakm4-ink);
    box-shadow: none;
}

body .dakm4-trigger::before,
body .dakm4-trigger::after,
body [data-dakm4-open]::before,
body [data-dakm4-open]::after {
    display: none;
    content: none;
}

@media (max-width: 767px) {
    body .dakm4-trigger,
    body [data-dakm4-open] {
        font-size: 11px;
    }
}

/* Header state changes only the header surface; its children keep their own typography. */
body .dakm4-header-sync {
    transition: background-color 540ms cubic-bezier(.72, 0, .16, 1), color 420ms ease;
}

body :is(
    .header1,
    .mobile-menu,
    .poem-header,
    [data-poem-header],
    .poem-header-runtime,
    .elementor-location-header,
    [data-elementor-type="header"],
    header,
    [role="banner"],
    .site-header,
    #masthead,
    .main-header,
    .header-wrapper
).dakm4-header-active {
    --poem-header-bg: var(--dakm4-paper);
    --poem-header-fg: var(--dakm4-ink);
    --poem-header-black-filter: none;
    --poem-header-white-filter: none;
    background-color: var(--dakm4-paper);
    background-image: none;
    color: var(--dakm4-ink);
    box-shadow: none;
    isolation: isolate;
    z-index: 99998;
}

body :is(
    .header1,
    .mobile-menu,
    .poem-header,
    [data-poem-header],
    .poem-header-runtime,
    .elementor-location-header,
    [data-elementor-type="header"]
).dakm4-header-active > :where(.elementor-element, .e-con, .e-con-inner, .elementor-container, .elementor-widget-wrap) {
    background-color: transparent;
    background-image: none;
}

body .dakm4-header-active :where(.dakm4-trigger, [data-dakm4-open]) {
    color: var(--dakm4-ink);
    -webkit-text-fill-color: var(--dakm4-ink);
}

html.dakm4-lock,
html.dakm4-lock body {
    overflow: hidden;
    overscroll-behavior: none;
}

.dakm4,
.dakm4 *,
.dakm4 *::before,
.dakm4 *::after {
    box-sizing: border-box;
}

.dakm4 {
    --dakm4-top: 0px;
    --dakm4-desktop-submenu-size: clamp(14px, 1.02vw, 16px);
    --dakm4-desktop-submenu-nested-size: clamp(13px, .92vw, 14.5px);
    --dakm4-mobile-root-size: clamp(16px, 4.35vw, 18px);
    --dakm4-mobile-submenu-size: clamp(17px, 4.5vw, 19px);
    position: fixed;
    inset: 0;
    z-index: 99990;
    visibility: hidden;
    overflow: hidden;
    color: var(--dakm4-ink);
    font-family: var(--dakm4-font-ui);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .018em;
    pointer-events: none;
    isolation: isolate;
    transition: visibility 0s linear 540ms;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-kerning: normal;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
}

.dakm4.is-open {
    visibility: visible;
    transition-delay: 0s;
}

.dakm4.is-yielding-cart {
    visibility: hidden;
    pointer-events: none;
}

.dakm4 button,
.dakm4 input,
.dakm4 a,
.dakm4 span,
.dakm4 strong,
.dakm4 p,
.dakm4 label,
.dakm4 li,
.dakm4 small,
.dakm4 select,
.dakm4 textarea {
    font-family: inherit;
    color: var(--dakm4-ink);
}

.dakm4 button {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.dakm4 a {
    color: inherit;
    text-decoration: none;
}

/* Theme/Elementor hover rules must never inject their accent background into
 * this self-contained editorial surface. */
.dakm4 :is(a, button):hover,
.dakm4 :is(a, button):focus,
.dakm4 :is(a, button):active,
.dakm4 :is(a, button).is-active,
.dakm4 :is(a, button)[aria-current="page"] {
    border-color: transparent;
    background-color: transparent;
    background-image: none;
    color: var(--dakm4-ink);
    -webkit-text-fill-color: var(--dakm4-ink);
    box-shadow: none;
    filter: none;
}

.dakm4 :is(a, button):not(.dakm4__desktop-root):not(.dakm4__desktop-submenu-link)::before,
.dakm4 :is(a, button):not(.dakm4__desktop-root):not(.dakm4__desktop-submenu-link)::after,
.dakm4__desktop-root::before {
    border: 0;
    background-color: transparent;
    background-image: none;
    box-shadow: none;
}

.dakm4 button:focus-visible,
.dakm4 a:focus-visible,
.dakm4 input:focus-visible {
    outline: 1px solid currentColor;
    outline-offset: 3px;
}

.dakm4 ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dakm4-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.dakm4__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: var(--dakm4-backdrop);
    opacity: 0;
    pointer-events: none;
    transition: opacity 360ms ease;
}

.dakm4.is-open .dakm4__backdrop {
    opacity: 1;
    pointer-events: auto;
}

.dakm4__backdrop::before,
.dakm4__backdrop::after,
.dakm4__dialog::before,
.dakm4__dialog::after {
    display: none;
    content: none;
}

.dakm4__dialog {
    position: absolute;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background-color: var(--dakm4-paper);
    background-image: none;
    color: var(--dakm4-ink);
    box-shadow: none;
    filter: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    mix-blend-mode: normal;
    pointer-events: none;
    will-change: transform;
}

.dakm4.is-open .dakm4__dialog {
    pointer-events: auto;
}

.dakm4__views {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background: var(--dakm4-paper);
}

.dakm4__view {
    position: absolute;
    inset: 0;
    visibility: hidden;
    overflow: hidden;
    background: var(--dakm4-paper);
    opacity: 0;
    pointer-events: none;
}

.dakm4[data-view="menu"] [data-dakm4-view="menu"],
.dakm4[data-view="search"] [data-dakm4-view="search"] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.dakm4__empty {
    margin: 0;
    padding: 34px 24px;
    color: var(--dakm4-ink);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.dakm4__chevron,
.dakm4__back-icon,
.dakm4__close-icon {
    display: block;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1;
    stroke-linecap: square;
    stroke-linejoin: miter;
}

.dakm4__chevron,
.dakm4__back-icon {
    width: 7px;
    height: 13px;
}

.dakm4__close-icon {
    width: 14px;
    height: 14px;
}

.dakm4-bag-count[data-count="0"] {
    display: none;
}

/* Desktop: the KHY panel starts below the live header and always leaves the page visible. */
.dakm4[data-mode="desktop"] {
    top: var(--dakm4-top);
    bottom: 0;
    height: auto;
}

.dakm4[data-mode="desktop"] .dakm4__dialog {
    inset: 0 0 auto;
    width: 100%;
    height: min(
        var(--dakm4-max-height, 670px),
        calc(100% - clamp(96px, 17.5dvh, var(--dakm4-page-peek, 164px)))
    );
    min-height: min(380px, 100%);
    transform: translate3d(0, -102%, 0);
    transition: transform 540ms cubic-bezier(.72, 0, .16, 1);
}

.dakm4[data-mode="desktop"].is-open .dakm4__dialog {
    transform: translate3d(0, 0, 0);
}

.dakm4[data-mode="desktop"] .dakm4__mobile-head,
.dakm4[data-mode="desktop"] .dakm4__mobile-menu {
    display: none;
}

.dakm4__desktop-menu {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: var(--dakm4-paper);
}

.dakm4__search-close {
    position: absolute;
    z-index: 8;
    top: 14px;
    right: 14px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    background: var(--dakm4-paper);
    color: var(--dakm4-ink);
}

.dakm4__desktop-menu-layout {
    --dakm4-desktop-gap: clamp(18px, 1.6vw, 28px);
    --dakm4-desktop-pad-x: clamp(20px, 2vw, 32px);
    --dakm4-desktop-pad-y: clamp(26px, 3vh, 34px);
    --dakm4-root-gap: clamp(22px, 2.6vh, 28px);
    --dakm4-root-icon-gap: 13px;
    --dakm4-submenu-gap: clamp(18px, 2.2vh, 24px);
    display: grid;
    grid-template-columns: minmax(180px, .9fr) minmax(190px, .95fr) minmax(0, 1fr) minmax(0, 1fr);
    column-gap: var(--dakm4-desktop-gap);
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: var(--dakm4-desktop-pad-y) var(--dakm4-desktop-pad-x) clamp(34px, 4vh, 44px);
}

.dakm4__desktop-rail,
.dakm4__desktop-stage {
    position: relative;
    min-width: 0;
    min-height: 0;
    background: var(--dakm4-paper);
}

.dakm4__desktop-rail {
    display: flex;
    flex-direction: column;
}

.dakm4__desktop-roots {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: var(--dakm4-root-gap);
    overflow: auto;
    padding: 0 0 96px;
    scrollbar-width: none;
}

.dakm4__desktop-roots::-webkit-scrollbar,
.dakm4__desktop-panel::-webkit-scrollbar,
.dakm4__mobile-scroll::-webkit-scrollbar,
.dakm4__search-scroll::-webkit-scrollbar {
    display: none;
}

/* Root items are a two-track component: text | chevron. The icon can never
 * collapse into the label because spacing belongs to the grid, not the SVG. */
button.dakm4__desktop-root {
    display: inline-grid;
    grid-template-columns: max-content 7px;
    column-gap: var(--dakm4-root-icon-gap);
    align-items: center;
}

a.dakm4__desktop-root {
    display: inline-flex;
    align-items: center;
}

.dakm4__desktop-root {
    position: relative;
    width: max-content;
    max-width: 100%;
    min-height: 20px;
    color: var(--dakm4-ink);
    font-size: clamp(14px, 1.12vw, 16px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: .012em;
    text-transform: uppercase;
    transition: opacity 160ms ease;
}

.dakm4__desktop-root .dakm4__root-label {
    position: relative;
    display: block;
    min-width: 0;
}

.dakm4__desktop-root .dakm4__root-label::after {
    position: absolute;
    right: 0;
    bottom: -4px;
    left: 0;
    height: 1px;
    background: currentColor;
    content: "";
    opacity: .42;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 220ms ease;
}

.dakm4__desktop-root:hover .dakm4__root-label::after,
.dakm4__desktop-root:focus-visible .dakm4__root-label::after,
.dakm4__desktop-root.is-active .dakm4__root-label::after,
.dakm4__desktop-root.is-current .dakm4__root-label::after {
    transform: scaleX(1);
}

.dakm4__desktop-root .dakm4__chevron {
    width: 7px;
    height: 12px;
    justify-self: start;
    stroke-width: 1;
    pointer-events: none;
}

.dakm4__desktop-utility {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.dakm4__desktop-utility a,
.dakm4__desktop-utility button {
    display: inline-flex;
    align-items: center;
    min-height: 17px;
    color: var(--dakm4-ink);
    font-size: clamp(10px, .72vw, 12px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: .07em;
    text-transform: uppercase;
}

/* Every submenu occupies this exact stage. Changing SHOP/COLLECTION/EXPLORE
 * swaps content only; position never changes. */
.dakm4__desktop-stage {
    overflow: hidden;
}

.dakm4__desktop-panel {
    position: absolute;
    inset: 0;
    visibility: hidden;
    overflow: auto;
    background: var(--dakm4-paper);
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms ease, visibility 0s linear 150ms;
    scrollbar-width: none;
}

.dakm4__desktop-panel.is-active {
    z-index: 1;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0s;
}

.dakm4__submenu-panel {
    padding: 0;
}

.dakm4__desktop-submenu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: min(230px, 100%);
    gap: var(--dakm4-submenu-gap);
    padding-top: 2px;
    font-family: var(--dakm4-font-submenu);
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}

/* Submenu links own their complete typography in every interaction state.
 * This prevents theme/Elementor a:hover rules from swapping the calligraphy
 * font while the pointer is over a menu item. */
.dakm4 a.dakm4__desktop-submenu-link,
.dakm4 a.dakm4__desktop-submenu-link:link,
.dakm4 a.dakm4__desktop-submenu-link:visited,
.dakm4 a.dakm4__desktop-submenu-link:hover,
.dakm4 a.dakm4__desktop-submenu-link:focus,
.dakm4 a.dakm4__desktop-submenu-link:active {
    position: relative;
    display: block;
    width: fit-content;
    max-width: 100%;
    border: 0;
    background: transparent;
    color: var(--dakm4-ink);
    -webkit-text-fill-color: var(--dakm4-ink);
    font-family: var(--dakm4-font-submenu);
    font-size: var(--dakm4-desktop-submenu-size);
    font-style: normal;
    font-weight: 400;
    line-height: 1.42;
    letter-spacing: .008em;
    text-decoration: none;
    text-transform: none;
    overflow-wrap: anywhere;
    box-shadow: none;
    filter: none;
}

.dakm4 a.dakm4__desktop-submenu-link.is-nested,
.dakm4 a.dakm4__desktop-submenu-link.is-nested:hover,
.dakm4 a.dakm4__desktop-submenu-link.is-nested:focus,
.dakm4 a.dakm4__desktop-submenu-link.is-nested:active {
    padding-left: 12px;
    font-size: var(--dakm4-desktop-submenu-nested-size);
}

.dakm4__desktop-submenu-view-all {
    margin-top: clamp(2px, .5vh, 6px);
}

/* Editorial underline: the font never changes; only this 1px line travels
 * from left to right. Keeping it on a pseudo-element avoids browser
 * text-decoration metrics and therefore prevents the visible hover jump. */
.dakm4 a.dakm4__desktop-submenu-link::after {
    position: absolute;
    right: 0;
    bottom: -4px;
    left: 0;
    display: block;
    height: 1px;
    border: 0;
    background: currentColor;
    box-shadow: none;
    content: "";
    opacity: .58;
    pointer-events: none;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 240ms cubic-bezier(.22, .61, .36, 1);
}

.dakm4 a.dakm4__desktop-submenu-link:hover::after,
.dakm4 a.dakm4__desktop-submenu-link:focus-visible::after,
.dakm4 a.dakm4__desktop-submenu-link.is-current::after,
.dakm4 a.dakm4__desktop-submenu-link[aria-current="page"]::after {
    transform: scaleX(1);
}

.dakm4__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-column: span 2;
    align-content: start;
    gap: var(--dakm4-desktop-gap);
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    container-type: size;
}

.dakm4__feature {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
    min-width: 0;
    min-height: 0;
    color: var(--dakm4-ink);
}

.dakm4__feature-number {
    display: block;
    flex: 0 0 16px;
    min-height: 16px;
    margin-bottom: 8px;
    color: var(--dakm4-ink);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .02em;
}

.dakm4__feature-media {
    display: block;
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--dakm4-paper);
}

@supports (width: 1cqh) {
    .dakm4__feature-media {
        width: min(100%, calc(80cqh - 38.4px));
    }
}

.dakm4__feature-media img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
    object-position: center;
    transition: transform 600ms cubic-bezier(.2, .7, .2, 1);
}

.dakm4__feature:hover img {
    transform: scale(1.018);
}

.dakm4__feature strong {
    display: block;
    flex: 0 0 auto;
    max-width: 100%;
    margin-top: 8px;
    overflow: hidden;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: .018em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Search: same old-paper/brown system as menu; product media never crops. */
.dakm4__search {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: var(--dakm4-paper);
    color: var(--dakm4-ink);
}

.dakm4[data-mode="desktop"] .dakm4__search {
    container-type: size;
}

.dakm4__search-form {
    position: relative;
    flex: 0 0 116px;
    width: min(48%, 650px);
    margin: 0 auto;
    padding-top: 16px;
}

.dakm4__search-form input[type="search"] {
    display: block;
    width: 100%;
    height: 42px;
    margin: 0;
    padding: 0 70px 0 0;
    border: 0;
    border-bottom: 1px solid var(--dakm4-ink);
    border-radius: 0;
    outline: 0;
    background: var(--dakm4-paper);
    box-shadow: none;
    color: var(--dakm4-ink);
    font-size: clamp(13px, .95vw, 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.dakm4__search-form input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.dakm4__search-form input[type="search"]::placeholder {
    color: var(--dakm4-ink);
    opacity: 1;
}

.dakm4__search-clear,
.dakm4__search-submit {
    position: absolute;
    top: 18px;
    display: grid;
    place-items: center;
    width: 36px;
    height: 38px;
    color: var(--dakm4-ink);
}

.dakm4__search-clear {
    right: 34px;
}

.dakm4__search-clear .dakm4__close-icon {
    width: 10px;
    height: 10px;
}

.dakm4__search-submit {
    right: -2px;
    font-size: 18px;
    font-weight: 400;
    text-align: center;
}

.dakm4__search-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
}

.dakm4__search-layout {
    display: grid;
    grid-template-columns: minmax(150px, 200px) minmax(0, 1fr);
    align-items: stretch;
    gap: clamp(20px, 2vw, 32px);
    height: 100%;
    min-height: 100%;
    padding: 10px 16px 28px clamp(30px, 9.4vw, 128px);
}

.dakm4__popular {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: var(--dakm4-ink);
}

.dakm4__popular > strong,
.dakm4__results-head {
    min-height: 27px;
    font-size: clamp(10px, .72vw, 12px);
    line-height: 1.1;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.dakm4__popular > strong,
.dakm4__results-head > strong {
    font-weight: 700;
}

.dakm4__popular nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: 9px;
}

.dakm4__popular a {
    color: var(--dakm4-ink);
    font-size: clamp(13px, .98vw, 16px);
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: .012em;
    text-transform: uppercase;
    transition: opacity 160ms ease;
}

.dakm4__popular a:hover {
    opacity: 1;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.dakm4__results-area {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.dakm4__results-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: start;
    gap: 14px;
    color: var(--dakm4-ink);
}

.dakm4__results-head > span {
    font-weight: 400;
    opacity: 1;
}

.dakm4__results-head > a {
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.dakm4__results {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: start;
    gap: 28px clamp(12px, 1.2vw, 18px);
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    transition: opacity 160ms ease;
}

.dakm4__results.is-loading {
    opacity: .34;
    pointer-events: none;
}

.dakm4__results > .dakm4__empty {
    grid-column: 1 / -1;
    padding: 26px 0;
}

.dakm4__product {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--dakm4-ink);
}

.dakm4__product-media {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--dakm4-paper);
}

.dakm4 .dakm4__product-media > img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    padding: 0;
    object-fit: contain;
    object-position: center;
    clip-path: none;
    mask-image: none;
    -webkit-mask-image: none;
    transform: none;
}

/* Desktop never forces an image into a landscape box. The original aspect
 * ratio defines the rendered image; only its maximum height is constrained so
 * the full product and caption remain visible inside the search panel. */
.dakm4[data-mode="desktop"] .dakm4__product-media {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    height: auto;
    max-height: none;
    aspect-ratio: auto;
    overflow: visible;
}

.dakm4[data-mode="desktop"] .dakm4__product-media > img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: clamp(140px, calc(100dvh - var(--dakm4-top) - 390px), 440px);
    aspect-ratio: auto;
}

@supports (max-height: 1cqh) {
    .dakm4[data-mode="desktop"] .dakm4__product-media > img {
        max-height: clamp(140px, calc(100cqh - 230px), 440px);
    }
}

.dakm4__product:hover .dakm4__product-media,
.dakm4__product:focus .dakm4__product-media,
.dakm4__product:active .dakm4__product-media,
.dakm4__product:hover img,
.dakm4__product:focus img,
.dakm4__product:active img {
    background-color: var(--dakm4-paper);
    background-image: none;
    opacity: 1;
    filter: none;
    transform: none;
}

.dakm4__product > strong {
    display: block;
    margin-top: 9px;
    overflow: hidden;
    color: var(--dakm4-ink);
    font-size: clamp(11px, .74vw, 13px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: .025em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.dakm4__product > span:not(.dakm4__product-media) {
    display: block;
    margin-top: 4px;
    color: var(--dakm4-ink);
    font-size: clamp(10px, .68vw, 12px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: .02em;
}

/* Mobile drawer follows the inset KHY composition without inheriting site backgrounds. */
.dakm4[data-mode="mobile"] {
    inset: 0;
}

.dakm4[data-mode="mobile"] .dakm4__dialog {
    top: 0;
    right: auto;
    bottom: 0;
    left: 0;
    inset: 0 auto 0 0;
    width: min(94vw, 420px);
    max-width: none;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    background: var(--dakm4-paper);
    opacity: 1;
    translate: none;
    scale: none;
    transform: translate3d(-101%, 0, 0);
    transform-origin: left center;
    transition: transform 540ms cubic-bezier(.72, 0, .16, 1);
    animation: none;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.dakm4[data-mode="mobile"].is-open .dakm4__dialog {
    translate: none;
    scale: none;
    transform: translate3d(0, 0, 0);
}

.dakm4[data-mode="mobile"] .dakm4__desktop-menu {
    display: none;
}

.dakm4[data-mode="mobile"] .dakm4__mobile-head {
    position: relative;
    z-index: 6;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    flex: 0 0 58px;
    width: 100%;
    min-height: 58px;
    padding: 0 16px;
    background: var(--dakm4-paper);
    color: var(--dakm4-ink);
    visibility: visible;
    opacity: 1;
}

.dakm4__micro {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 40px;
    color: var(--dakm4-ink);
    font-size: clamp(10.5px, 2.9vw, 12px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.dakm4__micro--right {
    justify-self: end;
}

.dakm4__micro--left {
    justify-self: start;
}

.dakm4__mobile-head-spacer {
    display: block;
    min-width: 0;
    pointer-events: none;
}

/* Commerce controls are intentionally NOT styled or positioned here.
 * [acx_cart_icon] and [fxh_wishlist_icon] belong to Elementor/ACX. */

.dakm4__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: min(46vw, 190px);
    min-height: 38px;
    color: var(--dakm4-ink);
}

.dakm4__brand img {
    display: block;
    width: auto;
    max-width: min(46vw, 190px);
    height: auto;
    max-height: 28px;
    object-fit: contain;
}

.dakm4__brand span {
    display: block;
    overflow: hidden;
    font-size: clamp(18px, 5vw, 21px);
    font-weight: 700;
    line-height: .92;
    letter-spacing: .02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dakm4__mobile-menu {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: var(--dakm4-paper);
    color: var(--dakm4-ink);
}

.dakm4__mobile-level {
    position: absolute;
    inset: 0 0 84px;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    background: var(--dakm4-paper);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(102%, 0, 0);
    transition: transform 430ms cubic-bezier(.72, 0, .16, 1), opacity 230ms ease, visibility 0s linear 430ms;
}

.dakm4__mobile-level.is-active {
    z-index: 2;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
    transition-delay: 0s;
}

.dakm4__mobile-level.is-behind {
    visibility: visible;
    opacity: .16;
    transform: translate3d(-14%, 0, 0);
    transition-delay: 0s;
}

.dakm4__mobile-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 25px 16px 24px;
    overscroll-behavior: contain;
    scrollbar-width: none;
}

.dakm4__mobile-level:not([data-dakm4-level="0"]) .dakm4__mobile-scroll {
    padding-top: 15px;
}

.dakm4__mobile-list {
    display: flex;
    flex-direction: column;
    font-family: var(--dakm4-font-ui);
}

.dakm4__mobile-list > button,
.dakm4__mobile-link,
.dakm4__mobile-view-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 42px;
    gap: 18px;
    color: var(--dakm4-ink);
    font: inherit;
    line-height: 1.08;
    letter-spacing: .012em;
}

/* Root mobile navigation keeps the original UI font. */
.dakm4__mobile-level[data-dakm4-level="0"] .dakm4__mobile-list > button,
.dakm4__mobile-level[data-dakm4-level="0"] .dakm4__mobile-link {
    min-height: 46px;
    font-family: var(--dakm4-font-ui);
    font-size: var(--dakm4-mobile-root-size);
    font-weight: 700;
    letter-spacing: .016em;
    text-transform: uppercase;
}

/* One definitive rule owns every nested mobile submenu item, including View All. */
.dakm4__mobile-level:not([data-dakm4-level="0"]) .dakm4__mobile-list > button,
.dakm4__mobile-level:not([data-dakm4-level="0"]) .dakm4__mobile-link,
.dakm4__mobile-level:not([data-dakm4-level="0"]) .dakm4__mobile-view-all {
    min-height: 48px;
    font-family: var(--dakm4-font-submenu);
    font-size: var(--dakm4-mobile-submenu-size);
    font-weight: 400;
    font-synthesis: none;
    line-height: 1.16;
    text-transform: none;
}

.dakm4__mobile-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 9px;
    margin-top: 28px;
    padding-bottom: 10px;
}

.dakm4__mobile-feature {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--dakm4-ink);
}

.dakm4__mobile-feature-media {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--dakm4-paper);
}

.dakm4 .dakm4__mobile-feature-media > img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
    object-position: center;
    filter: none;
    transform: none;
}

.dakm4__mobile-feature > strong {
    display: block;
    margin-top: 7px;
    overflow: hidden;
    font-size: clamp(10px, 2.75vw, 12px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: .025em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.dakm4__mobile-subhead {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    flex: 0 0 50px;
    min-height: 50px;
    padding: 0 17px;
    border-bottom: 1px solid var(--dakm4-rule);
    background: var(--dakm4-paper);
}

.dakm4__mobile-subhead button {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 38px;
    gap: 8px;
    font-size: clamp(10px, 2.8vw, 12px);
    font-weight: 400;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.dakm4__mobile-subhead strong {
    max-width: 48vw;
    overflow: hidden;
    font-size: clamp(12px, 3.3vw, 14px);
    font-weight: 700;
    letter-spacing: .035em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.dakm4__mobile-view-all {
    margin-top: 9px;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.dakm4__mobile-utility {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-height: 84px;
    gap: 7px;
    padding: 9px 17px max(10px, env(safe-area-inset-bottom));
    background: var(--dakm4-paper);
}

.dakm4__mobile-utility a,
.dakm4__mobile-utility button {
    display: inline-flex;
    align-items: center;
    min-height: 15px;
    color: var(--dakm4-ink);
    font-size: clamp(10px, 2.65vw, 11px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.dakm4__wishlist-adapter {
    display: contents;
}

.dakm4__wishlist-source[hidden] {
    display: none;
}

.dakm4[data-mode="mobile"] .dakm4__search-close {
    display: none;
}

.dakm4[data-mode="mobile"] .dakm4__search-form {
    flex: 0 0 72px;
    width: auto;
    margin: 0 17px;
    padding-top: 10px;
}

.dakm4[data-mode="mobile"] .dakm4__search-form input[type="search"] {
    height: 46px;
    padding-right: 66px;
    font-size: clamp(13px, 3.8vw, 16px);
}

.dakm4[data-mode="mobile"] .dakm4__search-clear,
.dakm4[data-mode="mobile"] .dakm4__search-submit {
    top: 12px;
    height: 42px;
}

.dakm4[data-mode="mobile"] .dakm4__search-layout {
    display: block;
    height: auto;
    min-height: 0;
    padding: 18px 17px 28px;
}

.dakm4[data-mode="mobile"] .dakm4__popular {
    display: none;
}

.dakm4[data-mode="mobile"] .dakm4__results-head {
    grid-template-columns: 1fr auto;
    min-height: 28px;
    font-size: clamp(10px, 2.8vw, 12px);
}

.dakm4[data-mode="mobile"] .dakm4__results-head > span {
    display: none;
}

.dakm4[data-mode="mobile"] .dakm4__results {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 10px;
}

@media (min-width: 768px) and (max-width: 1100px) {
    .dakm4[data-mode="desktop"] .dakm4__results {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.dakm4[data-mode="mobile"] .dakm4__product > strong {
    margin-top: 8px;
    font-size: clamp(10px, 2.8vw, 12px);
}

.dakm4[data-mode="mobile"] .dakm4__product > span:not(.dakm4__product-media) {
    font-size: clamp(9px, 2.6vw, 11px);
}

@media (max-width: 360px) {
    .dakm4__mobile-head {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dakm4__mobile-scroll,
    .dakm4__mobile-utility,
    .dakm4[data-mode="mobile"] .dakm4__search-layout {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dakm4__mobile-features {
        gap: 10px 8px;
    }

    .dakm4[data-mode="mobile"] .dakm4__search-form {
        margin-right: 14px;
        margin-left: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #dakm4-portal,
    #dakm4-portal *,
    #dakm4-portal *::before,
    #dakm4-portal *::after {
        scroll-behavior: auto;
        transition-duration: .01ms;
        animation-duration: .01ms;
        animation-iteration-count: 1;
    }
}