/* ============================================================
   6thLoom storefront — "Luxe" theme layer
   Loaded after style.css on storefront pages only (see head.ejs), so the admin
   and seller panels keep their own look. Editorial luxury-marketplace system:
   white canvas, near-black type, one red accent, square corners, 2:3 product
   imagery, uppercase section heads, a 1296px content column.
   ============================================================ */
:root {
  --ink: #212121;
  --ink-soft: #424242;
  --muted: #757575;
  --faint: #9e9e9e;
  --hair: #c2c2c2;
  --bg: #ffffff;
  --bg-soft: #f5f5f5;
  --bg-plp: #fafafa;
  --line: #e6e6e6;
  --line-dark: #d4d4d4;
  --pink: #C61A1A;            /* 6thLoom red — the single accent (sale, links, active) */
  --pink-deep: #A31414;
  --pink-soft: #fbeaea;
  --night: #212121;
  --radius: 0px;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --shadow-sm: 0 2px 10px rgba(0,0,0,.06);
  --font: 'Figtree', 'Inter', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-display: var(--font);
  --font-condensed: var(--font);
  --font-accent: var(--font);
  --serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --wrap: 100%;               /* < 1079px: full width with gutters */
  --gut: 16px;
  --th-w: 48px; --th-h: 72px; --th-gap: 16px;   /* product-page thumbnail rail */
}
/* The page column steps up with the screen, 90% of each breakpoint, so big monitors
   get a wider page and bigger photos instead of wider white margins. */
@media (min-width: 1079px) { :root { --wrap: 1020px; --th-w: 48px; --th-h: 72px; } }
@media (min-width: 1279px) { :root { --wrap: 1152px; --th-w: 56px; --th-h: 84px; } }
@media (min-width: 1439px) { :root { --wrap: 1296px; --th-w: 66px; --th-h: 99px; } }
@media (min-width: 1679px) { :root { --wrap: 1512px; } }
@media (min-width: 1919px) { :root { --wrap: 1728px; --th-w: 112px; --th-h: 168px; --th-gap: 24px; } }
@media (min-width: 2559px) { :root { --wrap: 2304px; } }

body.lx { font-family: var(--font); color: var(--ink); background: #fff; font-size: 14px; line-height: 1.5; letter-spacing: .1px; }
body.lx h1, body.lx h2, body.lx h3 { font-family: var(--font); letter-spacing: .2px; }
body.lx .serif { font-family: var(--serif); font-weight: 600; }
body.lx .container { max-width: calc(var(--wrap) + var(--gut) * 2); padding: 0 var(--gut); }
body.lx ::selection { background: #f0d6d6; }
body.lx :focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 0; }

/* ---------- Buttons ---------- */
body.lx .btn { background: var(--ink); color: #fff; border: 1px solid var(--ink); border-radius: 0; font-family: var(--font); font-size: 13px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; padding: 12px 28px; }
body.lx .btn:hover { background: #000; border-color: #000; transform: none; box-shadow: none; }
body.lx .btn.ghost { background: #fff; color: var(--ink); border: 1px solid var(--ink); }
body.lx .btn.ghost:hover { background: var(--ink); color: #fff; }
body.lx .btn.gold { background: #fff; color: var(--ink); border-color: #fff; }
body.lx .btn.sm { padding: 8px 16px; font-size: 11.5px; }
body.lx .btn.danger { background: var(--pink); border-color: var(--pink); }
body.lx .btn.ghost.danger { background: #fff; color: var(--pink); border-color: var(--pink); }
body.lx .btn.ghost.danger:hover { background: var(--pink); color: #fff; }
.lx-btn-line { display: inline-flex; align-items: center; justify-content: center; border: 1px solid currentColor; padding: 6px 14px; font-size: 11px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; line-height: 1.2; }

/* ---------- Forms ---------- */
body.lx input[type=text], body.lx input[type=email], body.lx input[type=password], body.lx input[type=tel],
body.lx input[type=number], body.lx input[type=search], body.lx select, body.lx textarea { border-radius: 0; border-color: var(--line-dark); font-family: var(--font); }
body.lx input:focus, body.lx select:focus, body.lx textarea:focus { border-color: var(--ink); box-shadow: none; outline: none; }
body.lx .card { border-radius: 0; border-color: var(--line); box-shadow: none; }
body.lx .pill { border-radius: 999px; }
body.lx .badge { border-radius: 0; letter-spacing: .8px; }
body.lx .notice, body.lx .hint { border-radius: 0; }

/* ============================================================
   HEADER
   ============================================================ */
body.lx .announce { display: none; }   /* replaced by .lx-topbar */
.lx-topbar { background: #eaeaea; height: 32px; font-size: 12px; position: relative; z-index: 51; }
.lx-topbar-in { display: flex; align-items: stretch; justify-content: space-between; height: 100%; gap: 20px; }
.lx-toptabs { display: flex; align-items: stretch; gap: 0; }
.lx-toptabs a { display: flex; align-items: center; padding: 0 12px; text-transform: uppercase; letter-spacing: .3px; color: #616161; position: relative; white-space: nowrap; }
.lx-toptabs a:first-child { padding-left: 8px; }
.lx-toptabs a:hover { color: #000; }
.lx-toptabs a.on { color: #000; font-weight: 600; }
.lx-toptabs a.on::after { content: ''; position: absolute; left: 4px; right: 4px; bottom: 0; height: 2px; background: #000; }
.lx-topmsg { display: flex; align-items: center; gap: 6px; color: #212121; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-topmsg a { color: var(--pink); font-weight: 600; }
.lx-topmsg a:hover { text-decoration: underline; }
.lx-topmsg .sep { color: #9e9e9e; margin: 0 4px; }
.lx-mstrip { display: none; }

body.lx .sticky-header-wrapper { position: sticky; top: 0; z-index: 50; background: #fff; box-shadow: 0 1px 0 #ececec; transition: box-shadow .2s; }
body.lx.lx-scrolled .sticky-header-wrapper { box-shadow: 0 2px 14px rgba(0,0,0,.07); }
body.lx header.site { background: #fff; border-bottom: none; }
.lx-bar-in { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 76px; transition: height .25s var(--ease); }
body.lx.lx-scrolled .lx-bar-in { height: 58px; }
.lx-bar-l { display: flex; align-items: center; gap: 6px; justify-self: start; }
.lx-bar-r { display: flex; align-items: center; gap: 4px; justify-self: end; }
.lx-logo { display: block; line-height: 0; }
.lx-logo img { height: 52px; width: auto; transition: height .25s var(--ease); }
body.lx.lx-scrolled .lx-logo img { height: 40px; }
body.lx .burger-menu-btn { display: none; }

/* icon buttons (search / wishlist / account / cart) */
.lx-ic, body.lx .icon-link.lx-ic { position: relative; display: inline-flex; flex-direction: row; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; gap: 0; color: #212121; background: none; border: none; cursor: pointer; border-radius: 0; font-size: 0; }
.lx-ic svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.lx-ic:hover { color: var(--pink); }
body.lx .cart-count { top: 3px; right: 1px; background: var(--ink); min-width: 17px; height: 17px; line-height: 17px; font-size: 10px; font-weight: 600; }

/* currency (left of the logo, like a region switcher) */
body.lx .currency-switch .currency-btn { border: none; background: none; padding: 6px 4px; font-size: 11.5px; font-weight: 600; color: #212121; letter-spacing: .4px; border-radius: 0; }
body.lx .currency-switch .currency-btn:hover { color: var(--pink); }
body.lx .currency-switch .dropdown { left: 0; right: auto; }

/* generic hover dropdown used by account + currency */
body.lx .dropdown { border-radius: 0; border-color: #eee; box-shadow: 0 12px 28px rgba(0,0,0,.08); padding: 8px 0; }
body.lx .dropdown a { font-size: 12.5px; color: #424242; padding: 8px 18px; }
body.lx .dropdown a:hover { background: #f5f5f5; color: #000; }
.lx-dd { position: relative; }
.lx-dd > .dropdown { top: 100%; right: -8px; left: auto; min-width: 200px; }
.lx-dd:hover > .dropdown, .lx-dd:focus-within > .dropdown { opacity: 1; visibility: visible; transform: none; }
.lx-dd .dd-who { padding: 6px 18px 10px; border-bottom: 1px solid #eee; margin-bottom: 6px; font-size: 12px; color: var(--muted); }
.lx-dd .dd-who b { display: block; color: var(--ink); font-size: 13px; font-weight: 600; }

/* primary menu row */
body.lx .catnav.lx-menu { background: #fff; border-bottom: 1px solid #ececec; position: relative; }
.lx-menu-in { display: flex; justify-content: center; align-items: stretch; gap: 0; flex-wrap: nowrap; overflow: hidden; }
.lx-mi { display: flex; align-items: center; padding: 0 11px; height: 38px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: #000; white-space: nowrap; position: relative; }
.lx-mi::after { content: ''; position: absolute; left: 11px; right: 11px; bottom: 6px; height: 1.5px; background: var(--pink); transform: scaleX(0); transition: transform .2s var(--ease); }
.lx-mi:hover, .lx-mi.on { color: var(--pink); }
.lx-mi:hover::after, .lx-mi.on::after { transform: scaleX(1); }
.lx-mi.hot { color: var(--pink); }
body.lx.lx-scrolled .lx-mi { height: 34px; }

/* mega menu */
.lx-mega { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid #ececec; box-shadow: 0 18px 30px rgba(0,0,0,.08); opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility 0s linear .18s; z-index: 60; }
.lx-menu:has(.lx-mi[data-mega]:hover) .lx-mega, .lx-mega:hover { opacity: 1; visibility: visible; transition-delay: .08s, 0s; }
.lx-mega-in { display: grid; grid-template-columns: repeat(4, minmax(0, 170px)) 1fr; gap: 28px; padding: 26px var(--gut) 30px; }
.lx-mega h5 { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; color: #212121; margin-bottom: 12px; }
.lx-mega-col a { display: block; font-size: 12.5px; color: #424242; padding: 4.5px 0; text-transform: capitalize; }
.lx-mega-col a:hover { color: var(--pink); }
.lx-mega-col a.see { margin-top: 8px; font-size: 11px; color: #9e9e9e; text-transform: uppercase; letter-spacing: .6px; }
.lx-mega-feat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lx-mega-feat a { display: block; }
.lx-mega-feat .mf-img { aspect-ratio: 2/3; background: #f3f3f3; overflow: hidden; }
.lx-mega-feat .mf-img img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .5s var(--ease); }
.lx-mega-feat a:hover img { transform: scale(1.04); }
.lx-mega-feat .mf-t { display: block; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; margin-top: 8px; color: #212121; }

/* search drop panel */
.lx-search { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid #ececec; box-shadow: 0 18px 30px rgba(0,0,0,.08); padding: 22px 0 26px; display: none; z-index: 61; }
.lx-search.open { display: block; }
.lx-search-form { display: flex; align-items: center; gap: 0; max-width: 760px; margin: 0 auto; border-bottom: 1.5px solid #212121; }
.lx-search-form svg { width: 20px; height: 20px; stroke: #212121; fill: none; stroke-width: 1.6; flex: 0 0 auto; }
body.lx .lx-search-form input[type=text] { flex: 1; border: none; outline: none; padding: 12px 14px; font-size: 16px; background: transparent; }
.lx-search-form button { background: none; border: none; font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; padding: 10px 4px; color: #212121; }
.lx-search-hints { max-width: 760px; margin: 14px auto 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 12px; color: var(--muted); }
.lx-search-hints a { border: 1px solid #ddd; border-radius: 20px; padding: 5px 13px; color: #212121; }
.lx-search-hints a:hover { border-color: #212121; }

.lx-bar-l [data-m-only] { display: none; }

/* mobile category bubbles (home only) */
.lx-bubbles { display: none; }

/* flash toast */
body.lx .flash { border-radius: 0; }

/* ============================================================
   SECTIONS (homepage + shared)
   ============================================================ */
body.lx section.block { padding: 18px 0; }
body.lx section.block.alt { background: transparent; }
body.lx .section-head { margin-bottom: 16px; align-items: center; flex-wrap: nowrap; }
body.lx .section-head h2 { font-size: 24px; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; color: #212121; line-height: 1.3; }
body.lx .section-head a.more { font-size: 13px; font-weight: 600; color: #757575; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
body.lx .section-head a.more:hover { color: #000; text-decoration: none; }
body.lx .section-head.center { justify-content: center; text-align: center; }
body.lx .eyebrow, body.lx .kicker { font-family: var(--font); letter-spacing: 2px; font-weight: 600; }

/* ---- generic rail (horizontal carousel with outside arrows) ---- */
.lx-rail { position: relative; --per: 5; --gap: 16px; }
.lx-rail-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--per) - 1) * var(--gap)) / var(--per)); gap: var(--gap); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.lx-rail-track::-webkit-scrollbar { display: none; }
.lx-rail-track > * { scroll-snap-align: start; min-width: 0; }
.lx-rail-btn { position: absolute; top: var(--arrow-top, 50%); transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; border: 1px solid #e0e0e0; background: #fff; color: #212121; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 4; box-shadow: 0 2px 8px rgba(0,0,0,.08); transition: opacity .2s, background .2s; }
.lx-rail-btn svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.lx-rail-btn:hover { background: #212121; color: #fff; border-color: #212121; }
.lx-rail-btn.prev { left: -46px; } .lx-rail-btn.next { right: -46px; }
.lx-rail-btn[disabled] { opacity: 0; pointer-events: none; }
.lx-rail.no-scroll .lx-rail-btn { display: none; }
@media (max-width: 1420px) { .lx-rail-btn.prev { left: -10px; } .lx-rail-btn.next { right: -10px; } }

/* ---- hero slider ---- */
body.lx .hero-carousel { max-width: calc(var(--wrap) + var(--gut) * 2); padding: 0 var(--gut); margin: 24px auto 0; }
body.lx .hero-viewport { border-radius: 0; }
body.lx .hero-slide { border-radius: 0; aspect-ratio: 1296 / 593; min-height: 0; display: block; position: relative; color: #fff; background-color: #2a1512; }
body.lx .hero-slide .hs-img { position: absolute; inset: 0; min-height: 0; height: 100%; }
body.lx .hero-slide .hs-img img { width: 100%; height: 100%; object-fit: cover; }
body.lx .hero-slide .hs-text { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 40px 8% !important; }
body.lx .hero-slide.has-img .hs-text { left: 52%; padding: 40px 6% !important; }
body.lx .hero-slide.has-img::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.42) 70%, rgba(0,0,0,.5)); }
body.lx .hero-slide .hs-kicker { font-family: var(--serif); font-style: italic; text-transform: none; letter-spacing: 3px; font-size: clamp(15px, 1.6vw, 22px); font-weight: 500; opacity: .95; margin-bottom: 4px; }
body.lx .hero-slide h2 { font-family: var(--serif); font-weight: 500; font-size: clamp(22px, 2.6vw, 38px); line-height: 1.1; margin-bottom: 10px; letter-spacing: .5px; }
body.lx .hero-slide h2 .mega { font-size: clamp(44px, 6.4vw, 92px); line-height: 1; font-weight: 500; margin-top: 2px; }
body.lx .hero-slide p { font-size: clamp(14px, 1.4vw, 20px); max-width: 520px; margin: 0 auto 22px; opacity: .95; }
body.lx .hero-slide .btn.gold { background: #fff !important; color: #212121 !important; border: 1px solid #fff; padding: 9px 22px; font-size: 12px; letter-spacing: 1.4px; }
body.lx .hero-arrow { width: 38px; height: 38px; background: rgba(255,255,255,.85); box-shadow: none; color: #212121; backdrop-filter: none; }
body.lx .hero-arrow.prev { left: 34px; } body.lx .hero-arrow.next { right: 34px; }
body.lx .hero-dots { margin-top: 10px; gap: 6px; }
body.lx .hero-dots button { width: 24px; height: 2px; border-radius: 0; background: #d0d0d0; }
body.lx .hero-dots button.on { width: 24px; background: #212121; }

/* ---- category tiles ("Shop by categories") ---- */
.lx-cats { --per: 6; }
.lx-cat { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: #2a2a2a; color: #fff; }
.lx-cat img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .6s var(--ease); }
.lx-cat:hover img { transform: scale(1.05); }
.lx-cat::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 48%, rgba(0,0,0,.62) 100%); }
.lx-cat-cap { position: absolute; left: 8px; right: 8px; bottom: 14px; z-index: 2; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.lx-cat-name { font-family: var(--serif); font-size: 22px; font-weight: 500; line-height: 1.1; text-shadow: 0 1px 8px rgba(0,0,0,.25); }
.lx-cat-cta { font-size: 9.5px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; opacity: .95; }
.lx-cat.no-img { background: #212121; }
.lx-cat.no-img .lx-cat-cap { top: 0; justify-content: center; }
.lx-cats.tiles-small { --per: 8; } .lx-cats.tiles-large { --per: 4; }

/* ---- product cards ---- */
body.lx .product-card { background: transparent; border: none; border-radius: 0; box-shadow: none; transform: none; }
body.lx .product-card:hover { box-shadow: none; transform: none; }
body.lx .product-card .imgwrap { aspect-ratio: 2 / 3; background: #f3f3f3; }
body.lx .product-card .imgwrap img { object-position: top center; transition: transform .6s var(--ease); }
body.lx .product-card:hover .imgwrap img { transform: scale(1.03); }
body.lx .product-card .body { padding: 10px 0 0; gap: 3px; }
body.lx .product-card .brand { font-size: 13px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; color: #212121; line-height: 18px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
body.lx .product-card .pname { font-size: 13px; color: #757575; line-height: 20px; -webkit-line-clamp: 1; }
body.lx .product-card .price { padding-top: 6px; margin-top: 0; font-size: 13px; font-weight: 600; letter-spacing: .3px; color: #212121; }
body.lx .price .was { color: #9e9e9e; font-size: 12px; font-weight: 400; margin: 0 4px 0 6px; }
body.lx .price .off { color: var(--pink); font-size: 12px; font-weight: 600; text-transform: uppercase; }
.lx-rate { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; color: #757575; }
.lx-rate svg { color: #212121; }
.lx-card-x { display: flex; gap: 14px; margin-top: 6px; font-size: 12px; color: #666; }
.lx-card-x a:hover { color: #000; text-decoration: underline; }
.lx-tag { position: absolute; left: 8px; bottom: 8px; z-index: 2; background: #fff; color: #212121; font-size: 9.5px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; padding: 3px 7px; display: inline-flex; align-items: center; gap: 3px; pointer-events: none; }
.lx-tag svg { width: 10px; height: 10px; }
.lx-tag.made { background: #212121; color: #fff; }
body.lx .badge.sale, body.lx .badge.preorder { display: none; }
body.lx .wish-heart { top: 8px; right: 8px; }
body.lx .wish-heart button { width: 30px; height: 30px; background: transparent; border: none; box-shadow: none; color: #fff; filter: drop-shadow(0 0 1.5px rgba(0,0,0,.55)) drop-shadow(0 1px 3px rgba(0,0,0,.3)); }
body.lx .wish-heart button:hover { color: var(--pink); transform: none; filter: none; }
body.lx .wish-heart button svg { width: 19px; height: 19px; }
body.lx .product-card .quick-add { left: 0; right: 0; bottom: 0; transform: translateY(6px); }
body.lx .quick-add button { background: rgba(33,33,33,.92); color: #fff; border: none; border-radius: 0; padding: 11px; font-size: 11.5px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
body.lx .quick-add button:hover { background: #000; color: #fff; }
@media (hover: none) { body.lx .product-card .quick-add { display: none; } }

/* product rows on the homepage */
.lx-prods { --per: 5; --arrow-top: 33%; }

/* grids */
body.lx .grid { gap: 28px 16px; }

/* ---- collection grid ("made for every celebration") ---- */
body.lx .occ-grid { gap: 16px; }
body.lx .occ-card { border-radius: 0; aspect-ratio: 2 / 3; justify-content: center; text-align: center; background: var(--occ-bg, var(--lx-tone, #2b2b2b)); }
body.lx .occ-card.e1 { --lx-tone: #4a1612; } body.lx .occ-card.e2 { --lx-tone: #23352d; }
body.lx .occ-card.e3 { --lx-tone: #3a2f28; } body.lx .occ-card.e4 { --lx-tone: #1f2633; }
body.lx .occ-card:hover { transform: none; box-shadow: none; }
body.lx .occ-card .occ-img { transition: transform .7s var(--ease); object-position: top center; }
body.lx .occ-card:hover .occ-img { transform: scale(1.04); }
body.lx .occ-card .occ-veil { background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.6) 100%); opacity: calc(.4 + var(--occ-veil, .55) * .6); }
body.lx .occ-card .occ-body { align-items: center; padding: 0 16px 26px; gap: 12px; text-shadow: 0 1px 10px rgba(0,0,0,.3); }
body.lx .occ-card .occ-ico, body.lx .occ-card .occ-s { display: none; }
body.lx .occ-card .occ-t { font-family: var(--serif); font-size: clamp(22px, 2.2vw, 32px); font-weight: 500; line-height: 1.05; max-width: 10ch; }
body.lx .occ-dots button { border-radius: 0; height: 2px; width: 18px; }
body.lx .occ-dots button.on { background: #212121; width: 18px; }

/* ---- designer spotlight ("celebrated designers") ---- */
.lx-designers { --per: 4; --arrow-top: 50%; }
.lx-dcard { position: relative; display: block; aspect-ratio: 2 / 3; overflow: hidden; background: #2a2a2a; color: #fff; }
.lx-dcard > img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .7s var(--ease); }
.lx-dcard:hover > img { transform: scale(1.04); }
.lx-dcard::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.66) 100%); }
.lx-dcard-cap { position: absolute; left: 10px; right: 10px; bottom: 24px; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; }
.lx-dcard-name { font-family: var(--serif); font-size: clamp(22px, 2vw, 30px); font-weight: 500; line-height: 1.05; }
.lx-dcard-off { font-size: 11.5px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 8px; }
.lx-dcard.no-img { background: #f3efea; color: #212121; }
.lx-dcard.no-img::after { display: none; }
.lx-dcard.no-img .lx-dcard-cap { top: 0; justify-content: center; }
.lx-dcard-logo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; background: #fff; margin-bottom: 10px; border: 1px solid #e5e5e5; }
.lx-sub { color: var(--muted); font-size: 13px; margin: -8px 0 16px; max-width: 680px; }

/* ---- offer banners ("wardrobe favourites") ---- */
body.lx .offer-strip { gap: 16px; }
body.lx .offer-card { border-radius: 0; min-height: 220px; padding: 26px 22px 28px; justify-content: flex-end; align-items: center; text-align: center; gap: 6px; background-color: #2b2b2b; position: relative; overflow: hidden; }
body.lx .offer-card:hover { transform: none; box-shadow: none; }
body.lx .offer-card.has-img { aspect-ratio: 1; min-height: 0; }
body.lx .offer-card.o1 { background: #4a1612; }
body.lx .offer-card.o2 { background: #212121; }
body.lx .offer-card.o3 { background: #3a2f28; }
body.lx .offer-card.o-custom { background-color: #212121; }
body.lx .offer-card .oc-k { font-size: 10.5px; letter-spacing: 2px; font-weight: 600; opacity: .9; }
body.lx .offer-card .oc-t { font-family: var(--serif); font-size: clamp(24px, 2.3vw, 34px); font-weight: 500; line-height: 1.1; }
body.lx .offer-card .oc-s { font-size: 12.5px; opacity: .9; margin-bottom: 8px; }

/* ---- image banner ---- */
.lx-banner-h { font-family: var(--serif) !important; font-weight: 500 !important; }

/* ---- trust strip ---- */
body.lx .trust-strip { gap: 0; border-top: 1px solid #ececec; border-bottom: 1px solid #ececec; padding: 28px 0; }
body.lx .trust-item { padding: 4px 24px; }
body.lx .trust-item + .trust-item { border-left: 1px solid #ececec; }
body.lx .trust-item .ti-ico { color: #212121; margin-bottom: 10px; }
body.lx .trust-item h3 { font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; color: #212121; margin-bottom: 6px; }
body.lx .trust-item p { font-size: 12.5px; color: #757575; max-width: 320px; margin: 0 auto; }

/* ---- rich text / how it works ---- */
body.lx .step { border: 1px solid #ececec; border-radius: 0; }
body.lx .step .num { background: #fff; border: 1px solid #212121; color: #212121; font-weight: 600; }
body.lx .step h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .8px; font-weight: 600; }
body.lx .how-cta { background: #f5f5f5 !important; border: none !important; }
.lx-rt h2 { font-size: 24px !important; text-transform: uppercase; letter-spacing: .6px; font-weight: 600; }

/* ---- blog row ("journal") ---- */
.lx-blog { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 40px; max-width: 1060px; margin: 0 auto; }
.lx-post { display: grid; grid-template-columns: 172px 1fr; gap: 18px; align-items: start; }
.lx-post-img { aspect-ratio: 4 / 3; overflow: hidden; background: #f0ebe6; display: flex; align-items: center; justify-content: center; }
.lx-post-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.lx-post:hover .lx-post-img img { transform: scale(1.05); }
.lx-post-img .ph { font-family: var(--serif); font-size: 22px; color: #6b5a50; padding: 10px; text-align: center; line-height: 1.1; }
.lx-post h3 { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; line-height: 1.45; color: #212121; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 6px; }
.lx-post p { font-size: 12.5px; color: #757575; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lx-post .k { display: block; margin-top: 8px; font-size: 11px; color: #9e9e9e; letter-spacing: .3px; }
.lx-blog-more { display: flex; justify-content: center; margin-top: 30px; }
.lx-blog-more .btn { min-width: 300px; }

/* ---- homepage frame: section content sits 8px inside the page column (the hero and
   the thin promo strip use the full column), exactly as the reference measures ---- */
@media (min-width: 1079px) {
  body.lx [data-section-type]:not([data-section-type="hero_slider"]):not([data-section-type="image_banner"]) section > .container {
    padding-left: calc(var(--gut) + 8px); padding-right: calc(var(--gut) + 8px);
  }
}

/* ---- thin promo strip under the hero ---- */
body.lx section.block.lx-thin-wrap { padding-top: 32px; }
.lx-thin { position: relative; display: flex; align-items: center; justify-content: flex-end; aspect-ratio: 1296 / 246; overflow: hidden; color: #fff;
  background: linear-gradient(100deg, #1c110d 0%, #3a1f15 55%, #5b2b18 100%); }
.lx-thin img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lx-thin.has-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.45) 100%); }
.lx-thin:not(.has-img)::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 55%;
  background: repeating-linear-gradient(90deg, rgba(201,155,63,.22) 0 1px, transparent 1px 12px), repeating-linear-gradient(90deg, rgba(201,155,63,.12) 0 3px, transparent 3px 46px);
  -webkit-mask-image: linear-gradient(90deg, #000 20%, transparent); mask-image: linear-gradient(90deg, #000 20%, transparent); }
.lx-thin-text { position: relative; z-index: 2; width: 50%; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 0 24px; }
.lx-thin-text .k { font-size: clamp(13px, 1.4vw, 20px); letter-spacing: .5px; opacity: .95; }
.lx-thin-text .h { font-family: var(--serif); font-size: clamp(26px, 3.3vw, 50px); font-weight: 500; line-height: 1.05; color: #e9cf96; }
.lx-thin-text .p { font-size: clamp(12px, 1vw, 15px); opacity: .9; margin-top: 2px; }
.lx-thin-text .b { margin-top: 10px; background: #fff; color: #212121; padding: 5px 16px; font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; }

/* ---- product-row filters ("Ready to ship" + category chips) ---- */
.lx-chipbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: -2px 0 18px; }
.lx-fchip { border: 1px solid #aaa; border-radius: 20px; background: #fff; padding: 7px 13px; font-family: inherit; font-size: 12px; line-height: 1.2; color: #111; cursor: pointer; }
.lx-fchip:hover { border-color: #212121; }
.lx-fchip.on { background: #f4f4f4; border-color: #212121; font-weight: 600; }
.lx-rts { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #aaa; padding: 7px 12px; font-size: 12px; line-height: 1.2; cursor: pointer; margin: 0 4px 0 0; background: #fff; font-weight: 400; }
.lx-rts input { width: 13px; height: 13px; accent-color: #212121; margin: 0; }
.lx-rail .product-card.lx-out { display: none; }
.lx-rail-empty { padding: 40px 0; text-align: center; color: var(--muted); font-size: 13px; }

/* ---- occasion grid: 4 across, then the wide second row ---- */
body.lx .occ-grid.n5 .occ-card:nth-child(5) { grid-column: 1 / -1; aspect-ratio: 1280 / 461; }
body.lx .occ-grid.n6 .occ-card:nth-child(n+5) { grid-column: span 2; aspect-ratio: 632 / 461; }
body.lx .occ-grid.n7 .occ-card:nth-child(5) { grid-column: span 2; aspect-ratio: 632 / 461; }

/* ---- editorial tiles ---- */
.lx-ed { display: grid; gap: 16px; }
.lx-ed-feature { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lx-ed-feature .lx-et { aspect-ratio: 416 / 548; }
.lx-ed-feature .lx-et:first-child { grid-column: span 2; aspect-ratio: auto; }
.lx-ed-feature.n1 .lx-et:first-child { grid-column: 1 / -1; aspect-ratio: 1280 / 548; }
.lx-ed-squares { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lx-ed-squares .lx-et { aspect-ratio: 1; }
.lx-et { position: relative; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; background: #2b2b2b; color: #fff; text-align: center; }
.lx-et img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .7s var(--ease); }
.lx-et:hover img { transform: scale(1.04); }
.lx-et::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.58) 100%); }
.lx-et-body { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0 16px 26px; text-shadow: 0 1px 10px rgba(0,0,0,.25); }
.lx-et-body .t { font-family: var(--serif); font-size: clamp(24px, 2.3vw, 34px); font-weight: 500; line-height: 1.05; }
.lx-et-body .s { font-size: 11.5px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; margin-bottom: 8px; }
.lx-portraits { --per: 4; }
.lx-et-cap { aspect-ratio: 2 / 3; }
.lx-et-cap .lx-et-body { padding-bottom: 18px; gap: 2px; }
.lx-et-cap .lx-et-body .t { font-family: var(--font); font-size: 12.5px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; }
.lx-et-cap .lx-et-body .s { font-size: 10px; font-weight: 500; margin: 0; }

/* ---- designer showcase band ---- */
.lx-band { padding: 70px 0; margin: 18px 0; }
.lx-band-in { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 48px; align-items: center; }
.lx-band-intro { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
.lx-band-logo { max-width: 170px; max-height: 110px; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.lx-band-name { font-family: var(--serif); font-size: 34px; font-weight: 500; line-height: 1.1; color: #212121; }
.lx-band-intro p { font-size: 13px; color: #424242; max-width: 260px; line-height: 1.6; }
.lx-band-btn { background: var(--pink); color: #fff; padding: 11px 30px; font-size: 12px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; }
.lx-band-btn:hover { background: var(--pink-deep); }
.lx-band-rail { --per: 3.4; --arrow-top: 38%; }
.lx-band .product-card .imgwrap { background: #fff; }

/* ---- designer feature + new collections ---- */
.lx-split { display: grid; grid-template-columns: minmax(0, 632fr) minmax(0, 568fr); column-gap: 80px; align-items: start; }
.lx-split-lead { position: relative; display: block; aspect-ratio: 632 / 391; overflow: hidden; background: #2b2b2b; color: #fff; }
.lx-split-lead img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; transition: transform .7s var(--ease); }
.lx-split-lead:hover img { transform: scale(1.03); }
.lx-split-lead::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 48%, rgba(0,0,0,.6) 100%); }
.lx-split-cap { position: absolute; left: 28px; right: 28px; bottom: 22px; z-index: 2; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.lx-split-cap .t { display: block; font-family: var(--serif); font-size: clamp(24px, 2.2vw, 32px); font-weight: 500; line-height: 1.1; }
.lx-split-cap .s { display: block; font-size: 11.5px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; margin-top: 4px; }
.lx-split-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 15px; }
.lx-split-grid a { display: block; }
.lx-split-grid .im { display: block; aspect-ratio: 1; overflow: hidden; background: #f3f3f3; }
.lx-split-grid img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .6s var(--ease); }
.lx-split-grid a:hover img { transform: scale(1.05); }
.lx-split-grid .nm { display: block; font-size: 12px; color: #212121; margin-top: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- journal band ---- */
body.lx section.block.lx-journal { background: #fbfbfb; padding: 34px 0 44px; margin-top: 24px; }

/* ============================================================
   PAGE SHELLS (all storefront pages)
   ============================================================ */
body.lx .page-head { background: #fff; color: #212121; padding: 26px 0 22px; border-bottom: 1px solid #ececec; }
body.lx .page-head h1 { color: #212121; font-size: 22px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; }
body.lx .page-head p { color: #757575; font-size: 13.5px; }
body.lx .page-head .eyebrow { color: #9e9e9e; }
body.lx .page-head a { color: inherit; }
body.lx .crumbs-bar { background: transparent; padding: 16px 0 0; border: none; }
body.lx .crumbs, body.lx .page-head .crumbs { color: #c2c2c2; font-size: 12px; margin-bottom: 10px; }
body.lx .crumbs a, body.lx .page-head .crumbs a { color: #9e9e9e; font-weight: 400; }
body.lx .crumbs a:hover { color: #212121; text-decoration: none; }
body.lx .crumbs span, body.lx .page-head .crumbs span { color: #616161; font-weight: 400; }
body.lx .crumbs .sep { color: #c2c2c2; }
body.lx .accordion details { border-radius: 0; border-color: #e6e6e6; }
body.lx .accordion details[open] { border-color: #212121; }
body.lx .accordion summary { font-size: 13.5px; font-weight: 600; }
body.lx .accordion summary::after { color: #212121; }
body.lx .brand-card, body.lx .cat-card, body.lx .guide-card { border-radius: 0; }
body.lx .brand-card:hover, body.lx .cat-card:hover, body.lx .guide-card:hover { transform: none; }
body.lx .tab-btn.on { border-bottom-color: #212121; }
body.lx .empty a { color: #212121; text-decoration: underline; }
body.lx table.list th { font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px; }

/* ============================================================
   PRODUCT LISTING (marketplace)
   ============================================================ */
.lx-plp { background: var(--bg-plp); padding: 14px 0 40px; }
.lx-plp-grid { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 52px; align-items: start; }
.lx-filters { position: sticky; top: 140px; max-height: calc(100vh - 160px); overflow-y: auto; scrollbar-width: thin; padding-bottom: 20px; }
.lx-f-top { display: none; }
.lx-f-overlay { display: none; }
.lx-fgroup { padding: 16px 0 14px; border-bottom: 1px solid #e3e3e3; }
.lx-fgroup:first-of-type { padding-top: 6px; }
.lx-fgroup h4 { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #212121; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center; }
.lx-fgroup h4 a { font-size: 10.5px; color: var(--pink); font-weight: 600; letter-spacing: .4px; }
body.lx .lx-fsearch { width: 100%; border: none; border-bottom: 1px solid #d9d9d9; background: transparent; padding: 7px 8px; font-size: 12px; margin-bottom: 8px; }
.lx-flist { max-height: 228px; overflow-y: auto; scrollbar-width: thin; padding-right: 4px; }
.lx-fopt { display: flex; align-items: center; gap: 9px; padding: 4px 0; font-size: 12px; color: #212121; text-transform: capitalize; letter-spacing: .2px; line-height: 1.35; }
.lx-fopt .bx { width: 13px; height: 13px; border: 1px solid #757575; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: #fff; }
.lx-fopt.on .bx { background: #212121; border-color: #212121; }
.lx-fopt.on .bx::after { content: ''; width: 6px; height: 3px; border-left: 1.5px solid #fff; border-bottom: 1.5px solid #fff; transform: rotate(-45deg) translate(1px, -1px); }
.lx-fopt .n { color: #9e9e9e; }
.lx-fopt:hover { color: #000; }
.lx-fopt.on { font-weight: 600; }
.lx-fopt[hidden] { display: none; }
.lx-price { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
body.lx .lx-price input { width: 100%; padding: 8px 9px; font-size: 12px; border: 1px solid #d9d9d9; background: #fff; }
.lx-price button { grid-column: 1 / -1; }
.lx-plp-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 4px 0 12px; border-bottom: 1px solid #212121; margin-bottom: 14px; }
.lx-plp-top h1 { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #212121; }
.lx-plp-top h1 span { font-size: 12px; font-weight: 500; color: #757575; text-transform: none; letter-spacing: .4px; margin-left: 4px; }
.lx-sort { display: flex; align-items: center; border: 1px solid #d9d9d9; background: #fff; height: 32px; }
.lx-sort label { font-size: 12px; color: #9e9e9e; padding: 0 2px 0 12px; margin: 0; white-space: nowrap; font-weight: 400; }
body.lx .lx-sort select { border: none; background: transparent; font-size: 12px; padding: 0 12px 0 4px; height: 30px; color: #212121; min-width: 150px; cursor: pointer; }
.lx-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; align-items: center; }
.lx-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #aaa; border-radius: 20px; padding: 5px 12px; font-size: 12px; background: #fff; color: #111; }
.lx-chip:hover { border-color: #212121; }
.lx-chip.clear { border: none; color: var(--pink); font-weight: 600; padding-left: 4px; }
.lx-plp .grid.cols-4 { gap: 36px 17px; }
@media (min-width: 1679px) { .lx-plp .grid.cols-4 { column-gap: 25px; } }
.lx-plp .product-card .imgwrap { background: #fff; }
.lx-plp-seo { margin-top: 48px; padding-top: 28px; border-top: 1px solid #e3e3e3; max-width: 860px; }
.lx-plp-seo h2 { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; margin: 0 0 10px; }
.lx-plp-seo p { color: #616161; font-size: 13px; line-height: 1.7; }
.lx-plp-seo .tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 22px; }
.lx-plp-seo .tags span { border: 1px solid #d9d9d9; border-radius: 20px; padding: 4px 12px; font-size: 11.5px; color: #424242; background: #fff; }
.lx-mbar { display: none; }
.lx-tagline { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; border: 1px solid #212121; padding: 2px 6px; font-size: 9.5px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; color: #212121; width: max-content; }
.lx-tagline svg { width: 10px; height: 10px; }

/* ============================================================
   PRODUCT PAGE
   ============================================================ */
.lx-pdp { padding: 4px 0 30px; }
.lx-pdp .pdp-grid { grid-template-columns: minmax(0, 40%) minmax(0, 50%); gap: 0 10%; }
.lx-pdp .pdp-gallery { grid-template-columns: var(--th-w) minmax(0, 1fr); gap: 13px; top: 132px; }
/* the rail never makes the row taller than the photo — it scrolls instead */
.lx-pdp .pdp-thumbs { gap: var(--th-gap); height: 0; min-height: 100%; max-height: none; scrollbar-width: none; }
.lx-pdp .pdp-thumbs::-webkit-scrollbar { display: none; }
.lx-pdp .pdp-thumbs img { width: var(--th-w); height: var(--th-h); border-radius: 0; border: 1px solid transparent; opacity: .75; object-position: top center; }
.lx-pdp .pdp-thumbs img.on, .lx-pdp .pdp-thumbs img:hover { border-color: #212121; opacity: 1; }
.lx-pdp .pdp-main { aspect-ratio: 2 / 3; border-radius: 0; border: none; background: #f3f3f3; }
.lx-pdp .pdp-main img { object-position: top center; }
.lx-pdp .pdp-info { padding-top: 0; }
.pdp-designer-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.pdp-designer { font-size: 24px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; color: #231f20; line-height: 1.35; display: inline-flex; align-items: center; gap: 6px; }
.pdp-designer:hover { color: var(--pink); }
.pdp-designer svg { color: #3b82c4; }
.pdp-wish { background: none; border: none; cursor: pointer; padding: 4px; color: #212121; line-height: 0; }
.pdp-wish svg { width: 22px; height: 22px; }
.pdp-wish:hover, .pdp-wish.on { color: var(--pink); }
.lx-pdp h1.pdp-name { font-family: var(--font); font-size: 13px; font-weight: 400; color: #757575; letter-spacing: .3px; margin: 2px 0 14px; line-height: 1.5; }
.pdp-rate { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #616161; margin-bottom: 10px; }
.pdp-rate svg { color: #212121; }
.pdp-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.pdp-price #prodPrice { font-size: 18px; font-weight: 600; color: #212121; letter-spacing: .3px; }
.pdp-price #prodCompare { font-size: 14px; color: #9e9e9e; text-decoration: line-through; }
.pdp-price #prodDiscBadge { font-size: 13px; color: var(--pink); font-weight: 600; text-transform: uppercase; letter-spacing: .3px; }
.pdp-tax { font-size: 12px; color: #757575; margin-top: 4px; }
.pdp-hr { border: none; border-top: 1px solid #e3e3e3; margin: 22px 0; }
.lx-pdp .avail-pill { padding: 0; background: none !important; font-size: 12.5px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; border-radius: 0; }
.lx-pdp .avail-pill.in { color: #2e7d55; }
.lx-pdp .avail-pill.out { color: var(--pink); }
.lx-pdp .avail-pill.pre { color: #8a6a1f; }
.lx-pdp .avail-pill .dot { box-shadow: none; width: 6px; height: 6px; }
.pdp-opt-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; font-size: 13px; font-weight: 600; color: #212121; letter-spacing: .2px; }
.pdp-opt-head .muted { font-weight: 400; }
.pdp-sg { background: none; border: none; color: var(--pink); font-size: 13px; font-weight: 600; cursor: pointer; padding: 0 2px; font-family: inherit; }
.pdp-sg:hover { text-decoration: underline; }
.lx-pdp .opt-pill { min-width: 48px; height: 44px; padding: 0 12px; border: 1px solid #e0e0e0; border-radius: 0; font-size: 12.5px; font-weight: 600; letter-spacing: .4px; color: #212121; background: #fff; text-transform: uppercase; }
.lx-pdp .opt-pill:hover { border-color: #212121; }
.lx-pdp .opt-pill.on { border-color: #212121; box-shadow: inset 0 0 0 1px #212121; }
.lx-pdp .opt-pill.oos { color: #bdbdbd; text-decoration: line-through; }
.lx-pdp .buy-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 26px; }
.lx-pdp .buy-row .qty-stepper { display: none; }
.lx-pdp .buy-row .btn { min-height: 44px; font-size: 13px; letter-spacing: .8px; padding: 0 20px; }
.lx-pdp .fit-box { border-radius: 0; border-color: #e0e0e0; }
.lx-pdp .fit-box.on { border-color: #212121; }
.lx-pdp .fit-step, .lx-pdp .fit-panel textarea { border-radius: 0; }
.lx-pdp .pre-note { border-radius: 0; }
.pdp-sec { padding: 18px 0; border-top: 1px solid #e3e3e3; }
.pdp-sec h3 { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; color: #212121; margin-bottom: 4px; }
.pdp-sec p, .pdp-sec li { font-size: 12.5px; color: #757575; line-height: 1.6; }
.pdp-sec ul { padding-left: 16px; }
.pdp-sec .row { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.pdp-sec a.red { color: var(--pink); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; }
.pdp-sec a.red:hover { text-decoration: underline; }
.pdp-desc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 30px; }
.pdp-kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 20px; }
.pdp-kv b { display: block; font-size: 13px; font-weight: 600; color: #212121; }
.pdp-kv span { font-size: 12.5px; color: #757575; }
.pdp-kv a { color: #212121; text-decoration: underline; }
.pdp-perks { background: #f5f5f5; padding: 22px 24px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 16px 24px; align-items: center; margin-top: 8px; }
.pdp-perks .pk b { display: block; font-size: 12.5px; font-weight: 600; color: #212121; }
.pdp-perks .pk span { font-size: 12px; color: #757575; }
.pdp-perks .help { grid-row: 1 / span 2; grid-column: 3; border-left: 1px solid #ddd; padding-left: 24px; font-size: 12.5px; color: #424242; max-width: 180px; }
.pdp-perks .help .btn { margin-top: 10px; padding: 9px 14px; font-size: 11px; width: 100%; }
.lx-pdp .safe-checkout { border-radius: 0; border-color: #ececec; margin-top: 16px; }
.lx-pdp .pay-badge { border-radius: 0; }
.lx-pdp .pdp-delivery { font-size: 12.5px; color: #616161; margin: 14px 0 0; }
.lx-pdp .pdp-delivery svg { color: #212121; width: 16px; height: 16px; }
.pdp-reviews { margin-top: 56px; }
.pdp-more { margin-top: 56px; }
body.lx #stickyBar { background: #fff; color: #212121; border-top: 1px solid #e3e3e3; box-shadow: 0 -6px 20px rgba(0,0,0,.06); }
body.lx #stickyBar .sticky-inner { max-width: calc(var(--wrap) + var(--gut) * 2); }
body.lx #stickyBar .sticky-inner img { border-radius: 0; }
body.lx #stickyBar .sticky-price { color: #212121; font-weight: 600; }
body.lx #stickyBar .sticky-name { font-weight: 600; font-size: 13px; }
body.lx #stickyBar .sticky-inner .btn { background: #212121; color: #fff; }
body.lx #stickyBar .sticky-inner .btn:hover { background: #000; }
#sizeChartModal > div { border-radius: 0 !important; }

/* ============================================================
   FOOTER
   ============================================================ */
body.lx footer.site.lx-foot { background: #fff; border-top: 1px solid #e6e6e6; margin-top: 48px; padding: 44px 0 26px; color: #616161; font-size: 12px; }
.lx-foot-cols { display: grid; grid-template-columns: repeat(var(--cols, 5), minmax(0, 1fr)); gap: 28px; padding-bottom: 34px; }
body.lx footer h4 { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; color: #212121; margin-bottom: 12px; }
body.lx footer .lx-foot-cols a { display: block; padding: 4px 0; font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: #616161; }
body.lx footer .lx-foot-cols a:hover { color: #000; }
.lx-foot-contact a { display: flex !important; align-items: center; gap: 8px; text-transform: none !important; }
.lx-foot-contact svg { width: 14px; height: 14px; flex: 0 0 auto; }
.lx-social { display: flex; gap: 14px; margin-top: 12px; }
.lx-social a { display: inline-flex !important; padding: 0 !important; color: #212121 !important; }
.lx-social svg { width: 17px; height: 17px; }
.lx-foot-app p { font-size: 12px; line-height: 1.55; color: #616161; margin-bottom: 12px; text-transform: none; }
.lx-foot-trust { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; }
.lx-foot-trust div { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 22px 10px; text-align: center; font-size: 11.5px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; color: #212121; }
.lx-foot-trust svg { width: 26px; height: 26px; stroke: #212121; fill: none; stroke-width: 1.4; }
.lx-foot-band { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding: 28px 0; border-bottom: 1px solid #e6e6e6; align-items: center; }
.lx-foot-band h4 { margin-bottom: 4px !important; font-size: 14px !important; }
.lx-foot-band small { display: block; color: #757575; font-size: 11.5px; margin-bottom: 10px; }
.lx-pay { display: flex; flex-wrap: wrap; gap: 6px; }
.lx-pay span { border: 1px solid #ddd; padding: 4px 9px; font-size: 10px; font-weight: 700; letter-spacing: .6px; color: #424242; background: #fff; }
.lx-news { display: flex; gap: 0; }
body.lx .lx-news input[type=email] { flex: 1; border: 1px solid #d0d0d0; border-right: none; padding: 11px 14px; font-size: 13px; min-width: 0; }
.lx-news .btn { padding: 0 26px; }
.lx-foot-seo { padding: 26px 0 8px; font-size: 11.5px; line-height: 1.75; color: #757575; }
.lx-foot-seo h4 { margin: 0 0 6px !important; font-size: 11.5px !important; }
.lx-foot-seo p { margin-bottom: 18px; }
.lx-foot-seo .links { margin-bottom: 18px; }
.lx-foot-seo .links a { display: inline !important; color: #616161; text-transform: none; padding: 0; font-size: 11.5px; }
.lx-foot-seo .links a:hover { color: #000; text-decoration: underline; }
.lx-foot-seo .links i { font-style: normal; color: #c2c2c2; margin: 0 6px; }
body.lx footer .fine { border-top: 1px solid #e6e6e6; padding-top: 18px; flex-direction: row; justify-content: space-between; font-size: 11.5px; color: #9e9e9e; }

/* bottom app nav + drawer + cart drawer re-skin */
body.lx .bottom-nav a.on { color: var(--pink); }
body.lx .bottom-nav .bn-count { background: #212121; }
body.lx .mobile-drawer .drawer-cat-card .dcc-img { border-radius: 0; box-shadow: none; }
body.lx .drawer-title { text-transform: uppercase; letter-spacing: .8px; font-size: 14px; font-weight: 600; }
.drawer-nav { display: flex; flex-direction: column; margin: 4px 0 18px; }
.drawer-nav a { padding: 12px 0; border-bottom: 1px solid #efefef; font-size: 13px; text-transform: uppercase; letter-spacing: .6px; color: #212121; display: flex; justify-content: space-between; }
.drawer-nav a.hot { color: var(--pink); }
body.lx .cart-drawer-title { font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; }
body.lx .cart-line-img, body.lx .cart-pop img { border-radius: 0; }
body.lx .cart-qty, body.lx .cart-opt, body.lx .cart-opt-panel textarea, body.lx .cart-opt-panel input { border-radius: 0; }
body.lx .cart-ship-track, body.lx .cart-ship-fill { border-radius: 0; }
body.lx .cart-ship-fill { background: #212121; }
body.lx .cart-subtotal { font-size: 16px; font-weight: 600; }
body.lx .cart-popular-head { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1200px) {
  .lx-prods { --per: 4; }
  .lx-cats { --per: 5; }
  .lx-mega-in { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lx-mega-feat { display: none; }
  .lx-menu-in { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .lx-menu-in::-webkit-scrollbar { display: none; }
}
@media (max-width: 1024px) {
  .lx-topbar { display: none; }
  .lx-band-rail { --per: 2.4; }
  .lx-split { column-gap: 40px; }
  .lx-mega { display: none; }
  .lx-prods { --per: 3; }
  .lx-cats { --per: 4; }
  .lx-designers { --per: 3; }
  .lx-plp-grid { grid-template-columns: 180px minmax(0, 1fr); gap: 28px; }
  .lx-foot-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  :root { --gut: 12px; }
  /* mobile header: black strip · burger/search · centred logo · wishlist/cart */
  .lx-mstrip { display: block; background: #212121; color: #fff; text-align: center; font-size: 12px; padding: 8px 12px; letter-spacing: .2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .lx-mstrip a { color: #ff8a80; text-decoration: underline; }
  .lx-bar-in { height: 60px; grid-template-columns: 1fr auto 1fr; }
  body.lx.lx-scrolled .lx-bar-in { height: 54px; }
  body.lx .nav-row .logo, body.lx .lx-logo { position: static; transform: none; }
  .lx-logo img, body.lx .nav-row .logo img { height: 38px !important; }
  body.lx.lx-scrolled .lx-logo img { height: 34px !important; }
  body.lx .burger-menu-btn { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; background: none; border: none; color: #212121; padding: 0; }
  body.lx .currency-switch { display: none; }
  body.lx .icon-link.lx-ic, .lx-ic { width: 38px; }
  .lx-hide-m { display: none !important; }
  .lx-bar-l [data-m-only] { display: inline-flex; }
  body.lx .catnav.lx-menu { display: none; }
  .lx-search { padding: 14px 12px 18px; }
  /* circular category bubbles under the header (home) */
  .lx-bubbles { display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; padding: 14px 12px 12px; background: #fff; border-bottom: 1px solid #f0f0f0; }
  .lx-bubbles::-webkit-scrollbar { display: none; }
  .lx-bubbles a { flex: 0 0 auto; width: 66px; display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 10.5px; text-transform: uppercase; letter-spacing: .2px; color: #212121; text-align: center; line-height: 1.2; }
  .lx-bubbles .bb { width: 62px; height: 62px; border-radius: 50%; overflow: hidden; background: #f3ece6; border: 1px solid #ececec; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 22px; color: #6b5a50; }
  .lx-bubbles .bb img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
  .lx-bubbles a.hot .bb { background: #fff; color: var(--pink); font-style: italic; }

  body.lx section.block { padding: 14px 0; }
  body.lx .section-head { margin-bottom: 12px; }
  body.lx .section-head h2 { font-size: 17px; letter-spacing: .4px; }
  body.lx .section-head a.more { font-size: 12px; }
  .lx-rail { --gap: 10px; }
  .lx-rail-btn { display: none; }
  .lx-prods { --per: 2.15; }
  .lx-cats { --per: 2.3; }
  .lx-cats.tiles-small { --per: 3.2; }
  .lx-designers { --per: 1.7; }
  .lx-cat-name { font-size: 20px; }
  body.lx .hero-carousel { padding: 0; margin-top: 0; }
  body.lx .hero-slide { aspect-ratio: 4 / 5; }
  body.lx .hero-slide.has-img .hs-text { left: 0; top: auto; padding: 24px 20px 30px !important; justify-content: flex-end; }
  body.lx .hero-slide.has-img::before { background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%); }
  body.lx .hero-slide .hs-img { display: block; height: 100%; min-height: 0; order: 0; }
  body.lx .hero-dots { margin-top: 8px; }
  body.lx .offer-strip { grid-template-columns: 1fr; }
  body.lx .offer-card.has-img { aspect-ratio: 4 / 3; }
  body.lx .offer-card { min-height: 168px; padding: 20px 18px 22px; }
  body.lx .trust-strip { grid-template-columns: 1fr; padding: 8px 0; }
  body.lx .trust-item { padding: 16px 10px; }
  body.lx .trust-item + .trust-item { border-left: none; border-top: 1px solid #ececec; }
  .lx-blog { grid-template-columns: 1fr; gap: 18px; }
  .lx-post { grid-template-columns: 120px 1fr; gap: 14px; }
  .lx-blog-more .btn { min-width: 0; width: 100%; }
  body.lx .product-card .brand { font-size: 12px; }
  body.lx .product-card .pname { font-size: 12px; }
  body.lx .grid { gap: 22px 10px; }
  .lx-card-x { display: none; }

  /* homepage sections */
  .lx-thin { aspect-ratio: auto; min-height: 120px; justify-content: center; }
  .lx-thin-text { width: 100%; padding: 18px 16px; }
  .lx-thin:not(.has-img)::before { width: 100%; opacity: .6; }
  .lx-chipbar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-right: calc(var(--gut) * -1); padding-right: var(--gut); }
  .lx-chipbar::-webkit-scrollbar { display: none; }
  .lx-fchip, .lx-rts { flex: 0 0 auto; }
  body.lx .occ-grid .occ-card { grid-column: auto !important; aspect-ratio: 2 / 3 !important; }
  .lx-ed-feature { grid-template-columns: 1fr 1fr; gap: 10px; }
  .lx-ed-feature .lx-et { aspect-ratio: 3 / 4; }
  .lx-ed-feature .lx-et:first-child { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
  .lx-ed-feature .lx-et:not(:first-child) .lx-et-body { padding: 0 8px 14px; }
  .lx-ed-feature .lx-et:not(:first-child) .t { font-size: 19px; }
  .lx-ed-feature .lx-et:not(:first-child) .s { font-size: 9.5px; letter-spacing: .8px; margin-bottom: 6px; }
  .lx-ed-feature .lx-et:not(:first-child) .lx-btn-line { padding: 5px 10px; font-size: 10px; }
  .lx-ed-squares { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 10px; }
  .lx-ed-squares::-webkit-scrollbar { display: none; }
  .lx-ed-squares .lx-et { scroll-snap-align: start; }
  .lx-portraits { --per: 2.2; }
  .lx-band { padding: 34px 0; }
  .lx-band-in { grid-template-columns: 1fr; gap: 24px; }
  .lx-band-rail { --per: 2.15; }
  .lx-split { grid-template-columns: 1fr; row-gap: 28px; }
  .lx-split-cap { left: 16px; right: 16px; bottom: 16px; }
  body.lx section.block.lx-journal { margin-top: 10px; padding: 24px 0 30px; }

  /* listing: filters become a slide-in sheet, sort/filter bar pinned above the app nav */
  .lx-plp { padding-top: 6px; }
  .lx-plp-grid { grid-template-columns: 1fr; gap: 0; }
  .lx-filters { position: fixed; inset: 0 auto 0 0; top: 0; width: 86vw; max-width: 340px; max-height: none; height: 100dvh; background: #fff; z-index: 210; padding: 0 18px 90px; transform: translateX(-102%); transition: transform .3s ease; box-shadow: 4px 0 24px rgba(0,0,0,.15); }
  .lx-filters.open { transform: none; }
  .lx-f-top { display: flex; position: sticky; top: 0; background: #fff; z-index: 2; align-items: center; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid #212121; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; }
  .lx-f-top button { background: none; border: none; cursor: pointer; padding: 4px; line-height: 0; color: #212121; }
  .lx-f-overlay { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 205; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
  .lx-f-overlay.open { opacity: 1; visibility: visible; }
  .lx-flist { max-height: none; }
  .lx-plp-top { border-bottom-color: #e3e3e3; }
  .lx-plp-top .lx-sort { display: none; }
  .lx-plp .grid.cols-4 { grid-template-columns: repeat(2, 1fr); gap: 24px 10px; }
  .lx-mbar { display: grid; grid-template-columns: 1fr 1fr; position: fixed; left: 0; right: 0; bottom: calc(62px + env(safe-area-inset-bottom)); z-index: 110; background: #fff; border-top: 1px solid #e3e3e3; box-shadow: 0 -4px 14px rgba(0,0,0,.05); }
  .lx-mbar > * { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; font-size: 12.5px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; background: none; border: none; color: #212121; position: relative; font-family: inherit; }
  .lx-mbar > * + * { border-left: 1px solid #e3e3e3; }
  .lx-mbar select { position: absolute; inset: 0; opacity: 0; width: 100%; font-size: 16px; }
  .lx-mbar svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.6; }

  /* product page */
  .lx-pdp .pdp-grid { grid-template-columns: 1fr; gap: 22px; }
  .lx-pdp .pdp-gallery { grid-template-columns: 1fr; position: static; margin: 0 calc(var(--gut) * -1); }
  .lx-pdp .pdp-thumbs { flex-direction: row; order: 2; height: auto; min-height: 0; max-height: none; overflow-x: auto; padding: 0 var(--gut); gap: 8px; }
  .lx-pdp .pdp-gallery.solo .pdp-thumbs { display: none; }
  .lx-pdp .pdp-thumbs img { width: 52px; height: 78px; }
  .lx-pdp .pdp-main { order: 1; }
  .pdp-designer { font-size: 18px; }
  .lx-pdp .buy-row { gap: 10px; position: sticky; bottom: calc(62px + env(safe-area-inset-bottom)); background: #fff; padding: 10px 0; z-index: 20; margin: 18px 0 0; }
  .pdp-kv { grid-template-columns: 1fr 1fr; }
  .pdp-desc-grid { grid-template-columns: 1fr; gap: 12px; }
  .pdp-perks { grid-template-columns: 1fr 1fr; }
  .pdp-perks .help { grid-column: 1 / -1; grid-row: auto; border-left: none; border-top: 1px solid #ddd; padding: 14px 0 0; max-width: none; }

  /* footer */
  body.lx footer.site.lx-foot { padding-top: 30px; margin-top: 30px; }
  .lx-foot-cols { grid-template-columns: 1fr 1fr; gap: 22px 16px; }
  .lx-foot-app { grid-column: 1 / -1; }
  .lx-foot-trust div { padding: 16px 6px; font-size: 10px; }
  .lx-foot-band { grid-template-columns: 1fr; gap: 22px; }
  body.lx footer .fine { flex-direction: column; text-align: center; }

  /* app nav */
  body.lx .bottom-nav { background: #fff; box-shadow: 0 -2px 12px rgba(0,0,0,.06); border-top-color: #eee; }
  body.lx .bottom-nav a { color: #424242; font-weight: 500; }
}
@media (max-width: 480px) {
  .lx-prods { --per: 2.1; }
  .lx-post { grid-template-columns: 104px 1fr; }
  .lx-foot-trust { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .lx-cat img, .lx-dcard > img, body.lx .product-card .imgwrap img, body.lx .occ-card .occ-img { transition: none; }
}

/* Page heads that still carry inline white text from the old dark banners: on the
   luxe white head that text would vanish, so force the dark palette — unless the
   page also set its own background inline (then its white text is still legible). */
body.lx .page-head:not([style*="background"]) h1 { color: #212121 !important; }
body.lx .page-head:not([style*="background"]) p { color: #757575 !important; }
body.lx .page-head:not([style*="background"]) .eyebrow, body.lx .page-head:not([style*="background"]) a { color: #9e9e9e !important; }
