/*
 * Motion — the design layer.
 *
 * Motion is a dark, animated skin over Niara's markup. Niara's templates and
 * every module's HTML are left intact (the cart, checkout, account pages and
 * the AI modules all hook into them), and this file restyles them.
 *
 * Load order: css/autoload/ loads after global.css and zz-brand.css, but a
 * module's own stylesheet (blockcart.css, blocklayered.css, ...) loads AFTER
 * this file. Every rule is therefore scoped under `body.mo` (the body class
 * header.tpl adds), which outscores those module rules on specificity
 * instead of on order. `!important` only where a module sets inline styles.
 */

:root {
  --mo-bg: #070b16;
  --mo-deep: #0c1224;
  --mo-surface: #111a31;
  --mo-raise: #16213d;
  --mo-ink: #f3efe6;
  --mo-muted: #9aa3b8;
  --mo-line: rgba(243, 239, 230, .12);
  --mo-line-2: rgba(243, 239, 230, .2);
  --mo-amber: #f2a54a;
  --mo-ember: #ff6b3d;
  --mo-hot: linear-gradient(95deg, var(--mo-ember), var(--mo-amber));
  --mo-accent-ink: #120b04;
  --mo-ok: #5fe0a2;
  --mo-warn: #ffb35c;
  --mo-bad: #ff7a70;
  --mo-glow: radial-gradient(circle at 50% 55%, #15204a 0%, #0d1530 50%, var(--mo-deep) 80%);
  --mo-radius: 22px;
  --mo-radius-sm: 14px;

  --mo-ease: cubic-bezier(.16, 1, .3, 1);
  --mo-font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mo-display: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
  --mo-max: 1320px;
  --mo-gutter: clamp(16px, 3vw, 32px);
  --mo-hdr-h: 72px;
}

/* ------------------------------------------------------------------ */
/* Base                                                                */
/* ------------------------------------------------------------------ */

/* Bootstrap 3 sets html to 10px; Motion (and the gwc modules) size in rem against 16. */
html { font-size: 16px; background: var(--mo-bg); scroll-behavior: auto !important; color-scheme: dark; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
body.mo { background: var(--mo-bg); color: var(--mo-ink); font: 400 16px/1.6 var(--mo-font); -webkit-font-smoothing: antialiased; overflow-x: clip; }
body.mo ::selection { background: var(--mo-amber); color: var(--mo-accent-ink); }
body.mo a { color: var(--mo-ink); transition: color .2s; }
body.mo a:hover, body.mo a:focus { color: var(--mo-amber); text-decoration: none; }
body.mo :focus-visible { outline: 2px solid var(--mo-amber); outline-offset: 3px; }
body.mo h1, body.mo h2, body.mo h3, body.mo h4, body.mo h5, body.mo .h1, body.mo .h2, body.mo .h3, body.mo .h4 { color: var(--mo-ink); text-wrap: balance; }
body.mo .mo-disp, body.mo h1, body.mo .page-heading, body.mo .page-subheading, body.mo .title_block, body.mo .page-product-heading, body.mo .footer-title {
  font-family: var(--mo-display); font-weight: 800; text-transform: uppercase; letter-spacing: .01em; line-height: .95;
}
body.mo p { color: #cfd3de; }
body.mo small, body.mo .text-muted, body.mo .help-block { color: var(--mo-muted); }
body.mo hr { border-color: var(--mo-line); }
body.mo .hot-t { background: var(--mo-hot); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.mo img { max-width: 100%; }

/* Page frame: the header floats, so content starts below it. */
body.mo #columns { padding-top: calc(var(--mo-hdr-h) + 40px); padding-bottom: 72px; }
body.mo.index #columns { padding-top: 0; }
body.mo .container { max-width: calc(var(--mo-max) + var(--mo-gutter) * 2); width: auto; padding-left: var(--mo-gutter); padding-right: var(--mo-gutter); }
body.mo #columns > .row { margin-left: 0; margin-right: 0; }
body.mo #center_column { padding-left: 0; padding-right: 0; }
body.mo .top_column_wrapper { background: none; padding: 0; }
body.mo #top_column { max-width: none; padding: calc(var(--mo-hdr-h) + 26px) 12px 0; }
body.mo #top_column > .row { margin: 0; }

/* Breadcrumb: small caps trail, no box. */
body.mo .breadcrumb { background: none; padding: 0; margin: 0 0 22px; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mo-muted); }
body.mo .breadcrumb a { color: var(--mo-muted); }
body.mo .breadcrumb a:hover { color: var(--mo-amber); }
body.mo .breadcrumb > li + li:before, body.mo .breadcrumb .navigation-pipe { color: var(--mo-line-2); }

body.mo .page-heading { font-size: clamp(2.4rem, 5.5vw, 4.6rem); margin: 0 0 24px; padding: 0; border: 0; color: var(--mo-ink); }
body.mo .page-heading .heading-counter, body.mo .heading-counter { font: 600 .9rem var(--mo-font); text-transform: none; color: var(--mo-muted); letter-spacing: 0; }
body.mo .page-subheading { font-size: 1.6rem; border: 0; padding: 0; margin: 0 0 16px; }
body.mo .title_block { font-size: 1.4rem; color: var(--mo-ink); background: none; border: 0; padding: 0; margin: 0 0 14px; }

/* ------------------------------------------------------------------ */
/* Controls                                                            */
/* ------------------------------------------------------------------ */

body.mo .btn { border-radius: 999px; font: 700 .92rem/1 var(--mo-font); letter-spacing: .01em; padding: 13px 22px; border: 1px solid transparent; transition: transform .35s var(--mo-ease), background .25s, border-color .25s, color .25s, box-shadow .25s; text-shadow: none; box-shadow: none; }
body.mo .btn:active { transform: scale(.97); }
body.mo .btn-lg { padding: 16px 28px; font-size: 1rem; }
body.mo .btn-xs, body.mo .btn-sm { padding: 7px 14px; font-size: .8rem; }
body.mo .btn-primary, body.mo .btn-success, body.mo .btn-add-to-cart, body.mo #add_to_cart button, body.mo .button.ajax_add_to_cart_button {
  background: var(--mo-hot); color: var(--mo-accent-ink) !important; border-color: transparent;
}
body.mo .btn-primary:hover, body.mo .btn-success:hover, body.mo .btn-primary:focus, body.mo .btn-success:focus, body.mo .btn-add-to-cart:hover {
  background: var(--mo-hot); color: var(--mo-accent-ink) !important; box-shadow: 0 10px 30px -10px rgba(255, 107, 61, .7); filter: saturate(1.1) brightness(1.05);
}
body.mo .btn-primary.disabled, body.mo .btn-primary[disabled] { opacity: .45; box-shadow: none; }
body.mo .btn-default, body.mo .btn-link.btn-default { background: transparent; color: var(--mo-ink); border-color: var(--mo-line-2); }
body.mo .btn-default:hover, body.mo .btn-default:focus { background: rgba(243, 239, 230, .08); color: var(--mo-ink); border-color: var(--mo-ink); }
body.mo .btn-link { color: var(--mo-amber); }
body.mo .btn .icon, body.mo .btn i { margin-right: 6px; }

body.mo .form-control, body.mo input[type="text"], body.mo input[type="email"], body.mo input[type="password"], body.mo input[type="search"], body.mo input[type="tel"], body.mo input[type="number"], body.mo select, body.mo textarea {
  background-color: var(--mo-surface); color: var(--mo-ink); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); box-shadow: none; min-height: 46px; font: 500 .95rem var(--mo-font);
}
body.mo textarea.form-control { min-height: 110px; }
body.mo .form-control:focus, body.mo input:focus, body.mo select:focus, body.mo textarea:focus { border-color: var(--mo-amber); box-shadow: 0 0 0 3px rgba(242, 165, 74, .2); outline: 0; }
body.mo .form-control::placeholder, body.mo input::placeholder, body.mo textarea::placeholder { color: var(--mo-muted); }
body.mo select.form-control, body.mo select { appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23f2a54a' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
body.mo label, body.mo .control-label { color: var(--mo-ink); font-weight: 600; }
body.mo .required sup, body.mo sup { color: var(--mo-amber); }
body.mo .input-group-btn .btn, body.mo .input-group-addon { border-radius: 0 var(--mo-radius-sm) var(--mo-radius-sm) 0; }
body.mo .input-group-addon { background: var(--mo-raise); border-color: var(--mo-line-2); color: var(--mo-ink); }
body.mo .checkbox label, body.mo .radio label { font-weight: 500; }
body.mo input[type="checkbox"], body.mo input[type="radio"] { accent-color: var(--mo-amber); }
body.mo .form-group.form-error .form-control { border-color: var(--mo-bad); }
body.mo .form-group.form-ok .form-control { border-color: var(--mo-ok); }

body.mo .alert { border-radius: var(--mo-radius-sm); border: 1px solid var(--mo-line-2); background: var(--mo-surface); color: var(--mo-ink); padding: 14px 18px; }
body.mo .alert-success { border-color: rgba(95, 224, 162, .45); background: rgba(95, 224, 162, .08); }
body.mo .alert-warning { border-color: rgba(255, 179, 92, .45); background: rgba(255, 179, 92, .08); }
body.mo .alert-danger { border-color: rgba(255, 122, 112, .5); background: rgba(255, 122, 112, .08); }
body.mo .alert-info { border-color: rgba(88, 118, 214, .5); background: rgba(88, 118, 214, .12); }
body.mo .alert a { color: var(--mo-amber); }

body.mo .label { border-radius: 999px; font: 700 .7rem/1 var(--mo-font); letter-spacing: .06em; text-transform: uppercase; padding: 6px 10px; }
body.mo .label-success { background: rgba(95, 224, 162, .16); color: var(--mo-ok); }
body.mo .label-warning { background: rgba(255, 179, 92, .16); color: var(--mo-warn); }
body.mo .label-danger { background: rgba(255, 122, 112, .16); color: var(--mo-bad); }
body.mo .badge { background: var(--mo-raise); color: var(--mo-ink); }

body.mo .box, body.mo .panel, body.mo .well, body.mo .block, body.mo .table-responsive, body.mo .address, body.mo .order_carrier_content, body.mo .page-product-box {
  background: var(--mo-deep); border: 1px solid var(--mo-line); border-radius: var(--mo-radius); color: var(--mo-ink); box-shadow: none;
}
body.mo .box, body.mo .panel { padding: 24px; }
body.mo .panel-heading, body.mo .panel-footer { background: transparent; border-color: var(--mo-line); color: var(--mo-ink); }

body.mo .table, body.mo table.std { color: var(--mo-ink); background: transparent; border-color: var(--mo-line); }
body.mo .table > thead > tr > th, body.mo .table > tbody > tr > td, body.mo .table > tfoot > tr > td, body.mo .table > tbody > tr > th, body.mo .table > tfoot > tr > th {
  border-color: var(--mo-line); background: transparent; vertical-align: middle; padding: 14px 12px;
}
body.mo .table > thead > tr > th { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mo-muted); background: var(--mo-surface); }
body.mo .table-bordered { border-color: var(--mo-line); }
body.mo .table-hover > tbody > tr:hover > td, body.mo .table-striped > tbody > tr:nth-of-type(odd) > td { background: rgba(243, 239, 230, .03); }
body.mo .table-responsive { padding: 0; overflow-x: auto; }

body.mo .pagination > li > a, body.mo .pagination > li > span { background: transparent; border: 1px solid var(--mo-line-2); color: var(--mo-ink); margin: 0 3px; border-radius: 999px !important; min-width: 40px; text-align: center; }
body.mo .pagination > .active > a, body.mo .pagination > .active > span, body.mo .pagination > li > a:hover { background: var(--mo-hot); border-color: transparent; color: var(--mo-accent-ink); }
body.mo .pagination > .disabled > span { color: var(--mo-muted); background: transparent; }

body.mo .dropdown-menu { background: var(--mo-surface); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .8); padding: 6px; }
body.mo .dropdown-menu > li > a { color: var(--mo-ink); border-radius: 10px; padding: 8px 12px; }
body.mo .dropdown-menu > li > a:hover, body.mo .dropdown-menu > .active > a { background: var(--mo-raise); color: var(--mo-amber); }

body.mo .nav-tabs { border-color: var(--mo-line); }
body.mo .nav-tabs > li > a { color: var(--mo-muted); border: 0; border-bottom: 2px solid transparent; background: none; border-radius: 0; font-weight: 700; }
body.mo .nav-tabs > li.active > a, body.mo .nav-tabs > li > a:hover { color: var(--mo-ink); border-bottom-color: var(--mo-amber); background: none; }

/* Fancybox / quick view / modals */
body.mo .fancybox-skin { background: var(--mo-deep) !important; color: var(--mo-ink); border-radius: var(--mo-radius) !important; }
body.mo .fancybox-overlay { background: rgba(4, 6, 14, .82); }
body.mo .modal-content { background: var(--mo-deep); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius); }

/* Product labels */
body.mo .product-label { border-radius: 999px; font: 700 .7rem/1 var(--mo-font); letter-spacing: .06em; text-transform: uppercase; padding: 6px 10px; background: var(--mo-bg); color: var(--mo-ink); border: 0; }
body.mo .product-label-new { background: var(--mo-hot); color: var(--mo-accent-ink); }
body.mo .product-label-sale, body.mo .product-label-discount, body.mo .price-percent-reduction { background: var(--mo-ember); color: #fff; border-radius: 999px; }
body.mo .price, body.mo .product-price, body.mo .our_price_display { color: var(--mo-amber); font-weight: 800; font-variant-numeric: tabular-nums; }
body.mo .old-price, body.mo #old_price { color: var(--mo-muted); text-decoration: line-through; }

/* ------------------------------------------------------------------ */
/* Header                                                              */
/* ------------------------------------------------------------------ */

body.mo #header { position: fixed; z-index: 1000; left: 0; right: 0; top: 0; padding: calc(env(safe-area-inset-top, 0px) + 12px) var(--mo-gutter) 0; background: none; transition: transform .5s var(--mo-ease); pointer-events: none; }
body.mo #header.is-hidden { transform: translateY(calc(-100% - 30px)); }
body.mo #header-banners { pointer-events: auto; margin: 0 auto 8px; max-width: var(--mo-max); border-radius: var(--mo-radius-sm); overflow: hidden; }
body.mo .mo-bar { pointer-events: auto; position: relative; max-width: var(--mo-max); margin: 0 auto; height: var(--mo-hdr-h); display: flex; align-items: center; gap: 18px; padding: 0 12px 0 22px;
  border-radius: 999px; background: rgba(12, 18, 36, .72); border: 1px solid var(--mo-line); backdrop-filter: blur(18px) saturate(1.3); -webkit-backdrop-filter: blur(18px) saturate(1.3);
  box-shadow: 0 20px 50px -30px rgba(0, 0, 0, .9); }
body.mo .mo-bar::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: linear-gradient(95deg, rgba(255, 107, 61, .6), transparent 30%, transparent 70%, rgba(242, 165, 74, .4)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
body.mo .mo-logo { flex: none; display: block; line-height: 0; }
body.mo .mo-logo img { height: 42px; width: auto; }

/* The displayTop modules sit directly in the bar and are ordered here. */
body.mo .mo-top { display: contents; }
body.mo .mo-top > nav { order: 1; flex: 1; min-width: 0; }
body.mo .mo-top > div.col-sm-4, body.mo .mo-top > .col-sm-4.col-md-3 { order: 3; width: auto; float: none; padding: 0; }
body.mo .mo-tools { order: 2; display: flex; align-items: center; gap: 6px; margin-left: auto; }
body.mo .mo-top > .col-sm-4 { order: 3; }

body.mo #block_top_menu { float: none; width: auto; padding: 0; margin: 0; background: none; }
body.mo #block_top_menu .cat-title { display: none; }
body.mo #block_top_menu .sf-menu { display: flex; justify-content: center; gap: 2px; margin: 0; padding: 0; border: 0; background: none; float: none; width: auto; }
body.mo #block_top_menu .sf-menu > li { float: none; border: 0; }
body.mo #block_top_menu .sf-menu > li > a { display: block; padding: 10px 14px; border: 0; border-radius: 999px; font: 700 .92rem var(--mo-font); letter-spacing: 0; text-transform: none; color: var(--mo-ink); background: none; }
body.mo #block_top_menu .sf-menu > li > a:hover, body.mo #block_top_menu .sf-menu > li.sfHover > a, body.mo #block_top_menu .sf-menu > li.sfHoverForce > a { background: rgba(243, 239, 230, .08); color: var(--mo-amber); }
body.mo #block_top_menu .sf-menu ul, body.mo #block_top_menu .submenu-container { background: var(--mo-surface); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .8); }
body.mo #block_top_menu .sf-menu ul a { color: var(--mo-ink); }

body.mo .mo-icon { position: relative; width: 46px; height: 46px; display: inline-grid; place-items: center; border-radius: 50%; border: 1px solid var(--mo-line); background: rgba(243, 239, 230, .04); color: var(--mo-ink); font-size: 16px; padding: 0; transition: background .2s, border-color .2s, transform .35s var(--mo-ease); }
body.mo .mo-icon:hover { background: rgba(243, 239, 230, .1); border-color: var(--mo-line-2); color: var(--mo-amber); }
body.mo .mo-icon .icon { margin: 0; }
body.mo .mo-burger { display: none; }
body.mo .mo-burger span { position: absolute; left: 14px; right: 14px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .35s var(--mo-ease), top .35s var(--mo-ease); }
body.mo .mo-burger span:first-child { top: 18px; }
body.mo .mo-burger span:last-child { top: 26px; }
html.mo-menu-open body.mo .mo-burger span:first-child { top: 22px; transform: rotate(45deg); }
html.mo-menu-open body.mo .mo-burger span:last-child { top: 22px; transform: rotate(-45deg); }

/* Account and language menu */
body.mo .mo-util { position: relative; }
body.mo .mo-util-menu { position: absolute; right: 0; top: calc(100% + 12px); min-width: 230px; margin: 0; padding: 8px; list-style: none; background: var(--mo-surface); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .8);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s, transform .3s var(--mo-ease), visibility .2s; }
body.mo .mo-util.is-open .mo-util-menu { opacity: 1; visibility: visible; transform: none; }
body.mo .mo-util-menu > li { float: none; display: block; }
body.mo .mo-util-menu > li > a { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border-radius: 10px; color: var(--mo-ink); font-weight: 600; background: none; }
body.mo .mo-util-menu > li > a:hover, body.mo .mo-util-menu > li > a:focus { background: var(--mo-raise); color: var(--mo-amber); }
body.mo .mo-util-menu .dropdown-menu { position: static; float: none; display: none; box-shadow: none; border: 0; background: var(--mo-deep); margin: 4px 0; }
body.mo .mo-util-menu .open > .dropdown-menu { display: block; }
body.mo .mo-util-menu .caret { border-top-color: var(--mo-amber); }

/* Language switcher, lifted out of the account menu into the bar */
body.mo .mo-lang { position: relative; margin: 0; padding: 0; list-style: none; }
body.mo .mo-lang > li { float: none; position: relative; }
body.mo .mo-lang > li > a { display: inline-flex; align-items: center; gap: 6px; height: 46px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--mo-line); background: rgba(243, 239, 230, .04); color: var(--mo-ink); font-weight: 800; font-size: .85rem; letter-spacing: .04em; }
body.mo .mo-lang > li > a:hover, body.mo .mo-lang > li.open > a { background: rgba(243, 239, 230, .1); color: var(--mo-amber); }
body.mo .mo-lang > li > a .icon { margin: 0; }
body.mo .mo-lang .dropdown-menu { left: auto; right: 0; top: calc(100% + 12px); min-width: 190px; }

/* Phone copy of the language/currency choices, at the foot of the menu panel */
body.mo .mo-mnav-extra { display: none; }

/* Search: an overlay panel under the bar. */
body.mo #search_block_top { position: absolute; left: 0; right: 0; top: calc(100% + 12px); width: auto; float: none; padding: 14px; margin: 0; border-radius: var(--mo-radius); background: rgba(12, 18, 36, .94); border: 1px solid var(--mo-line-2); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .95);
  opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .25s, transform .4s var(--mo-ease), visibility .25s; }
html.mo-search-open body.mo #search_block_top { opacity: 1; visibility: visible; transform: none; }
/* One pill: the input and the button share a frame. The search module's
   own CSS uses #id selectors, so these carry two ids to outrank it. */
body.mo #search_block_top #searchbox .input-group { display: flex; align-items: stretch; width: 100%; height: 58px; border: 1px solid var(--mo-line-2); border-radius: 999px; background: var(--mo-surface); overflow: hidden; transition: border-color .2s, box-shadow .2s; }
body.mo #search_block_top #searchbox .input-group:focus-within { border-color: var(--mo-amber); box-shadow: 0 0 0 3px rgba(242, 165, 74, .2); }
body.mo #search_block_top #search_query_top { flex: 1; min-width: 0; width: auto; float: none; height: 100%; min-height: 0; margin: 0; padding: 0 22px; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--mo-ink); font-size: 1.1rem; }
body.mo #search_block_top #search_query_top:focus { box-shadow: none; outline: 0; }
body.mo #search_block_top #searchbox .input-group-btn { display: flex; width: auto; padding: 5px; }
body.mo #search_block_top #searchbox .input-group-btn .btn { display: grid; place-items: center; width: auto; height: 100%; aspect-ratio: 1; min-height: 0; padding: 0; margin: 0; border: 0; border-radius: 50%; background: var(--mo-hot); color: var(--mo-accent-ink); font-size: 17px; }
body.mo #search_block_top #searchbox .input-group-btn .btn:hover { box-shadow: 0 8px 24px -8px rgba(255, 107, 61, .8); }
body.mo #search_block_top #searchbox .input-group-btn .btn .icon { margin: 0; color: inherit; }
/* Search suggestions (jQuery autocomplete positions the box inline under the input). */
body.mo .ac_results { margin-top: 14px; padding: 8px; background: var(--mo-surface); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .9); color: var(--mo-ink); z-index: 1100 !important; overflow: hidden; }
body.mo .ac_results ul { margin: 0; padding: 0; max-height: 60vh; overflow-y: auto; }
body.mo .ac_results li { margin: 0; padding: 12px 14px; border: 0; border-radius: 10px; background: none; color: var(--mo-ink); font: 600 .98rem/1.3 var(--mo-font); cursor: pointer; }
body.mo .ac_results li strong { color: var(--mo-amber); font-weight: 800; }
body.mo .ac_results .ac_over, body.mo .ac_results li:hover { background: var(--mo-raise); color: var(--mo-amber); }

/* Cart pill */
body.mo #blockcart { position: relative; float: none; width: auto; margin: 0; padding: 0; }
body.mo #blockcart-header { display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 16px 0 14px; border-radius: 999px; background: var(--mo-hot); color: var(--mo-accent-ink); font-weight: 800; border: 0; }
body.mo #blockcart-header:hover { color: var(--mo-accent-ink); box-shadow: 0 10px 30px -10px rgba(255, 107, 61, .8); }
body.mo #blockcart-header b { font-weight: 800; }
body.mo #blockcart-header b::before { font-family: FontAwesome; content: "\f291"; margin-right: 8px; font-weight: 400; }
body.mo #blockcart-header .ajax_cart_quantity { position: static; transform: none; margin: 0; display: inline-grid !important; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--mo-bg); color: var(--mo-ink); font-size: .75rem; }
body.mo #blockcart-header .ajax_cart_product_txt, body.mo #blockcart-header .ajax_cart_product_txt_s, body.mo #blockcart-header .ajax_cart_total, body.mo #blockcart-header .ajax_cart_no_product { display: none !important; }
body.mo #blockcart-header:before, body.mo #blockcart-header:after { display: none; }
body.mo .cart_block, body.mo #blockcart-dropdown { position: absolute; right: 0; top: calc(100% + 12px); width: 360px; max-width: calc(100vw - 32px); background: var(--mo-surface); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius); box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .95); color: var(--mo-ink); padding: 14px; z-index: 5; }
body.mo .cart_block .cart_block_list, body.mo .cart_block dl, body.mo .cart_block dt, body.mo .cart_block dd { background: none; border-color: var(--mo-line); color: var(--mo-ink); }
body.mo .cart_block .cart-images img { border-radius: 10px; background: var(--mo-glow); object-fit: contain; }
body.mo img.mo-cut { object-fit: contain; }
body.mo .cart_block .cart-prices { border-color: var(--mo-line); background: none; }
body.mo .cart_block .cart-prices-line { border-color: var(--mo-line); }
body.mo .cart_block .price { color: var(--mo-amber); }
body.mo .cart_block .cart_block_product_name { color: var(--mo-ink); font-weight: 700; }

/* Cart drawer: blockcart's dropdown, moved into a panel on the right (motion.js). */
body.mo .mo-dr-ov { position: fixed; inset: 0; z-index: 1300; background: rgba(4, 6, 14, .6); backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
html.mo-cart-open body.mo .mo-dr-ov { opacity: 1; visibility: visible; }
body.mo .mo-drawer { position: fixed; z-index: 1310; top: 12px; right: 12px; bottom: 12px; width: min(440px, calc(100vw - 24px)); display: flex; flex-direction: column; border-radius: 26px; background: var(--mo-deep); border: 1px solid var(--mo-line-2); box-shadow: -30px 0 80px -30px rgba(0, 0, 0, .9); color: var(--mo-ink); overflow: hidden;
  transform: translateX(calc(100% + 24px)); visibility: hidden; transition: transform .55s var(--mo-ease), visibility .55s; }
html.mo-cart-open body.mo .mo-drawer { transform: none; visibility: visible; }
html.mo-cart-open, html.mo-cart-open body { overflow: hidden; }
body.mo .mo-dr-hd { display: flex; align-items: center; gap: 10px; padding: 18px 18px 14px 22px; border-bottom: 1px solid var(--mo-line); }
body.mo .mo-dr-hd strong { font-size: 2rem; }
body.mo .mo-dr-n { color: var(--mo-muted); font-weight: 700; margin-right: auto; }
body.mo .mo-dr-free { padding: 14px 22px; border-bottom: 1px solid var(--mo-line); }
body.mo .mo-dr-free p { margin: 0 0 8px; font-size: .88rem; color: var(--mo-ink); }
body.mo .mo-dr-free i { display: block; height: 6px; border-radius: 6px; background: rgba(243, 239, 230, .1); overflow: hidden; }
body.mo .mo-dr-free b { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--mo-hot); transition: width .6s var(--mo-ease); }
body.mo .mo-dr-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
body.mo .mo-dr-empty { flex: 1; display: grid; place-items: center; margin: 0; padding: 40px 22px; color: var(--mo-muted); text-align: center; }
body.mo .mo-dr-empty[hidden], body.mo .mo-dr-body[hidden] { display: none; }
body.mo .mo-drawer #blockcart-dropdown { position: static; display: flex !important; flex-direction: column; min-height: 100%; width: auto; max-width: none; height: auto !important; padding: 0 !important; margin: 0 !important; overflow: visible !important; border: 0; border-radius: 0; box-shadow: none; background: none; }
body.mo .mo-drawer .cart_block_list { display: flex; flex-direction: column; flex: 1; }
body.mo .mo-drawer dl.products { margin: 0; padding: 6px 22px; flex: 1; }
body.mo .mo-drawer dl.products > dt { position: relative; display: grid; grid-template-columns: 84px 1fr auto; gap: 14px; align-items: start; padding: 14px 0; margin: 0; border-bottom: 1px solid var(--mo-line); background: none; }
body.mo .mo-drawer dl.products > dt.unvisible { display: grid !important; }
/* Bootstrap's .clearfix pseudo-elements would become grid cells. */
body.mo .mo-drawer dl.products > dt::before, body.mo .mo-drawer dl.products > dt::after, body.mo .mo-drawer .cart-info::before, body.mo .mo-drawer .cart-info::after { display: none; content: none; }
body.mo .mo-drawer dl.products > dt > .cart-images { grid-column: 1; }
body.mo .mo-drawer dl.products > dt > .cart-info { grid-column: 2; }
body.mo .mo-drawer dl.products > dt > .cart_block_remove_link { grid-column: 3; top: auto; margin: 0; align-self: center; }
body.mo .mo-drawer dl.products > dd { margin: 0; }
body.mo .mo-drawer .cart-images { display: block; width: 84px; height: 84px; border-radius: 16px; overflow: hidden; background: #101a3c; float: none; margin: 0; }
body.mo .mo-drawer .cart-images picture { display: block; width: 100%; height: 100%; }
body.mo .mo-drawer .cart-images img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; background: none; }
body.mo .mo-drawer .cart-images img.mo-cut { object-fit: contain; padding: 8%; filter: drop-shadow(0 8px 8px rgba(0, 0, 0, .45)); }
body.mo .mo-drawer .cart-info { display: grid; gap: 4px; float: none; width: auto; min-width: 0; padding: 0; text-align: left; }
body.mo .mo-drawer .product-name { margin: 0; font: 700 1rem/1.3 var(--mo-font); }
body.mo .mo-drawer .product-name .quantity-formatted { display: none; }
body.mo .mo-drawer .cart_block_product_name { color: var(--mo-ink); }
body.mo .mo-drawer .product-attributes a { color: var(--mo-muted); font-size: .85rem; }
body.mo .mo-drawer .cart-info .price { position: static; color: var(--mo-amber); font-weight: 800; font-size: 1rem; }
body.mo .mo-drawer .cart_block_remove_link { position: static; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--mo-line); color: var(--mo-muted); }
body.mo .mo-drawer .cart_block_remove_link:hover { color: var(--mo-bad); border-color: var(--mo-bad); }
body.mo .mo-qty { display: inline-flex; align-items: center; justify-self: start; margin-top: 6px; border: 1px solid var(--mo-line-2); border-radius: 999px; overflow: hidden; }
body.mo .mo-qty button { width: 34px; height: 32px; border: 0; background: transparent; color: var(--mo-ink); font: 700 1rem var(--mo-font); }
body.mo .mo-qty button:hover { background: rgba(243, 239, 230, .08); color: var(--mo-amber); }
body.mo .mo-qty button:disabled { opacity: .4; }
body.mo .mo-qty span { min-width: 28px; text-align: center; font-weight: 800; font-variant-numeric: tabular-nums; }
body.mo .mo-dr-sum { border-top: 1px solid var(--mo-line); }
body.mo .mo-drawer.is-empty .mo-dr-sum { display: none; }
body.mo .mo-drawer .cart-prices { padding: 16px 22px 0; margin: 0; border: 0; background: none; }
html.mo-cart-open body.mo #gwcchat { visibility: hidden; }
body.mo .mo-drawer .cart-prices-line { display: flex; justify-content: space-between; padding: 4px 0; border: 0; color: var(--mo-muted); }
body.mo .mo-drawer .cart-prices-line.mo-sum-totalline { color: var(--mo-ink); font-size: 1.15rem; font-weight: 800; margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--mo-line); }
body.mo .mo-drawer .cart-prices-line .price { color: var(--mo-ink); font-weight: 700; }
body.mo .mo-drawer .cart-prices-line.mo-sum-totalline .price { color: var(--mo-amber); font-weight: 800; }
body.mo .mo-drawer .cart-buttons { padding: 14px 22px 0; margin: 0; background: none; }
body.mo .mo-drawer #button_order_cart { display: flex; justify-content: center; align-items: center; gap: 8px; width: 100%; min-height: 54px; font-size: 1.02rem; }
body.mo .mo-drawer .cart_block_no_products { display: none !important; }
body.mo .mo-dr-ft { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px 22px 20px; }
body.mo .mo-drawer.is-empty .mo-dr-ft { grid-template-columns: 1fr; }
body.mo .mo-drawer.is-empty .mo-dr-view { display: none; }
body.mo .mo-dr-ft .btn { justify-content: center; display: flex; }

/* "Added to cart" layer */
body.mo #layer_cart { background: var(--mo-deep); border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius); color: var(--mo-ink); box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .95); overflow: hidden; }
body.mo #layer_cart .layer_cart_cart { background: var(--mo-surface); border-color: var(--mo-line); }
body.mo #layer_cart .cart-title { font: 800 1.4rem var(--mo-display); text-transform: uppercase; color: var(--mo-ok); }
body.mo #layer_cart .layer_cart_img { background: var(--mo-glow); border: 0; border-radius: var(--mo-radius-sm); }
body.mo #layer_cart .layer_cart_img { padding: 10px; }
body.mo #layer_cart .layer_cart_img img { mix-blend-mode: normal; }
body.mo #layer_cart .layer_cart_img img.mo-cut { filter: drop-shadow(0 14px 14px rgba(0, 0, 0, .5)); }
body.mo #layer_cart .cross { color: var(--mo-ink); opacity: .8; }
body.mo #layer_cart .pager a { border-radius: 999px; background: transparent; border: 1px solid var(--mo-line-2); color: var(--mo-ink); }
body.mo #layer_cart .pager .next a { background: var(--mo-hot); border-color: transparent; color: var(--mo-accent-ink); font-weight: 800; }
body.mo .layer_cart_overlay { background: rgba(4, 6, 14, .72); opacity: 1; }
body.mo #layer_cart .crossseling { background: var(--mo-deep); border-color: var(--mo-line); }

/* Hide Niara's old top navbar row; its content moved into the bar. */
body.mo #header > .navbar { display: none; }

/* ------------------------------------------------------------------ */
/* Home: hero                                                          */
/* ------------------------------------------------------------------ */

body.mo .mo-hero { position: relative; max-width: none; }
body.mo .mo-hero-grid { position: relative; height: min(86vh, 860px); min-height: 560px; }
body.mo .mo-slide { position: absolute; inset: 0; display: grid; grid-template-columns: 1.08fr 1fr; gap: 12px; visibility: hidden; }
body.mo .mo-slide.is-on { visibility: visible; z-index: 1; }
body.mo .mo-pane { position: relative; overflow: hidden; border-radius: 26px; background: var(--mo-deep); isolation: isolate; }
body.mo .mo-pane-a .mo-life { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
body.mo .mo-pane-a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(7, 11, 22, .88) 0%, rgba(7, 11, 22, .1) 45%, transparent 70%); z-index: 1; }
body.mo .mo-copy { position: absolute; z-index: 2; left: clamp(22px, 3.4vw, 48px); right: 22px; bottom: clamp(26px, 4vw, 52px); }
body.mo .mo-copy h1, body.mo .mo-copy h2 { margin: 0 0 12px; font-size: clamp(2.8rem, 5.6vw, 5.4rem); color: var(--mo-ink); }
body.mo .mo-copy .w { display: inline-block; overflow: hidden; vertical-align: top; padding-right: .18em; }
body.mo .mo-copy .w > span { display: inline-block; }
body.mo .mo-copy p { margin: 0; max-width: 40ch; color: #cfd3de; font-size: 1.05rem; }
body.mo .mo-pane-b { display: grid; place-items: center; overflow: visible; z-index: 2; background: var(--mo-glow); text-align: center; container-type: size; }
body.mo .mo-clip { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; z-index: 0; }
body.mo .mo-back { position: absolute; left: 50%; top: 50%; translate: -50% -50%; white-space: nowrap; font-size: clamp(5rem, 13vw, 12rem); color: rgba(88, 118, 214, .22); }
body.mo .mo-top-copy { position: absolute; top: clamp(22px, 3vw, 38px); left: 0; right: 0; z-index: 3; }
body.mo .mo-name { margin: 0 0 6px; font-size: clamp(2rem, 3.4vw, 3rem); }
body.mo .mo-tag { margin: 0; color: var(--mo-muted); font-size: .92rem; }
/* The product box: one centred square, 72% of the pane's shorter side, the same for every product
   (a wide pen, a tall candle and a mug read alike; see the master rule in zz-studio-grid.css). */
body.mo .mo-plate { position: relative; z-index: 1; width: calc(min(100cqw, 100cqh) * .72); aspect-ratio: 1; height: auto; translate: 0 2%; display: grid; place-items: center; pointer-events: none; }
/* No pool of light behind the product — it read as a glow, worst behind
   a small one like the pen. The contact shadow below does the grounding. */
body.mo .mo-plate::after { content: ""; position: absolute; z-index: -1; left: 24%; right: 24%; bottom: 3%; height: 7%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .75), transparent); filter: blur(6px); animation: mo-shadow 6s ease-in-out infinite; }
body.mo .mo-plate img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; max-width: none; filter: drop-shadow(0 34px 34px rgba(0, 0, 0, .5)); animation: mo-float 6s ease-in-out infinite; transform-origin: 50% 80%; }
body.mo .mo-plate.is-photo { width: 58%; aspect-ratio: 1; height: auto; translate: 0 2%; }
body.mo .mo-plate.is-photo img { border-radius: 28px; object-fit: cover; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .9); filter: none; }
@keyframes mo-float { 0%, 100% { translate: 0 0; rotate: -1.2deg; } 50% { translate: 0 -14px; rotate: 1.2deg; } }
@keyframes mo-shadow { 0%, 100% { transform: scaleX(1); opacity: 1; } 50% { transform: scaleX(.84); opacity: .7; } }
body.mo .mo-ctas { position: absolute; z-index: 3; bottom: clamp(22px, 3vw, 38px); left: 0; right: 0; display: flex; gap: 10px; justify-content: center; }
body.mo .mo-ghost { background: rgba(7, 11, 22, .45); backdrop-filter: blur(8px); }
body.mo .mo-hero-nav { position: absolute; z-index: 5; top: 50%; left: 16px; right: 16px; display: flex; justify-content: space-between; pointer-events: none; }
body.mo .mo-hero-nav button { pointer-events: auto; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--mo-line); background: rgba(7, 11, 22, .55); color: var(--mo-ink); backdrop-filter: blur(10px); font-size: 18px; transition: background .2s, transform .35s var(--mo-ease); }
body.mo .mo-hero-nav button:hover { background: var(--mo-amber); color: var(--mo-accent-ink); }
body.mo .mo-hero-prog { position: absolute; z-index: 5; left: 50%; translate: -50% 0; bottom: 14px; display: flex; gap: 8px; }
body.mo .mo-hero-prog button { width: 48px; height: 14px; padding: 5px 0; border: 0; background: none; }
body.mo .mo-hero-prog i { display: block; height: 3px; border-radius: 3px; background: rgba(243, 239, 230, .2); position: relative; overflow: hidden; }
body.mo .mo-hero-prog i::after { content: ""; position: absolute; inset: 0; width: var(--p, 0%); background: var(--mo-hot); }

/* Marquee */
body.mo .mo-marq { overflow: hidden; margin: 22px 0 0; border-block: 1px solid var(--mo-line); padding: 18px 0; white-space: nowrap; }
body.mo .mo-marq > div { display: inline-flex; gap: 48px; animation: mo-marq 32s linear infinite; padding-left: 48px; }
body.mo .mo-marq span { font: 800 clamp(1.4rem, 2.6vw, 2.2rem) var(--mo-display); text-transform: uppercase; color: var(--mo-ink); display: inline-flex; align-items: center; gap: 48px; }
body.mo .mo-marq span::after { content: "\2726"; color: var(--mo-amber); font-size: .7em; }
@keyframes mo-marq { to { transform: translateX(-50%); } }

/* ------------------------------------------------------------------ */
/* Section heads and product cards                                     */
/* ------------------------------------------------------------------ */

body.mo .tm-home { float: none; width: auto; padding: 0; }
body.mo .tm-hp, body.mo .mo-shead { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin: clamp(64px, 9vw, 120px) 0 28px; text-align: left; }
body.mo .tm-hp { display: block; }
body.mo .tm-hp h2, body.mo .mo-shead h2 { margin: 0 0 8px; font: 800 clamp(2.4rem, 5vw, 4.4rem)/.95 var(--mo-display); text-transform: uppercase; color: var(--mo-ink); background: none; border: 0; }
body.mo .tm-hp h2::before, body.mo .tm-hp h2::after { display: none; }
body.mo .tm-hp .tm-over { background: none; padding: 0; }
body.mo .tm-hp .tm-over span { font-style: normal; background: var(--mo-hot); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.mo .tm-hp p, body.mo .mo-shead p { margin: 0; color: var(--mo-muted); max-width: 52ch; }

body.mo ul.product_list.grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; }
body.mo #center_column ul.product_list.grid, body.mo .product-listing ul.product_list.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.mo.index ul.product_list.grid, body.mo.hide-left-column ul.product_list.grid, body.mo.index #center_column ul.product_list.grid, body.mo.hide-left-column #center_column ul.product_list.grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.mo ul.product_list.grid::before, body.mo ul.product_list.grid::after { display: none; }
body.mo ul.product_list.grid > li { width: auto; float: none; padding: 0; margin: 0; min-width: 0; }
body.mo ul.product_list.grid > li .product-container { position: relative; display: grid; gap: 10px; height: 100%; padding: 12px; margin: 0; border: 1px solid var(--mo-line); border-radius: var(--mo-radius); background: linear-gradient(180deg, rgba(27, 44, 99, .35), rgba(17, 26, 49, .6)); box-shadow: none; transition: border-color .3s, transform .45s var(--mo-ease); text-align: left; }
body.mo ul.product_list.grid > li .product-container:hover { border-color: rgba(242, 165, 74, .45); transform: translateY(-4px); box-shadow: none; }
body.mo ul.product_list .product-image-container { position: relative; border: 0; padding: 0; margin: 0; aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: #101a3c; }
body.mo ul.product_list .product-image-container::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: 9%; height: 6%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .7), transparent); filter: blur(4px); opacity: 0; transition: opacity .3s; }
body.mo ul.product_list .product-image-container.mo-has-cut::after { opacity: 1; }
body.mo ul.product_list .product_img_link, body.mo ul.product_list .product_img_link picture { display: block; width: 100%; height: 100%; }
body.mo ul.product_list .product_img_link img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--mo-ease), opacity .4s; }
body.mo ul.product_list .product_img_link img.mo-cut { position: relative; z-index: 1; object-fit: contain; padding: 10%; filter: drop-shadow(0 18px 18px rgba(0, 0, 0, .45)); }
body.mo ul.product_list .product-container:hover .product_img_link img { transform: scale(1.06); }
body.mo ul.product_list .product-container:hover .product_img_link img.mo-cut { transform: scale(1.1) rotate(-3deg); }
body.mo ul.product_list .product-label-container { position: absolute; top: 10px; left: 10px; z-index: 3; display: flex; gap: 6px; }
body.mo ul.product_list .quick-view { position: absolute; z-index: 3; right: 10px; top: 10px; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(7, 11, 22, .6); color: var(--mo-ink); backdrop-filter: blur(8px); opacity: 0; transition: opacity .25s; border: 1px solid var(--mo-line); }
body.mo ul.product_list .product-container:hover .quick-view { opacity: 1; }
body.mo ul.product_list .functional-buttons { position: absolute; z-index: 3; left: 10px; right: 10px; bottom: 10px; display: flex; gap: 6px; justify-content: flex-end; background: none; border: 0; padding: 0; opacity: 0; transition: opacity .25s; }
body.mo ul.product_list .product-container:hover .functional-buttons { opacity: 1; }
body.mo ul.product_list .functional-buttons a { display: inline-flex; gap: 4px; align-items: center; padding: 6px 10px; border-radius: 999px; background: rgba(7, 11, 22, .7); color: var(--mo-ink); font-size: .75rem; backdrop-filter: blur(8px); }
body.mo ul.product_list .product-description-container { padding: 4px 4px 0; text-align: left; }
body.mo ul.product_list .product-name { margin: 0; font: 700 1rem/1.3 var(--mo-font); text-transform: none; letter-spacing: 0; color: var(--mo-ink); text-align: left; }
body.mo ul.product_list .product-name a { color: var(--mo-ink); }
body.mo ul.product_list .product-actions-container { display: grid; gap: 10px; padding: 0 4px 4px; margin-top: auto; }
body.mo ul.product_list .product-price-button-wrapper { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
body.mo ul.product_list .content_price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; text-align: left; padding: 0; }
body.mo ul.product_list .content_price .price { font-size: 1.05rem; }
body.mo ul.product_list .aeuc_delivery_label, body.mo .aeuc_delivery_label, body.mo .aeuc_tax_label { color: var(--mo-muted); font-size: .72rem; display: block; width: 100%; }
body.mo ul.product_list .product-price-button-wrapper { display: grid; gap: 10px; width: 100%; float: none; }
body.mo ul.product_list .button-container .btn .icon { font-size: 1em; }
body.mo ul.product_list .button-container { margin: 0; opacity: 1 !important; visibility: visible !important; display: block !important; position: static; transform: none; width: 100%; }
body.mo ul.product_list .button-container .btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; padding: 10px 16px; font-size: .88rem; }
body.mo ul.product_list .button-container .btn .icon { margin-right: 6px; }
body.mo ul.product_list .availability { font-size: .75rem; }
body.mo ul.product_list .color-list-container ul { display: flex; gap: 6px; margin: 0; padding: 0; }
body.mo ul.product_list .color-list-container a, body.mo .color_pick { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--mo-line-2); display: block; }
body.mo ul.product_list .compare_mb, body.mo ul.product_list .product-desc { display: none; }
body.mo ul.product_list.grid .product-container .hook-reviews { text-align: left; }
body.mo .mo-home-mod + .mo-home-mod { margin-top: 0; }

/* List view (category switcher) */
body.mo ul.product_list.list > li { width: 100%; float: none; }
body.mo ul.product_list.list .product-container { display: grid; grid-template-columns: 220px 1fr auto; gap: 20px; align-items: center; padding: 12px; border: 1px solid var(--mo-line); border-radius: var(--mo-radius); background: var(--mo-deep); margin-bottom: 12px; }
body.mo ul.product_list.list .product-desc { display: block; color: var(--mo-muted); }

/* ------------------------------------------------------------------ */
/* Home: scenes, story, collections, room                              */
/* ------------------------------------------------------------------ */

body.mo .mo-scenes { position: relative; height: 100vh; min-height: 620px; width: 100vw; margin: clamp(64px, 9vw, 120px) 0 0 calc(50% - 50vw); overflow: hidden; border-radius: 0; }
body.mo .mo-scene { position: absolute; inset: 0; }
body.mo .mo-scene img { width: 100%; height: 100%; object-fit: cover; max-width: none; }
body.mo .mo-scene + .mo-scene { clip-path: inset(100% 0 0 0); }
body.mo .mo-scenes::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7, 11, 22, .75), transparent 60%); pointer-events: none; z-index: 1; }
body.mo .mo-pincard { position: absolute; z-index: 3; left: max(20px, calc((100% - var(--mo-max)) / 2 + var(--mo-gutter))); top: 50%; translate: 0 -50%; width: min(420px, calc(100% - 40px)); padding: 22px; border-radius: var(--mo-radius); background: rgba(12, 18, 36, .78); border: 1px solid var(--mo-line); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
body.mo .mo-pin-hd { display: flex; justify-content: space-between; font-size: .8rem; color: var(--mo-muted); letter-spacing: .08em; text-transform: uppercase; padding-bottom: 12px; border-bottom: 1px solid var(--mo-line); }
body.mo .mo-pin-hd b { color: var(--mo-ink); font-variant-numeric: tabular-nums; }
body.mo .mo-pin-body { position: relative; min-height: 290px; margin-top: 16px; }
body.mo .mo-pin-slot { position: absolute; inset: 0; display: grid; align-content: start; gap: 14px; }
body.mo .mo-pin-slot + .mo-pin-slot { opacity: 0; visibility: hidden; }
body.mo .mo-pin-slot h3 { margin: 0; font-size: 2.4rem; }
body.mo .mo-pin-slot p { margin: 0; }
body.mo .mo-thumbs { display: flex; gap: 8px; }
body.mo .mo-thumbs a { width: 60px; aspect-ratio: 1; border-radius: 12px; background: rgba(88, 118, 214, .16); overflow: hidden; display: grid; place-items: center; border: 1px solid var(--mo-line); transition: border-color .2s, transform .35s var(--mo-ease); }
body.mo .mo-thumbs a:hover { border-color: var(--mo-amber); transform: translateY(-3px); }
body.mo .mo-thumbs img { width: 84%; height: 84%; object-fit: contain; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .45)); }
body.mo .mo-thumbs img.is-photo { width: 100%; height: 100%; object-fit: cover; filter: none; }
body.mo .mo-link { color: var(--mo-amber); font-weight: 700; }
body.mo .mo-pinbar { position: absolute; z-index: 3; right: max(20px, calc((100% - var(--mo-max)) / 2 + var(--mo-gutter))); top: 50%; translate: 0 -50%; width: 3px; height: 160px; border-radius: 3px; background: rgba(243, 239, 230, .15); overflow: hidden; }
body.mo .mo-pinbar i { position: absolute; left: 0; right: 0; top: 0; height: 0; background: var(--mo-hot); }

body.mo .mo-story { padding: clamp(80px, 12vw, 160px) 0; }
body.mo .mo-story p { margin: 0 auto; max-width: 22ch; font: 800 clamp(2.4rem, 6vw, 5.6rem)/1 var(--mo-display); text-transform: uppercase; color: var(--mo-ink); text-align: center; }
body.mo .mo-story span { opacity: .16; transition: opacity .3s; }
body.mo .mo-story span.is-lit { opacity: 1; }

body.mo .mo-cols { position: relative; border-top: 1px solid var(--mo-line); width: 100vw; margin-left: calc(50% - 50vw); }
body.mo .mo-crow { display: block; overflow: hidden; padding-left: var(--mo-gutter) !important; border-bottom: 1px solid var(--mo-line); padding: clamp(10px, 2vw, 22px) 0; color: var(--mo-ink); white-space: nowrap; }
body.mo .mo-crow-t { display: inline-flex; gap: .4em; font-size: clamp(3rem, 9vw, 8rem); line-height: 1; transition: color .3s, transform .9s var(--mo-ease); }
body.mo .mo-crow-t em { font-style: normal; color: var(--mo-amber); font-size: .5em; align-self: center; }
body.mo .mo-crow:hover { color: var(--mo-ink); }
body.mo .mo-crow:hover .mo-crow-t { color: transparent; -webkit-text-stroke: 1px var(--mo-ink); transform: translateX(-4%); }
body.mo .mo-cprev { position: fixed; z-index: 50; left: 0; top: 0; width: 280px; aspect-ratio: 4/3; border-radius: 18px; overflow: hidden; pointer-events: none; opacity: 0; transform: scale(.8); transition: opacity .25s, transform .4s var(--mo-ease); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .9); }
body.mo .mo-cprev.is-on { opacity: 1; transform: scale(1); }
body.mo .mo-cprev img { width: 100%; height: 100%; object-fit: cover; }

body.mo .mo-look { position: relative; border-radius: 28px; overflow: hidden; }
body.mo .mo-look > img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
body.mo .mo-spot { position: absolute; z-index: 2; }
body.mo .mo-dot { position: relative; width: 36px; height: 36px; margin: -18px 0 0 -18px; border-radius: 50%; border: 0; background: #fff; color: #0c1224; font-weight: 800; font-size: 18px; line-height: 1; box-shadow: 0 0 0 6px rgba(255, 255, 255, .18); transition: transform .35s var(--mo-ease), background .2s; }
body.mo .mo-dot::before { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); animation: mo-ping 2s var(--mo-ease) infinite; }
body.mo .mo-dot[aria-expanded="true"] { transform: rotate(45deg); background: var(--mo-amber); }
@keyframes mo-ping { from { transform: scale(.6); opacity: 1; } to { transform: scale(1.5); opacity: 0; } }
body.mo .mo-dpop { position: absolute; z-index: 3; left: 26px; top: -30px; width: 260px; padding: 12px; border-radius: 18px; background: rgba(12, 18, 36, .9); border: 1px solid var(--mo-line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; }
body.mo .mo-spot.is-left .mo-dpop { left: auto; right: 26px; }
body.mo .mo-dpop[hidden] { display: none; }
body.mo .mo-dpop img { width: 64px; height: 64px; border-radius: 12px; background: rgba(88, 118, 214, .18); object-fit: contain; padding: 4px; }
body.mo .mo-dpop img.is-photo { object-fit: cover; padding: 0; }
body.mo .mo-dpop strong { display: block; color: var(--mo-ink); }
body.mo .mo-dpop > div > span { color: var(--mo-amber); font-weight: 800; }
body.mo .mo-dpop .btn span { color: inherit; }
body.mo .mo-dpop .btn { grid-column: 1 / -1; padding: 10px; }

/* Reveal-on-scroll starts visible; JS only animates it in when motion is allowed. */
body.mo [data-mo-rise] { will-change: transform; }

/* ------------------------------------------------------------------ */
/* Category and listing pages                                          */
/* ------------------------------------------------------------------ */

body.mo #category-info, body.mo .content_scene_cat { position: relative; margin: 0 0 28px; padding: clamp(28px, 5vw, 56px); border-radius: 28px; overflow: hidden; background: var(--mo-glow); border: 1px solid var(--mo-line); min-height: 240px; display: flex; flex-direction: column; justify-content: flex-end; }
body.mo #category-info img, body.mo .content_scene_cat img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; z-index: 0; opacity: .5; }
body.mo #category-info > *, body.mo .content_scene_cat > * { position: relative; z-index: 1; }
body.mo #category-info h1, body.mo #category-info .page-heading { font-size: clamp(3rem, 8vw, 7rem); margin: 0; }
body.mo #category-info .rte, body.mo #category-info p { max-width: 60ch; color: #cfd3de; }
body.mo .content_sortPagiBar, body.mo .sortPagiBar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0 0 18px; margin: 0 0 18px; border-bottom: 1px solid var(--mo-line); background: none; }
body.mo .sortPagiBar::before, body.mo .sortPagiBar::after, body.mo .content_sortPagiBar::before, body.mo .content_sortPagiBar::after { display: none; }
body.mo .sortPagiBar > * { float: none; margin: 0; }
body.mo #productsSortForm { margin-left: auto; }
body.mo #productsSortForm label { color: var(--mo-muted); font-weight: 500; margin-right: 8px; }
body.mo #productsSortForm select { width: auto; display: inline-block; border-radius: 999px; }
body.mo .product-list-switcher .btn, body.mo .display .btn { border-radius: 999px; }
body.mo .compare-form .btn { border-radius: 999px; }
body.mo .top-pagination-content, body.mo .bottom-pagination-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; border: 0; background: none; padding: 18px 0 0; }
body.mo .product-count { color: var(--mo-muted); }
body.mo #subcategories { background: none; border: 0; padding: 0; }
body.mo #subcategories ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; padding: 0; }
body.mo #subcategories li { width: auto; float: none; margin: 0; padding: 14px; border: 1px solid var(--mo-line); border-radius: var(--mo-radius-sm); background: var(--mo-deep); text-align: center; }

/* Left column (category filters): a sticky panel on desktop, a drawer on phones. */
body.mo #left_column { padding: 0 24px 0 0; }
body.mo #left_column .block { padding: 18px; margin-bottom: 14px; }
body.mo #left_column .block .title_block, body.mo #left_column .block h4 { font-size: 1.1rem; }
body.mo #left_column .block_content, body.mo #left_column .list-block ul { background: none; }
body.mo #left_column .list-block li, body.mo #left_column .block li { border-color: var(--mo-line); }
body.mo #left_column a { color: #cfd3de; }
body.mo .products-block img, body.mo #left_column .block img { border-radius: 12px; background: #101a3c; }
body.mo .products-block img.mo-cut, body.mo #left_column .block img.mo-cut { padding: 8%; filter: drop-shadow(0 8px 8px rgba(0, 0, 0, .45)); }
body.mo #left_column a:hover { color: var(--mo-amber); }
body.mo #layered_block_left .layered_subtitle { color: var(--mo-ink); font-weight: 800; }
body.mo #layered_block_left .layered_price .layered_slider, body.mo .ui-slider { background: var(--mo-raise); border: 0; }
body.mo .ui-slider .ui-slider-range { background: var(--mo-hot); }
body.mo .ui-slider .ui-slider-handle { background: var(--mo-ink); border: 0; border-radius: 50%; }
body.mo .mo-filter-btn { display: none; }

/* ------------------------------------------------------------------ */
/* Product page                                                        */
/* ------------------------------------------------------------------ */

body.mo.product #center_column > div > .primary_block, body.mo .primary_block { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(20px, 4vw, 56px); margin: 0; }
body.mo .primary_block::before, body.mo .primary_block::after { display: none; }
body.mo .primary_block > .pb-left-column, body.mo .primary_block > .pb-center-column, body.mo .primary_block > .pb-right-column { width: auto; float: none; padding: 0; }
body.mo .primary_block > .pb-center-column { grid-column: 2; }
body.mo .primary_block > .pb-right-column { grid-column: 2; }
body.mo .primary_block > .pb-left-column { grid-row: span 2; }
body.mo #image-block { position: relative; aspect-ratio: 1; border-radius: 28px; overflow: hidden; border: 1px solid var(--mo-line); background: var(--mo-glow); padding: 0; }
body.mo #image-block #view_full_size, body.mo #image-block #view_full_size a { display: block; height: 100%; }
body.mo #image-block #bigpic { display: block; width: 100%; height: 100%; }
body.mo #image-block #bigpic > img { width: 100%; height: 100%; object-fit: cover; max-width: none; transition: transform .6s var(--mo-ease); }
body.mo #image-block.mo-has-cut::before { content: attr(data-back); position: absolute; left: 50%; top: 50%; translate: -50% -50%; white-space: nowrap; font: 800 clamp(4rem, 10vw, 9rem)/1 var(--mo-display); text-transform: uppercase; color: rgba(88, 118, 214, .22); z-index: 0; }
body.mo #image-block.mo-has-cut::after { content: ""; position: absolute; left: 26%; right: 26%; bottom: 10%; height: 6%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .7), transparent); filter: blur(6px); z-index: 0; }
body.mo #image-block #bigpic > img.mo-cut { position: relative; z-index: 1; object-fit: contain; padding: 8%; filter: drop-shadow(0 34px 34px rgba(0, 0, 0, .5)); animation: mo-float 6s ease-in-out infinite; }
body.mo #image-block .span_link, body.mo #image-block .product-label-container { z-index: 2; }
body.mo #image-block .span_link { position: absolute; right: 14px; bottom: 14px; padding: 8px 14px; border-radius: 999px; background: rgba(7, 11, 22, .6); color: var(--mo-ink); backdrop-filter: blur(8px); font-size: .8rem; }
body.mo #image-block .product-label-container { position: absolute; top: 14px; left: 14px; }
body.mo #views_block { margin-top: 12px; }
body.mo #thumbs_list ul { display: flex; gap: 10px; padding: 0; margin: 0; }
body.mo #thumbs_list li { width: 78px !important; height: 78px; float: none; margin: 0; border: 1px solid var(--mo-line); border-radius: 14px; overflow: hidden; background: #101a3c; }
body.mo #thumbs_list li a { display: block; width: 100% !important; height: 100% !important; border: 0; padding: 0; margin: 0; background: none; border-radius: 0; }
body.mo #thumbs_list li picture { display: block; width: 100%; height: 100%; }
body.mo #thumbs_list li img { width: 100%; height: 100%; object-fit: cover; }
body.mo #thumbs_list li img.mo-cut { object-fit: contain; padding: 10%; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .45)); }
body.mo #thumbs_list li a.shown, body.mo #thumbs_list li:hover { border-color: var(--mo-amber); }
body.mo #view_scroll_left, body.mo #view_scroll_right { display: none !important; }

body.mo .pb-center-column h1 { font-size: clamp(2.6rem, 5vw, 4.4rem); margin: 0 0 14px; }
body.mo .pb-center-column #product_reference, body.mo .pb-center-column #product_condition { color: var(--mo-muted); font-size: .85rem; margin: 0; }
body.mo #short_description_block { color: #cfd3de; border: 0; padding: 0; margin: 12px 0; }
body.mo #short_description_content, body.mo .rte { color: #cfd3de; background: none; }
body.mo .rte h1, body.mo .rte h2, body.mo .rte h3 { color: var(--mo-ink); }
body.mo #product-availability, body.mo #availability_statut { margin: 12px 0; }
body.mo #availability_value.label-success { background: rgba(95, 224, 162, .14); color: var(--mo-ok); }
body.mo .box-info-product { background: var(--mo-deep); border: 1px solid var(--mo-line); border-radius: var(--mo-radius); padding: 22px; box-shadow: none; }
body.mo .box-info-product .content_prices { padding: 0 0 14px; border-bottom: 1px solid var(--mo-line); margin-bottom: 14px; }
body.mo .box-info-product .our_price_display { font: 800 clamp(2rem, 3vw, 2.6rem)/1 var(--mo-display); }
body.mo .product_attributes { padding: 0; border: 0; }
body.mo .attribute_fieldset { margin-bottom: 14px; }
body.mo .attribute_label { color: var(--mo-muted); font-weight: 600; font-size: .85rem; }
body.mo #color_to_pick_list { display: flex; gap: 8px; flex-wrap: wrap; padding: 0; margin: 6px 0 0; }
body.mo #color_to_pick_list li { float: none; width: auto; height: auto; display: block; margin: 0; padding: 3px; border: 2px solid transparent; border-radius: 50%; }
body.mo #color_to_pick_list li.selected { border-color: var(--mo-amber); }
body.mo #color_to_pick_list li a.color_pick { width: 30px; height: 30px; border: 0; border-radius: 50%; }
body.mo .attribute_list .form-control { max-width: 260px; }
body.mo .box-cart-bottom { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 16px 0 0; margin-top: 4px; border-top: 1px solid var(--mo-line); }
body.mo #quantity_wanted_p > div:first-child { display: none; }
body.mo #quantity_wanted_p label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
body.mo .product_attributes { margin-bottom: 4px; }
body.mo .attribute_fieldset { display: grid; gap: 8px; }
body.mo #quantity_wanted_p { display: inline-flex; margin: 0; }
body.mo #quantity_wanted_p .input-group { display: inline-flex; align-items: center; border: 1px solid var(--mo-line-2); border-radius: 999px; overflow: hidden; }
body.mo #quantity_wanted_p .form-control { width: 56px; border: 0; border-radius: 0; text-align: center; background: transparent; min-height: 48px; }
body.mo #quantity_wanted_p .input-group-btn { width: auto; display: block; position: static; }
body.mo #quantity_wanted_p .input-group > .form-control { order: 2; }
body.mo #quantity_wanted_p .input-group > .input-group-btn:nth-of-type(1) { order: 1; }
body.mo #quantity_wanted_p .input-group > .input-group-btn:nth-of-type(2) { order: 3; }
body.mo #quantity_wanted_p .btn .icon-angle-down::before { content: "\2212"; font-family: var(--mo-font); font-weight: 700; }
body.mo #quantity_wanted_p .btn .icon-angle-up::before { content: "+"; font-family: var(--mo-font); font-weight: 700; }
body.mo #quantity_wanted_p .btn { border: 0; border-radius: 0; background: transparent; color: var(--mo-ink); padding: 0 14px; min-height: 48px; display: grid; place-items: center; }
body.mo #quantity_wanted_p .btn .icon { margin: 0; }
/* The base theme nudges the minus button down and pads both past their width: pin them. */
body.mo #quantity_wanted_p .input-group-btn .btn { position: static; top: auto; width: 40px; height: 48px; margin: 0; padding: 0; }
body.mo #quantity_wanted_p .btn .icon { width: auto; }
body.mo #add_to_cart { flex: 1; margin: 0; }
body.mo #add_to_cart .btn { width: 100%; min-height: 52px; }
body.mo #usefull_link_block, body.mo .socialsharing_product { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 16px 0 0; list-style: none; }
body.mo #usefull_link_block li, body.mo .socialsharing_product .btn { float: none; margin: 0; }
body.mo #usefull_link_block a, body.mo .socialsharing_product .btn { color: var(--mo-muted); font-size: .85rem; }
body.mo .page-product-box { padding: 24px; margin: 20px 0 0; }
body.mo .page-product-heading { font-size: 1.8rem; background: none; border: 0; padding: 0; margin: 0 0 14px; }
body.mo .table-data-sheet td { border-color: var(--mo-line); }
body.mo .table-data-sheet tr.odd td { background: rgba(243, 239, 230, .03); }
body.mo #product_comments_block_tab, body.mo #new_comment_form { color: var(--mo-ink); }
body.mo .star_content .star, body.mo .star { color: var(--mo-amber); }
body.mo .blockproductscategory, body.mo #productscategory_list, body.mo .crossseling_list { background: none; border: 0; }
/* "Other products in the same category", "Customers who bought", accessories:
   a row of equal cards (the modules print bare lists sized by each photo). */
body.mo #productscategory_list ul, body.mo #crossselling_list ul, body.mo .accessories-block ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 20px 16px; width: auto !important; margin: 0; padding: 0; list-style: none; transform: none !important; }
body.mo #productscategory_list li, body.mo #crossselling_list li, body.mo .accessories-block li { display: grid; gap: 8px; align-content: start; width: auto !important; float: none; margin: 0 !important; padding: 0; text-align: left; }
body.mo #productscategory_list .product-image, body.mo #crossselling_list .lnk_img, body.mo .accessories-block .product_img_link { display: block; aspect-ratio: 1; border: 0; border-radius: 22px; background: var(--mo-fog); overflow: hidden; }
body.mo #productscategory_list .product-image picture, body.mo #crossselling_list .lnk_img picture, body.mo .accessories-block .product_img_link picture { display: block; width: 100%; height: 100%; }
body.mo #productscategory_list img, body.mo #crossselling_list img, body.mo .accessories-block img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
body.mo #productscategory_list img.mo-cut, body.mo #crossselling_list img.mo-cut, body.mo .accessories-block img.mo-cut { object-fit: contain; padding: 12%; mix-blend-mode: normal; }
body.mo #productscategory_list .product-name, body.mo #crossselling_list .product-name, body.mo .accessories-block .product-name { margin: 0; font-size: .95rem; font-weight: 600; }
body.mo #productscategory_list br, body.mo #crossselling_list br { display: none; }
body.mo #productscategory_list .clearfix, body.mo #crossselling_list .clearfix { margin: 0 !important; }
body.mo #productscategory_list .button, body.mo #crossselling_list .button, body.mo .accessories-block .button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border: 0; border-radius: 999px; font-weight: 700; font-size: .85rem; }
body.mo .bx-wrapper, body.mo .bx-viewport { width: auto !important; height: auto !important; max-width: none !important; border: 0; box-shadow: none; background: none; left: 0; }
body.mo #productscategory_list ul::before, body.mo #productscategory_list ul::after, body.mo #crossselling_list ul::before, body.mo #crossselling_list ul::after, body.mo .accessories-block ul::before, body.mo .accessories-block ul::after, body.mo .bx-controls, body.mo #productscategory_list li.bx-clone, body.mo #crossselling_list li.bx-clone, body.mo .accessories-block li.bx-clone { display: none; }
body.mo .mo-plife { position: relative; height: 80vh; min-height: 460px; width: 100vw; margin: clamp(48px, 7vw, 96px) 0 0 calc(50% - 50vw); overflow: hidden; }
body.mo .mo-plife img { position: absolute; inset: -10% 0; width: 100%; height: 120%; object-fit: cover; max-width: none; }
body.mo .mo-plife h2 { position: absolute; left: clamp(22px, 4vw, 48px); bottom: clamp(22px, 4vw, 48px); margin: 0; font-size: clamp(2.6rem, 6vw, 5rem); max-width: 12ch; }

/* Sticky add-to-cart bar on the product page (built by motion.js). */
body.mo .mo-sticky { position: fixed; z-index: 900; left: 50%; bottom: 16px; translate: -50% 0; width: min(720px, calc(100% - 32px)); display: flex; align-items: center; gap: 14px; padding: 10px 10px 10px 14px; border-radius: 999px; background: rgba(12, 18, 36, .86); border: 1px solid var(--mo-line-2); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .95);
  transform: translateY(140%); transition: transform .5s var(--mo-ease); }
body.mo .mo-sticky.is-on { transform: none; }
body.mo .mo-sticky img { width: 44px; height: 44px; border-radius: 50%; object-fit: contain; background: var(--mo-glow); }
body.mo .mo-sticky strong { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.mo .mo-sticky .price { font-weight: 800; }

/* ------------------------------------------------------------------ */
/* Cart, checkout, account, CMS, contact                               */
/* ------------------------------------------------------------------ */

body.mo #order_step { display: flex; gap: 6px; margin: 0 0 24px; padding: 0; border: 0; background: none; }
body.mo #order_step > li { flex: 1; float: none; width: auto; margin: 0; }
body.mo #order_step > li > a, body.mo #order_step > li > span { display: block; padding: 12px 10px; text-align: center; border-radius: 999px; border: 1px solid var(--mo-line); background: transparent; color: var(--mo-muted); font-weight: 700; font-size: .85rem; }
body.mo #order_step > li.active > a, body.mo #order_step > li.step_current > span { background: var(--mo-hot); color: var(--mo-accent-ink); border-color: transparent; }
body.mo #order_step > li.completed > a, body.mo #order_step > li.done > a, body.mo #order_step > li.step_done > a { border-color: rgba(95, 224, 162, .5); color: var(--mo-ok); }
body.mo #cart_summary, body.mo .cart_summary { border-radius: var(--mo-radius); overflow: hidden; border: 1px solid var(--mo-line); }
body.mo .cart_summary td.cart_product img { border-radius: 12px; background: var(--mo-glow); }
body.mo .cart_summary tfoot td, body.mo .cart_summary .cart_total_price td { background: var(--mo-deep); }
body.mo .cart_summary .total_price_container, body.mo #total_price { color: var(--mo-amber); font-weight: 800; }
body.mo .cart_navigation { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 24px 0 0; }
body.mo .cart_navigation .button-exclusive, body.mo .cart_navigation .btn-default { border-radius: 999px; }
body.mo .cart_quantity_input { width: 64px; text-align: center; }
body.mo .delivery_option, body.mo .delivery_options_address .delivery_option { background: var(--mo-deep); border: 1px solid var(--mo-line); border-radius: var(--mo-radius-sm); }
body.mo .payment_module a, body.mo p.payment_module a, body.mo #opc_payment_methods form > a:not(.fancybox) { display: block; padding: 18px 22px; border: 1px solid var(--mo-line-2); border-radius: var(--mo-radius-sm); background: var(--mo-deep); color: var(--mo-ink); }
body.mo .payment_module a:hover, body.mo #opc_payment_methods form > a:not(.fancybox):hover { border-color: var(--mo-amber); }
body.mo .addresses .address li.address_title, body.mo ul.address li.address_title { color: var(--mo-ink); font-family: var(--mo-display); text-transform: uppercase; font-size: 1.3rem; border-color: var(--mo-line); }
body.mo ul.address { padding: 20px; }
body.mo .myaccount-link-list a, body.mo #my-account .myaccount-link-list a { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border: 1px solid var(--mo-line); border-radius: var(--mo-radius-sm); background: var(--mo-deep); color: var(--mo-ink); font-weight: 700; margin-bottom: 10px; }
body.mo .myaccount-link-list a:hover { border-color: var(--mo-amber); color: var(--mo-amber); }
body.mo .myaccount-link-list a i { color: var(--mo-amber); font-size: 1.3rem; }
body.mo .lost_password a { color: var(--mo-amber); }
body.mo #cms #center_column .rte, body.mo .cms .rte { max-width: 72ch; font-size: 1.05rem; line-height: 1.75; }
body.mo .contact-form-box { background: var(--mo-deep); border: 1px solid var(--mo-line); border-radius: var(--mo-radius); padding: 24px; box-shadow: none; }
body.mo .contact-form-box fieldset { background: none; border: 0; }

/* ------------------------------------------------------------------ */
/* Footer                                                              */
/* ------------------------------------------------------------------ */

body.mo #footer { background: var(--mo-deep); border-top: 1px solid var(--mo-line); color: var(--mo-muted); margin-top: 40px; padding: 56px 0 24px; position: relative; overflow: hidden; }
body.mo #footer::before { content: ""; position: absolute; left: 50%; top: -60%; width: 900px; height: 600px; translate: -50% 0; background: radial-gradient(closest-side, rgba(242, 165, 74, .12), transparent); pointer-events: none; }
body.mo #footer .container > .row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; margin: 0; }
body.mo #footer .container > .row > * { width: auto; float: none; padding: 0; }
body.mo #footer .container > .row > #blocksocial, body.mo #footer .container > .row > #reinsurance_block, body.mo #footer .container > .row > #blockreinsurance, body.mo #footer .container > .row > .blockreinsurance, body.mo #footer .container > .row > [id*="newsletter"], body.mo #footer .container > .row > [class*="mailchimp"] { grid-column: 1 / -1; }
body.mo #footer .footer-title, body.mo #footer h2, body.mo #footer h4 { color: var(--mo-ink); font-size: 1.3rem; margin: 0 0 14px; background: none; border: 0; padding: 0; }
body.mo #footer a { color: var(--mo-muted); }
body.mo #footer a:hover { color: var(--mo-amber); }
body.mo #footer li { padding: 3px 0; border: 0; background: none; }
body.mo #blocksocial { display: flex; align-items: center; gap: 10px; padding: 30px 0 34px !important; border-bottom: 1px solid var(--mo-line); }
body.mo #blocksocial h2 { margin: 0 auto 0 0 !important; font: 800 clamp(2rem, 4vw, 3.2rem)/1 var(--mo-display) !important; text-transform: uppercase; }
body.mo #blocksocial a { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--mo-line-2); color: var(--mo-ink); }
body.mo #blocksocial a .icon { font-size: 18px; width: auto; }
body.mo #blocksocial a:hover { background: var(--mo-amber); color: var(--mo-accent-ink); border-color: transparent; }
body.mo #copyright-footer { border-top: 1px solid var(--mo-line); margin-top: 28px; padding-top: 18px; text-align: center; color: var(--mo-muted); font-size: .85rem; background: none; }

/* Third-party widgets on the dark ground */
body.mo #growls { position: fixed; z-index: 950; top: auto !important; right: auto !important; left: 16px; bottom: 16px; max-width: min(360px, calc(100vw - 32px)); }
body.mo #growls .growl { width: auto; margin: 8px 0 0; padding: 12px 36px 12px 16px; border-radius: var(--mo-radius-sm); background: rgba(12, 18, 36, .92); border: 1px solid var(--mo-line-2); color: var(--mo-ink); backdrop-filter: blur(12px); opacity: 1; font-size: .85rem; box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .9); }
body.mo #growls .growl .growl-close { color: var(--mo-muted); top: 8px; right: 12px; }
body.mo #growls .growl .growl-title:empty { display: none; }
body.mo .cc-window, body.mo .cc-banner { background: rgba(12, 18, 36, .95) !important; color: var(--mo-ink) !important; border-top: 1px solid var(--mo-line); backdrop-filter: blur(12px); }
body.mo .cc-btn { border-radius: 999px !important; background: var(--mo-hot) !important; color: var(--mo-accent-ink) !important; border: 0 !important; font-weight: 800 !important; }
body.mo .cc-link { color: var(--mo-amber) !important; }

/* ------------------------------------------------------------------ */
/* Responsive                                                          */
/* ------------------------------------------------------------------ */

@media (max-width: 1100px) {
  body.mo ul.product_list.grid, body.mo.index ul.product_list.grid, body.mo.hide-left-column ul.product_list.grid, body.mo.index #center_column ul.product_list.grid, body.mo.hide-left-column #center_column ul.product_list.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.mo #block_top_menu .sf-menu > li > a { padding: 10px 10px; }
}
/* Header: the menu folds behind the burger below 1180px (at ~1000px the
   logo, five menu items and the tools do not fit on one line). */
@media (max-width: 1180px) {
  body.mo .mo-bar { padding: 0 8px 0 16px; gap: 8px; }
  body.mo .mo-logo img { height: 34px; }
  body.mo .mo-burger { display: inline-grid; }
  body.mo .mo-top > nav { position: fixed; left: 12px; right: 12px; top: calc(var(--mo-hdr-h) + 24px); flex: none; padding: 12px; border-radius: var(--mo-radius); background: rgba(12, 18, 36, .96); border: 1px solid var(--mo-line-2); backdrop-filter: blur(18px); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .25s, transform .4s var(--mo-ease), visibility .25s; }
  html.mo-menu-open body.mo .mo-top > nav { opacity: 1; visibility: visible; transform: none; }
  body.mo #block_top_menu .sf-menu { flex-direction: column; align-items: stretch; }
  body.mo #block_top_menu .sf-menu > li > a { font: 800 2rem/1 var(--mo-display); text-transform: uppercase; padding: 14px 12px; }
  body.mo #block_top_menu .sf-menu ul { position: static !important; display: block !important; box-shadow: none; border: 0; background: none; }
  body.mo #blockcart-header b { font-size: 0; }
  body.mo #blockcart-header b::before { font-size: 16px; margin: 0; }
}
@media (max-width: 991px) {
  :root { --mo-hdr-h: 64px; }
  body.mo .mo-hero-grid { height: auto; min-height: 0; }
  body.mo .mo-slide { position: relative; grid-template-columns: 1fr; display: none; }
  body.mo .mo-slide.is-on { display: grid; }
  body.mo .mo-pane-a { aspect-ratio: 4/5; }
  body.mo .mo-pane-b { aspect-ratio: 1; }
  body.mo .mo-plate { translate: 0 4%; }
  body.mo .mo-hero-nav { display: none; }
  body.mo .mo-hero-prog { position: static; translate: none; justify-content: center; margin-top: 12px; }
  body.mo ul.product_list.grid, body.mo.index ul.product_list.grid, body.mo.hide-left-column ul.product_list.grid, body.mo #center_column ul.product_list.grid, body.mo.index #center_column ul.product_list.grid, body.mo.hide-left-column #center_column ul.product_list.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body.mo .primary_block, body.mo.product #center_column > div > .primary_block { grid-template-columns: 1fr; }
  body.mo .primary_block > .pb-center-column, body.mo .primary_block > .pb-right-column { grid-column: auto; }
  body.mo .primary_block > .pb-left-column { grid-row: auto; }
  body.mo #left_column { position: fixed; z-index: 1200; left: 0; top: 0; bottom: 0; width: min(360px, 88vw); padding: 24px 16px; overflow-y: auto; background: var(--mo-bg); border-right: 1px solid var(--mo-line-2); transform: translateX(-102%); transition: transform .45s var(--mo-ease); }
  html.mo-filters-open body.mo #left_column { transform: none; }
  body.mo .mo-filter-btn { display: inline-flex; }
  body.mo #footer .container > .row { grid-template-columns: 1fr 1fr; }
  body.mo .mo-scenes { height: auto; min-height: 0; width: auto; margin-left: 0; padding: 0 0 24px; }
  body.mo .mo-scene { position: relative; display: none; aspect-ratio: 4/3; border-radius: var(--mo-radius); overflow: hidden; }
  body.mo .mo-scene:first-child { display: block; }
  body.mo .mo-scene + .mo-scene { clip-path: none; }
  body.mo .mo-scenes::after { display: none; }
  body.mo .mo-pincard { position: relative; left: auto; top: auto; translate: none; width: auto; margin-top: -60px; }
  body.mo .mo-pin-body { min-height: 0; }
  body.mo .mo-pin-slot { position: static; }
  body.mo .mo-pin-slot + .mo-pin-slot { opacity: 1; visibility: visible; margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--mo-line); }
  body.mo .mo-pinbar { display: none; }
  body.mo #order_step { flex-wrap: wrap; }
  body.mo #order_step > li { flex: 1 1 30%; }
}
@media (max-width: 600px) {
  body.mo .mo-bar { gap: 6px; padding: 0 6px 0 12px; }
  body.mo .mo-tools .mo-lang { display: none; }
  body.mo .mo-mnav-extra { display: grid; gap: 10px; margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--mo-line); }
  body.mo .mo-mnav-row { display: flex; flex-wrap: wrap; gap: 6px; }
  body.mo .mo-mnav-row a { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--mo-line-2); color: var(--mo-ink); font-weight: 700; font-size: .85rem; }
  body.mo .mo-mnav-row a.is-on { background: var(--mo-hot); color: var(--mo-accent-ink); border-color: transparent; }
  body.mo .mo-logo img { height: 28px; }
  body.mo .mo-tools { gap: 4px; }
  body.mo .mo-icon { width: 38px; height: 38px; font-size: 14px; }
  body.mo .mo-burger span { left: 11px; right: 11px; }
  body.mo .mo-burger span:first-child { top: 14px; }
  body.mo .mo-burger span:last-child { top: 22px; }
  html.mo-menu-open body.mo .mo-burger span:first-child, html.mo-menu-open body.mo .mo-burger span:last-child { top: 18px; }
  body.mo .mo-lang > li > a { height: 38px; padding: 0 9px; font-size: .78rem; }
  body.mo .mo-lang > li > a .icon { display: none; }
  body.mo #blockcart-header { height: 38px; padding: 0 12px; }
  body.mo .mo-cprev { display: none; }
  body.mo .mo-dpop { width: 220px; }
  body.mo #footer .container > .row { grid-template-columns: 1fr; }
  body.mo .tm-hp, body.mo .mo-shead { margin-top: 56px; }
  body.mo ul.product_list.list .product-container { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body.mo .mo-plate img, body.mo .mo-plate::after, body.mo #image-block #bigpic > img.mo-cut, body.mo .mo-marq > div, body.mo .mo-dot::before { animation: none; }
  body.mo .mo-story span { opacity: 1; }
}

/* The product-comments module paints its own near-white panel (#fbfbfb) with a
   pale border, which no design ever restyled — on a dark ground that is the
   design's own cream text on white. Give it the design's raised surface. */
body.mo #product_comments_block_extra { background: var(--mo-raise) !important; border: 1px solid var(--mo-line) !important; border-radius: var(--mo-radius-sm); padding: 16px 20px; }
body.mo #product_comments_block_extra .comments_advices a, body.mo #product_comments_block_extra a.open-comment-form { color: var(--mo-ink) !important; }
body.mo #product_comments_block_extra .star_content, body.mo #product_comments_block_extra .comments_note span { color: var(--mo-muted); }
body.mo #order_step > li.completed > a, body.mo #order_step > li.completed > a:hover, body.mo #order_step > li.completed > a:focus { background: transparent; }

/* Checkout: the step cards and the order panel are panels of this
   design, not transparent patches of the page behind them. */
body.mo .st-step { background: var(--mo-surface); border-color: var(--mo-line); }
body.mo .st-co-side { background: var(--mo-surface); border-color: var(--mo-line); }
body.mo .st-step-n { border-color: var(--mo-line-2, var(--mo-line)); }
body.mo .st-step-edit { border-color: var(--mo-line-2, var(--mo-line)); color: var(--mo-ink); }
/* Checkout copy reads in ink; the hierarchy is size and weight. */
body.mo .st-step-t small, body.mo .st-co-side h3, body.mo .st-co-line span,
body.mo .st-co-totals span { color: var(--mo-ink); }
/* Checkout small print is UI copy: the body face, rendered with the
   subpixel smoothing small text needs, not the display face. */
body.mo .st-step-t small, body.mo .st-co-side h3, body.mo .st-co-line,
body.mo .st-co-totals, body.mo .st-step-edit {
  font-family: var(--mo-font);
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

/* A payment method is one card: the shell carries this design's edge,
   and the divider under an open header is the same line. */
body.mo .st-pay { border: 1px solid var(--mo-line-2); background: var(--mo-surface); }
/* The frame stays the same line open, closed or hovered. Painting it in
   the accent drew a heavy box around the row, and because the pointer
   rests on the row after a click the hover state kept it there. The
   divider below and the turned chevron already say which one is open. */
body.mo .st-pay:hover,
body.mo .st-pay.is-open { border-color: var(--mo-line-2); }
body.mo .st-pay.is-open .st-pay-body { border-top: 1px solid var(--mo-line-2); }

/* The accepted-card panel beside the fields: a quiet inset, not a second
   card competing with the one it sits inside. */
body.mo .st-pay-accept { background: var(--mo-line); }
body.mo .st-pay-accept-t { color: var(--mo-ink); font-family: var(--mo-display, inherit); }
body.mo .st-pay-brands li { border: 1px solid var(--mo-line-2); }
body.mo .st-pay-accept-n { color: var(--mo-ink); }
body.mo .st-ship-head { color: var(--mo-ink); font-family: var(--mo-display, inherit); }

/* ---- client area ---- */
body.mo #my-account-menu li > a {
  border: 1px solid var(--mo-line-2);
  background: var(--mo-surface);
  /* !important because the vendor sheet forces a leftover orange on
     `.nav-pills.stacked-menu > li > a` with !important of its own. */
  color: var(--mo-ink) !important;
}
body.mo #my-account-menu li > a:hover { border-color: var(--mo-accent, var(--mo-ink)); }
body.mo #my-account-menu li > a i { color: var(--mo-accent, var(--mo-ink)); }
body.mo .st-order { border: 1px solid var(--mo-line-2); background: var(--mo-surface); }
body.mo .st-order-ref { color: var(--mo-ink); }
body.mo .st-order-date { color: var(--mo-muted, var(--mo-ink)); }
body.mo .st-order-facts dt { color: var(--mo-muted, var(--mo-ink)); }
body.mo .st-order-facts dd { color: var(--mo-ink); }
/* The client-area tables sit on the same ground as the address cards. */
body.mo.stores .table { background: var(--mo-surface); }
body.mo.order-detail .table,
body.mo.guest-tracking .table,
body.mo.order-confirmation .table,
body.mo.order-slip .table,
body.mo.order-follow .table,
body.mo.discount .table { background: var(--mo-deep); }