/** Shopify CDN: Minification failed

Line 385:0 Unexpected "}"

**/
/*
 * A KONZEPT Next: one design layer for the whole shop.
 * Hairlines, mono text, Manrope for statements. Same pieces everywhere.
 */
:root {
  --akn-line: color-mix(in srgb, currentColor 12%, transparent);
  --akn-grey: var(--colorFaded, #737373);
  /* The one surface for product pictures. Packshots are pure white; their white dissolves into it (multiply). */
  --akn-tile: #f7f7f7;
  /* Radii from the theme only: pictures, controls; smaller steps of the theme's space scale for small tiles. */
  --akn-r-img: var(--globalRadiusImg, 0px);
  --akn-r-ui: var(--globalRadius, 0px);
  --akn-r-sm: var(--space-2, 8px);
  --akn-r-xs: var(--space-1, 4px);
  --akn-gap: clamp(64px, 9vw, 140px);
  --akn-pad: var(--layoutInline, 24px);
}

/* ---------- statements ---------- */
.akn-big { font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(26px, 3.05vw, 44px); letter-spacing: -0.03em; line-height: 1.1; margin: 0; }
.akn-mid { font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(20px, 2.2vw, 32px); letter-spacing: -0.02em; line-height: 1.15; margin: 0; }
.akn-grey { color: var(--akn-grey); }
.akn-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- chapter: the one frame for every block below the fold ---------- */
.akn-ch { margin: var(--akn-gap) var(--akn-pad) 0; padding-top: 28px; border-top: 1px solid currentColor; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 8fr); gap: 0 clamp(24px, 3.4vw, 48px); }
.akn-ch__head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 24px; }
.akn-ch__label { font: inherit; margin: 0; letter-spacing: inherit; }
.akn-ch__body { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.akn-ch__body > p { margin: 0; max-width: 60ch; }
.akn-ch[hidden] { display: none; }
.akn-ch--pending { height: 0; margin: 0; padding: 0; border: 0; overflow: hidden; }
@media (max-width: 777px) {
  .akn-ch { grid-template-columns: minmax(0, 1fr); margin-top: 56px; padding-top: 16px; }
  .akn-ch__head { flex-direction: row; justify-content: space-between; margin-bottom: 16px; }
  .akn-ch__body { gap: 16px; }
}

/* ---------- rows (details, facts) ---------- */
.akn-rows { display: flex; flex-direction: column; border-top: 1px solid var(--akn-line); margin: 0; }
.akn-rows > div { display: grid; grid-template-columns: minmax(96px, 38%) minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--akn-line); }
.akn-rows dt { color: var(--akn-grey); }
.akn-rows dd { margin: 0; }

/* ---------- product page: lead text + read more ---------- */
.akn-lead { display: flex; flex-direction: column; gap: 10px; }
.akn-lead .rte > :first-child { margin-top: 0; }
.akn-lead .rte > :last-child { margin-bottom: 0; }
.akn-lead details summary { list-style: none; cursor: pointer; color: var(--akn-grey); text-decoration: underline; text-underline-offset: 3px; width: fit-content; }
.akn-lead details summary::-webkit-details-marker { display: none; }
.akn-lead details[open] summary { display: none; }

/* ---------- smell: three statements ---------- */
.akn-smell { display: flex; flex-direction: column; }
.akn-smell > div { display: grid; grid-template-columns: minmax(120px, 2fr) minmax(0, 6fr); align-items: baseline; gap: 16px; padding: 28px 0; border-top: 1px solid var(--akn-line); }
.akn-smell > div:first-child { border-top: 0; padding-top: 0; }
.akn-smell > div:last-child { padding-bottom: 0; }
@media (max-width: 777px) { .akn-smell > div { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px 0; } }

/* ---------- cards (same look as the theme's product cards) ---------- */
.akn-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3, 12px); }
.akn-card { display: flex; flex-direction: column; gap: 2px; position: relative; }
.akn-card a { color: inherit; text-decoration: none; display: flex; flex-direction: column; gap: 2px; }
.akn-card__img { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 5; background: var(--akn-tile); border-radius: var(--akn-r-img); overflow: hidden; margin-bottom: 10px; }
.akn-card__img img { width: 100%; height: 100%; object-fit: contain; }
.akn-card__why { color: var(--akn-grey); margin-top: 2px; }
/* Styled with: the look in one row (up to six), the note and saving it below */
.akn-cards--look { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.akn-look-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.akn-look-foot p { margin: 0; font-size: 12px; }
.akn-answer__txt .akn-note { font-size: 12px; margin: 0; }
@media (max-width: 777px) { .akn-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 8px; } }

/* ---------- ask: which scent do you like ---------- */
.akn-answer { display: grid; grid-template-columns: minmax(120px, 220px) minmax(0, 1fr); gap: clamp(14px, 2vw, 28px); align-items: center; }
.akn-answer .akn-card__img { margin: 0; }
.akn-ch__more { grid-column: 2; margin: 24px 0 0; }
@media (max-width: 777px) { .akn-ch__more { grid-column: 1; } }
/* How it smells: the link to the scent finder sits under the notes, flush with them (not in the narrow label column) */
.akn-ch[data-akn-kind="smell"] .akn-ch__more { display: grid; grid-template-columns: minmax(120px, 2fr) minmax(0, 6fr); gap: 16px; margin-top: 40px; }
.akn-ch[data-akn-kind="smell"] .akn-ch__more > a { grid-column: 2; justify-self: start; }
@media (max-width: 777px) { .akn-ch[data-akn-kind="smell"] .akn-ch__more { grid-template-columns: minmax(0, 1fr); margin-top: 20px; } .akn-ch[data-akn-kind="smell"] .akn-ch__more > a { grid-column: 1; } }
.akn-answer__txt { display: flex; flex-direction: column; gap: 6px; }
.akn-answer__txt a { color: inherit; text-decoration: none; }
.akn-more-btn { font: inherit; background: none; border: 0; padding: 0; color: var(--akn-grey); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; width: fit-content; }

/* ---------- lookbook ---------- */
.akn-look { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3, 12px); }
.akn-look a { display: block; }
.akn-look img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
@media (max-width: 777px) { .akn-look { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; margin-right: calc(-1 * var(--akn-pad)); } .akn-look a { flex: 0 0 72%; scroll-snap-align: start; } }

/* ---------- pin (Merken) ---------- */
product-card .media { position: relative; }
.ak-pin { position: absolute; top: 8px; right: 8px; z-index: 2; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 1px solid var(--akn-line); border-radius: 50%; background: var(--bgColor, #fff); color: inherit; cursor: pointer; opacity: 0; transition: opacity .15s; }
.ak-pin svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linejoin: round; }
product-card:hover .ak-pin, .akn-card:hover .ak-pin, .ak-pin:focus-visible, .ak-pin[aria-pressed=true] { opacity: 1; }
.ak-pin[aria-pressed=true] { color: var(--color, #000); }
.ak-pin[aria-pressed=true] svg { fill: currentColor; animation: akn-heart .45s cubic-bezier(.2, .8, .2, 1.4); }
@keyframes akn-heart { 0% { transform: scale(.7); } 60% { transform: scale(1.15); } 100% { transform: none; } }
@media (hover: none) { .ak-pin { opacity: 1; } }
.akn-buy-row { display: flex; gap: 10px; width: 100%; align-self: stretch; align-items: stretch; }
.akn-buy-row .add-2-cart { width: auto !important; }
.akn-buy-row .add-2-cart { flex: 1 1 auto; min-height: 56px; font-size: 14px; letter-spacing: .02em; }
.ak-pin--pdp { position: static; opacity: 1; flex: 0 0 56px; width: 56px; height: auto; min-height: 56px; display: grid; place-items: center; border-radius: var(--akn-r-ui); border: 1px solid color-mix(in srgb, currentColor 35%, transparent); background: transparent; }
.ak-pin--pdp svg { width: 18px; height: 18px; }
.ak-pin--pdp:hover { border-color: currentColor; }
.ak-pin--pdp[aria-pressed="true"] { border-color: currentColor; }

/* ---------- board (Gemerkt) ---------- */
.ak-board-fab { position: fixed; left: var(--akn-pad); bottom: var(--akn-pad); z-index: 20; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; font: inherit; color: #fff; background: #000; border: 0; border-radius: 999px; cursor: pointer; }
.ak-board-fab svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.ak-board-fab[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .ak-pin { transition: none; } .ak-pin[aria-pressed=true] svg { animation: none; } }

/* ---------- list chapters (rows of products): label row + full-width list, same rule ---------- */
.akn-ch--list { grid-template-columns: minmax(0, 1fr); }
.akn-ch--list .akn-ch__head { flex-direction: row; justify-content: space-between; }
[coretex-page=product] .suggested { margin-top: var(--akn-gap); }
[coretex-page=product] .suggested .section-heading, [coretex-page=product] .suggested .section-heading[addpad] { padding-inline: 0; margin-inline: var(--akn-pad); padding: 28px 0 0; border-top: 1px solid currentColor; margin-bottom: 24px; }
[coretex-page=product] .suggested .section-heading .h6, [coretex-page=product] .suggested .section-heading h2 { font: inherit; letter-spacing: inherit; }

/* ---------- page intro (collections, pages, legal) ---------- */
.akn-intro { margin: clamp(24px, 4vw, 56px) var(--akn-pad) clamp(32px, 5vw, 72px); display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 8fr); gap: 16px clamp(24px, 3.4vw, 48px); align-items: start; }
.akn-intro__head { display: flex; flex-direction: column; gap: 6px; }
.akn-intro__title { font: inherit; margin: 0; letter-spacing: inherit; }
.akn-intro__body { display: flex; flex-direction: column; gap: 16px; max-width: 900px; }
.akn-intro__more summary { list-style: none; cursor: pointer; color: var(--akn-grey); text-decoration: underline; text-underline-offset: 3px; width: fit-content; }
.akn-intro__more summary::-webkit-details-marker { display: none; }
.akn-intro__more[open] summary { display: none; }
.akn-intro__more .rte { max-width: 60ch; }
@media (max-width: 777px) { .akn-intro { grid-template-columns: minmax(0, 1fr); } .akn-intro__head { flex-direction: row; justify-content: space-between; } }

/* ---------- pages and legal texts: title left, text right, same grid as everywhere ---------- */
.general-page > x-grid.container, .shopify-policy__container { margin: clamp(24px, 4vw, 56px) var(--akn-pad) var(--akn-gap); padding: 0; max-width: none; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 8fr); gap: 16px clamp(24px, 3.4vw, 48px); align-items: start; }
.general-page > x-grid.container > x-cell { grid-column: auto; }
.general-page .title, .shopify-policy__title, .shopify-policy__title h1 { font: inherit; letter-spacing: inherit; text-align: left; margin: 0; }
.general-page .content, .shopify-policy__body .rte { max-width: 68ch; }
.shopify-policy__body .rte { margin: 0; }
.shopify-policy__body .rte strong, .general-page .rte strong { font-weight: 500; }
@media (max-width: 777px) { .general-page > x-grid.container, .shopify-policy__container { grid-template-columns: minmax(0, 1fr); } }

/* ---------- home + list sections: headings in the same chapter frame ---------- */
[coretex-page=index] .section-heading, [coretex-page=index] .section-heading[addpad] { margin: var(--akn-gap) var(--akn-pad) 24px; padding: 28px 0 0; border-top: 1px solid currentColor; }
[coretex-page=index] .section-heading .h6, [coretex-page=index] .section-heading h2 { font: inherit; letter-spacing: inherit; }
.akn-cards--theme > li { list-style: none; }

/* ---------- colours and sizes under product cards ---------- */
.akn-sw { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.akn-sw:empty { display: none; }
.akn-sw__row { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
/* the frame of the chosen colour sits inside the small picture (border + gap), so rows that scroll sideways never cut it off */
.akn-sw__i { display: block; box-sizing: border-box; width: 24px; height: 30px; padding: 1px; border: 1px solid transparent; border-radius: var(--akn-r-xs); overflow: hidden; background: var(--akn-tile); }
.akn-sw__i img { width: 100%; height: 100%; object-fit: contain; display: block; }
.akn-sw__i[aria-current=true] { border-color: currentColor; }
.akn-sw__i.is-out { opacity: .4; }
.akn-sw__more { color: var(--akn-grey); font-size: .92em; margin-left: 2px; }
.akn-sw__sizes { display: flex; gap: 8px; flex-wrap: wrap; color: var(--akn-grey); font-size: .92em; }
.akn-sw__sizes a { color: inherit; text-decoration: none; }
.akn-sw__sizes a:hover { color: var(--color, #000); }
.akn-sw__sizes [aria-current=true] { color: var(--color, #000); }

/* ---------- colours and volumes on the product page ---------- */
.akn-fam { display: flex; flex-direction: column; gap: 8px; }
.akn-fam__tiles, .akn-fam__pills { display: flex; gap: 8px; flex-wrap: wrap; }
.akn-fam__tile { display: block; width: 56px; height: 70px; border-radius: var(--akn-r-sm); overflow: hidden; background: var(--akn-tile); outline: 1px solid transparent; outline-offset: 2px; }
.akn-fam__tile img { width: 100%; height: 100%; object-fit: contain; display: block; }
.akn-fam__tile[aria-current=true] { outline-color: currentColor; }
.akn-fam__tile.is-out { opacity: .4; }
.akn-fam__pill { height: 44px; min-width: 64px; padding: 0 14px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--akn-line); border-radius: var(--akn-r-ui); color: inherit; text-decoration: none; }
.akn-fam__pill[aria-current=true] { border-color: currentColor; }
.akn-fam__pill.is-out { color: var(--akn-grey); text-decoration: line-through; }

/* ---------- luxury details: brand in small capitals, quiet badges ---------- */
/* The accent: one small typeface for labels only (brand names, overlines, badges). Set in the editor as "Accent font". */
product-card .vendor .h6, .akn-card > a > span:nth-of-type(2), .etheryx-product-info .vendor a, .etheryx-product-info section.vendor, .ak-it__v, .ak-it__label, .ak-idea__v,
.akn-cover__eyebrow, .akn-menu-tile__eyebrow, .akn-menu-tile__v, .akn-lex__eyebrow, .akn-lex__house h3, .akn-lex__v,
product-card .badges .badge {
  font-family: var(--aFontFamily); text-transform: uppercase; letter-spacing: .06em; font-size: 10.5px; font-weight: 400;
}
product-card .badges .badge { color: var(--akn-grey); }
product-card .badges .badge + .badge::before { content: "·"; margin: 0 6px; }
product-card .badges .badge { color: var(--akn-grey); }
product-card .badges .badge.soldout { color: var(--akn-grey); }
.etheryx-product-info .vendor a { text-decoration: none; }

/* ---------- footer: the same rule and grid ---------- */
#primaryFooter { margin-inline: var(--akn-pad); padding-top: 28px !important; border-top: 1px solid currentColor; }
#primaryFooter .labelTitle { font: inherit; letter-spacing: inherit; color: var(--akn-grey); margin: 0 0 12px; }
#primaryFooter .menu a { text-decoration: none; }
#primaryFooter .menu a { width: fit-content; background: linear-gradient(currentColor, currentColor) 0 calc(100% - var(--space-1) - 2px) / 0 1px no-repeat; transition: background-size .45s cubic-bezier(.2,.7,.2,1); }
#primaryFooter .menu a:is(:hover, :focus-visible) { background-size: 100% 1px; }
@media (prefers-reduced-motion: reduce) { #primaryFooter .menu a { transition: none; } }
#primaryFooter .akn-about { display: flex; flex-direction: column; gap: 16px; }
#primaryFooter .akn-about__logo { display: block; width: fit-content; }
#primaryFooter .akn-about__logo img { height: var(--akn-logo-h, 22px); width: auto; }
#primaryFooter .akn-about__name { font-weight: 500; letter-spacing: .02em; }
#primaryFooter .akn-about__text { margin: 0; max-width: 34ch; color: var(--akn-grey); text-wrap: pretty; }
#primaryFooter .menu li li { padding: 3px 0; }
#primaryFooter .akn-fcol > summary { list-style: none; cursor: default; }
#primaryFooter .akn-fcol > summary::-webkit-details-marker { display: none; }
/* the bottom line starts where the columns start */
#secondaryFooter { margin-inline: var(--akn-pad); }
/* Phone: the columns fold into calm rows with a hairline, the house in brief below, then payment, legal links in two even columns, copyright last. */
@media (max-width: 777px) {
  #primaryFooter { --gap: 0; padding-bottom: 8px !important; }
  #primaryFooter .menu > ul { row-gap: 0 !important; }
  #primaryFooter .menu > ul > li { grid-column: 1 / -1 !important; border-bottom: 1px solid var(--akn-line); }
  #primaryFooter .akn-fcol > summary { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 16px 0; color: var(--color, #000); cursor: pointer; }
  #primaryFooter .akn-fcol > summary::after { content: ""; width: 9px; height: 9px; background: linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat, linear-gradient(currentColor, currentColor) center / 1px 100% no-repeat; transition: transform .3s ease; }
  #primaryFooter .akn-fcol[open] > summary::after { transform: rotate(45deg); }
  #primaryFooter .akn-fcol > ul { padding: 0 0 14px; }
  #primaryFooter .menu li li { padding: 0; }
  #primaryFooter .menu li li a { padding-block: 7px; }
  #primaryFooter .akn-about { margin-top: 36px; gap: 12px; }
  #primaryFooter .akn-about__text { max-width: none; }
  #secondaryFooter { padding-top: 24px !important; padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important; }
  #secondaryFooter > x-flex { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px 16px; align-items: start; }
  #secondaryFooter > x-flex > .akn-payments { grid-column: 1 / -1; order: 0; margin: 0 0 12px; width: auto; }
  #secondaryFooter > x-flex > .akn-payments .payment-icons { justify-content: flex-start; }
  #secondaryFooter .policies, #secondaryFooter .policies > x-flex, #secondaryFooter .policies ul { display: contents !important; }
  #secondaryFooter .policies li { order: 1; align-self: start; line-height: 1.4; }
  #secondaryFooter > x-flex > .akn-warranty { align-self: start; line-height: 1.4; }
  #secondaryFooter .akn-warranty { order: 2; }
  #secondaryFooter .copyright { grid-column: 1 / -1; order: 3; margin-top: 14px; }
}

/* ---------- phone menu ----------
 * Language switch and close on top, search right below, the sections large and calm (they open softly),
 * account and help at the bottom. Desktop-only parts of the panels (title, newest piece) stay out. */
@media (max-width: 777px) {
  #menuDrawerBox > .menuContent { inset: 0 !important; width: auto !important; max-width: none !important; height: 100dvh !important; max-height: none !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow-y: auto; }
  #menuDrawerBox .menuContent { display: flex; flex-direction: column; overflow-y: auto; }
  #menuDrawerBox drawer-header.akn-dh { padding: 12px var(--akn-pad); border: 0; background: var(--bgColor, #fff); }
  .akn-lang { display: inline-flex; padding: 3px; border: 1px solid var(--akn-line); border-radius: var(--globalRadiusFull, 999px); }
  .akn-lang__b { height: 28px; min-width: 40px; padding: 0 12px; border: 0; border-radius: var(--globalRadiusFull, 999px); background: transparent; color: var(--akn-grey); font-family: var(--aFontFamily); font-size: 11px; letter-spacing: .08em; cursor: pointer; }
  .akn-lang__b[aria-current="true"] { background: var(--color, #000); color: var(--bgColor, #fff); }
  #menuDrawerBox .akn-dsearch { box-sizing: border-box; width: calc(100% - 2 * var(--akn-pad)) !important; height: 46px !important; min-height: 46px; justify-content: flex-start !important; }
  .akn-dsearch { display: flex; align-items: center; gap: 10px; margin: 4px var(--akn-pad) 12px; height: 46px; padding: 0 16px; border: 1px solid var(--akn-line); border-radius: var(--globalRadiusFull, 999px); background: var(--akn-tile); color: var(--akn-grey); font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
  .akn-dsearch svg { width: 16px; height: 16px; flex: none; }
  #menuDrawerBox nav.menuPrimary { flex: 1 0 auto; }
  #menuDrawerBox [data-level="1"] { padding: 0 var(--akn-pad); }
  #menuDrawerBox [data-level="1"] > li { border-bottom: 1px solid var(--akn-line); }
  #menuDrawerBox [data-level="1"] > li > a, #menuDrawerBox [data-level="1"] > li > details > summary { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 16px 0; font-family: var(--hFontFamily); font-weight: 500; font-size: 26px; letter-spacing: -0.02em; line-height: 1.1; text-transform: none; }
  #menuDrawerBox [data-level="1"] > li > :is(a, details > summary) > span { font: inherit !important; letter-spacing: inherit !important; text-transform: none !important; }
  #menuDrawerBox [data-level="1"] > li > :is(a, details > summary)::before, #menuDrawerBox [data-level="1"] > li > :is(a, details > summary) > span::after { content: none !important; }
  #menuDrawerBox [data-level="1"] > li > details > summary svg { width: 16px; height: 16px; transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
  #menuDrawerBox [data-level="1"] > li > details[open] > summary svg { transform: rotate(90deg); }
  #menuDrawerBox details.lv1 > details-menu { overflow: hidden; }
  #menuDrawerBox [data-level="2"] { padding: 0 0 18px; }
  #menuDrawerBox [data-level="2"] a { display: block; padding: 9px 0; font-size: 16px; }
  #menuDrawerBox .akn-menu-tile, #menuDrawerBox .akn-panel__title { display: none !important; }
  #menuDrawerBox drawer-footer.akn-df { display: flex; flex-direction: column; gap: 16px; margin-top: 28px; padding: 4px var(--akn-pad) calc(28px + env(safe-area-inset-bottom)); border-top: 0; }
  .akn-df__a { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; font-size: 14px; }
  .akn-df__a svg { width: 18px; height: 18px; }
  #menuDrawerBox :focus-visible { outline: 1px solid currentColor; outline-offset: 2px; box-shadow: none; }
}
@media (min-width: 778px) { .akn-dsearch, drawer-footer.akn-df { display: none !important; } }

/* ---------- product page, info column: quiet and aligned ---------- */
.etheryx-product-info .kontainer { gap: 14px; }
.etheryx-product-info .kontainer > * { margin-block: 0 !important; }
.etheryx-product-info section.description .akn-lead { gap: 6px; }
.etheryx-product-info section.vendor { margin: 0; }
.etheryx-product-info section.title h1 { font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(22px, 2vw, 30px); letter-spacing: -0.02em; line-height: 1.12; margin: 6px 0 0; }
.akn-rows dt, .akn-rows dd { font-weight: 400; }
.etheryx-product-info coretex-accordion, .etheryx-product-info .accordion { margin: 0; }
.etheryx-product-info .collapsible-tab, .etheryx-product-info section.collapsible_tab, .etheryx-product-info details { border-bottom: 1px solid var(--akn-line); }
.etheryx-product-info details > summary { padding: 11px 0; color: inherit; list-style: none; display: flex; justify-content: space-between; cursor: pointer; }
.akn-lead details { border-bottom: 0 !important; }
.akn-lead details > summary { padding: 0; display: block; }
@media (max-width: 777px) {
  /* phone: picture, then brand + name, then buying, then the text */
  .product-body > .etheryx-product-info, .etheryx-product-info > .sticky, .etheryx-product-info > .sticky > .kontainer, .etheryx-product-info > .kontainer { display: contents; }
  .etheryx-product-info .kontainer > * { order: 4; }
  /* one rhythm: brand 20 px under the picture, buying 24 px under the name, the text 40 px under the payment icons,
     all on one left edge (the buying column had 4 px of its own side padding). The !important beats the column's own
     "no margins" rule above, which otherwise swallowed these distances. */
  .etheryx-product-info .kontainer > section.vendor { order: 2; margin-top: 20px !important; }
  .etheryx-product-info .kontainer > section.title { order: 2; margin-bottom: 0 !important; }
  .product-body > .etheryx-product-options { order: 3; margin-top: 24px; }
  .product-body > .etheryx-product-options > .sticky { padding-inline: 0; }
  .product-body > .etheryx-product-media { order: 1; }
  .etheryx-product-info .kontainer > section.description { margin-top: 40px !important; }
}

/* price line and stock: calm, sentence case */
.etheryx-product-options .price-info, .etheryx-product-options .taxes, .etheryx-product-options [class*=tax] { color: var(--akn-grey); }
.etheryx-product-options .tax { display: block; color: var(--akn-grey); }
.etheryx-product-options .tax small { display: inline; font-size: 11px; }
.etheryx-product-options .tax small + small::before { content: " "; }
.akn-both { margin-top: 10px; height: 48px; padding: 0 22px; width: fit-content; border: 0; border-radius: var(--akn-r-ui); background: var(--color, #000); color: var(--bgColor, #fff); font: inherit; cursor: pointer; }

/* product page: side columns centred on the first picture and sticky (desktop) */
@media (min-width: 1024px) {
  .product-body.akn-aligned > :is(.etheryx-product-info, .etheryx-product-options) { padding-top: var(--akn-off, 0px); }
  .product-body.akn-aligned > :is(.etheryx-product-info, .etheryx-product-options) > .sticky { position: sticky; top: calc(var(--akn-head, var(--headSpace, 64px)) + 8px); height: auto; min-height: var(--akn-mh, auto); max-height: none !important; overflow: visible !important; display: flex; flex-direction: column; justify-content: center; }
  .product-body.akn-aligned > :is(.etheryx-product-info, .etheryx-product-options) > .sticky > .kontainer { justify-content: safe center; height: auto; min-height: 0; max-height: 100%; }
  /* the first picture always in the middle of the screen frame, however many pictures follow */
  .product-body.akn-aligned > .etheryx-product-media > .sticky > .kontainer { justify-content: flex-start; padding-top: max(0px, calc((var(--akn-mh) - var(--akn-size)) / 2)); min-height: 0; }
  /* every picture in the same square, whatever its pixel size */
  .product-body.akn-aligned .etheryx-product-media .product__media-item media-loader { width: var(--akn-size); height: var(--akn-size); margin-inline: auto; }
  .product-body.akn-aligned .etheryx-product-media .product__media-item media-loader img { width: 100% !important; height: 100% !important; max-height: none !important; margin: 0 !important; object-fit: contain; }
  .product-body.akn-aligned .etheryx-product-media .product__media-item media-loader img[data-akn-pic="photo"] { object-fit: cover; }
  .product-body.akn-aligned .etheryx-product-media .product__media-item > button { display: block; width: 100%; }
}
/* phone and tablet: every picture of the gallery in the same square tile (as on desktop), so the gallery never takes
   the height of one taller picture and the progress lines always lie on the picture */
@media (max-width: 1023px) {
  .product-page media-gallery .product__media-item media-loader { display: block; width: 100%; height: auto !important; aspect-ratio: 1 / 1; }
  .product-page media-gallery .product__media-item media-loader img { width: 100% !important; height: 100% !important; max-height: none !important; object-fit: contain; }
  .product-page media-gallery .product__media-item media-loader img[data-akn-pic="photo"] { object-fit: cover; }
}

/* no sideways scrolling from off-canvas drawers */
html, body { overflow-x: clip; }

/* ---------- buying column: one rhythm, one label style ---------- */
.etheryx-product-options .kontainer { gap: 22px; }
.etheryx-product-options .kontainer > * { margin-block: 0 !important; }
.etheryx-product-options .variant-picker legend, .etheryx-product-options .variant-picker label, .etheryx-product-options .variant-picker .labelTitle, .etheryx-product-options .variant-picker [class*=label], .akn-fam > span { font: inherit; letter-spacing: inherit; text-transform: none; color: var(--akn-grey); margin: 0 0 8px; padding: 0; }
.akn-fam { gap: 0; }
.akn-fam__tiles { gap: 6px; }
.akn-fam__tile { width: 52px; height: 65px; }
.etheryx-product-options .variant-picker fieldset { margin: 0; padding: 0; border: 0; }
.akn-answer--layer { align-items: start; }
.akn-answer--layer .akn-answer__txt { gap: 12px; max-width: 62ch; }
.akn-answer--layer .akn-answer__txt p { margin: 0; }

/* ---------- home cover: fashion and fragrance side by side ---------- */
.akn-cover { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 0 var(--akn-pad); height: calc(var(--akn-cover-h, 85svh) - var(--headSpace, 56px)); min-height: 480px; }
.akn-cover__half { position: relative; display: block; overflow: hidden; border-radius: var(--akn-r-img); background: var(--akn-tile); color: #fff; text-decoration: none; }
.akn-cover__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.akn-cover__half:hover .akn-cover__img { transform: scale(1.02); }
.akn-cover__half.is-light { color: var(--color, #000); }
.akn-cover__half, .akn-cover__half:hover, .akn-cover__half:focus-visible { color: #fff; }
.akn-cover__half.is-light, .akn-cover__half.is-light:hover { color: var(--color, #000); }
.akn-cover__half:not(.is-light)::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgba(0, 0, 0, .45)); pointer-events: none; }
.akn-cover__text { position: absolute; left: clamp(20px, 2.4vw, 36px); right: 20px; bottom: clamp(22px, 2.8vw, 40px); z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.akn-cover__eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: 11px; }
.akn-cover__title { font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(40px, 5.2vw, 84px); letter-spacing: -0.04em; line-height: .95; }
.akn-cover__houses { font-size: 12px; opacity: .85; margin-top: 4px; }
.akn-cover__cta { margin-top: 14px; padding-bottom: 3px; border-bottom: 1px solid currentColor; font-size: 12px; letter-spacing: .02em; }
.akn-cover__half:hover .akn-cover__cta { border-bottom-width: 2px; padding-bottom: 2px; }
@media (max-width: 777px) { .akn-cover { grid-template-columns: 1fr; height: auto; } .akn-cover__half { height: 72svh; } }
@media (prefers-reduced-motion: reduce) { .akn-cover__img { transition: none; } }

/* ---------- desktop navigation: quiet bar, wide panel with large links ---------- */
@media (min-width: 1024px) {
  #headerGroup nav.menuPrimary > ul { flex-wrap: nowrap; column-gap: clamp(14px, 1.6vw, 26px); white-space: nowrap; }
  #headerGroup nav.menuPrimary > ul > li > details > summary .g-chevronDown, #headerGroup nav.menuPrimary > ul > li > details > summary svg { display: none; }
  #headerGroup nav.menuPrimary > ul > li > details > summary, #headerGroup nav.menuPrimary > ul > li > a { padding-inline: 0; }
  /* the first row of the house: small capitals, wide spacing, a fine line that draws itself on hover */
  #headerGroup nav.menuPrimary > ul[data-level="1"] > li > :is(a, details > summary), #headerGroup nav.menuPrimary > ul[data-level="1"] > li > details > summary > span { font-family: var(--fontFamily) !important; font-weight: 500 !important; font-size: 11px !important; letter-spacing: .14em !important; text-transform: uppercase !important; }
  #headerGroup nav.menuPrimary > ul[data-level="1"] > li > :is(a, details > summary) > span, #headerGroup nav.menuPrimary > ul[data-level="1"] > li > a { position: relative; }
  #headerGroup nav.menuPrimary > ul[data-level="1"] > li > details > summary > span::after, #headerGroup nav.menuPrimary > ul[data-level="1"] > li > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -5px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
  #headerGroup nav.menuPrimary > ul[data-level="1"] > li > details[open] > summary > span::after, #headerGroup nav.menuPrimary > ul[data-level="1"] > li:hover > :is(a, details > summary) > span::after, #headerGroup nav.menuPrimary > ul[data-level="1"] > li > a:hover::after { transform: scaleX(1); }
  #headerGroup nav.menuPrimary details.lv1 > details-menu { position: fixed !important; left: 0 !important; right: 0 !important; width: auto !important; max-width: none !important; transform: none !important; margin: 0 !important; border-radius: 0 !important; top: var(--headSpace, 56px); z-index: 30; background: var(--bgColor, #fff); border-top: 1px solid var(--akn-line); padding: 36px var(--akn-pad) 56px !important; height: auto !important; max-height: calc(100dvh - 80px) !important; overflow: auto !important; display: block !important; }
  #headerGroup nav.menuPrimary details.lv1 > details-menu > ul[data-level="2"] { position: static !important; inset: auto !important; width: auto !important; max-height: none !important; overflow: visible !important; transform: none !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 220px)); gap: 2px clamp(24px, 3.4vw, 48px); margin: 0 0 0 calc(20% + 10px); padding: 0; max-width: 1100px; }
  #headerGroup nav.menuPrimary [data-level="2"] > li { text-align: left; background: none; }
  #headerGroup nav.menuPrimary [data-level="2"] > li > a { display: block; text-align: left; justify-content: flex-start; padding: 7px 0; font-family: var(--fontFamily); font-weight: 400; font-size: 16px; letter-spacing: 0; line-height: 1.3; white-space: normal; }
  .akn-panel__title { position: absolute; left: var(--akn-pad); top: 40px; font-family: var(--aFontFamily); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--akn-grey); }
  #headerGroup nav.menuPrimary [data-level="2"] > li > a:hover { color: var(--akn-grey); }
  /* long lists (brands) become a calm index */
  #headerGroup nav.menuPrimary details.lv1 > details-menu > ul[data-level="2"]:has(> li:nth-child(16)) { grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: none; }
  #headerGroup nav.menuPrimary [data-level="2"]:has(> li:nth-child(16)) > li > a { font-family: inherit; font-weight: 400; font-size: inherit; letter-spacing: inherit; padding: 5px 0; }
}
/* Like the large houses: the logo centred on top, the menu centred in its own row below
   (menu block "Layout": "Logo centred on top"; with "Theme layout" the theme's own alignment applies). */
@media (min-width: 778px) {
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header { flex-wrap: wrap; position: relative; }
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header > .logo { position: absolute; left: 50%; top: 0; transform: translateX(-50%); }
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header > .tools, #headerGroup coretex-header:not([data-ak-layout="theme"]) .header > :not(.logo):not(.menu) { margin-left: auto; }
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header { padding-top: 10px; }
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header > coretex-menu.menu { order: 3; flex: 0 0 100%; justify-content: center !important; padding: 6px 0 9px; }
  #headerGroup coretex-header:not([data-ak-layout="theme"]) nav.menuPrimary > ul[data-level="1"] { justify-content: center; column-gap: clamp(16px, 2vw, 28px) !important; }
}
/* Menu block switches (editor): "Menu words in capitals" off, and "Theme layout" instead of logo on top / menu below */
#headerGroup coretex-header[data-ak-caps="off"] nav.menuPrimary > ul[data-level="1"] > li > :is(a, details > summary), #headerGroup coretex-header[data-ak-caps="off"] nav.menuPrimary > ul[data-level="1"] > li > details > summary > span { text-transform: none !important; letter-spacing: 0 !important; }
}
/* same quiet menu labels at every width: no arrows next to the words */
@media (min-width: 778px) {
  #headerGroup nav.menuPrimary > ul[data-level="1"] > li > details > summary > svg, #headerGroup nav.menuPrimary > ul[data-level="1"] > li > details > summary > i { display: none !important; }
}
@media (min-width: 1024px) {
  /* the newest piece of the collection, at the right of its panel */
  #headerGroup nav.menuPrimary details.lv1 > details-menu:has(.akn-menu-tile) { min-height: 440px; }
  #headerGroup nav.menuPrimary details.lv1 > details-menu:has(.akn-menu-tile) > ul[data-level="2"] { margin-right: 300px; }
  .akn-menu-tile { position: absolute; top: 36px; right: var(--akn-pad); width: 240px; display: flex; flex-direction: column; gap: 2px; color: inherit; text-decoration: none; white-space: normal; } /* the menu row does not wrap; the tile's text does */
  .akn-menu-tile__img { display: block; aspect-ratio: 4 / 5; border-radius: var(--akn-r-img); background: var(--akn-tile); isolation: isolate; overflow: hidden; margin-bottom: 10px; }
  .akn-menu-tile__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
  .akn-menu-tile:hover .akn-menu-tile__img img { transform: scale(1.03); }
  .akn-menu-tile__eyebrow { font-size: 10.5px; color: var(--akn-grey); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
  .akn-menu-tile__v { text-transform: uppercase; letter-spacing: .06em; font-size: .92em; }
  .akn-menu-tile__t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; } /* long names: two lines at most, as wide as the picture */
}
@media (max-width: 777px) { .akn-menu-tile { display: none; } }


/* cover text keeps its colour on hover */
.akn-cover__half:focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
product-card:has(.ak-pin:focus:not(:focus-visible)):not(:hover) .secondary, product-card:has(.ak-pin:focus:not(:focus-visible)):not(:hover) [class*=secondary] { opacity: 0 !important; }

/* header: solid, above the menu veil; no pill behind the active item */
/* header keeps its blend look (inverted colours over pictures); only while a menu panel is open it turns white */
/* white on scroll only when "Enable content blend mode" is off in the header settings; with it on, the theme's inverted colours stay (editor decides) */
#headerGroup:has(details.lv1[open]), #headerGroup.akn-solid:not(:has(coretex-header[mix-blend="true"])) { background: var(--bgColor, #fff); transition: background-color .25s ease; }
#headerGroup:has(details.lv1[open]) * { mix-blend-mode: normal !important; }
#headerGroup.akn-solid:not(:has(coretex-header[mix-blend="true"])) { box-shadow: 0 1px 0 var(--akn-line); }
#headerGroup:has(details.lv1[open]) .akn-menu-tile__img img { mix-blend-mode: multiply !important; }
#headerGroup nav.menuPrimary > ul > li > details > summary, #headerGroup nav.menuPrimary > ul > li > a { background: transparent !important; box-shadow: none !important; }
#headerGroup nav.menuPrimary > ul > li > details > summary::before, #headerGroup nav.menuPrimary > ul > li > a::before { display: none !important; }
@media (min-width: 1024px) {
  #headerGroup nav.menuPrimary details.lv1 > details-menu { top: var(--akn-head-h, 45px) !important; border-top: 0 !important; }
}

/* a column that grew taller than the screen (opened texts) simply scrolls with the page: no inner scrollbar */
.product-body.akn-aligned > :is(.etheryx-product-info, .etheryx-product-options) > .sticky:hover, .product-body.akn-aligned > :is(.etheryx-product-info, .etheryx-product-options) > .sticky:focus-within { overflow: visible !important; }
.product-body.akn-aligned > .akn-unstick > .sticky { position: static !important; }
.akn-lead:has(details[open]) > p.text { display: none; }


/* One veil for everything that opens above the page: the theme's own overlay (colour, blur, fade), as for cart and drawers. */
body:has(#headerGroup details.lv1[open])::before { content: ""; position: fixed; inset: 0; z-index: 98; background: var(--overlayBg); -webkit-backdrop-filter: var(--overlayBlur); backdrop-filter: var(--overlayBlur); animation: fadeIn 1s ease forwards; pointer-events: none; }

/* ---------- product pictures: one surface everywhere ----------
 * Packshots are square on pure white. They sit whole (never cropped) on the tile colour,
 * and their white dissolves into it. Model and lookbook pictures elsewhere stay untouched. */
/* Cards: the theme stacks first and hover picture in one grid, each in its own layer (component-loader).
 * The tile sits on the stack, each layer dissolves its white into it. The stack keeps the theme's own layout. */
product-card .media x-grid { background: var(--akn-tile); isolation: isolate; overflow: hidden; border-radius: var(--akn-r-img); }
product-card .media x-grid > component-loader { mix-blend-mode: multiply; }
/* while a colour of the row is pointed at, the card shows that colour in its first picture, not the theme's hover picture */
product-card[data-akn-colour] .media .on { opacity: 1 !important; }
product-card[data-akn-colour] .media .off { opacity: 0 !important; }
product-card .media img[data-akn-pic="photo"] { object-fit: cover !important; }
/* Elsewhere one picture per frame; the theme forces the picture itself transparent, so the tile sits on its frame. */
.product__media-item media-loader, slider-thumbnails button, #cartBox media-loader, #searchBox media-loader,
.akn-card__img, .akn-sw__i, .akn-fam__tile, .ak-it__img, .ak-idea__img {
  display: block; background: var(--akn-tile); isolation: isolate; overflow: hidden;
}
.product__media-item media-loader, slider-thumbnails button { border-radius: var(--akn-r-img); }
.product__media-item img, slider-thumbnails img, #cartBox media-loader img, #searchBox media-loader img,
.akn-card__img img, .akn-sw__i img, .akn-fam__tile img, .ak-it__img img, .ak-idea__img img {
  mix-blend-mode: multiply; background: transparent;
}
.akn-sw__i { background-clip: content-box; } /* the tile colour only behind the picture, the gap to the frame stays white */

/* ---------- board: the line-up ----------
 * Looks side by side like the finale of a show; each head to toe, closed by its scent, followed by what it
 * still wants. Nothing is listed twice: price, sizes and remove sit on the piece. */
.ak-board { border: 0; padding: 0; width: min(1440px, calc(90vw - 16px)); max-width: none; height: calc(90dvh - 16px); max-height: none; background: transparent; color: var(--color, #000); }
.ak-board::backdrop { background: var(--overlayBg); -webkit-backdrop-filter: var(--overlayBlur); backdrop-filter: var(--overlayBlur); animation: fadeIn 1s ease forwards; }
.ak-board:focus, .ak-board:focus-visible, .ak-board__in:focus { outline: none; }
.ak-board__in { height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: var(--bgColor, #fff); border-radius: var(--akn-r-ui); overflow: hidden; }
.ak-board__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 20px 14px 28px; border-bottom: 1px solid var(--akn-line); }
.ak-board__title { display: flex; gap: 14px; align-items: baseline; }
.ak-board__tools { display: flex; gap: 16px; align-items: center; }
.ak-board__hint { font-size: 11px; }
/* where you are among the looks (phone) */
.ak-pager { display: none; align-items: center; gap: 10px; font-size: 12px; }
.ak-pager button { width: 32px; height: 32px; border: 1px solid var(--akn-line); border-radius: 50%; background: var(--bgColor, #fff); color: inherit; font: inherit; font-size: 14px; line-height: 1; cursor: pointer; }
.ak-pager button:disabled { opacity: .35; cursor: default; }
.ak-pager__dots { display: flex; gap: 5px; }
.ak-pager__dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--akn-line); transition: background .2s ease, width .2s ease; }
.ak-pager__dots i.is-on { width: 16px; border-radius: 3px; background: var(--color, #000); }
.ak-x { font: inherit; font-size: 16px; line-height: 1; width: 32px; height: 32px; border: 1px solid var(--akn-line); border-radius: 50%; background: var(--bgColor, #fff); color: inherit; cursor: pointer; }
/* one calm scroll area for the whole board, no bar of its own (the looks never scroll inside) */
.ak-board__stage { position: relative; min-height: 0; min-width: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
.ak-board__stage::-webkit-scrollbar { display: none; }
.ak-board__empty { position: absolute; inset: 0; margin: auto; height: fit-content; max-width: 34ch; text-align: center; color: var(--akn-grey); }
/* desktop: the looks as wide cards side by side, in rows when there are more; nothing scrolls sideways */
.ak-lineup { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; padding: 20px 24px 28px; align-items: start; }
.ak-look { display: flex; flex-direction: column; min-width: 0; padding: 22px 24px 24px; border: 1px solid var(--akn-line); border-radius: var(--akn-r-img); transition: background .25s ease, border-color .25s ease; }
.ak-look.is-over { background: var(--akn-tile); border-color: currentColor; }
.ak-look__head { padding-bottom: 14px; }
.ak-look__n { font-family: var(--hFontFamily); font-weight: 500; font-size: 30px; letter-spacing: -0.03em; line-height: 1; }
.ak-look__items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ak-look--new { align-items: center; justify-content: center; min-height: 180px; color: var(--akn-grey); border: 1px dashed var(--akn-line); background: none; font: inherit; cursor: pointer; }
.ak-look--new:hover > span, .ak-look--new:focus-visible > span { border-color: currentColor; color: var(--color, #000); }
.ak-look.is-empty .ak-look__head { display: flex; justify-content: space-between; align-items: center; }
.ak-look__hint { margin: 0 0 4px; padding: 28px 16px; border: 1px dashed var(--akn-line); border-radius: var(--akn-r-ui); color: var(--akn-grey); font-size: 12px; text-align: center; }
.ak-look.is-empty .ak-look__more { margin-top: 18px; padding-top: 0; }
.ak-look.is-empty.is-over .ak-look__hint { border-color: currentColor; color: var(--color, #000); }
.ak-look--new > span { padding: 10px 16px; }
.ak-look--new.is-over { border-color: currentColor; color: var(--color, #000); }
/* a piece */
.ak-it { position: relative; display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 16px; align-items: start; padding: 12px 0; border-top: 1px solid var(--akn-line); cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; background: var(--bgColor, #fff); }
.ak-it:first-child { border-top: 0; }
.ak-it.is-scent { margin-top: 10px; border-top: 1px solid currentColor; }
.ak-lineup.is-accords .ak-it.is-scent { margin-top: 0; border-top: 1px solid var(--akn-line); }
.ak-lineup.is-accords .ak-it.is-scent:first-child { border-top: 0; }
.ak-it__img { display: block; aspect-ratio: 4 / 5; border-radius: var(--akn-r-sm); }
.ak-it__img img { width: 100%; height: 100%; object-fit: contain; display: block; pointer-events: none; }
.ak-it__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-right: 64px; font-size: 13px; line-height: 1.35; }
.ak-it__label { font-size: 10.5px; color: var(--akn-grey); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 2px; }
.ak-it__v { font-size: 10.5px; color: var(--akn-grey); text-transform: uppercase; letter-spacing: .06em; }
.ak-it__t { color: inherit; text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ak-it__sizes { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.ak-it__x { position: absolute; top: 12px; right: 0; width: 24px; height: 24px; padding: 0; border: 1px solid var(--akn-line); border-radius: 50%; background: var(--bgColor, #fff); color: inherit; font: inherit; font-size: 13px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .2s ease, background .2s ease, color .2s ease; }
.ak-it:hover .ak-it__x, .ak-it:focus-within .ak-it__x { opacity: 1; }
.ak-it__x:hover { background: var(--color, #000); color: var(--bgColor, #fff); }
/* move a piece to another look: a plain button with a short menu, dragging stays as a shortcut */
.ak-it__mv { position: absolute; top: 12px; right: 30px; height: 24px; padding: 0 9px; border: 1px solid var(--akn-line); border-radius: 999px; background: var(--bgColor, #fff); color: inherit; font: inherit; font-size: 11px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .2s ease, border-color .2s ease; }
.ak-it:hover .ak-it__mv, .ak-it:focus-within .ak-it__mv { opacity: 1; }
.ak-it__mv:hover, .ak-it__mv[aria-expanded=true] { border-color: currentColor; }
.ak-it__mv svg { display: none; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.ak-menu { position: fixed; z-index: 110; min-width: 180px; padding: 6px; background: var(--bgColor, #fff); border: 1px solid var(--akn-line); border-radius: var(--akn-r-ui); box-shadow: 0 16px 40px rgba(0, 0, 0, .12); display: flex; flex-direction: column; }
.ak-menu button { text-align: left; padding: 10px 12px; border: 0; border-radius: var(--akn-r-sm); background: none; font: inherit; font-size: 13px; color: inherit; cursor: pointer; }
.ak-menu button:hover, .ak-menu button:focus-visible { background: var(--akn-tile); outline: none; }
.ak-it.is-out { opacity: .45; }
.ak-it.is-lifted { opacity: .25; }
.ak-it--ghost { position: fixed; left: 0; top: 0; z-index: 100; pointer-events: none; padding: 12px; border: 0; border-radius: var(--akn-r-ui); box-shadow: 0 24px 48px rgba(0, 0, 0, .16), 0 4px 10px rgba(0, 0, 0, .06); cursor: grabbing; }
.ak-it:focus-visible { outline: 1px solid currentColor; outline-offset: 2px; }
.ak-it.is-new .ak-it__img { animation: akn-arrive .6s cubic-bezier(.2, .8, .2, 1.2); }
@keyframes akn-arrive { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.ak-chip { min-width: 28px; height: 26px; padding: 0 7px; border: 1px solid var(--akn-line); border-radius: var(--akn-r-sm); background: var(--bgColor, #fff); color: inherit; font: inherit; font-size: 11px; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease; }
.ak-chip:hover { border-color: currentColor; }
.ak-chip[aria-pressed="true"] { background: var(--color, #000); color: var(--bgColor, #fff); border-color: var(--color, #000); }
.ak-chip:disabled { color: var(--akn-grey); text-decoration: line-through; cursor: default; border-color: var(--akn-line); }
.ak-it.is-ask .ak-chip:not(:disabled) { animation: akn-ask .9s ease 2; }
@keyframes akn-ask { 0%, 100% { border-color: var(--akn-line); } 40% { border-color: currentColor; box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 10%, transparent); } }
/* what a look still wants */
.ak-look__more { padding-top: 20px; display: flex; flex-direction: column; gap: 18px; }
.ak-look__more:empty { display: none; }
.ak-sug { display: flex; flex-direction: column; gap: 6px; padding-top: 14px; border-top: 1px dashed var(--akn-line); }
.ak-sug__t { margin: 0; font-size: 12px; }
.ak-sug__why { margin: 0 0 4px; font-size: 11px; line-height: 1.45; color: var(--akn-grey); }
.ak-idea__items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
/* the stylist's pieces: picture, house, name and the rule in a few words */
.ak-idea__why { color: var(--akn-grey); font-size: 10.5px; line-height: 1.35; margin-top: 3px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ak-sug__note { margin: 16px 0 0; font-size: 10.5px; color: var(--akn-grey); }
/* the same distance under every block: below the cards the space is already in the cards (22 px to the text) */
.ak-idea__items + .ak-sug__note { margin-top: 0; }
.ak-idea__items li { position: relative; display: flex; flex-direction: column; gap: 1px; font-size: 10.5px; line-height: 1.3; min-width: 0; }
.ak-idea__img { aspect-ratio: 4 / 5; border-radius: var(--akn-r-sm); margin-bottom: 6px; }
.ak-idea__img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ak-idea__v { color: var(--akn-grey); text-transform: uppercase; letter-spacing: .06em; font-size: 9.5px; }
.ak-idea__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ak-idea__add { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; padding: 0; border-radius: 50%; border: 1px solid var(--akn-line); background: var(--bgColor, #fff); color: inherit; font: inherit; font-size: 14px; line-height: 1; cursor: pointer; transition: background .2s ease, color .2s ease; }
.ak-idea__add:hover { background: var(--color, #000); color: var(--bgColor, #fff); }
.ak-idea__scent { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: center; font-size: 11px; line-height: 1.4; }
.ak-idea__scent .ak-idea__img { margin: 0; }
.ak-idea__scent > div { display: flex; flex-direction: column; min-width: 0; padding-right: 30px; }
.ak-idea__scent .ak-idea__add { top: 50%; margin-top: -12px; right: 0; }
/* the bar */
.ak-board__bar { display: flex; align-items: center; justify-content: flex-end; gap: 24px; padding: 12px 20px 12px 28px; border-top: 1px solid var(--akn-line); }
.ak-board__share { margin-right: auto; font: inherit; background: none; border: 0; padding: 0; color: var(--akn-grey); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ak-board__sum { display: flex; gap: 12px; align-items: baseline; }
.ak-board__buy { height: 48px; padding: 0 28px; border: 0; border-radius: var(--akn-r-ui); background: var(--color, #000); color: var(--bgColor, #fff); font: inherit; font-weight: 500; cursor: pointer; }
.ak-board__buy[disabled] { opacity: .4; cursor: not-allowed; }
.ak-board__buy.is-waiting { background: var(--bgColor, #fff); color: var(--color, #000); box-shadow: inset 0 0 0 1px currentColor; }
@media (hover: none) { .ak-it__x, .ak-it__mv { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ak-it.is-new .ak-it__img, .ak-it.is-ask .ak-chip { animation: none; } }
@media (max-width: 777px) {
  .ak-board { width: 100vw; height: 100dvh; }
  .ak-board__in { border-radius: 0; }
  .ak-board__head { padding: 14px 16px 12px; }
  .ak-board__hint { display: none; }
  .ak-pager { display: flex; justify-content: space-between; padding: 10px 16px 0; }
  /* phone: one look per screen, the next one peeks in; the pager on top says where you are */
  .ak-lineup { display: flex; gap: 12px; padding: 16px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding: 0 16px; scrollbar-width: none; }
  .ak-lineup::-webkit-scrollbar { display: none; }
  .ak-look { flex: 0 0 calc(100vw - 56px); scroll-snap-align: start; padding: 18px 16px 20px; }
  .ak-look--new { flex-basis: 44vw; min-height: 0; }
  .ak-idea__items { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .ak-it { grid-template-columns: 76px minmax(0, 1fr); }
  /* move: a round icon next to remove, so it never covers the name */
  .ak-it__mv { right: 30px; width: 24px; padding: 0; display: grid; place-items: center; }
  .ak-it__mv span { display: none; }
  .ak-it__mv svg { display: block; }
  .ak-it__txt { padding-right: 60px; }
  /* the bar: link, sum and button in one line; the privacy note stays on desktop */
  .ak-board__local { display: none; }
  .ak-board__sum { flex-direction: column; gap: 0; align-items: flex-end; font-size: 12px; }
  .ak-board__bar { gap: 16px; padding: 12px 16px; }
  .ak-board__buy { padding: 0 18px; }
}

/* ---------- the Scent Index ---------- */
.akn-lex { padding: clamp(32px, 5vw, 72px) var(--akn-pad) var(--akn-gap); }
.akn-lex__head { display: flex; flex-direction: column; gap: 18px; max-width: 900px; margin-bottom: clamp(32px, 4vw, 56px); }
.akn-lex__eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: 11px; }
h1.akn-lex__eyebrow { margin: 0; line-height: 1.4; font-weight: inherit; --hSize: 11px; }
.akn-lex__head p.akn-big { margin: 0; text-wrap: balance; }
.akn-lex__intro { max-width: 60ch; }
.akn-lex__search input { width: min(560px, 100%); height: 56px; box-sizing: border-box; padding: 0 18px; border: 1px solid var(--akn-line); border-radius: var(--akn-r-ui); background: var(--akn-tile); font: inherit; font-size: 15px; color: inherit; }
.akn-lex__search input:focus { outline: 1px solid currentColor; }
.akn-lex__fam { display: flex; flex-wrap: wrap; gap: 6px; }
.akn-lex__fam .ak-chip { height: 32px; padding: 0 12px; font-size: 12px; }
.akn-lex__count { margin: 0; font-size: 12px; }
.akn-lex__body { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 64px); border-top: 1px solid currentColor; padding-top: 28px; align-items: start; }
.akn-lex__letter { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 0 12px; padding: 14px 0; border-bottom: 1px solid var(--akn-line); }
.akn-lex__letter > h2 { margin: 0; font-family: var(--hFontFamily); font-weight: 500; font-size: 28px; letter-spacing: -0.03em; line-height: 1; }
.akn-lex__house { grid-column: 2; display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 12px; padding: 4px 0 10px; }
.akn-lex__house h3 { margin: 0; font: inherit; text-transform: uppercase; letter-spacing: .06em; font-size: .92em; color: var(--akn-grey); }
.akn-lex__house ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.akn-lex__house li { margin: 0; padding: 0; }
.akn-lex__house a { display: block; padding: 2px 0; color: inherit; text-decoration: none; }
.akn-lex__house a:hover, .akn-lex__house a[aria-current] { text-decoration: underline; text-underline-offset: 3px; }
.akn-lex__detail { position: sticky; top: calc(var(--akn-head-h, 45px) + 24px); }
.akn-lex__hint { min-height: 240px; display: flex; align-items: center; justify-content: center; border-radius: var(--akn-r-img); background: var(--akn-tile); padding: 32px; text-align: center; color: var(--akn-grey); }
.akn-lex__entry { display: flex; flex-direction: column; gap: 14px; }
.akn-lex__meta { margin: 0; font-size: 12px; }
.akn-lex__line { margin: 0; font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(18px, 1.6vw, 24px); letter-spacing: -0.015em; line-height: 1.3; max-width: 34ch; }
.akn-lex__pyr { margin: 6px 0 0; display: flex; flex-direction: column; border-top: 1px solid var(--akn-line); }
.akn-lex__pyr > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--akn-line); }
.akn-lex__pyr dt { color: var(--akn-grey); font-weight: 400; }
.akn-lex__pyr dd { margin: 0; }
.akn-lex__ours { margin: 22px 0 0; font: inherit; color: var(--akn-grey); }
.akn-lex__own { margin: 22px 0 0; }
.akn-lex__own a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.akn-lex__rel { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.akn-lex__rel a { display: flex; flex-direction: column; gap: 2px; color: inherit; text-decoration: none; font-size: 12px; line-height: 1.4; }
.akn-lex__rel .akn-card__img { margin-bottom: 8px; }
.akn-lex__v { text-transform: uppercase; letter-spacing: .06em; font-size: 10.5px; color: var(--akn-grey); }
.akn-lex__src { margin: 8px 0 0; font-size: 11px; }
.akn-lex.is-loading .akn-lex__body { opacity: .4; }
@media (max-width: 777px) {
  .akn-lex__body { grid-template-columns: minmax(0, 1fr); }
  .akn-lex__detail { position: static; order: -1; }
  .akn-lex__house { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .akn-lex__rel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- search: a quiet field top left, opens the theme's search ---------- */
@media (min-width: 778px) {
  #headerGroup coretex-header:not([data-ak-layout="theme"]) .header > .tools x-cell:has(> button[data-open="#searchBox"]) { position: absolute; left: 0; top: 10px; display: block !important; } /* centred layout only; in "Theme layout" it stays in the row */
  #headerGroup .header > .tools button[data-open="#searchBox"] { display: inline-flex; align-items: center; gap: 10px; width: clamp(180px, 18vw, 280px); height: 34px; padding: 0 14px; justify-content: flex-start; border: 1px solid color-mix(in srgb, currentColor 30%, transparent); border-radius: var(--globalRadiusFull, 999px); background: transparent; color: inherit; opacity: .75; }
  #headerGroup .header > .tools button[data-open="#searchBox"] i { display: inline-flex !important; width: 14px; height: 14px; }
  #headerGroup .header > .tools button[data-open="#searchBox"]:hover { border-color: currentColor; opacity: 1; }
}


/* Search opens where it was clicked: at the top, docked to the left under the search field, input first, results below. */
#searchBox .akn-search-field { top: 0; z-index: 2; background: var(--bgColor, #fff); }
@media (min-width: 778px) {
  #searchBox dialog[dialog-position="top center"] { --dialogTransOrigin: top left; margin-inline: var(--akn-pad) auto; margin-block-start: 8px; width: min(560px, calc(100vw - 2 * var(--akn-pad))); }
}
#searchBox mark { background: none; color: inherit; font-weight: 600; }
#searchBox .akn-search-field :is(input, x-stack):focus-visible, #searchBox .akn-search-field input:focus { outline: none; box-shadow: none; }
#searchBox .akn-search-field x-stack:focus-within { border-color: currentColor; }

/* Featured brands: like a product card. Picture on the tile, the house named below it (never over the picture). */
.feat-collections a.onHover[columns="stack"] { display: flex !important; flex-direction: column; gap: 12px; color: inherit; text-decoration: none; }
.feat-collections a.onHover > x-cell { order: 1; aspect-ratio: 4 / 5; border-radius: var(--akn-r-img); background: var(--akn-tile); isolation: isolate; overflow: hidden; }
.feat-collections a.onHover > x-cell component-loader { mix-blend-mode: multiply; display: block; width: 100%; height: 100%; }
.feat-collections a.onHover > x-cell :is(media-loader, picture) { display: block; width: 100%; height: 100%; }
.feat-collections a.onHover > x-cell img { width: 100%; height: 100%; object-fit: contain; }
.feat-collections a.onHover > x-cell img[data-akn-pic="photo"] { object-fit: cover; }
.feat-collections a.onHover > h2.title { order: 2; position: static; mix-blend-mode: normal; color: inherit !important; --color: inherit; margin: 0; padding: 0 !important; word-break: normal; overflow-wrap: break-word; hyphens: manual; }
.feat-collections a.onHover > h2.title .off { display: none; }

/* ---------- phone buy bar (theme "preview tab"): a quiet bar, never over the footer ---------- */
@media (max-width: 777px) {
  preview-tab#previewTab { margin-inline: 10px !important; margin-bottom: calc(10px + env(safe-area-inset-bottom)); padding: 10px 10px 10px 16px !important; border-radius: var(--akn-r-ui) !important; box-shadow: 0 10px 30px rgba(0, 0, 0, .12) !important; }
  preview-tab#previewTab::before { display: none !important; }
  .akn-pt { gap: 12px; }
  .akn-pt__name { display: flex; flex-direction: column; min-width: 0; font-size: 12px; line-height: 1.3; }
  .akn-pt__name .title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; font: inherit; }
  .akn-pt__v { font-family: var(--aFontFamily); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--akn-grey); }
  .akn-pt__cta { flex: none; height: 42px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: var(--akn-r-ui); background: var(--color, #000); color: var(--bgColor, #fff); font-size: 13px; font-weight: 500; white-space: nowrap; }
  body.akn-foot preview-tab#previewTab.show { transform: translateY(120%); opacity: 0; pointer-events: none; }
  body:has(preview-tab#previewTab.show):not(.akn-foot) back-to-top { inset-block-end: calc(84px + env(safe-area-inset-bottom)) !important; }
}


/* Collections: the sticky "filter and sort" bar follows the header. With "Enable content blend mode" on (header settings)
   it is see-through with inverted colours like the header; with it off, it is solid white like the scrolled header. */
section.filter-trigger.sticky { z-index: 10; }
body:not(:has(coretex-header[mix-blend="true"])) section.filter-trigger.sticky { background: var(--bgColor, #fff); box-shadow: 0 1px 0 var(--akn-line); }
body:has(coretex-header[mix-blend="true"]) section.filter-trigger.sticky { background: transparent; box-shadow: none; mix-blend-mode: exclusion; --color: #FFF; --linkColor: #FFF; --linkHover: #FFF; color: #FFF; }
body:has(coretex-header[mix-blend="true"]) section.filter-trigger.sticky :is(button, a, span) { color: #FFF; }

/* Cart: the checkout button is the one strong button; quiet focus on close; pictures on the tile. */
#cartBox .go-2-checkout, coretex-cart .go-2-checkout { --buttonBg: var(--color, #000); --buttonColor: var(--bgColor, #fff); --buttonBgHover: var(--color, #000); --buttonColorHover: var(--bgColor, #fff); background: var(--color, #000) !important; color: var(--bgColor, #fff) !important; border-color: var(--color, #000) !important; min-height: 52px; font-weight: 500; }
#cartBox [data-close], #languageBox [data-close] { outline: none !important; box-shadow: none !important; border-color: transparent !important; }
coretex-cart ajax-cart-quantity > x-cell:has(.minus) { order: 0; }
coretex-cart ajax-cart-quantity > x-flex { order: 1; }
coretex-cart ajax-cart-quantity > x-cell:has(.plus) { order: 2; }
coretex-cart cart-item media-loader, coretex-cart cart-item picture { background: var(--akn-tile); border-radius: var(--akn-r-sm); isolation: isolate; overflow: hidden; display: block; }
coretex-cart cart-item img { mix-blend-mode: multiply; object-fit: contain; }

/* Q&A: questions as calm labels, answers fold open */
.akn-faq { border-top: 1px solid var(--akn-line); max-width: 760px; }
.akn-faq details { border-bottom: 1px solid var(--akn-line); }
.akn-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; padding: 18px 0; font-family: var(--aFontFamily); font-size: 12px; letter-spacing: .04em; line-height: 1.5; }
.akn-faq summary::-webkit-details-marker { display: none; }
.akn-faq summary::after { content: "+"; font-family: var(--fontFamily); font-size: 16px; line-height: 1; transition: transform .3s ease; }
.akn-faq details[open] summary::after { transform: rotate(45deg); }
.akn-faq__a { padding: 0 0 20px; color: var(--akn-grey); }
.akn-faq__a p { margin: 0 0 8px; }

/* Phone: layering stacked (picture, then text and button, full width); no floating back-to-top arrow. */
@media (max-width: 777px) {
  .akn-answer, .akn-answer--layer { grid-template-columns: minmax(0, 1fr); }
  .akn-answer .akn-card__img { max-width: 220px; }
  .akn-answer--layer .akn-answer__txt { max-width: none; }
  .akn-both { width: 100%; justify-content: center; }
  back-to-top { display: none !important; }
}

/* 404 */
.akn-404 { max-width: 760px; padding: clamp(48px, 10vw, 140px) var(--akn-pad) var(--akn-gap); display: flex; flex-direction: column; gap: 18px; }
.akn-404 p { margin: 0; }
.akn-404__ways { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; margin-top: 12px; }
.akn-404 .akn-404__search { display: flex !important; align-items: center; gap: 10px; margin: 0; width: min(420px, 100%) !important; height: 46px; padding: 0 16px; border: 1px solid var(--akn-line); border-radius: var(--globalRadiusFull, 999px); background: var(--akn-tile); color: var(--akn-grey); font: inherit; font-size: 14px; cursor: pointer; justify-content: flex-start; }
.akn-404 .akn-404__search svg { width: 16px; height: 16px; flex: none; }



/* Newsletter invitation: room to breathe, the first line as a statement. */
#newsletterBox dialog { padding: 0 !important; border-radius: var(--akn-r-ui); }
#newsletterBox dialog-wrapper { padding: clamp(24px, 3vw, 36px) !important; gap: 18px !important; }
#newsletterBox dialog-wrapper :is(p, .rte, .description) { font-family: var(--hFontFamily); font-weight: 500; font-size: clamp(18px, 1.6vw, 22px); letter-spacing: -0.015em; line-height: 1.3; }

/* Houses A to Z in the menu (Designers, and the houses of a collection such as Fragrance): letter groups read top to bottom. */
.akn-az__title, .akn-az__l { display: block; font-family: var(--aFontFamily); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--akn-grey); }
.akn-az__title { margin: 0 0 14px; }
.akn-az__l { margin: 0 0 4px; }
.akn-az__cols { columns: 4 160px; column-gap: clamp(24px, 3.4vw, 48px); }
.akn-az__g { break-inside: avoid; margin: 0 0 16px; }
.akn-az ul, .akn-fixed > ul { margin: 0; padding: 0; list-style: none; }
.akn-houses, .akn-fixed { list-style: none; }
@media (min-width: 778px) {
  #headerGroup nav.menuPrimary details.lv1 > details-menu > ul.akn-has-houses { grid-template-columns: minmax(0, 220px) minmax(0, 1fr) !important; max-width: none; align-items: start; }
  #headerGroup nav.menuPrimary details.lv1 > details-menu > ul.akn-only-houses { grid-template-columns: minmax(0, 1fr) !important; }
  #headerGroup nav.menuPrimary .akn-fixed a { display: block; text-align: left; justify-content: flex-start; padding: 7px 0; font-family: var(--fontFamily); font-weight: 400; font-size: 16px; letter-spacing: 0; line-height: 1.3; white-space: normal; }
  #headerGroup nav.menuPrimary .akn-az a { display: block; text-align: left; justify-content: flex-start; padding: 3px 0; font-family: var(--fontFamily); font-weight: 400; font-size: 14px; letter-spacing: 0; line-height: 1.35; white-space: normal; }
  #headerGroup nav.menuPrimary :is(.akn-fixed, .akn-az) a:hover { color: var(--akn-grey); }
  #headerGroup nav.menuPrimary ul.akn-only-houses .akn-az__cols { columns: 6 150px; }
}
@media (max-width: 777px) {
  #menuDrawerBox .akn-az__cols { columns: 2 120px; column-gap: 20px; }
  #menuDrawerBox .akn-az a { padding: 6px 0; font-size: 15px; }
  #menuDrawerBox .akn-az__title { margin: 12px 0 10px; }
}

/* Saved, in the header next to the cart: a heart and its own word, so it never reads as the cart. */
.akn-cart-cell { display: flex; align-items: center; gap: 0; }
.akn-saved-cell { position: relative; display: inline-flex; align-items: center; }
.akn-saved { display: inline-flex; align-items: center; gap: 6px; }
/* the same heart as on the save buttons (.ak-pin svg): size, line, fill, movement */
.akn-saved__i { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linejoin: round; }
.has-saved .akn-saved__i { fill: currentColor; }
.akn-saved__n:empty { display: none; }
.akn-saved-cell.is-bump .akn-saved__i { animation: akn-heart .45s cubic-bezier(.2, .8, .2, 1.4); }
.akn-saved-cell.is-bump .akn-saved__n { animation: akn-count .6s cubic-bezier(.2, .8, .2, 1.4); }
@keyframes akn-count { 0% { transform: translateY(-40%); opacity: 0; } 100% { transform: none; opacity: 1; } }
.akn-saved__note { position: fixed; right: var(--akn-pad); top: calc(var(--akn-head-h, 46px) + 8px); z-index: 120; white-space: nowrap; padding: 8px 12px; border-radius: var(--akn-r-sm); background: #000 !important; color: #fff !important; font-size: 12px; mix-blend-mode: normal; line-height: 1.2; opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.akn-saved__note.is-on { opacity: 1; transform: none; }
@media (max-width: 777px) {
  .akn-saved__t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .akn-saved-cell.is-bump :is(.akn-saved__i, .akn-saved__n) { animation: none; } }
.ak-board__keep { margin-right: auto; display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.ak-board__keep .ak-board__share { margin-right: 0; flex: none; }
.ak-board__local { font-size: 12px; line-height: 1.45; color: var(--akn-grey); }
@media (max-width: 777px) { .ak-board__keep { flex: 0 1 auto; } } /* phone: link, sum and button in one line (the note is hidden there) */

/* Language and cart open where they are called: top right, under their word in the header (as search opens under its field). */
@media (min-width: 778px) {
  :is(#languageBox, #cartBox) dialog[dialog-position="top right"] { margin-block-start: 8px; margin-inline-end: var(--akn-pad); }
  #languageBox dialog:modal { --dialogW: 240px; }
  #cartBox dialog:modal { --dialogW: 420px; --dialogH: fit-content; --dialogMaxH: calc(100dvh - 16px); }
}
@media (max-width: 777px) { #cartBox dialog:modal { --dialogH: fit-content; --dialogMaxH: 88svh; } }
/* The cart window takes the height of its content. Its inner parts must then size by content too: Safari reads the
   theme's height: 100% inside a content-sized window as zero (only the header was left, most visibly when empty). */
#cartBox :is(dialog-wrapper, main, coretex-cart, .coretex-cart) { height: auto !important; min-height: 0; }
#cartBox section.empty > x-flex { padding: 28px 0 32px; gap: 14px; }
#cartBox .coretex-cart cart-footer { max-height: none !important; }
#languageBox main { padding-bottom: 4px; }
#languageBox .localization-list { gap: 2px; }

/* Phones: saved and cart as a pair of icons (header setting "Saved and cart on mobile"). Same line weight for both:
   the heart as on the save buttons, the cart icon drawn a little finer to match it. */
@media (max-width: 777px) {
  coretex-header[content-type-s="icons"] .akn-cart-cell { gap: 4px; }
  coretex-header[content-type-s="icons"] .akn-cart-cell .cartBubble .txtState { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  coretex-header[content-type-s="icons"] .akn-cart-cell .cartBubble > i { display: inline-flex !important; }
  coretex-header[content-type-s="icons"] .akn-cart-cell .cartBubble > i svg { width: 20px; height: 20px; }
  coretex-header[content-type-s="icons"] .akn-cart-cell .cartBubble > i svg path { stroke-width: 1.5; }
  coretex-header[content-type-s="icons"] .akn-saved__i { width: 17px; height: 17px; }
  coretex-header[content-type-s="icons"] :is(.akn-saved, .cartBubble) { min-width: 40px; min-height: 40px; justify-content: center; gap: 3px; }
}

/* Saved as a plain wish list (default): a calm grid, each piece with its size and its own "add to cart". */
.ak-wish { list-style: none; margin: 0; padding: 20px 28px 28px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 16px; }
.ak-wish .ak-wish__it { display: flex; flex-direction: column; gap: 10px; padding: 0; border: 0; cursor: default; }
.ak-wish__img { display: block; aspect-ratio: 4 / 5; border-radius: var(--akn-r-img); background: var(--akn-tile); overflow: hidden; }
.ak-wish__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.ak-wish__txt { display: flex; flex-direction: column; gap: 3px; font-size: 13px; line-height: 1.35; }
.ak-wish__txt .ak-it__sizes { margin-top: 6px; }
.ak-wish__cart { margin-top: 10px; width: 100%; height: 40px; border: 1px solid var(--color, #000); border-radius: var(--akn-r-ui); background: var(--color, #000); color: var(--bgColor, #fff); font: inherit; font-size: 13px; cursor: pointer; }
.ak-wish__cart.is-done { background: none; color: var(--color, #000); }
.ak-wish .ak-it__x { top: 8px; right: 8px; opacity: 1; }
/* List | Looks */
.ak-view { display: inline-flex; padding: 2px; border: 1px solid var(--akn-line); border-radius: 999px; }
.ak-view button { height: 28px; padding: 0 14px; border: 0; border-radius: 999px; background: none; font: inherit; font-size: 12px; color: var(--akn-grey); cursor: pointer; }
.ak-view button[aria-pressed=true] { background: var(--color, #000); color: var(--bgColor, #fff); }
.ak-board__tools { display: flex; align-items: center; gap: 16px; }
/* a long press lifts the piece; no callout or text selection on the way */
.ak-lineup .ak-it { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
@media (max-width: 1024px) { .ak-wish { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 777px) {
  .ak-wish { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; padding: 14px 16px 20px; }
  .ak-board__hint { display: block; font-size: 11px; }
  .ak-board__head { flex-wrap: wrap; row-gap: 10px; }
}

/* Product page on phones and tablets: every picture uses the full width, still uncropped. The theme sizes an
   uncropped picture by its file ("fit-content"), so a smaller original showed as a smaller picture. */
@media (max-width: 1023px) {
  .etheryx-product-media :is(.kontainer > component-loader, media-gallery, slider-component, slider-component > ul, .product__media-item, .product__media-item > button, .product__media-item component-loader) { width: 100%; }
  .etheryx-product-media slider-component { display: block; }
  .etheryx-product-media .product__media-item { flex: 0 0 100%; }
  .etheryx-product-media .product__media-item media-loader { display: block; width: 100%; }
  .etheryx-product-media .product__media-item media-loader img { width: 100% !important; height: auto; margin: 0 !important; object-fit: contain; }
}

/* Product page: empty theme blocks take no room. Instalments without an offer and a stock line without a message
   still received the column gap (2 × 22px of white above the button). They show again as soon as they have content. */
.etheryx-product-options .installments:not(:has(shopify-payment-terms)),
.etheryx-product-options section.inventory:not(:has(.inventoryStatus .txt)) { display: none; }

/* Similar scents, desktop: the relatives are compact rows (picture, house, name, reason, price), so the whole entry
   fits the sticky column and the reason can be read without scrolling to the end of the list. */
@media (min-width: 778px) {
  .akn-lex__rel { grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--akn-line); }
  .akn-lex__rel li { border-bottom: 1px solid var(--akn-line); }
  .akn-lex__rel a { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; column-gap: 16px; row-gap: 2px; align-content: center; padding: 10px 0; font-size: 13px; }
  .akn-lex__rel .akn-card__img { grid-row: 1 / span 3; grid-column: 1; width: 72px; aspect-ratio: 1 / 1; margin: 0; }
  .akn-lex__rel a > :not(.akn-card__img) { grid-column: 2; }
  .akn-lex__rel a > span:last-child { grid-column: 3; grid-row: 1; text-align: right; }
  .akn-lex__rel a:hover .akn-lex__t { text-decoration: underline; text-underline-offset: 3px; }
  /* very short screens: the entry scrolls on its own instead of running below the fold */
  .akn-lex__detail { max-height: calc(100vh - var(--akn-head-h, 45px) - 40px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
}

/* Editorial article (lookbook): a quiet head, then the theme's collage, then pieces of the house. */
.akn-ed__head { display: flex; flex-direction: column; gap: 10px; padding: clamp(28px, 5vw, 64px) var(--akn-pad) clamp(20px, 3vw, 36px); }
.akn-ed__eyebrow { font-family: var(--aFontFamily); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.akn-ed__eyebrow a { color: inherit; text-decoration: none; }
.akn-ed__head h1 { margin: 0; max-width: 22ch; }
.akn-ed__date { font-size: 12px; }
.akn-ed__collage { padding-bottom: clamp(32px, 5vw, 72px); }
.akn-ed__collage .text .content { max-width: 60ch; }
/* the credits line under the story: small, grey, no indent, like a caption */
.akn-ed .rte p.akn-credits { text-indent: 0; margin-top: 1.4em; font-size: 12px; line-height: 1.6; color: var(--akn-grey); }
.akn-ed__plain { display: flex; flex-direction: column; gap: 28px; padding: 0 var(--akn-pad) 56px; max-width: 980px; }
.akn-ed__pieces { padding: 8px var(--akn-pad) 64px; }
.akn-ed__pieces-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 24px 0 18px; border-top: 1px solid var(--akn-line); }
.akn-ed__pieces-head h2 { margin: 0; }
.akn-ed__grid { --gridGap: 24px 12px; gap: 24px 12px; }
/* an editorial picture in the menu is a photo: it fills its tile */
.akn-menu-tile--photo .akn-menu-tile__img img { object-fit: cover !important; mix-blend-mode: normal !important; width: 100%; height: 100%; }

/* Footer bottom line: copyright and legal links small and quiet on the left, payment icons at the end. */
#secondaryFooter > x-flex { align-items: center; gap: 8px 16px; font-size: var(--fontSize, 12px); color: var(--akn-grey); }
/* the right of withdrawal is always recognisable as a link */
#secondaryFooter a[href*="/pages/withdraw"] { text-decoration: underline !important; text-underline-offset: 3px; }
#secondaryFooter .policies ul { gap: 4px 16px; }
#secondaryFooter .policies a, #secondaryFooter .akn-warranty__open { color: inherit; font: inherit; text-decoration: none; cursor: pointer; padding: 0; border: 0; background: none; }
#secondaryFooter .policies a:hover, .akn-warranty__open:hover { color: var(--color, #000); }
#secondaryFooter .akn-payments { margin-left: auto; --iconSize: 22px; }
#secondaryFooter .akn-payments .payment-icons { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.akn-warranty__dlg { border: 0; padding: 0; border-radius: var(--akn-r-img); max-width: min(720px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); background: #fff; }
.akn-warranty__dlg::backdrop { background: var(--overlayBg, rgba(0,0,0,.3)); -webkit-backdrop-filter: var(--overlayBlur); backdrop-filter: var(--overlayBlur); }
.akn-warranty__dlg img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 32px); }
.akn-warranty__x { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 1px solid var(--akn-line); border-radius: 50%; background: #fff; font-size: 16px; line-height: 1; cursor: pointer; }

/* PDP: payment methods under the buy button, small and quiet */
.akn-pay { --iconSize: 21px; margin-top: 12px; }
.akn-pay ul { gap: 5px !important; flex-wrap: wrap; }
.akn-pay--left ul { justify-content: flex-start; }
.akn-pay--right ul { justify-content: flex-end; }
/* full width: the icons span button and heart, so the buying column reads as wide as the text column on the left */
.akn-pay--full { width: 100%; }
.akn-pay--full ul { justify-content: space-between; }
/* product page: side columns at the width set in the section ("Side columns width"), the picture column takes the rest */
@media (min-width: 1025px) {
  .product-body[data-akn-side] { grid-template-columns: minmax(0, var(--akn-side)) minmax(0, 1fr) minmax(0, var(--akn-side)) !important; }
  .product-body[data-akn-side] > x-cell { grid-column: auto / span 1 !important; }
}

/* card: house and subtitle are plain text lines now (SEO outline), without paragraph spacing */
product-card .vendor p.h6, product-card p.h6.subtitle { margin: 0; }

/* home: editorials as tiles, one per house (tall pictures, the house in small capitals, the title below) */
.akn-stories__row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3, 12px); }
.akn-story a { display: flex; flex-direction: column; gap: 10px; color: inherit; text-decoration: none; }
.akn-story img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--akn-r-img, 0); transition: opacity .4s ease; }
.akn-story a:hover img { opacity: .88; }
.akn-story__v { font-family: var(--aFontFamily); text-transform: uppercase; letter-spacing: .06em; font-size: 10.5px; margin-top: 4px; }
.akn-story__t { font-size: 15px; line-height: 1.3; }
@media (max-width: 777px) {
  .akn-stories__row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(-1 * var(--akn-pad)); padding-inline: var(--akn-pad); scroll-padding-left: var(--akn-pad); }
  .akn-stories__row::-webkit-scrollbar { display: none; }
  .akn-story { flex: 0 0 78%; scroll-snap-align: start; }
}
/* home: the house of the week, introduced by its name and two lookbook pictures */
.akn-house__name a { color: inherit; text-decoration: none; }
.akn-house__look { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px var(--space-3, 12px); color: inherit; text-decoration: none; }
@media (max-width: 777px) { .akn-house__look { grid-template-columns: 1fr 1fr; } .akn-house__look img:nth-of-type(n+3) { display: none; } }
.akn-house__look img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--akn-r-img, 0); }
.akn-house__look .akn-link { grid-column: 1 / -1; }
/* home: designers A to Z inside the chapter frame */
.akn-directory .akn-az__cols { columns: 4 180px; }
.akn-directory .akn-az a { display: block; padding: 3px 0; font-size: 14px; line-height: 1.35; color: inherit; text-decoration: none; background: none; border: 0; min-height: 0; text-align: left; font-weight: 400; letter-spacing: 0; }
.akn-directory .akn-az a:hover { color: var(--akn-grey); }
@media (max-width: 777px) { .akn-directory .akn-az__cols { columns: 2 130px; column-gap: 20px; } .akn-directory .akn-az a { padding: 2px 0; font-size: 14px; } .akn-directory .akn-az__g { margin-bottom: 10px; } }

/* home: entry to "Find a similar scent" */
.akn-finder__form input { width: min(100%, 560px); height: 56px; padding: 0 18px; border: 1px solid var(--akn-line); border-radius: var(--akn-r-img, 12px); background: var(--akn-soft, #f6f6f6); font: inherit; font-size: 15px; }
.akn-finder__starts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.akn-finder__starts a { display: inline-block; padding: 8px 14px; border: 1px solid var(--akn-line); border-radius: 999px; color: inherit; text-decoration: none; font-size: 13px; }
.akn-finder__starts a:hover { border-color: currentColor; }

/* section heads: the description and the link carry no own margins or padding, so all three share one baseline */
.section-heading .description .rte > :first-child { margin-top: 0; }
.section-heading .description .rte > :last-child { margin-bottom: 0; }
.section-heading .cta > a.button.is-custom { padding-block: 0; }

/* home: houses in focus (each with its newest piece) */
.akn-brands__row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-3, 12px); }
.akn-brand a { display: flex; flex-direction: column; gap: 10px; color: inherit; text-decoration: none; }
.akn-brand__img { display: block; aspect-ratio: 4 / 5; background: var(--akn-soft, #f6f6f6); border-radius: var(--akn-r-img, 12px); overflow: hidden; }
.akn-brand__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.akn-brand a:hover .akn-brand__img img { transform: scale(1.03); }
.akn-brand__n { font-size: 13px; }
@media (max-width: 1024px) { .akn-brands__row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 777px) { .akn-brands__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 8px; } }

/* PDP: product safety as quiet rows */
.akn-safety__list { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.akn-safety__list > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 12px; }
.akn-safety__list dt { color: var(--akn-grey); }
.akn-safety__list dd { margin: 0; }
.akn-safety__list a { color: inherit; }

/* product cards: packshots framed to the same size (ak-frame.js measures, the picture itself is untouched) */
img[data-akf] { transform: translate(var(--akf-x, 0), var(--akf-y, 0)) scale(var(--akf-s, 1)); transform-origin: 50% 50%; }