/* MARENCE brand.css (goya-child). One file for the whole site, loaded by mu-plugins/marence-header.php after style.css.
   Sections: tokens | header: top bar + menu row (stage 1) | header: mega menu (stage 2) | footer (ivory, D-108) | home v3.
   Computer layout from 1024 px = theme setting mobile_header_breakpoint 1023 + 1. Phone header and phone menu untouched. */

/* == tokens == */
:root{
  --m-ink:#000;--m-paper:#fff;--m-ink-2:#555454;--m-rule:#C4C2C1;--m-track:.25em;--m-light:#E6E6E6;
  --m-pad:clamp(20px, -29.23px + 4.808vw, 40px);
  --m-wrap:1360px;
  --m-ease:cubic-bezier(.2,.7,.2,1);
  /* smart header (D-101): top bar height (stage 1b), computer header height before scrolling (Kirki header_height; the
     page spacer is pinned to it), theme header layer (core.css .site-header), slide time, the theme own header timing
     (core.css .site-header transition, kept when the slide is added); --m-ab = WordPress admin bar, set per width below */
  --m-tb:36px;--m-hdr-h:96px;--m-z-hdr:602;--m-hdr-dur:200ms;--m-hdr-dur-theme:.15s;--m-ab:0px;
  /* footer ivory (D-108) and the shared scale it brings (names of design/css-tokens-2026-09-29/report.md): colours of the
     footer, type, weights, tracking, line heights, spacing steps, sizes; the footer grids. 5 colours: ivory ground, charcoal
     text 11.9:1, second text 5.4:1, gold 871 C for thin details 3.1:1, warm rule (decor only), all on #F7F4EF */
  --m-ivory:#F7F4EF;--m-char:#34302C;--m-char-2:#6B635B;--m-gold:#A8863A;--m-rule-warm:#DAD1C6;
  --m-fs-2:12px;--m-fs-3:13px;--m-fs-4:15px;--m-fw-reg:400;--m-fw-semi:600;--m-track-s:.1em;
  --m-lh-0:1;--m-lh-1:1.3;--m-lh-2:1.5;--m-lh-3:1.6;
  --m-s2:8px;--m-s3:12px;--m-s4:16px;--m-s5:24px;--m-s6:32px;--m-s7:48px;--m-band:56px;
  --m-line:1px;--m-hair:1.5px;--m-focus:2px;--m-focus-off:3px;--m-ul-off:5px;--m-round:50%;
  --m-tap:44px;--m-btn-h:48px;--m-ring:40px;--m-glyph:18px;--m-check:18px;--m-check-in:3px;--m-sign:12px;--m-mark:56px;--m-div-h:28px;
  --m-flogo:224px;--m-lotus:40px;--m-lotus-h:24px;--m-leaf:420px;--m-leaf-x:-34px;--m-say-w:300px;--m-lead-w:440px;--m-link-y:6px;
  --m-indent:clamp(0px, calc((100vw - 1280px) / 2), 80px);
  --m-fcols:minmax(0, 1.45fr) minmax(0, 1fr) minmax(0, .9fr) minmax(0, 1fr) minmax(min-content, 1.25fr);
  --m-fcols-md:minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1fr) minmax(min-content, 1.25fr);
  --m-fcols-2:repeat(2, minmax(0, 1fr));--m-fcols-1:minmax(0, 1fr);--m-ct-cols:var(--m-ring) minmax(min-content, 1fr);
  --m-fbar-cols:minmax(0, 27.7fr) minmax(0, 22.5fr) minmax(0, 22.7fr) minmax(0, 27.1fr);
  /* home v3 (D-112, D-115; design/homepage-v3-2026-09-30/recipe.md, palette.md): colours of the brandbook = field #ECEAE9
     (p. 33), 80 % and 60 % black (p. 19, p. 07), silver foil on screen (p. 19); edges = variant B, one line to change;
     grid, rhythm, type scale, hero sizes, product well, motion */
  --m-ground:#ECEAE9;--m-ink-80:#333;--m-ink-60:#666;
  --m-silver:linear-gradient(135deg, #E3E3E3 0%, #B2B2B2 100%);
  --m-r-media:4px;--m-r-ctl:2px;
  --m-f:16px;--m-g:clamp(12px, 7.54px + 1.143vw, 24px);--m-v:clamp(56px, 41.14px + 3.81vw, 96px);
  --m-head:clamp(24px, 19.54px + 1.143vw, 36px);--m-field:clamp(28px, 13.14px + 3.81vw, 68px);
  --m-t-h1:clamp(28px, 18.82px + 2.353vw, 64px);--m-t-h1-min:24px;--m-t-h2:clamp(16px, 14.51px + 0.381vw, 20px);
  --m-t-h3:clamp(19px, 17.14px + 0.476vw, 24px);--m-t-body:clamp(15px, 14.63px + 0.095vw, 16px);
  --m-t-num:clamp(72px, 51.2px + 5.333vw, 128px);--m-fs-1:11px;
  --m-fw-light:300;--m-fw-med:500;--m-fw-bold:700;--m-track-q:.2em;
  --m-lh-h1:1.1;--m-lh-h2:1.15;--m-lh-card:1.35;--m-lh-kick:1.4;
  --m-s1:4px;--m-s-card:6px;--m-s-quiet:10px;--m-s-count:14px;--m-text-w:34rem;
  --m-hero-max:1400px;--m-hero-min:420px;--m-hero-photo:240px;--m-hero-room:68px;--m-hero-cols:7fr 5fr;
  --m-hero-k-h1:.07;--m-hero-k-pad:.08;--m-hero-sign:44px;--m-hero-sign-ar:1000 / 585.36;
  --m-hero-nav-w:calc(100% * 5 / 12);--m-z-nav:2;--m-ul-hover:2px;--m-ul-off-s:4px;--m-name-lines:3;
  --m-pp-w:10px;--m-pp-h:12px;--m-pp-bar:3px;
  --m-obj-c:50% 30%;--m-obj-l:0% 40%;--m-obj-r:60% 45%;
  --m-well-ar:4 / 5;--m-pack-y:9%;--m-pack-h:76%;--m-pack-w:74%;--m-label-h:18px;
  --m-rib:46%;--m-rib-md:30%;--m-rib-wide:62%;--m-rib-wide-md:40%;
  --m-count-box:clamp(96px, 72.23px + 6.095vw, 160px);--m-event-cols:minmax(0, 5fr) minmax(0, 7fr);--m-below-h:960px;
  --m-d-out:160ms;--m-d-in:280ms;--m-d-rise:400ms;
  --m-rise:16px;--m-slide-in:40px;--m-settle:1.06;--m-lift:-6px;
  --m-ar-sl:30%;--m-ar-sl-step:12%;--m-ar-step:40px;--m-ar-len:200px;--m-ar-dg:160px;--m-ar-dg-step:60px;
}
/* text for screen readers only (one rule for the whole site: phone language button, footer language row, footer icons) */
.m-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* == type: one Montserrat (D-137) == Kirki prints body{font-family:Montserrat} with no fallback, so until the font
   arrives Windows paints Times New Roman. "Montserrat Fallback" = local Arial sized to Montserrat
   (mu-plugins/marence-local-fonts.php); html body outranks the Kirki rule wherever it is printed. Four theme counters
   (shop.css) are set in Arial: same font as the text around them. */
html body, html blockquote cite{font-family:'Montserrat','Montserrat Fallback',Arial,sans-serif}
.filter-trigger .et-active-filters-count, .products .product.product-category .category-caption h2 .count,
.minicart-counter, .et-wishlist-counter.active{font-family:inherit}

/* == header: top bar + menu row (stage 1 + 1b, D-091) == */
@media (min-width:1024px){
  :root{
    --m-logo-w:clamp(120px, 100.31px + 1.923vw, 128px);
    --m-logo-clear:clamp(28px, -21.23px + 4.808vw, 48px);
    --m-nav-fs:clamp(14px, 9.08px + 0.4808vw, 16px);
    --m-nav-gap:clamp(20px, -9.54px + 2.885vw, 32px);
    --m-ico-box:clamp(36px, 26.15px + 0.9615vw, 40px);
    --m-ico-gap:clamp(0px, -19.69px + 1.923vw, 8px);
    --m-left-w:clamp(258px, 198.92px + 5.769vw, 282px);
    --m-lang-box:calc(4 * var(--m-ico-box) + 3 * var(--m-ico-gap));
    --m-ico-inset:calc((var(--m-ico-box) - 22px) / 2);
    --m-row-h:96px;
  }
  /* sticky row: logo 120 and row 88; the grid column follows the variable, so the menus stay --m-logo-clear from the logo */
  body.header_on_scroll{--m-logo-w:120px;--m-row-h:88px}

  /* one grid for both rows: column 1 = left box W pressed to the logo, column 2 = logo width, column 3 = right side */
  #top-bar .container,
  #header .header-main .header-contents{
    width:calc(100% - 2 * var(--m-pad));max-width:var(--m-wrap);
    margin-inline:auto;padding-inline:0;
    display:grid;grid-template-columns:minmax(0, 1fr) var(--m-logo-w) minmax(0, 1fr);
    column-gap:var(--m-logo-clear);align-items:center;
  }
  #top-bar .container::before,
  #top-bar .container::after{content:none}
  #top-bar .topbar-left,
  #header .header-main .header-left-items{grid-area:1 / 1;justify-self:end;min-width:0}
  #top-bar .topbar-center,
  #header .header-main .header-center-items{grid-area:1 / 2}
  #top-bar .topbar-right{grid-area:1 / 3;justify-self:end;min-width:0}
  #header .header-main .header-right-items{grid-area:1 / 3;min-width:0}

  /* top bar: #000, 36 px */
  #top-bar.top-bar{min-height:36px;background:var(--m-ink);color:var(--m-light);font-size:13px;font-weight:400;line-height:1}
  #top-bar .container{min-height:36px}
  #top-bar a{display:inline-flex;align-items:center;min-height:36px;color:var(--m-light);opacity:1}
  #top-bar a:hover{opacity:1;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
  #top-bar a:focus-visible{outline:2px solid var(--m-light);outline-offset:3px}

  /* top bar, left box W: phone, contacts, the social pair; space-between, never tighter than the menu gap */
  #top-bar .topbar-left{
    display:flex;align-items:center;justify-content:space-between;column-gap:var(--m-nav-gap);
    width:var(--m-left-w);box-sizing:border-box;
  }
  #top-bar .topbar-left > *{flex:none;margin:0;padding:0}
  #top-bar .et-top-bar-text p{margin:0}
  #top-bar .et-top-menu{display:flex;margin:0;padding:0;list-style:none}
  #top-bar .et-top-menu > li{margin:0;padding:0}
  #top-bar .top-bar-social-icons{display:flex;align-items:center;column-gap:12px;margin:0;padding:0;list-style:none}
  #top-bar .top-bar-social-icons > li{margin:0;padding:0}
  #top-bar .top-bar-social-icons a{
    justify-content:center;box-sizing:border-box;width:24px;height:36px;padding:0 5px;margin:0 -5px;
    color:var(--m-light);background:none;border:0;border-radius:0;text-decoration:none;
  }
  #top-bar .top-bar-social-icons a:is(:hover, :focus-visible){color:var(--m-paper);text-decoration:none}
  #top-bar .top-bar-social-icons .et-icon{display:block;width:14px;height:14px;font-size:14px;line-height:1;color:inherit}
  #top-bar .top-bar-social-icons .et-icon::before{font-size:inherit;line-height:1;color:inherit}

  /* social icons in the brands' own colours (owner 28.09 15:00: "coloured, like the original"): Facebook blue,
     Instagram gradient on the glyph; first in the left box, before the phone (031 v2) */
  #top-bar .top-bar-social-icons .et-facebook{color:#0866FF}
  #top-bar .top-bar-social-icons .et-instagram::before{
    display:inline-block;color:transparent;
    background:linear-gradient(45deg, #FEDA75 0%, #FA7E1E 25%, #D62976 50%, #962FBF 75%, #4F5BD5 100%);
    -webkit-background-clip:text;background-clip:text;
  }
  /* top bar, right: LV RU EN over the four icons; inset = half the empty part of an icon box */
  #top-bar .et-language{
    display:flex;align-items:center;justify-content:space-between;
    box-sizing:border-box;width:var(--m-lang-box);margin:0;padding:0 var(--m-ico-inset);
  }
  #top-bar .et-language :is(ul, li){display:contents !important}
  #top-bar .et-language .label,
  #top-bar .et-language .ls-flag,
  #top-bar .et-language .ls-name{display:none}
  #top-bar .et-language :is(a, .selected){
    position:static;display:inline-flex;align-items:center;min-height:36px;margin:0;padding:0;
    border:0;background:none;box-shadow:none;text-decoration:none;
  }
  #top-bar .et-language :is(li, a, .selected, .ls-code)::before,
  #top-bar .et-language :is(li, a, .selected, .ls-code)::after{content:none}
  #top-bar .et-language a:is(:hover, :focus-visible){text-decoration:none}
  #top-bar .et-language .ls-code{
    display:inline;border:0;text-decoration:none;
    text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:.1em;
  }
  #top-bar .et-language a[data-lang="lv"]{order:1}
  #top-bar .et-language a[data-lang="ru"]{order:2}
  #top-bar .et-language a[data-lang="en"]{order:3}
  html[lang|="lv"] #top-bar .et-language .selected{order:1}
  html[lang|="ru"] #top-bar .et-language .selected{order:2}
  html[lang|="en"] #top-bar .et-language .selected{order:3}
  #top-bar .et-language :is(.selected, a:hover) .ls-code{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

  /* menu row */
  #header .header-main .header-contents{position:relative}
  #header .header-main .header-items,
  #header .header-main .main-navigation,
  #header .header-main .secondary-navigation,
  #header .header-main .et-header-menu,
  #header .header-main .et-header-menu > li.menu-item-mega-parent{position:static}
  #header .header-main{border-bottom:1px solid var(--m-rule)}
  #header.site-header::after{content:none;display:none}
  #header.site-header{box-shadow:none}
  #header .header-main .header-left-items{display:flex;justify-content:flex-end}
  #header .header-main .header-left-items > *{margin:0}
  #header .header-main .header-left-items > nav{flex:none;width:var(--m-left-w)}
  #header .header-main .header-left-items .et-header-menu{display:flex;justify-content:space-between;width:100%;margin:0;padding:0}
  #header .header-main .header-center-items,
  #header .header-main .header-center-items > *{margin:0;flex:none}
  #header .header-main .header-center-items{display:flex;justify-content:center}
  #header .header-main .header-right-items{justify-content:flex-end;column-gap:var(--m-ico-gap)}
  #header .header-main .header-right-items > *{margin:0}
  #header .header-main .header-right-items > nav{margin-right:auto;padding-right:var(--m-nav-gap)}
  #header .header-main .logolink .logoimg{width:var(--m-logo-w);height:auto;max-height:none}
  #header .header-main .et-header-menu{gap:var(--m-nav-gap)}
  #header .header-main .et-header-menu > li{padding-left:0;margin-left:0}
  #header .header-main .et-header-menu > li > a{font-size:var(--m-nav-fs);font-weight:400;letter-spacing:0;color:var(--m-ink)}
  #header .header-main .et-header-menu > li > a::before,
  #header .header-main .et-header-menu > li > a::after{content:none}
  #header .header-main .et-header-menu > li:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, :hover, :focus-within) > a{
    text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;
  }

  /* icons: guest link and logged-in link share one box */
  #header .header-main .header-right-items > a.icon,
  #header .header-main .header-right-items ul.account-links > li > a{
    position:relative;display:inline-grid;place-items:center;box-sizing:border-box;
    width:var(--m-ico-box);height:var(--m-ico-box);padding:0;color:var(--m-ink);
  }
  #header .header-main .header-right-items :is(a.icon, ul.account-links > li > a) svg{width:22px;height:22px}
  #header .header-main .header-right-items :is(a.icon, ul.account-links > li > a) :is(.text, .icon-text){
    position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;
  }
  #header .header-main .header-right-items ul.account-links{display:flex;margin:0;padding:0;list-style:none;position:static}
  #header .header-main .header-right-items ul.account-links > li{position:static;margin:0;padding:0}
  #header .header-main .header-right-items ul.account-links > li > a,
  #header .header-main .header-right-items ul.account-links > li:is(:hover, :focus-within, .current-menu-item) > a{text-decoration:none}
  #header .header-main .header-right-items ul.account-links > li > a::before,
  #header .header-main .header-right-items ul.account-links > li > a::after{content:none}
  #header .header-main .item-counter{
    position:absolute;top:2px;right:0;min-width:0;width:auto;height:auto;padding:0;
    background:none;border:0;border-radius:0;
    font-size:11px;font-weight:600;line-height:1;color:var(--m-ink);
  }
  #header .header-main .item-counter.et-count-zero,
  #header .header-main .item-counter:empty{display:none}
  #header .header-main a:focus-visible{outline:2px solid var(--m-ink);outline-offset:3px}

  /* account list (logged in): hangs from the header line, right edge = right edge of the account icon box */
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu{
    position:absolute;top:100%;left:auto;right:calc(3 * var(--m-ico-box) + 3 * var(--m-ico-gap));z-index:20;
    display:block;box-sizing:border-box;width:max-content;min-width:200px;max-width:280px;
    margin:0;padding:12px 0;list-style:none;
    background:var(--m-paper);border:1px solid var(--m-rule);border-top-color:var(--m-ink);border-radius:0;box-shadow:none;
    font-size:15px;font-weight:400;line-height:1.45;letter-spacing:0;text-transform:none;text-align:left;
    opacity:0;visibility:hidden;transform:none;
    transition:opacity 120ms var(--m-ease) 150ms, visibility 0s linear 270ms;
  }
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu::before{content:none}
  /* invisible bridge from the icon down to the line, so the pointer keeps :hover on the way */
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu::after{
    content:"";position:absolute;left:0;right:0;bottom:100%;width:auto;
    height:calc((var(--m-row-h) - var(--m-ico-box)) / 2 + 1px);
    background:none;border:0;box-shadow:none;transform:none;
  }
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li{display:block;width:auto;margin:0;padding:0;border:0}
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a{
    display:block;padding:5px 20px;margin:0;
    font:inherit;color:var(--m-ink);background:none;border:0;
    white-space:normal;text-wrap:pretty;text-decoration:none;
  }
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a::before,
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a::after{content:none}
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a:hover{
    color:var(--m-ink);background:none;
    text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;
  }
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li:is(.is-active, .current-menu-item) > a,
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a[aria-current="page"]{font-weight:600;text-decoration:none}
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li > a:focus-visible{outline:2px solid var(--m-ink);outline-offset:-3px}
  /* log out set apart (delete this one rule if the owner wants no line inside the list) */
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu > li:last-child{margin-top:8px;padding-top:8px;border-top:1px solid var(--m-rule)}

  #header .header-main .header-right-items ul.account-links > li:focus-within > ul.sub-menu{
    opacity:1;visibility:visible;transition:opacity 180ms var(--m-ease) 60ms, visibility 0s linear 60ms;
  }
}
@media (min-width:1024px) and (hover:hover) and (pointer:fine){
  #header .header-main .header-right-items ul.account-links > li:hover > ul.sub-menu{
    opacity:1;visibility:visible;transition:opacity 180ms var(--m-ease) 60ms, visibility 0s linear 60ms;
  }
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #header .header-main .header-right-items ul.account-links > li > ul.sub-menu{transition:opacity 0s linear 150ms, visibility 0s linear 150ms}
  #header .header-main .header-right-items ul.account-links > li:is(:hover, :focus-within) > ul.sub-menu{transition:none}
}

/* == header: mega menu (stage 2) == */
/* recipe.md 1.1-1.6 (D-087): five columns in the owner's order; the nine placement rules follow the order of the menu
   (LV / RU / EN identical: face, body, hair, men, mud, travel, sets, gifts, loyalty). A new or moved section = edit them. */
:root{
  --mm-ip:clamp(24px, -15.38px + 3.846vw, 40px);
  --mm-gap:clamp(24px, -15.38px + 3.846vw, 40px);
  --mm-pb:clamp(24px, 4.31px + 1.923vw, 32px);
  --mm-h:clamp(12px, 9.54px + 0.2404vw, 13px);
  --mm-a:clamp(15px, 10.08px + 0.4808vw, 17px);
}
@media (min-width:1024px){
  #header.megamenu-fullwidth .header-main .et-header-menu > li.menu-item-mega-parent > .sub-menu{
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    grid-template-rows:repeat(4, auto) minmax(0, 1fr);
    column-gap:var(--mm-gap);row-gap:0;
    position:absolute;inset:100% 0 auto 0;width:auto;max-width:none;
    margin:0;padding:var(--mm-pb) var(--mm-ip);
    background:var(--m-paper);
    border:1px solid var(--m-rule);border-top-color:var(--m-ink);border-radius:0;
    box-shadow:none;animation:none;transform:none;
    max-height:calc(100dvh - 160px);overflow-y:auto;
    visibility:hidden;opacity:0;
    transition:opacity 120ms linear 150ms, visibility 0s linear 270ms;
  }
  #header.megamenu-fullwidth .header-main .et-header-menu > li.menu-item-mega-parent > .sub-menu::before{content:none;display:none}
  #header.megamenu-fullwidth .header-main .et-header-menu > li.menu-item-mega-parent:is(:hover, :focus-within) > .sub-menu{
    display:grid;visibility:visible;opacity:1;
    transition:opacity 180ms var(--m-ease) 60ms, visibility 0s linear 60ms;
  }

  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li{
    width:auto;max-width:none;min-width:0;margin:0;padding:0;align-self:start;
    transform:none;opacity:1;transition:none;animation:none;
  }
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(1){grid-column:1;grid-row:1 / -1}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(2){grid-column:2;grid-row:1 / -1}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(3){grid-column:3;grid-row:1;padding-bottom:20px}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(4){grid-column:3;grid-row:2;padding-bottom:20px}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(5){grid-column:3;grid-row:3;padding-bottom:20px}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(6){grid-column:3;grid-row:4}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(7){grid-column:4;grid-row:1 / span 3;padding-bottom:20px}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(8){grid-column:5;grid-row:1 / span 3}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(9){grid-column:5;grid-row:4 / -1}
  /* 10th item "Jaunumi / Новинки / New arrivals" (093, owner 16.10.2026): under the sets in column 4; without this line the
     grid put it in the free cell of column 3 right under "Ceļojumam", the two read as one item */
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:nth-child(10){grid-column:4;grid-row:4 / -1}

  /* section heading */
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li > a{
    display:block;padding:0;margin:0 0 10px;
    font-size:var(--mm-h);font-weight:600;line-height:1.4;
    letter-spacing:var(--m-track);text-transform:uppercase;color:var(--m-ink);
    white-space:normal;text-wrap:balance;
  }
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li:not(.menu-item-has-children) > a{margin-bottom:0}
  /* subsection links */
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li > .sub-menu{
    position:static;display:block;opacity:1;
    width:auto;padding:0;margin:0;border:0;background:none;box-shadow:none;transform:none;
  }
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li > .sub-menu::before{content:none;display:none}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li > .sub-menu > li{display:block;width:auto;margin:0;padding:0}
  #header.megamenu-fullwidth .header-main .menu-item-mega-parent > .sub-menu > li > .sub-menu > li > a{
    display:inline-block;padding:4px 0;margin:0;
    font-size:var(--mm-a);font-weight:400;line-height:1.45;
    letter-spacing:0;text-transform:none;color:var(--m-ink);
    white-space:normal;text-wrap:pretty;
  }
  #header .header-main .menu-item-mega-parent .sub-menu a::before,
  #header .header-main .menu-item-mega-parent .sub-menu a::after{content:none}
  #header .header-main .menu-item-mega-parent .sub-menu a:hover,
  #header .header-main .menu-item-mega-parent > .sub-menu > li:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent) > a{
    color:var(--m-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;
  }
  #header .header-main .menu-item-mega-parent > .sub-menu .sub-menu > li.current-menu-item > a{font-weight:600;text-decoration:none}
  #header .header-main .menu-item-mega-parent .sub-menu a:focus-visible{outline:2px solid var(--m-ink);outline-offset:3px}
  /* note under a section (class marence-note + Description, printed by mu-plugins/marence-header.php) */
  #header .header-main .mm-note{
    display:block;margin-top:4px;
    font-size:var(--mm-h);font-weight:400;line-height:1.4;
    letter-spacing:0;text-transform:none;color:var(--m-ink-2);text-wrap:balance;
  }
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #header.megamenu-fullwidth .header-main .et-header-menu > li.menu-item-mega-parent > .sub-menu,
  #header.megamenu-fullwidth .header-main .et-header-menu > li.menu-item-mega-parent:is(:hover, :focus-within) > .sub-menu{transition:none}
}

/* == phone (stage 4): header, language button, bottom bar, shop toolbar, sticky add-to-cart bar; up to 1023 px == */
/* design/mobile-2026-09-28/recipe.md 2.1-2.6 and 4.6, adapted to the theme DOM (the phone header is the theme's
   .header-mobile > .header-contents: .hamburger-menu, .logo-holder, .mobile-header-icons). Markup of the bar, the language
   button and the price in the sticky bar: mu-plugins/marence-tabbar.php. Layers: theme panels 600, overlay 603,
   open search 604; ours below them: sticky shop toolbar 589, header 590 (stage 4b, was 95), bottom bar 595.
   Nothing here applies from 1024 px except the two hides at the end. Stage 4b (28.09 evening): header sticky, language column,
   shop toolbar sticky, Kategorijas panel; the Kategorijas list itself is a section after this one (all widths). */
@media (max-width:1023px){
  :root{
    --m-gut:16px;--m-mh:90px;--m-bar-h:56px;--m-sbar-h:64px;
    --m-safe:env(safe-area-inset-bottom, 0px);
    --m-pad-l:max(var(--m-gut), env(safe-area-inset-left, 0px));
    --m-pad-r:max(var(--m-gut), env(safe-area-inset-right, 0px));
  }

  /* header: sticky white 90 on every page up to 1023 px (stage 4b, owner 28.09 evening "как у них сейчас": the live phone
     header stays pinned after the empty campaign bar, goya-app.js stickyHeader has no hide-on-scroll-down). Sticky keeps it
     in the flow: no spacer, no script, no shift; 90 also on 992-1023 where the theme would give the desktop 96 / 88.
     Layer 590: above slick arrows and dots (500, core.css 8318/8419) and the product gallery nav (500, shop.css 2366/2737),
     below the bottom bar 595 and the theme panels 600-604. #wrapper is overflow:clip (core.css 1211), sticky works. */
  #header.site-header,
  body.header_on_scroll #header.site-header{
    position:sticky;top:0;z-index:590;height:auto;min-height:0;
    background:var(--m-paper);box-shadow:none;transform:none;overflow:visible;
  }
  #header.site-header::after{content:none}
  .header-spacer,.product-header-spacer{display:none}
  #top-bar{display:none}
  html{scroll-padding-top:calc(var(--m-mh) + env(safe-area-inset-top, 0px) + 8px)}
  /* logged-in with the WordPress admin bar: the bar is fixed from 601 px (46 up to 782, 32 above), sticky goes under it */
  @media (min-width:601px) and (max-width:782px){body.admin-bar #header.site-header{top:46px}}
  @media (min-width:783px){body.admin-bar #header.site-header{top:32px}}
  #header .header-mobile{height:auto}
  #header .header-mobile .header-contents{
    display:grid;grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);grid-template-rows:minmax(0, 1fr);align-items:center;
    position:relative;box-sizing:border-box;width:auto;max-width:none;
    height:calc(var(--m-mh) + env(safe-area-inset-top, 0px));margin:0;
    padding:env(safe-area-inset-top, 0px) var(--m-pad-r) 0 var(--m-pad-l);
    background:var(--m-paper);border-bottom:1px solid var(--m-rule);
  }
  #header .header-mobile .header-contents::before,
  #header .header-mobile .header-contents::after{content:none}
  #header .header-mobile .hamburger-menu{justify-self:start;margin:0 0 0 -11px}
  #header .header-mobile .menu-toggle{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;color:var(--m-ink)}
  #header .header-mobile .menu-toggle svg{display:block;width:22px;height:22px;stroke-width:1.5;stroke-linecap:butt}
  #header .header-mobile .menu-toggle .name{display:none}
  #header .header-mobile .menu-toggle:focus-visible{outline:2px solid var(--m-ink);outline-offset:-4px}

  /* logo: the full theme logo (site_logo, Customizer > Logo) exactly as the theme draws it on the live site: the holder takes
     the full row height, the theme sizes the image (logo_height_mobile 69); owner 28.09 17:19 "логотип виден весь" */
  #header .header-mobile .logo-holder{justify-self:center;align-self:stretch;height:100%;margin:0;padding:0;overflow:visible}
  #header .header-mobile .logolink:focus-visible{outline:2px solid var(--m-ink);outline-offset:4px}

  /* language: one round button (owner 28.09 17:19: "мягкую, приятную, кругленькую"; a deliberate exception to the sharp
     corners of the brand canon, by his direct word); the list hangs under the button, right edge = right edge of the circle */
  #header .header-mobile .mobile-header-icons{justify-self:end;display:flex;justify-content:flex-end;align-items:center;min-width:0}
  #header .header-mobile .mobile-header-icons > *{margin-left:0}
  /* language (stage 4b, recipe v3.1, owner 28.09 evening "ровнее, в столбик"): the round button + a column of the two OTHER
     languages as the same circles under it, no box, no shadow; the current language is not repeated (marence-tabbar.php) */
  .m-lang{position:relative;margin:0 -2px 0 0;padding:0}
  .m-lang__btn{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .m-lang__btn::-webkit-details-marker{display:none}
  .m-lang__btn::marker{content:""}
  .m-lang__code,
  #header .m-lang__list a > span[aria-hidden]{
    display:grid;place-items:center;width:40px;height:40px;box-sizing:border-box;margin:0;padding:0 0 0 .1em;
    background:var(--m-paper);color:var(--m-ink);border:1px solid var(--m-ink);border-radius:50%;
    font-size:12px;font-weight:600;line-height:1;letter-spacing:.1em;text-transform:uppercase;
  }
  .m-lang__btn:active .m-lang__code{background:#ECEAE9}
  .m-lang[open] .m-lang__code{background:var(--m-ink);border-color:var(--m-ink);color:var(--m-paper)}
  .m-lang__btn:focus-visible{outline:none}
  .m-lang__btn:focus-visible .m-lang__code{outline:2px solid var(--m-ink);outline-offset:2px}
  #header .m-lang__list{
    position:absolute;top:calc(100% + 4px);right:0;z-index:2;
    display:grid;grid-auto-rows:44px;row-gap:4px;width:44px;height:auto;min-width:0;
    margin:0;padding:0;list-style:none;overflow:visible;
    background:none;border:0;border-radius:0;box-shadow:none;
  }
  #header .m-lang__list li{
    display:grid;place-items:center;width:44px;height:44px;min-height:0;margin:0;padding:0;
    border:0;background:none;line-height:1;list-style:none;
  }
  #header .m-lang__list li::before,#header .m-lang__list li::after,
  #header .m-lang__list a::before,#header .m-lang__list a::after{content:none}
  #header .m-lang__list a{
    display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;
    border:0;background:none;color:var(--m-ink);text-decoration:none;line-height:1;
    -webkit-tap-highlight-color:transparent;
  }
  #header .m-lang__list a:active > span[aria-hidden]{background:#ECEAE9}
  #header .m-lang__list a:focus-visible{outline:none}
  #header .m-lang__list a:focus-visible > span[aria-hidden]{outline:2px solid var(--m-ink);outline-offset:2px}
  .m-lang[open] .m-lang__list li{opacity:1;transform:none;transition:opacity 160ms var(--m-ease), transform 160ms var(--m-ease)}
  .m-lang[open] .m-lang__list li:nth-child(2){transition-delay:20ms}
  @starting-style{.m-lang[open] .m-lang__list li{opacity:0;transform:translateY(-8px)}}

  /* hero pages (own flag _marence_phone_hero, marence-tabbar.php; phone only, set on no page yet): the header lies on the
     first photo without a background until the theme puts header_on_scroll on body (scroll > 0), then white */
  body.m-hero #header.site-header{margin-bottom:calc(-1 * (var(--m-mh) + env(safe-area-inset-top, 0px)))}
  body.m-hero .wpb-content-wrapper > .sec_row:first-child > .vc_row:first-child{margin-top:0 !important}
  body.m-hero:not(.header_on_scroll) #header.site-header,
  body.m-hero:not(.header_on_scroll) #header .header-mobile .header-contents{background:transparent;border-bottom-color:transparent}
  body.m-hero #header.site-header,
  body.m-hero #header .header-mobile .header-contents{transition:background-color 180ms var(--m-ease), border-color 180ms var(--m-ease)}
  body.m-hero--light:not(.header_on_scroll) #header .header-mobile .logolink .logoimg.bg--light{display:none}
  body.m-hero--light:not(.header_on_scroll) #header .header-mobile .logolink .logoimg.bg--dark{display:block;opacity:1}
  body.m-hero--light:not(.header_on_scroll) #header .header-mobile .menu-toggle{color:#FFFFFF}
  body.m-hero--light:not(.header_on_scroll) #header .header-mobile .menu-toggle:focus-visible,
  body.m-hero--light:not(.header_on_scroll) #header .header-mobile .logolink:focus-visible{outline-color:#FFFFFF}
  body.m-hero--light:not(.header_on_scroll) .m-lang:not([open]) .m-lang__code{background:transparent;border-color:#FFFFFF;color:#FFFFFF}
  body.m-hero--light:not(.header_on_scroll) .m-lang__btn:focus-visible .m-lang__code{outline-color:#FFFFFF}

  /* bottom bar */
  /* room for the bar on #wrapper, not on body (19.10, live: the bar covered the copyright row): the theme gives html and
     body height:100% (core.css 43-81), so a body padding stays inside the first screen and the page never scrolls past
     the footer; #wrapper (flex column, min-height:100%, border-box, core.css 1205) grows with it on long pages and keeps
     the footer right above the bar on short ones */
  body.m-has-tabbar #wrapper{padding-bottom:calc(var(--m-bar-h) + var(--m-safe))}
  html:has(body.m-has-tabbar){scroll-padding-bottom:calc(var(--m-bar-h) + var(--m-safe) + 8px)}
  .m-tabbar{
    position:fixed;left:0;right:0;bottom:0;z-index:595;
    padding:0 env(safe-area-inset-right, 0px) var(--m-safe) env(safe-area-inset-left, 0px);
    background:var(--m-paper);border-top:1px solid var(--m-ink);
  }
  .m-tabbar ul{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));max-width:600px;margin:0 auto;padding:0;list-style:none}
  .m-tabbar li{margin:0;padding:0;border-left:1px solid var(--m-rule)}
  .m-tabbar li:first-child{border-left:0}
  .m-tabbar .m-tab{
    position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    width:100%;height:var(--m-bar-h);margin:0;padding:0;box-sizing:border-box;
    background:none;border:0;border-radius:0;color:var(--m-ink);text-decoration:none;
    -webkit-tap-highlight-color:transparent;
  }
  .m-tabbar .m-tab::before,.m-tabbar .m-tab::after{content:none}
  .m-tab__ico{display:block;width:22px;height:22px;line-height:0}
  .m-tab__ico svg{display:block;width:22px;height:22px;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter}
  .m-tab__lbl{font-size:10px;font-weight:600;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
  .m-tabbar .m-tab:active{background:#ECEAE9}
  .m-tabbar .m-tab:focus-visible{outline:2px solid var(--m-ink);outline-offset:-4px}
  .m-tabbar .m-tab[aria-current] .m-tab__lbl{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
  .m-tabbar .m-tab .minicart-counter{
    position:absolute;top:7px;left:calc(50% + 13px);right:auto;display:block;
    width:auto;min-width:0;height:auto;margin:0;padding:0;
    background:none;color:var(--m-ink);border:0;border-radius:0;box-shadow:none;transform:none;
    font-size:10px;font-weight:600;line-height:1;
  }
  .m-tabbar .m-tab .minicart-counter.et-count-zero{display:none}
  .m-tabbar .m-tab .text{display:none}

  /* shop toolbar (stage 4b, recipe v3.5, owner 28.09 evening "едет вместе с шапкой"): Kategorijas, sort, view stick under
     the sticky header, 52 always. .shop-filters sits in .shop_bar > .row > .col-md-6 (wc-functions.php 240-300), a box as
     short as itself where sticky cannot move: the three wrappers become display:contents, so the sticky box is bounded by
     .shop-products-col (products + pagination). Breadcrumbs and the count stay in the flow above and do not stick.
     The white band + bottom rule reach the screen edges through border-image outset (no layout; #wrapper clips it). */
  .shop_bar,
  .shop_bar > .row,
  .shop_bar > .row > .col-md-6:not(.category_bar){display:contents}
  .shop_bar > .row > .category_bar{flex:none;max-width:none;width:auto;margin:16px 0 0;padding:0}
  .shop_bar .shop-filters,
  .shop_bar .shop-filters.sticky-filters{
    position:sticky;top:calc(var(--m-mh) + env(safe-area-inset-top, 0px));bottom:auto;left:auto;right:auto;z-index:589;
    display:flex;align-items:center;justify-content:flex-start;gap:12px;width:auto;
    height:52px;min-height:0;box-sizing:border-box;margin:8px 0 16px;padding:0;border:0;box-shadow:none;
    background:var(--m-paper);
    border-image:linear-gradient(var(--m-paper) calc(100% - 1px), var(--m-rule) 0) fill 0 / 0 / 0 100vw;
  }
  html:has(.shop_bar .shop-filters){scroll-padding-top:calc(var(--m-mh) + env(safe-area-inset-top, 0px) + 60px)}
  .shop_bar .filter-trigger-box{margin:0;padding:0;border:0;flex:none}
  .shop_bar .filter-trigger{
    position:relative;inset:auto;transform:none;flex:none;
    display:inline-flex;align-items:center;gap:6px;height:36px;margin:0;padding:0 12px;box-sizing:border-box;
    background:var(--m-paper);color:var(--m-ink);border:1px solid var(--m-ink);border-radius:0;box-shadow:none;
    font:inherit;font-size:12px;font-weight:600;line-height:1;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
  }
  .shop_bar .filter-trigger :is(svg, .icon-filter, .icon-close){display:none}
  .shop_bar .filter-trigger .et-active-filters-count{
    position:static;min-width:0;width:auto;height:auto;margin:0;padding:0;
    background:none;color:inherit;border:0;border-radius:0;font:inherit;line-height:1;
  }
  .shop_bar .filter-trigger .et-active-filters-count:not(.active){display:none}
  .shop_bar .filter-trigger .et-active-filters-count.active{display:inline}
  .shop_bar .filter-trigger:active{background:#ECEAE9}
  .shop_bar .filter-trigger:focus-visible{outline:2px solid var(--m-ink);outline-offset:2px}
  .shop_bar .woocommerce-ordering{flex:0 1 auto;min-width:0;margin:0 0 0 auto}
  .shop_bar .shop-filters .orderby{
    height:44px;max-width:100%;border:0;border-radius:0;background-color:transparent;
    font-size:14px;font-weight:400;color:var(--m-ink);text-align:right;text-overflow:ellipsis;
  }
  .shop_bar .shop-filters .orderby:focus-visible{outline:2px solid var(--m-ink);outline-offset:2px}
  .shop_bar .filter-trigger::before{content:"";position:absolute;left:-1px;right:-1px;top:-5px;bottom:-5px}
  .shop_bar .shop-filters .woocommerce-ordering{flex:1 1 auto;min-width:0;margin:0;display:flex;justify-content:flex-end}
  .shop_bar .shop-filters .orderby{min-width:0}
  .shop_bar .shop-views{flex:none;display:flex;align-items:center;margin:0 -11px 0 0;padding:0}
  .shop_bar .shop-views::before{content:none;display:none}
  .shop_bar .shop-views button{
    position:relative;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:0;background:none;
    color:var(--m-ink);opacity:1;align-items:center;justify-content:center;
  }
  .shop_bar .shop-views :is(.grid-icon, .small-icon, .list-icon){display:none}
  .shop_bar .shop-views .grid-icon,
  .shop_bar .shop-views.list-1 .list-icon,
  .shop_bar .shop-views.small-1 .small-icon{display:inline-flex}
  .shop_bar .shop-views button svg{display:block;width:22px;height:22px}
  .shop_bar .shop-views button::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;width:auto;height:1px;background:transparent}
  .shop_bar .shop-views button.active::after{background:var(--m-ink)}
  .shop_bar .shop-views button:focus-visible{outline:2px solid var(--m-ink);outline-offset:-4px}

  /* Kategorijas panel (stage 4b, recipe v3.3): sections vs subsections; the accordion markup = mu-plugins/marence-cat-accordion.php
     (<details> per section with subsections, first row "Skatīt visu"). Theme markup (wc-functions.php 309-326): #side-filters >
     header (.side-panel-title "Kategorijas" + button.et-close "Aizvērt") + .side-panel-content > ul.shop-sidebar > .widget.
     The only close button of the theme is moved to a black bar at the bottom of the panel (goya-app.js 931 closes on it).
     Up to 991 only: from 992 the theme shows #side-filters as the sidebar column of the shop (shop.css 701-720), not a panel. */
  @media (max-width:991px){
  #side-filters.side-panel > header{
    position:static;display:flex;align-items:center;justify-content:flex-start;height:56px;box-sizing:border-box;margin:0;
    padding:0 var(--m-pad-r) 0 var(--m-pad-l);background:var(--m-paper);border:0;border-bottom:1px solid var(--m-rule);box-shadow:none;
  }
  #side-filters .side-panel-title{margin:0;color:var(--m-ink);font-size:12px;font-weight:600;line-height:1;letter-spacing:.2em;text-transform:uppercase}
  #side-filters .side-panel-content{padding:8px var(--m-pad-r) calc(96px + var(--m-safe)) var(--m-pad-l);overflow-y:auto;-webkit-overflow-scrolling:touch}
  #side-filters::after{
    content:"";position:absolute;left:0;right:0;bottom:0;z-index:1;height:calc(72px + var(--m-safe));
    background:var(--m-paper);border-top:1px solid var(--m-rule);pointer-events:none;
  }
  #side-filters.side-panel .et-close,
  #side-filters.side-panel .et-close.button{
    position:absolute;left:var(--m-pad-l);right:var(--m-pad-r);bottom:calc(12px + var(--m-safe));z-index:2;
    display:flex;align-items:center;justify-content:center;width:auto;height:48px;box-sizing:border-box;margin:0;padding:0 16px;
    background:var(--m-ink);color:var(--m-paper);border:0;border-radius:0;box-shadow:none;transform:none;animation:none;
    font-size:12px;font-weight:600;line-height:1;letter-spacing:.12em;text-transform:uppercase;opacity:1;
  }
  #side-filters.side-panel .et-close::before,#side-filters.side-panel .et-close::after{content:none;display:none}
  #side-filters.side-panel .et-close:active{background:#333333}
  #side-filters.side-panel .et-close:focus-visible{outline:2px solid var(--m-ink);outline-offset:2px}
  }

  /* theme sticky add-to-cart bar on the product page (product_sticky_bar, trigger-only): price left, button right */
  body.single-product .sticky-product-bar{
    height:auto;min-height:calc(var(--m-sbar-h) + var(--m-safe));box-sizing:border-box;padding:0 0 var(--m-safe);
    background:var(--m-paper);border:0;border-top:1px solid var(--m-ink);border-radius:0;box-shadow:none;
  }
  body.single-product .sticky-product-bar .container{width:100%;max-width:none;padding:0 var(--m-pad-r) 0 var(--m-pad-l)}
  body.single-product .sticky-product-bar .row{margin:0}
  body.single-product .sticky-product-bar .col-12{padding:0}
  body.single-product .sticky-product-bar-content{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--m-sbar-h)}
  body.single-product .sticky-product-bar-content .sticky-product-bar-title{display:none}
  body.single-product .sticky-product-bar .sticky-product-bar-image{display:block;flex:1 1 auto;width:auto;max-width:none;min-width:0;margin:0}
  body.single-product .sticky-product-bar .sticky-product-bar-image img{display:none}
  .m-sticky-price{display:flex;flex-direction:column;gap:2px;color:var(--m-ink);font-size:17px;font-weight:600;line-height:1.2;white-space:nowrap}
  .m-sticky-price del{order:-1;color:var(--m-ink-2);font-size:12px;font-weight:400;text-decoration:line-through}
  .m-sticky-price ins{color:var(--m-ink);background:none;text-decoration:none}
  body.single-product .sticky-product-bar .stock{margin:2px 0 0;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--m-ink)}
  body.single-product .sticky-product-bar .sticky_add_to_cart{
    flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:56%;height:48px;
    margin:0;padding:0 16px;box-sizing:border-box;
    background:var(--m-ink);color:var(--m-paper);border:0;border-radius:0;box-shadow:none;
    font-size:12px;font-weight:600;line-height:1;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  }
  body.single-product .sticky-product-bar .sticky_add_to_cart:focus-visible{outline:2px solid var(--m-ink);outline-offset:2px}
  body.fixed-product-bar.product-bar-visible.single-product .footer{margin-bottom:calc(var(--m-sbar-h) + var(--m-safe))}

  #scroll_to_top{display:none !important}
}
@media (max-width:1023px) and (hover:none) and (pointer:coarse){
  body.m-has-tabbar:has(:is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"], [type="range"], [type="color"], [type="file"]), textarea, [contenteditable="true"]):focus) .m-tabbar{display:none}
}
@media (max-width:359px){:root{--m-gut:12px}}
@media (min-width:576px) and (max-width:1023px){:root{--m-gut:20px}}
@media (max-width:1023px) and (max-height:500px){
  :root{--m-bar-h:48px}
  .m-tabbar .m-tab{flex-direction:row;gap:8px}
}
@media (max-width:1023px) and (prefers-reduced-motion:reduce){
  .m-lang[open] .m-lang__list li{transition:none}
  .side-panel,.sticky-product-bar{transition:none !important;animation:none !important}
  body.m-hero #header.site-header,body.m-hero #header .header-mobile .header-contents{transition:none}
}

/* == Kategorijas list (stage 4b, recipe v3.3), all widths: the same widget is the phone panel and, from 992 px, the
   sidebar column of the shop; markup mu-plugins/marence-cat-accordion.php. Big sections 600 capitals between rules,
   subsections 400 with an indent, + / − sign, current underlined; theme pill of the current item (shop.css 9184-9212) off == */
#side-filters{--m-cat-pl:var(--m-pad-l, 0px);--m-cat-pr:var(--m-pad-r, 0px)}
#side-filters .widget_product_categories{margin:0;padding:0;border:0}
#side-filters .widget_product_categories .product-categories{margin:0;padding:0;list-style:none}
#side-filters .widget_product_categories li{margin:0;padding:0;border:0;list-style:none;line-height:1}
#side-filters .widget_product_categories li > a,
#side-filters .widget_product_categories li.current-cat > a{
  display:flex;position:static;margin:0;padding:0;background:none;border-radius:0;line-height:1.3;color:var(--m-ink);
}
#side-filters .widget_product_categories li > a::before,
#side-filters .widget_product_categories li > a::after{content:none;display:none}
#side-filters .m-cat{border-top:1px solid var(--m-rule)}
#side-filters .m-cat:first-child{border-top:0}
#side-filters .m-cat:last-child{border-bottom:1px solid var(--m-rule)}
#side-filters .m-cat__acc{margin:0;padding:0}
#side-filters .m-cat__head,
#side-filters .widget_product_categories li > a.m-cat__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;box-sizing:border-box;
  margin:0 calc(-1 * var(--m-cat-pr)) 0 calc(-1 * var(--m-cat-pl));padding:14px var(--m-cat-pr) 14px var(--m-cat-pl);
  color:var(--m-ink);background:none;text-decoration:none;cursor:pointer;list-style:none;
  font-size:13px;font-weight:600;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;
  -webkit-tap-highlight-color:transparent;
}
#side-filters .m-cat__head::-webkit-details-marker{display:none}
#side-filters .m-cat__head::marker{content:""}
#side-filters .m-cat__sign{position:relative;flex:none;width:44px;height:44px;margin:-14px -14px -14px auto}
#side-filters .m-cat__sign::before,#side-filters .m-cat__sign::after{content:"";position:absolute;left:50%;top:50%;background:var(--m-ink)}
#side-filters .m-cat__sign::before{width:12px;height:1.5px;margin:-.75px 0 0 -6px}
#side-filters .m-cat__sign::after{width:1.5px;height:12px;margin:-6px 0 0 -.75px;transition:transform 150ms var(--m-ease)}
#side-filters .m-cat__acc[open] > .m-cat__head .m-cat__sign::after{transform:scaleY(0)}
#side-filters .widget_product_categories .m-cat .children{margin:0;padding:0 0 12px 16px;list-style:none}
#side-filters .widget_product_categories .m-cat .children .children{padding:0 0 4px 16px}
#side-filters .widget_product_categories .m-cat .children a,
#side-filters .widget_product_categories .m-cat .children li.current-cat > a{
  display:flex;align-items:center;min-height:44px;box-sizing:border-box;
  margin:0 calc(-1 * var(--m-cat-pr)) 0 calc(-1 * (var(--m-cat-pl) + 16px));padding:11px var(--m-cat-pr) 11px calc(var(--m-cat-pl) + 16px);
  color:var(--m-ink);background:none;text-decoration:none;font-size:14px;font-weight:400;line-height:1.35;letter-spacing:0;text-transform:none;
}
#side-filters .widget_product_categories .m-cat .children .children a{font-size:13px}
#side-filters .widget_product_categories .count{margin-left:6px;color:#555454;font-size:12px;font-weight:400;letter-spacing:0}
#side-filters .widget_product_categories [aria-current="page"],
#side-filters .widget_product_categories .m-cat.current-cat > .m-cat__acc > .m-cat__head .m-cat__name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
#side-filters .m-cat__head:active,#side-filters .widget_product_categories .m-cat .children a:active{background:#ECEAE9}
#side-filters .m-cat__head:focus-visible,#side-filters .widget_product_categories .m-cat .children a:focus-visible{outline:2px solid var(--m-ink);outline-offset:-2px}
@media (hover:hover){
  #side-filters .m-cat__head:hover,#side-filters .widget_product_categories .m-cat .children a:hover{background:#ECEAE9}
}
@media (prefers-reduced-motion:reduce){#side-filters .m-cat__sign::after{transition:none}}
/* from 1024 px (html.m-cat-wide, set by the inline script of marence-cat-accordion.php, stage 7b): every section open,
   the name is a link, no + / − and no "Skatīt visu" row; below 1024 the accordion as before */
.m-cat-wide #side-filters .m-cat__sign,
.m-cat-wide #side-filters .widget_product_categories .m-cat__all{display:none}
.m-cat-wide #side-filters .m-cat__head a.m-cat__name{color:inherit;text-decoration:inherit}
@media (min-width:1024px){
  .m-tabbar,.m-sticky-price{display:none !important}
}

/* == footer (ivory, D-108): draft design/footer-v2-2026-09-29/src-ivory/build.mjs, plan tech-ivory.md, build log stage 8 == */
/* Theme markup (goya inc/frontend/footer.php): footer#colophon > .footer-middle.footer-widgets (subscription, shortcode
   [marence_footer_top] of mu-plugins/marence-footer.php; the theme gives it the class footer-widgets too, hence
   :not(.footer-middle) below) > .footer-widgets.footer-toggle-widgets > .container > .row > .footer1..4 (widgets) >
   #footer-bar (.footer-left: copyright + nav#footer-bar-menu, .footer-center: empty, .footer-right: .m-flang).
   Five columns without a fifth widget area: .footer1 is display:contents, so its two widgets (brand block [marence_footer_brand]
   + the shop menu of the language) are cells of the grid; the brand block goes first by its class. Lotus on the top rule =
   mask of img/marence-sign.svg over a rule with a gap; flower = img.m-fleaf of the brand block, absolute in #colophon, under
   the text (z-index -1 inside the isolated footer). Up to 767 the theme folds every widget that has a .widgettitle
   (goya-app.js toggleWidgets: .widgettitle.active = folded); the brand block and KONTAKTI have no widget title and stay open.
   #colophon beats the inline Kirki colours printed after this file. Every colour, size and step = token in :root (D-106). */
#colophon.site-footer{
  position:relative;isolation:isolate;overflow:hidden;margin:0;padding:0;border:0;
  background:var(--m-ivory);color:var(--m-char);
  font-size:var(--m-fs-4);font-weight:var(--m-fw-reg);line-height:var(--m-lh-2);
}
#colophon :is(.footer-middle, .footer-widgets){margin:0;padding:0;border:0;background:none;color:inherit}
#colophon :is(.footer-middle, .footer-widgets, #footer-bar) > .container{width:calc(100% - 2 * var(--m-pad));max-width:var(--m-wrap);margin-inline:auto;padding:0}
#colophon .row{margin:0}
#colophon .row > [class*="col-"]{flex:none;width:auto;max-width:none;min-height:0;margin:0;padding:0}
#colophon .widget{margin:0;padding:0;border:0}
#colophon ul{margin:0;padding:0;list-style:none}
#colophon li{margin:0;padding:0;border:0}
#colophon address{margin:0;font-style:normal}
#colophon a,
#colophon a:hover{color:inherit;opacity:1}
#colophon a{text-decoration:none}
#colophon a::before,
#colophon a::after{content:none}
#colophon a:hover{text-decoration:underline;text-decoration-color:var(--m-gold);text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off)}
#colophon :is(a, button, input):focus-visible{outline:var(--m-focus) solid var(--m-char);outline-offset:var(--m-focus-off)}

/* headings: 600, capitals, brand tracking, short gold rule under them */
#colophon :is(.widgettitle, .m-foot-h){
  position:relative;margin:0;padding:0;border:0;background:none;color:inherit;
  font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);line-height:var(--m-lh-1);letter-spacing:var(--m-track);text-transform:uppercase;
}
#colophon :is(.widgettitle, .m-foot-h)::after{content:"";display:block;width:var(--m-mark);height:var(--m-line);margin:var(--m-s4) 0;background:var(--m-gold)}

/* row 1: subscription (heading and lead over columns 1-2, form over columns 3-5 of the grid below) */
#colophon .footer-middle{padding-top:var(--m-band)}
#colophon .footer-middle .row{display:block}
#colophon .m-sub{display:grid;grid-template-columns:var(--m-fcols);align-items:start}
#colophon .m-sub__txt{grid-column:1 / 3;padding:0 var(--m-s6) 0 var(--m-indent)}
#colophon .m-sub__lead{max-width:var(--m-lead-w);margin:0;line-height:var(--m-lh-3);text-wrap:pretty}
#colophon .m-sub__form{grid-column:3 / 6;margin:0;padding:0}
#colophon .m-sub__lbl{display:block;margin:0 0 var(--m-s2);font-size:var(--m-fs-3);color:var(--m-char-2)}
#colophon .m-sub__row{display:flex}
#colophon .m-sub__input{
  flex:1 1 auto;min-width:0;height:var(--m-btn-h);box-sizing:border-box;margin:0;padding:0 var(--m-s4);
  border:var(--m-line) solid var(--m-gold);border-right:0;border-radius:0;box-shadow:none;
  background:var(--m-paper);color:var(--m-char);font:inherit;-webkit-appearance:none;appearance:none;
}
#colophon .m-sub__input:focus{border-color:var(--m-char)}
#colophon .m-sub__btn{
  flex:none;height:var(--m-btn-h);box-sizing:border-box;margin:0;padding:0 var(--m-s6);
  border:var(--m-line) solid var(--m-char);border-radius:0;box-shadow:none;background:var(--m-char);color:var(--m-ivory);
  font-family:inherit;font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);line-height:var(--m-lh-0);
  letter-spacing:var(--m-track-s);text-transform:uppercase;white-space:nowrap;cursor:pointer;
}
#colophon .m-sub__btn:hover{background:var(--m-ink);border-color:var(--m-ink)}
#colophon .m-sub__ok{display:flex;align-items:flex-start;gap:var(--m-s4);margin:var(--m-s4) 0 0;font-size:var(--m-fs-3);color:var(--m-char-2);cursor:pointer}
#colophon .m-sub__ok input{
  flex:none;width:var(--m-check);height:var(--m-check);box-sizing:border-box;margin:var(--m-line) 0 0;padding:var(--m-check-in);
  border:var(--m-line) solid var(--m-gold);border-radius:0;box-shadow:none;background:var(--m-paper);
  -webkit-appearance:none;appearance:none;cursor:pointer;
}
#colophon .m-sub__ok input:checked{background:linear-gradient(var(--m-gold), var(--m-gold)) content-box, var(--m-paper)}
#colophon .m-sub__ok a{text-decoration:underline;text-decoration-color:var(--m-gold);text-underline-offset:var(--m-ul-off)}
#colophon .m-sub__msg{margin:var(--m-s3) 0 0;color:var(--m-char)}
#colophon .m-sub__msg:empty{margin:0}

/* row 2: the rule with the lotus, then five columns */
#colophon .footer-widgets:not(.footer-middle){padding-top:var(--m-band)}
#colophon .footer-widgets:not(.footer-middle) > .container::before{
  content:"";display:block;height:var(--m-lotus-h);background:var(--m-rule-warm);
  -webkit-mask:url(img/marence-sign.svg) center / var(--m-lotus) auto no-repeat,
    linear-gradient(to right, var(--m-ink) calc(50% - var(--m-lotus) / 2 - var(--m-s5)), transparent 0 calc(50% + var(--m-lotus) / 2 + var(--m-s5)), var(--m-ink) 0) center / 100% var(--m-line) no-repeat;
  mask:url(img/marence-sign.svg) center / var(--m-lotus) auto no-repeat,
    linear-gradient(to right, var(--m-ink) calc(50% - var(--m-lotus) / 2 - var(--m-s5)), transparent 0 calc(50% + var(--m-lotus) / 2 + var(--m-s5)), var(--m-ink) 0) center / 100% var(--m-line) no-repeat;
}
#colophon .footer-widgets:not(.footer-middle) .row{display:grid;grid-template-columns:var(--m-fcols);padding:var(--m-band) 0}
#colophon .footer-widgets:not(.footer-middle) .row > .footer1{display:contents}
#colophon .footer-widgets:not(.footer-middle) :is(.footer1 > .widget, .footer2, .footer3){padding-right:var(--m-s4)}
#colophon .footer-widgets:not(.footer-middle) .widget:has(.m-fbrand){order:-1;padding-left:var(--m-indent)}
#colophon .footer-widgets:not(.footer-middle) .menu a{display:inline-block;padding:var(--m-link-y) 0;line-height:var(--m-lh-1)}
/* shop sections: the category names are stored in capitals; shown in sentence case by CSS only (a renamed category follows) */
#colophon .footer-widgets:not(.footer-middle) .footer1 .menu a{text-transform:lowercase}
#colophon .footer-widgets:not(.footer-middle) .footer1 .menu a::first-letter{text-transform:uppercase}

/* brand block: official lock-up all black, phrase, social icons black in thin gold rings, flower */
#colophon .m-fbrand__logo{display:block;width:var(--m-flogo)}
#colophon .m-fbrand__logo:hover{text-decoration:none}
#colophon .m-fbrand__mark{display:block;width:100%;height:auto;color:var(--m-ink);fill:currentColor}
#colophon .m-fbrand__say{max-width:var(--m-say-w);margin:var(--m-s6) 0 0;line-height:var(--m-lh-3);text-wrap:pretty}
#colophon .m-fsoc{display:flex;gap:var(--m-s4);margin-top:var(--m-s5)}
#colophon .m-fsoc a{display:grid;place-items:center;width:var(--m-ring);height:var(--m-ring);box-sizing:border-box;border:var(--m-line) solid var(--m-gold);border-radius:var(--m-round)}
#colophon .m-fsoc a:hover{border-color:var(--m-ink);text-decoration:none}
#colophon .m-fsoc svg{display:block;width:var(--m-glyph);height:var(--m-glyph);color:var(--m-ink);fill:currentColor}
#colophon .m-fsoc .m-fsoc__line{fill:none;stroke:currentColor;stroke-width:var(--m-hair)}
#colophon .m-fsoc .m-fsoc__dot{fill:currentColor;stroke:none}
#colophon .m-fleaf{position:absolute;left:var(--m-leaf-x);bottom:0;z-index:-1;display:block;width:var(--m-leaf);max-width:none;height:auto;pointer-events:none;user-select:none}

/* KONTAKTI (block per language, footer4): icon + ring = one mask per row class (Cloudflare rewrites mailto links, so never by href) */
#colophon .m-ct__i{display:grid;grid-template-columns:var(--m-ct-cols);column-gap:var(--m-s4);align-items:center;margin-top:var(--m-s4)}
#colophon .m-ct__i:first-child{margin-top:var(--m-s2)}
#colophon .m-ct__i::before{
  content:"";width:var(--m-ring);height:var(--m-ring);background:var(--m-gold);
  -webkit-mask:var(--m-ct-ico) center / contain no-repeat;mask:var(--m-ct-ico) center / contain no-repeat;
}
#colophon .m-ct__i--tel{--m-ct-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath fill-rule='evenodd' d='M20 0a20 20 0 1 0 0 40a20 20 0 1 0 0-40zm0 1a19 19 0 1 1 0 38a19 19 0 1 1 0-38z'/%3E%3Cpath transform='translate(11 11) scale(.75)' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25c1.1.37 2.3.57 3.6.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E")}
#colophon .m-ct__i--mail{--m-ct-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath fill-rule='evenodd' d='M20 0a20 20 0 1 0 0 40a20 20 0 1 0 0-40zm0 1a19 19 0 1 1 0 38a19 19 0 1 1 0-38z'/%3E%3Cpath transform='translate(11 11) scale(.75)' d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5z'/%3E%3C/svg%3E")}
#colophon .m-ct__i--pin{--m-ct-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath fill-rule='evenodd' d='M20 0a20 20 0 1 0 0 40a20 20 0 1 0 0-40zm0 1a19 19 0 1 1 0 38a19 19 0 1 1 0-38z'/%3E%3Cpath transform='translate(11 11) scale(.75)' d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E")}
#colophon .m-ct__sub{display:block;font-size:var(--m-fs-3);color:var(--m-char-2)}

/* row 3: bottom bar = four cells (copyright, two legal links, languages) with thin dividers; the legal menu keeps its list
   semantics through subgrid (nav and ul span cells 2-3) */
#colophon #footer-bar{margin:0;padding:0;border:0;border-top:var(--m-line) solid var(--m-rule-warm);background:none;color:inherit;font-size:var(--m-fs-3)}
#colophon #footer-bar > .container{display:grid;grid-template-columns:var(--m-fbar-cols);align-items:center;min-height:calc(var(--m-band) + var(--m-s4))}
#colophon #footer-bar .footer-left{display:contents}
#colophon #footer-bar .footer-center{display:none}
#colophon #footer-bar .footer-items > *{margin:0;float:none}
#colophon #footer-bar .copyright{display:flex;align-items:center;justify-self:start;min-height:var(--m-tap);padding-left:var(--m-indent)}
#colophon #footer-bar .copyright p{margin:0}
#colophon #footer-bar-menu{grid-column:2 / 4;display:grid;grid-template-columns:subgrid}
#colophon #footer-bar-menu .menu{grid-column:1 / -1;display:grid;grid-template-columns:subgrid}
#colophon #footer-bar :is(.menu li, .footer-right){position:relative;display:flex;align-items:center;justify-content:center;min-height:var(--m-tap)}
#colophon #footer-bar :is(.menu li, .footer-right)::before{content:"";position:absolute;left:0;top:50%;width:var(--m-line);height:var(--m-div-h);transform:translateY(-50%);background:var(--m-rule-warm)}
#colophon #footer-bar .menu a{display:inline-block;margin:0}
#colophon .m-flang ul{display:flex;gap:var(--m-s6)}
#colophon .m-flang a{
  display:inline-flex;align-items:center;min-height:var(--m-tap);
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);line-height:var(--m-lh-0);letter-spacing:var(--m-track-s);text-transform:uppercase;
}
#colophon .m-flang a[aria-current]{text-decoration:underline;text-decoration-color:var(--m-gold);text-decoration-thickness:var(--m-focus);text-underline-offset:var(--m-ul-off)}

/* 768-1279: brand block over the row, four columns under it; subscription in two halves */
@media (max-width:1279px){
  #colophon .m-sub{grid-template-columns:var(--m-fcols-2)}
  #colophon .m-sub__txt{grid-column:1}
  #colophon .m-sub__form{grid-column:2}
  #colophon .footer-widgets:not(.footer-middle) .row{grid-template-columns:var(--m-fcols-md);row-gap:var(--m-s7)}
  #colophon .footer-widgets:not(.footer-middle) .widget:has(.m-fbrand){grid-column:1 / -1}
}

/* below 768: one column, everything centred; order: subscription, brand block (open), VEIKALS, PIRCĒJIEM, MARENCE (folded by
   the theme), KONTAKTI (open), languages, legal links, copyright; no lotus (solid rule), no flower (not downloaded) */
@media (max-width:767px){
  :root{--m-flogo:180px;--m-ring:44px}
  #colophon.site-footer{text-align:center}
  #colophon .m-fleaf{display:none}
  #colophon :is(.widgettitle, .m-foot-h)::after{margin-inline:auto}
  #colophon .footer-middle{padding-top:var(--m-s7)}
  #colophon .m-sub{grid-template-columns:var(--m-fcols-1)}
  #colophon .m-sub__txt,
  #colophon .m-sub__form{grid-column:auto;padding:0}
  #colophon .m-sub__lead{margin-inline:auto}
  #colophon .m-sub__form{margin-top:var(--m-s5)}
  #colophon .m-sub__row{flex-direction:column;gap:var(--m-s2)}
  #colophon .m-sub__input{border-right:var(--m-line) solid var(--m-gold)}
  #colophon .m-sub__btn{width:100%}
  #colophon .m-sub__ok{flex-direction:column;align-items:center;gap:var(--m-s2);min-height:var(--m-tap)}

  #colophon .footer-widgets:not(.footer-middle){padding-top:var(--m-s7)}
  #colophon .footer-widgets:not(.footer-middle) > .container::before{height:var(--m-line);-webkit-mask:none;mask:none}
  #colophon .footer-widgets:not(.footer-middle) .row{grid-template-columns:var(--m-fcols-1);row-gap:0;padding:var(--m-s7) 0 var(--m-s6)}
  #colophon .footer-widgets:not(.footer-middle) :is(.footer1 > .widget, .footer2, .footer3){padding-right:0}
  #colophon .footer-widgets:not(.footer-middle) .widget:has(.m-fbrand){padding:0 0 var(--m-s6)}
  #colophon .m-fbrand{display:grid;justify-items:center}
  #colophon .m-fbrand__say{margin-inline:auto}
  #colophon .m-fsoc{justify-content:center}

  #colophon .footer-widgets:not(.footer-middle) .widgettitle{display:flex;align-items:center;justify-content:center;min-height:var(--m-band);cursor:pointer;-webkit-tap-highlight-color:transparent}
  #colophon .footer-widgets:not(.footer-middle) .widgettitle::after{content:none}
  #colophon .footer-widgets:not(.footer-middle) .widgettitle span{
    position:absolute;top:50%;right:calc((var(--m-tap) - var(--m-sign)) / -2);display:block;width:var(--m-tap);height:var(--m-tap);margin:0;transform:translateY(-50%);
  }
  #colophon .footer-widgets:not(.footer-middle) .widgettitle span::before,
  #colophon .footer-widgets:not(.footer-middle) .widgettitle span::after{
    content:"";position:absolute;left:50%;top:50%;background:var(--m-gold);font-family:inherit;transform:translate(-50%, -50%);transition:none;
  }
  #colophon .footer-widgets:not(.footer-middle) .widgettitle span::before{width:var(--m-sign);height:var(--m-hair)}
  #colophon .footer-widgets:not(.footer-middle) .widgettitle span::after{display:none;width:var(--m-hair);height:var(--m-sign)}
  #colophon .footer-widgets:not(.footer-middle) .widgettitle.active span::after{display:block}
  #colophon .footer-widgets:not(.footer-middle) .widgettitle + div{padding-bottom:var(--m-s4)}
  #colophon .footer-widgets:not(.footer-middle) .menu a{display:block;padding:calc((var(--m-tap) - var(--m-lh-2) * var(--m-fs-4)) / 2) 0;line-height:var(--m-lh-2)}
  #colophon .footer-widgets:not(.footer-middle) .footer4{margin-top:var(--m-s5)}
  #colophon .m-ct__i{grid-template-columns:var(--m-fcols-1);justify-items:center;row-gap:var(--m-s2);margin-top:var(--m-s5)}
  #colophon .m-ct a{display:flex;align-items:center;justify-content:center;min-height:var(--m-tap)}

  #colophon #footer-bar > .container{grid-template-columns:var(--m-fcols-1);padding:var(--m-s2) 0 var(--m-s5)}
  #colophon #footer-bar .footer-right{order:-1}
  #colophon #footer-bar .copyright{order:1;justify-self:center;padding-left:0}
  #colophon #footer-bar-menu,
  #colophon #footer-bar-menu .menu{grid-column:auto;display:block}
  #colophon #footer-bar :is(.menu li, .footer-right)::before{content:none}
}

/* == smart header (D-101): scrolling down past the header hides it, scrolling up brings it back, at the top it always
   shows; phone and computer. The class m-hdr-hidden on <html> is set by mu-plugins/marence-smart-header.php (passive scroll
   + rAF, 8 px tolerance, never while the mega menu, a side panel, search, cart or the language list is open). Only
   transform moves, nothing leaves or enters the flow: CLS 0.
   Computer: the theme keeps the header out of the flow (absolute, then fixed with header_on_scroll, a 96 px spacer holds
   its place) while the top bar sat in the flow and scrolled away. To bring the WHOLE header back (top bar with Facebook,
   Instagram, phone, languages), the top bar leaves the flow too: absolute at the top, its 36 px kept as padding of
   .page-wrapper-inner (the page does not move), fixed together with the header once the theme sets header_on_scroll.
   The spacer stays 96 px (the theme shrank it to 88 on scroll: an 8 px jump of the whole page). == */
@media (min-width:783px){body.admin-bar{--m-ab:32px}}
@media (min-width:601px) and (max-width:782px){body.admin-bar{--m-ab:46px}}
@media (min-width:1024px){
  body.has-top-bar #top-bar.top-bar{position:absolute;top:0;left:0;right:0;z-index:var(--m-z-hdr);height:var(--m-tb);min-height:var(--m-tb);box-sizing:border-box}
  body.has-top-bar .page-wrapper-inner{padding-top:var(--m-tb)}
  body.has-top-bar:not(.header_on_scroll) #header.site-header,
  body.has-top-bar.header_on_scroll.megamenu-active #header.site-header{top:var(--m-tb)}
  body.has-top-bar.header_on_scroll:not(.megamenu-active) #top-bar.top-bar{position:fixed;top:var(--m-ab)}
  body.has-top-bar.header_on_scroll:not(.megamenu-active) #header.site-header{top:calc(var(--m-ab) + var(--m-tb))}
  #wrapper .header-spacer,
  #wrapper .product-header-spacer{height:var(--m-hdr-h)}
  html.m-hdr-hidden body.has-top-bar.header_on_scroll:not(.megamenu-active) #top-bar.top-bar{transform:translateY(calc(-100% - var(--m-ab)))}
  html.m-hdr-hidden body.has-top-bar.header_on_scroll:not(.megamenu-active) #header.site-header{transform:translateY(calc(-100% - var(--m-tb) - var(--m-ab)))}
  html.m-hdr-hidden body:not(.has-top-bar).header_on_scroll:not(.megamenu-active) #header.site-header{transform:translateY(calc(-100% - var(--m-ab)))}
}
@media (max-width:1023px){
  html.m-hdr-hidden body #header.site-header{transform:translateY(calc(-100% - var(--m-ab)))}
  html.m-hdr-hidden body .shop_bar .shop-filters{transform:translateY(calc(-1 * (var(--m-mh) + env(safe-area-inset-top, 0px))))}
}
@media (prefers-reduced-motion:no-preference){
  body #header.site-header{transition:transform var(--m-hdr-dur) var(--m-ease), height var(--m-hdr-dur-theme) linear, background-color var(--m-hdr-dur-theme) linear}
  body #top-bar.top-bar,
  body .shop_bar .shop-filters{transition:transform var(--m-hdr-dur) var(--m-ease)}
}

/* == home v3, stage 1 (D-112, D-115): first screen + holiday block. Markup: mu-plugins/marence-home-slides.php (theme
   hook goya_after_header_spacer, wrapper .m-home), draft design/homepage-v3-2026-09-30/middle.html (sections m-hero and
   ev-h, accepted as they are, D-113 p. 3), values recipe.md 3-6, 8.6, 9, 10. Everything is scoped to .m-home or to class
   names used nowhere else (checked 02.10): theme, WPBakery and the rest of the site are not touched; body.m-hero (phone
   hero flag of marence-tabbar.php) is another element. Edges: --m-r-media and --m-r-ctl (variant B); full-bleed objects
   (slide photo and field) stay square, as in the draft. Motion: transform and opacity only, only without
   prefers-reduced-motion, slide 1 never moves (LCP). == */
@media (min-width:576px){:root{--m-f:20px}}
@media (min-width:1024px){:root{--m-f:var(--m-pad);--m-hero-min:480px}}
/* height = window minus the header (computer: top bar + menu row; phone: header + safe top + bottom bar + safe bottom)
   minus the WordPress admin bar of a logged-in user (--m-ab is set on body, so the height is counted on .m-home); svh =
   window with the address bar shown, it does not change while scrolling */
@media (max-width:1023px){
  .m-home{--m-hero-h:min(calc(100vh - var(--m-mh) - env(safe-area-inset-top, 0px) - var(--m-bar-h) - var(--m-safe) - var(--m-ab)), var(--m-hero-max))}
  @supports (height:100svh){.m-home{--m-hero-h:min(calc(100svh - var(--m-mh) - env(safe-area-inset-top, 0px) - var(--m-bar-h) - var(--m-safe) - var(--m-ab)), var(--m-hero-max))}}
}
@media (min-width:1024px){
  .m-home{--m-hero-h:min(calc(100vh - var(--m-tb) - var(--m-hdr-h) - var(--m-ab)), var(--m-hero-max));--m-hero-pad:min(var(--m-field), calc(var(--m-hero-h) * var(--m-hero-k-pad)))}
  @supports (height:100svh){.m-home{--m-hero-h:min(calc(100svh - var(--m-tb) - var(--m-hdr-h) - var(--m-ab)), var(--m-hero-max))}}
}
.m-home{color:var(--m-ink);font-size:var(--m-t-body);font-weight:var(--m-fw-reg);line-height:var(--m-lh-3);overflow-x:clip}
.m-home *,.m-home *::before,.m-home *::after{box-sizing:border-box}
.m-home :is(h1, h2, h3, p, ul, ol, li, figure):not(.m-loop *){margin:0;padding:0}
.m-home :is(ul, ol):not(.m-loop *){list-style:none}
.m-home :is(h1, h2, h3):not(.m-loop *){color:inherit;font-family:inherit;font-weight:inherit;letter-spacing:normal;text-transform:none;text-wrap:balance}
.m-home p:not(.m-loop *){text-wrap:pretty}
.m-home a:not(.m-loop *){color:inherit;text-decoration:none}
.m-home a:not(.m-loop *):hover{color:inherit}
.m-home img:not(.m-loop *){display:block;max-width:100%}
.m-home button:not(.m-loop *){font:inherit;color:inherit;letter-spacing:normal;text-transform:none}
.m-home :focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}
.m-in{width:100%;max-width:calc(var(--m-wrap) + 2 * var(--m-f));margin-inline:auto;padding-inline:var(--m-f)}
.m-band{padding-block:calc(var(--m-v) / 2)}
.m-below{content-visibility:auto;contain-intrinsic-size:auto var(--m-below-h)}

/* type, buttons, section head */
.m-home .m-kick{font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;line-height:var(--m-lh-kick)}
.m-home .m-h1{font-size:max(var(--m-t-h1-min), min(var(--m-t-h1), calc(var(--m-hero-h) * var(--m-hero-k-h1))));font-weight:var(--m-fw-light);line-height:var(--m-lh-h1)}
.m-home h2.m-h2{color:var(--m-h-ink);font-size:var(--m-t-h2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;line-height:var(--m-lh-h2s)}
.m-home .m-h3{font-size:var(--m-t-h3);font-weight:var(--m-fw-reg);line-height:var(--m-lh-1)}
.m-home .m-small{font-size:var(--m-fs-3);line-height:var(--m-lh-2)}
.m-home .m-u{text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off)}
.m-home .m-u:hover{text-decoration-thickness:var(--m-ul-hover)}
.m-home .m-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:var(--m-btn-h);padding:var(--m-s3) var(--m-s6);
  background:var(--m-ink);color:var(--m-paper);border:0;border-radius:var(--m-r-ctl);box-shadow:none;
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;line-height:var(--m-lh-1);
  text-align:center;text-wrap:balance;cursor:pointer;
}
.m-home .m-btn:hover{background:var(--m-ink-80);color:var(--m-paper)}
.m-home .m-btn--quiet{width:100%;min-height:var(--m-tap);margin-top:var(--m-s1);padding:var(--m-s-quiet) var(--m-s3);background:var(--m-quiet, var(--m-ground));color:var(--m-ink);font-size:var(--m-fs-1);letter-spacing:var(--m-track-q)}
.m-home .m-btn--quiet:hover{background:var(--m-ink);color:var(--m-paper)}
.m-home .m-btn .icon{display:none}
/* the shop's confirmation after an AJAX add ("View cart", appended by WooCommerce next to the button) */
.m-home .m-card__buy .added_to_cart{display:inline-grid;place-items:center;min-height:var(--m-tap);font-size:var(--m-fs-3);font-weight:var(--m-fw-med);text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s)}
.m-home .m-head{display:grid;justify-items:center;gap:var(--m-head-gap);margin-bottom:var(--m-head);text-align:center}

/* first screen: phone = photo over the field (the photo shrinks first, the text stays whole); computer from 1024 =
   photo 7 / field 5. The phone hides the paragraph and the lotus (a long RU slide would push the screen out). */
.m-home .m-hero{position:relative;background:var(--m-ground)}
.m-track{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
.m-track::-webkit-scrollbar{display:none}
.m-home .m-track:focus-visible{outline-offset:calc(-1 * var(--m-s1))}
.m-slide{position:relative;display:grid;grid-template-rows:minmax(var(--m-hero-photo), 1fr) auto;min-width:0;min-height:max(var(--m-hero-h), var(--m-hero-min));overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always}
.m-slide__media{position:relative;display:block;overflow:hidden;background:var(--m-ground)}
.m-home .m-slide__media img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--m-obj-c)}
.m-slide__body{display:grid;align-content:center;justify-items:center;gap:var(--m-s3);padding:var(--m-s5) var(--m-f) var(--m-hero-room);background:var(--m-ground);text-align:center}
.m-slide__body > *{max-width:var(--m-text-w)}
.m-slide__sign{
  display:none;width:var(--m-hero-sign);aspect-ratio:var(--m-hero-sign-ar);background:var(--m-ink-60);
  -webkit-mask:url(img/marence-sign.svg) center / contain no-repeat;mask:url(img/marence-sign.svg) center / contain no-repeat;
}
.m-home .m-slide__text{display:none}
@media (min-width:768px){.m-home .m-slide__text{display:block}}
.m-hero__nav{position:absolute;left:0;right:0;bottom:var(--m-s3);z-index:var(--m-z-nav);display:grid;grid-auto-flow:column;justify-content:center;gap:var(--m-s1)}
.m-hero__nav[hidden]{display:none}
.m-home .m-hero__nav button,
.m-home .m-hero__nav button:hover{
  min-width:var(--m-tap);height:var(--m-tap);min-height:0;margin:0;padding:0;background:none;border:0;border-radius:var(--m-r-ctl);box-shadow:none;
  color:var(--m-ink-2);font-size:var(--m-fs-3);font-weight:var(--m-fw-reg);font-variant-numeric:tabular-nums;line-height:var(--m-lh-0);cursor:pointer;
}
.m-home .m-hero__nav button[aria-current="true"]{color:var(--m-ink);font-weight:var(--m-fw-bold)}
/* pause / play of the autoplay (v3.2.1): first in the row, the sign is drawn by CSS (two bars; a triangle when stopped) */
.m-home .m-hero__pp{display:grid;place-items:center}
.m-hero__pp::before{content:"";box-sizing:border-box;width:var(--m-pp-w);height:var(--m-pp-h);border-inline:var(--m-pp-bar) solid currentColor}
.m-hero__pp.is-stopped::before{border:0;background:currentColor;clip-path:polygon(0 0, 100% 50%, 0 100%)}
@media (prefers-reduced-motion:reduce){.m-home .m-hero__pp{display:none}}
@media (min-width:1024px){
  .m-slide{grid-template-columns:var(--m-hero-cols);grid-template-rows:none}
  .m-slide__body{gap:var(--m-s4);padding:var(--m-hero-pad) var(--m-field) calc(var(--m-hero-pad) + var(--m-s7))}
  .m-slide__sign{display:block}
  .m-home .m-focus-l img{object-position:var(--m-obj-l)}
  .m-home .m-focus-r img{object-position:var(--m-obj-r)}
  .m-hero__nav{left:auto;width:var(--m-hero-nav-w);bottom:var(--m-s5)}
}

/* holiday block: silver panel with the countdown (only black text on silver, palette.md 2.4) + sets from the shop */
.m-event{display:grid;gap:var(--m-g)}
@media (min-width:1024px){.m-event{grid-template-columns:var(--m-event-cols);align-items:center}}
.m-count{display:grid;justify-items:center;align-content:center;gap:var(--m-s-count);padding:var(--m-field) var(--m-f);border-radius:var(--m-r-media);background:var(--m-silver);text-align:center}
.m-home .m-count__fig{display:grid;justify-items:center;gap:var(--m-s-card);margin-block:var(--m-s1)}
.m-home .m-count__fig[hidden]{display:none}
.m-count__n{display:inline-flex;overflow:clip;font-size:var(--m-t-num);font-weight:var(--m-fw-light);line-height:var(--m-lh-0);font-variant-numeric:tabular-nums}
.m-dg{display:inline-block}
.m-count__u{font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase}

/* product shelf and card (recipe 9): six rows of a shared subgrid keep prices and buttons of a row on one line */
.m-shelf{display:grid;grid-template-rows:repeat(6, auto);column-gap:var(--m-g);row-gap:0}
.m-ribbon{
  grid-auto-flow:column;grid-auto-columns:var(--m-rib);margin-inline:calc(-1 * var(--m-f));padding:0 var(--m-f) var(--m-s1);
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m-f);scrollbar-width:none;
}
.m-ribbon::-webkit-scrollbar{display:none}
.m-ribbon > *{scroll-snap-align:start}
.m-ribbon--wide{grid-auto-columns:var(--m-rib-wide)}
@media (min-width:640px){.m-ribbon{grid-auto-columns:var(--m-rib-md)}.m-ribbon--wide{grid-auto-columns:var(--m-rib-wide-md)}}
@media (min-width:1024px){
  .m-ribbon{grid-auto-flow:row;grid-auto-columns:auto;margin-inline:0;padding-inline:0;overflow:visible}
  .m-shelf--1{grid-template-columns:minmax(0, 1fr)}
  .m-shelf--2{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .m-shelf--3{grid-template-columns:repeat(3, minmax(0, 1fr))}
  .m-shelf--4{grid-template-columns:repeat(4, minmax(0, 1fr))}
}
.m-card{grid-row:span 6;display:grid;grid-template-rows:subgrid;row-gap:var(--m-s-card);align-content:start;min-width:0;text-align:center}
.m-card__link{grid-row:span 3;display:grid;grid-template-rows:subgrid;row-gap:var(--m-s-card)}
.m-card__well{position:relative;display:block;aspect-ratio:var(--m-well-ar);margin-bottom:var(--m-s1);overflow:hidden;border-radius:var(--m-r-media);background:var(--m-well, var(--m-ground))}
.m-home .m-card__well img{position:absolute;left:0;right:0;bottom:var(--m-pack-y);width:auto;height:calc(var(--k, 1) * var(--m-pack-h));max-width:var(--m-pack-w);margin-inline:auto;object-fit:contain}
.m-line{display:flex;align-items:center;justify-content:center;gap:var(--m-s2);min-height:var(--m-label-h);color:var(--m-ink-2);font-size:var(--m-fs-2);font-weight:var(--m-fw-med)}
.m-card__name{display:-webkit-box;overflow:hidden;font-size:var(--m-fs-4);font-weight:var(--m-fw-med);line-height:var(--m-lh-card);-webkit-box-orient:vertical;-webkit-line-clamp:var(--m-name-lines);line-clamp:var(--m-name-lines)}
.m-home .m-card__meta{color:var(--m-ink-2);font-size:var(--m-fs-3)}
/* price = the shop's loop/price.php (span.price with del and ins): one colour of the page, old price small and grey */
.m-home .m-card__price,
.m-home .m-card__price .price,
.m-home .m-card__price .price ins{color:var(--m-ink);font-size:var(--m-fs-4);font-weight:var(--m-fw-semi);font-variant-numeric:tabular-nums;text-decoration:none}
.m-home .m-card__price .price del{color:var(--m-ink-2);font-size:var(--m-fs-3);font-weight:var(--m-fw-reg)}
@media (hover:hover){
  .m-card__link:hover .m-card__name{text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s)}
}

/* motion (recipe 10): 1 entering slide, 2 groups rise, 3 hover on a product (lift only, never larger: claims gate 02.10,
   claims on tubes must not be enlarged), 4 countdown digits; scroll-driven only where the browser supports it,
   otherwise the page is simply still */
.m-grp{view-timeline:--m-grp block}
.m-slide{view-timeline:--m-sl inline}
.m-rv:nth-child(2),.m-dg:nth-child(2),.m-slide__body > :nth-child(2){--m-i:1}
.m-rv:nth-child(3),.m-slide__body > :nth-child(3){--m-i:2}
.m-rv:nth-child(4),.m-slide__body > :nth-child(4){--m-i:3}
.m-rv:nth-child(5),.m-slide__body > :nth-child(5){--m-i:4}
@keyframes m-rise{from{opacity:0;transform:translateY(var(--m-rise))}}
@keyframes m-slide-in{from{opacity:0;transform:translateX(var(--m-slide-in))}}
@keyframes m-settle{from{transform:scale(var(--m-settle))}}
@keyframes m-digit{from{opacity:0;transform:translateY(100%)}}
@media (prefers-reduced-motion:no-preference){
  .m-track{scroll-behavior:smooth}
  @media (hover:hover){
    .m-home .m-card__well img{transition:transform var(--m-d-out) var(--m-ease)}
    .m-home .m-card__link:hover .m-card__well img{transform:translateY(var(--m-lift));transition-duration:var(--m-d-in)}
  }
  @supports (animation-timeline:view()){
    .m-slide + .m-slide .m-slide__body > *{animation:m-slide-in var(--m-ease) both;animation-timeline:--m-sl;animation-range:entry calc(var(--m-ar-sl) + var(--m-i, 0) * var(--m-ar-sl-step)) entry 100%}
    .m-home .m-slide + .m-slide .m-slide__media img{animation:m-settle linear both;animation-timeline:--m-sl;animation-range:entry 0% entry 100%}
    .m-rv{animation:m-rise var(--m-ease) both;animation-timeline:--m-grp;animation-range:entry calc(var(--m-i, 0) * var(--m-ar-step)) entry calc(var(--m-ar-len) + var(--m-i, 0) * var(--m-ar-step))}
    .m-dg{animation:m-digit var(--m-ease) both;animation-timeline:--m-grp;animation-range:entry calc(var(--m-ar-dg) + var(--m-i, 0) * var(--m-ar-dg-step)) entry calc(var(--m-ar-dg) + var(--m-ar-len) + var(--m-i, 0) * var(--m-ar-dg-step))}
  }
}

/* == home v3, stage 2 (D-113, D-119, D-120): facts line, "Sievietēm" tiles, skin filters + ribbon, men top 5, two lines,
   top 5 by sales. Markup: mu-plugins/marence-home-middle.php (inside .m-home of stage 1); draft middle.html v3.2.1, values
   recipe.md 8, 9, 17, 18. Colours: --m-gold-btn is the one new colour (recipe 17.1); --m-men and --m-on-black-2 come from
   palette.md (approved v2). The product well stays --m-paper everywhere (18.5), no blend modes; product photos never grow
   on hover (claims gate 02.10): lift only, the second picture fades in by opacity. Tiles: the hover of the live site
   (Goya hover-zoom + hover-border), transform and opacity only. == */
:root{
  --m-gold-btn:#8F6D1D;--m-men:#53575A;--m-on-black-2:#A6A6A6;
  --m-s0:2px;--m-head-gap:10px;--m-fil-px:18px;
  --m-tile-ar:650 / 886;--m-tl-h:40px;--m-tl-fs:13px;--m-tl-pad:20px;--m-tl-y:66%;--m-tl-edge:16px;--m-tl-lift:-20px;--m-tl-zoom:1.05;
  --m-tf:10px;--m-ease-tile:cubic-bezier(.25, .46, .45, .94);--m-d-tile:500ms;--m-d-tile-img:450ms;
    --m-lmedia-ar:4 / 3;--m-lmedia-max:min(70svh, 640px);--m-lmedia-max-tall:min(70svh, 800px);--m-gold-w:56px;--m-drift:4%;--m-drift-k:1.08;
}
@media (min-width:1024px){:root{--m-tf:20px}}
@media (min-width:1280px){:root{--m-tl-h:48px;--m-tl-fs:14px;--m-tl-pad:24px}}

.m-h1-only{padding-block:var(--m-v) 0;text-align:center}
.m-home .m-link{display:inline-flex;align-items:center;min-height:var(--m-tap);font-size:var(--m-fs-3);font-weight:var(--m-fw-med);white-space:nowrap;text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off)}
.m-home .m-link:hover{text-decoration-thickness:var(--m-ul-hover)}
.m-home .m-mute{color:var(--m-ink-2)}
.m-ground{background:var(--m-ground);--m-quiet:var(--m-paper)}
.m-black{background:var(--m-ink);color:var(--m-light)}
.m-home :is(.m-black, .m-count) :focus-visible{outline-color:var(--m-paper)}

/* tiles: 2 columns, 4 from 768; gold label at 66 % of the height */
.m-tiles{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--m-g)}
@media (min-width:768px){.m-tiles{grid-template-columns:repeat(4, minmax(0, 1fr))}}
/* skin filters: a strip to swipe on the phone, one centred row with wrapping from 1024 */
.m-filters{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--m-s2);margin:0 calc(-1 * var(--m-f)) var(--m-head);padding:var(--m-s0) var(--m-f) var(--m-s1);overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:var(--m-f);scrollbar-width:none}
.m-filters::-webkit-scrollbar{display:none}
.m-home .m-filters a{display:inline-grid;place-items:center;min-height:var(--m-tap);padding:0 var(--m-fil-px);background:var(--m-ground);border-radius:var(--m-r-ctl);font-size:var(--m-fs-3);font-weight:var(--m-fw-med);white-space:nowrap;scroll-snap-align:start}
.m-home .m-filters a:hover{background:var(--m-light)}
.m-home .m-filters a[aria-current="true"]{background:var(--m-ink);color:var(--m-paper)}
@media (min-width:1024px){.m-filters{display:flex;flex-wrap:wrap;justify-content:center;margin-inline:0;padding-inline:0;overflow:visible}}

/* shop cards (D-126): the shop's own loop card (Goya + this file style it); here only the strip / row of the list */
.m-home .m-loop ul.products.row:not(.shop_display_list){display:grid;grid-auto-flow:column;grid-auto-columns:var(--m-rib);margin:0 calc(-1 * var(--m-f));padding:0 var(--m-f);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m-f);scrollbar-width:none}
.m-home .m-loop ul.products::-webkit-scrollbar{display:none}
.m-home .m-loop ul.products.row:not(.shop_display_list) > li{width:auto;max-width:none;flex:none;margin:0;list-style:none;scroll-snap-align:start}
.m-loop.columns-3{--m-loop-cols:3}.m-loop.columns-2{--m-loop-cols:2}.m-loop.columns-1{--m-loop-cols:1}
@media (min-width:640px){.m-home .m-loop ul.products.row:not(.shop_display_list){grid-auto-columns:var(--m-rib-md)}}
@media (min-width:1024px){.m-home .m-loop ul.products.row:not(.shop_display_list){grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(var(--m-loop-cols, 5), minmax(0, 1fr));margin-inline:0;padding-inline:0;overflow:visible}}
/* claims gate 02.10: product photos of the home page never grow on hover (Goya zoom-jump scales them to 1.05; the lift stays) */
.no-touch .m-home .products.hover-animation-zoom-jump .product-inner:hover .product_thumbnail img{transform:none}

/* two lines: halves from 768, photo 4:3 up to min(70svh, 800px) (mud-d of the draft: no drift on the mud picture) */
.m-lines{display:grid}
@media (min-width:768px){.m-lines{grid-template-columns:repeat(2, minmax(0, 1fr))}}
.m-lcol{display:grid;grid-template-rows:auto 1fr}
.m-lmedia{position:relative;width:100%;aspect-ratio:var(--m-lmedia-ar);max-height:var(--m-lmedia-max);overflow:hidden;background:var(--m-ground)}
.m-lines--tall .m-lmedia{max-height:var(--m-lmedia-max-tall)}
.m-home .m-lmedia__bg{width:100%;height:100%;max-width:none;object-fit:cover}
.m-ltext{display:grid;justify-items:center;align-content:center;gap:var(--m-s4);padding:var(--m-field) var(--m-f);text-align:center}
.m-ltext > *{max-width:var(--m-text-w)}
.m-home .m-black .m-small{color:var(--m-on-black-2)}
.m-gold{display:block;width:var(--m-gold-w);height:var(--m-line);background:var(--m-gold)}

.m-rv:nth-child(6){--m-i:5}
@keyframes m-draw{from{transform:scaleX(0)}}
@keyframes m-drift{from{transform:translateY(calc(-1 * var(--m-drift))) scale(var(--m-drift-k))}to{transform:translateY(var(--m-drift)) scale(var(--m-drift-k))}}
@media (prefers-reduced-motion:no-preference){
  @media (hover:hover){
  }
  @supports (animation-timeline:view()){
    .m-gold{animation:m-draw var(--m-ease) both;animation-timeline:--m-grp;animation-range:entry 30% entry 80%}
    .m-home .m-drift{animation:m-drift linear both;animation-timeline:--m-grp;animation-range:cover 0% cover 100%}
  }
}

/* == home v3.3 (D-126, D-127, D-128, D-129): first screen as on the live site (photo, three captions, H1, gold button,
   the white strip of the nine icons of the customer with the slide numbers), white bands, section heads of the shop,
   one gold button on every photo entry (.m-gbtn) with one effect (.m-pe), holiday = photo panel. Draft middle.html
   v3.3 + recipe.md 19 (values there). The product card stays the shop's own (not from the draft). Colours new here:
   --m-h-ink (headings of the theme), --m-icon and --m-w-text (icons of the customer and the card text of the theme). == */
:root{
  --m-h-ink:#282828;--m-icon:#9D9E9E;--m-w-text:#686868;--m-lh-h2s:1.35;--m-lh-ptitle:1.2;
  --m-lh-gb:1.2;--m-men-min:280px;--m-mark-w:40px;--m-busy:.45;
  --m-ev-ar:2 / 3;--m-ev-max:min(88svh, 860px);--m-ev-x:clamp(20px, 12.57px + 1.905vw, 40px);--m-obj-ev:50% 85%;--m-gb-ev:14px;--m-ev-edge:20px;
}
.m-sprite{position:absolute;width:0;height:0;overflow:hidden}

.m-nt{text-transform:none}

/* gold button and photo entry (19.4); long labels wrap on narrow photos (review v3.3 p. 2) */
.m-home .m-gbtn{display:grid;place-items:center;width:max-content;max-width:calc(100% - var(--m-tl-edge));height:var(--m-tl-h);padding-inline:calc(var(--m-tl-pad) + var(--m-track-q)) var(--m-tl-pad);background:var(--m-gold-btn);color:var(--m-paper);border-radius:var(--m-r-ctl);font-size:var(--m-tl-fs);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-q);text-transform:uppercase;line-height:var(--m-lh-0);white-space:nowrap}
.m-home .m-gbtn:hover{color:var(--m-paper)}
.m-home .m-pe{position:relative;display:block;overflow:hidden;border-radius:var(--m-r-media);background:var(--m-ground);-webkit-tap-highlight-color:transparent}
.m-pe::after{content:"";position:absolute;inset:0;z-index:1;border:var(--m-tf) solid var(--m-paper);border-radius:inherit;opacity:0;pointer-events:none}
.m-pe__img{position:absolute;inset:0;display:block}
.m-home .m-pe__img img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--m-obj-c)}
.m-home .m-pe > .m-gbtn{position:absolute;top:calc(var(--m-tl-y) - var(--m-tl-h) / 2);left:0;right:0;z-index:2;height:auto;min-height:var(--m-tl-h);margin-inline:auto;padding:var(--m-s2) var(--m-s3);white-space:normal;line-height:var(--m-lh-gb);overflow-wrap:anywhere}
.m-pe--low{--m-tl-y:84%}
.m-pe--high{--m-tl-y:16%}
.m-home .m-tile{aspect-ratio:var(--m-tile-ar)}
.m-lines .m-pe{border-radius:0}
.m-home .m-men-lead{min-width:0}
.m-home .m-men-lead .m-pe{height:100%;min-height:var(--m-men-min)}
.m-head--men::before{content:"";width:var(--m-mark-w);height:var(--m-focus);margin-bottom:var(--m-s2);background:var(--m-men)}
/* D-138: the link to the section under a shelf ("Visa kosmētika vīriešiem"), centred like the section heads */
.m-home .m-more{display:flex;justify-content:center;margin-top:var(--m-s4)}
.m-ribbon-box[aria-busy="true"]{opacity:var(--m-busy);pointer-events:none}
@media (min-width:1024px){.m-home .m-loop-men--photo .m-loop ul.products.row:not(.shop_display_list){grid-auto-flow:column;grid-auto-columns:25%;grid-template-columns:none;overflow-x:auto}}
@media (min-width:1280px){.m-home .m-loop-men--photo .m-loop ul.products.row:not(.shop_display_list){grid-auto-flow:row;grid-template-columns:repeat(6, minmax(0, 1fr));overflow:visible}}

/* holiday = photo panel (19.5): text left in the upper half, gold button at 44-52 % (review v3.3 p. 1: fits 360) */
.m-home .m-count{position:relative;display:grid;align-content:start;justify-items:start;gap:var(--m-s2);aspect-ratio:var(--m-ev-ar);max-height:var(--m-ev-max);padding:var(--m-field) var(--m-field) var(--m-field) var(--m-ev-x);overflow:hidden;border-radius:var(--m-r-media);background:var(--m-ink);color:var(--m-paper);text-align:left}
.m-home .m-count__bg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--m-obj-ev)}
.m-count > :not(.m-count__bg){position:relative}
.m-count > :not(.m-count__bg, .m-gbtn){max-width:70%}
.m-home .m-count h2.m-h2{color:var(--m-paper);text-align:left}
.m-home .m-count__fig{justify-items:start;gap:var(--m-s1);margin-block:var(--m-s2) var(--m-s3)}
.m-home .m-count .m-gbtn{padding-inline:var(--m-gb-ev);max-width:calc(100% - var(--m-ev-edge))}
.m-home .m-black h2.m-h2{color:var(--m-light)}

@media (prefers-reduced-motion:no-preference){
  .m-home .m-pe__img{transition:transform var(--m-d-tile-img) linear}
  .m-pe::after{transition:opacity var(--m-d-tile) var(--m-ease-tile)}
  .m-home .m-pe > .m-gbtn{transition:transform var(--m-d-tile) var(--m-ease-tile)}
  .m-home .m-pe:is(:active, :focus-visible) .m-pe__img{transform:scale(var(--m-tl-zoom))}
  .m-home .m-pe:is(:active, :focus-visible)::after{opacity:1}
  .m-home .m-pe:is(:active, :focus-visible) > .m-gbtn{transform:translateY(var(--m-tl-lift))}
  @media (hover:hover){
    .m-home .m-pe:hover .m-pe__img{transform:scale(var(--m-tl-zoom))}
    .m-home .m-pe:hover::after{opacity:1}
    .m-home .m-pe:hover > .m-gbtn{transform:translateY(var(--m-tl-lift))}
  }
}
/* the product name of the shop card as a div on the home page (seo-geo 1.3): the rules Goya and its base give the bare
   h2 there (shop.css ".products .product .product-title h2", ".products .et-listing-style1 .product-title h2", core.css
   h1-h6 line-height 1.2, theme colour of headings) */
.m-loop .product-title .m-ptitle{display:block;margin:0 auto 0 0;font-family:inherit;font-size:inherit;font-weight:var(--m-fw-reg);line-height:var(--m-lh-ptitle);letter-spacing:inherit;text-transform:inherit;color:var(--m-h-ink)}

/* == home v3.5.1 layer (design/homepage-v34-2026-10-02/layer.css md5 a1a7428e, recipe 20-22): look of the first screen
   (three captions, icons, H1), holiday timer and gifts, men block. Stand-only mask rules of the icons removed. == */
/* MARENCE home v3.4: layer right after brand.css (stand), later moved into brand.css as one section.
   Stand classes on <html>: ev-a | ev-b (holiday). No class = ev-a. The first-screen rules of this layer were removed on 04.10 evening.
   Checked on the Latvian home only (owner 02.10). Product cards stay the shop's own: here only their container
   (grid, gutters, section heads). Values and reasons: design/homepage-v3-2026-09-30/recipe.md section 20. */

:root{
  /* Goya column padding of every li.product (grid.css .col-*): a card shows 15 px inside its cell, 30 px between cards */
  --m-gut:15px;--m-shelf-gap:30px;
  /* holiday: photo crop that keeps the box and its logo whole, gold button from the top, countdown size */
  --m-ev-pos:50% 85%;--m-ev-btn-y:6%;--m-ev-num:clamp(36px, 30.06px + 1.524vw, 52px);
}

/* == first screen v3 (LV, RU, EN; D-145..D-147, D-154, D-155): design/homepage-v36-2026-10-03/ref/v3/hero-v3.css md5 f4057974, built by
   scripts/home/hero-v3/build.mjs: slide class m-slide--brand of the design = m-slide--hero here and .m-home .m-hero = the
   v3 section .m-hero--v3. The screen above and its rules (v3.2-v3.5.1) were removed on 04.10 evening with RU and EN. == */
/* == home first screen v3 final (owner 04.10 night, recipe-ref.md): photo across the slide; on the photo two captions, a
   short line and the H1 (main slide; other slides: captions only); the card with the lotus, the slogan large (main
   slide; other slides: their h2), the line and the gold button; the nine framed icons with their labels ON the photo at
   the bottom of the main slide, travelling one place at a time (no pause button).
   Layout by ORIENTATION: landscape of any width = "wide" (card over the photo on the right); portrait of any width =
   "photo" (one screen, everything on the photo: captions + H1 on top, slogan + button over the icon row).
   Classes of the slide (fields of "Sākumlapa: slaidi"): card view m-card-label (owner's choice for the main slide) |
   m-card-jar | m-card-none (none = plain ivory), m-soft (soft corners), m-h1-b (light capitals for the card text),
   m-base-hi | m-base-mid | m-base-lo (where the products stand in another photo; none = photo B).
   Colours only as tokens (D-106). Every selector at least (0,3,0): the reset of the home page (.m-home :is(h1, h2, h3,
   p, ul, ol, li, figure):not(.m-loop *), (0,2,1)) never wins. == */

:root{
  --m-ink-card:#111;--m-on-photo:#FFF;--m-on-photo-85:rgb(255 255 255 / .85);--m-nav-ink:#8C8C8C;
  --m-jar:#141414;--m-jar-text:#CFC8BD;--m-scrim:0 0 0;--m-ico-ink:var(--m-ivory);--m-clear:transparent;
}

.m-home .m-slide.m-slide--hero{
  --m-row-h:70px;--m-row-k:3;--m-row-ic:28px;--m-row-fs:9px;--m-row-lh:1.2;--m-row-pt:8px;--m-row-g:5px;
  --m-row-veil:.45;--m-row-fade:32px;--m-row-ext:0px;--m-say-veil:.6;--m-card-veil:.58;
  --m-ph-k:1.625;--m-ph-base:var(--m-base-p, .658);--m-ph-top:var(--m-top-p, .304);--m-ph-x:56%;--m-ph-room:calc(var(--m-row-h) + 6px);
}
/* other photos (slides made in the admin): where the bottom of the products stands in the frame */
.m-home .m-slide.m-slide--hero.m-base-hi{--m-base-l:.62;--m-base-p:.55;--m-top-p:.25}
.m-home .m-slide.m-slide--hero.m-base-mid{--m-base-l:.7;--m-base-p:.6;--m-top-p:.28}
.m-home .m-slide.m-slide--hero.m-base-lo{--m-base-l:.82;--m-base-p:.7;--m-top-p:.36}

/* the frame: cover; the products' base --m-ph-room above the lower edge of the photo box, never past the frame edges (cq
   units of the picture = the photo box; --m-ph-k = frame height / width: 1.625 vertical 1280 x 2080, .5625 landscape) */
.m-home .m-slide--hero .m-slide__media{position:relative;container-type:size;overflow:hidden}
.m-home .m-slide--hero .m-slide__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--m-ph-x) clamp(100cqh - max(var(--m-ph-k) * 100cqw, 100cqh), 100cqh - var(--m-ph-room) - var(--m-ph-base) * max(var(--m-ph-k) * 100cqw, 100cqh), 0px)}

/* left block on the photo: two captions (white capitals), a short line, the H1 in the same system a little stronger; one
   rhythm (patch 01, owner 04.10: "разные пробелы"): every caption line 1.75em high, no margins between captions, the
   short line .4em under the list and .4em over the H1 (in the captions' em), the H1 1.6 at its size; a soft oval
   darkening under the block only (pixels of photo B, recipe 3.6) */
.m-home .m-slide--hero .m-hero__say{
  position:absolute;z-index:1;isolation:isolate;display:block;margin:0;padding:0;
  color:var(--m-on-photo);font-size:11px;font-weight:var(--m-fw-med);letter-spacing:.25em;line-height:1.75;text-transform:uppercase;
}
.m-home .m-slide--hero .m-hero__say ul{display:block;margin:0;padding:0;list-style:none}
.m-home .m-slide--hero .m-hero__say li{display:block;margin:0;padding:0}
.m-home .m-slide--hero .m-hero__say ul::after{content:"";display:block;width:32px;height:2px;margin:.4em 0;background:var(--m-on-photo)}
.m-home .m-slide--hero .m-hero__say .m-hero__h1{
  margin:0;color:var(--m-on-photo);font-family:inherit;font-size:13px;font-weight:var(--m-fw-semi);letter-spacing:.25em;line-height:1.6;
  text-transform:uppercase;text-wrap:balance;
}
.m-home .m-slide--hero .m-hero__say::before{
  content:"";position:absolute;z-index:-1;left:50%;top:50%;width:170%;height:320%;transform:translate(-50%, -50%);pointer-events:none;
  background:radial-gradient(closest-side, rgb(var(--m-scrim) / var(--m-say-veil)) 55%, rgb(var(--m-scrim) / calc(var(--m-say-veil) * .85)) 67%, rgb(var(--m-scrim) / calc(var(--m-say-veil) * .5)) 77.5%, rgb(var(--m-scrim) / calc(var(--m-say-veil) * .16)) 88%, rgb(var(--m-scrim) / 0) 100%);
}

/* the card: lotus, the slogan large (p on the main slide, h2 on the others; capitals by CSS only), the line, the button */
.m-home .m-slide--hero .m-hero__card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:0;margin:0;
  background:var(--m-ivory);color:var(--m-ink-card);text-align:center;border-radius:0;box-shadow:none;
}
.m-home .m-slide--hero .m-hero__card > *{max-width:100%}
.m-home .m-slide--hero .m-hero__card .m-slide__sign{display:none}
/* card text a (default): capitals of the brand book, SemiBold, .25em; b: light capitals, wider tracking; Montserrat only */
.m-home .m-slide--hero .m-hero__card .m-hero__slogan{
  margin:0 -.25em 0 0;color:var(--m-ink-card);font-family:inherit;font-size:20px;font-weight:var(--m-fw-semi);
  letter-spacing:.25em;line-height:1.25;text-transform:uppercase;text-wrap:balance;
}
.m-home .m-slide--hero.m-h1-b .m-hero__card .m-hero__slogan{margin-right:-.28em;font-weight:var(--m-fw-light);letter-spacing:.28em}
.m-home .m-slide--hero .m-hero__card .m-slide__text{display:none;color:var(--m-ink-80);line-height:1.55;text-wrap:balance}
.m-home .m-slide--hero .m-hero__card .m-gbtn{margin:12px 0 0}

/* the icon row ON the photo: drawings in their frames and labels in light lines; under them a flat darkening with a soft
   top edge (alpha from the pixels of photo B, worst place = the sun path on the water: ref/v3/row-veil.mjs); on the
   "photo" layout the same darkening reaches up behind the slogan and the button (--m-row-ext) */
.m-home .m-slide--hero .m-hero__icons{
  grid-area:1 / 1;align-self:end;position:relative;z-index:1;isolation:isolate;height:var(--m-row-h);min-width:0;margin:0;padding:0;
  background:none;color:var(--m-on-photo);overflow:visible;
}
.m-home .m-slide--hero .m-hero__icons::before{
  content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:calc(100% + var(--m-row-ext) + var(--m-row-fade));pointer-events:none;
  background:linear-gradient(to top, rgb(var(--m-scrim) / var(--m-row-veil)) calc(100% - var(--m-row-fade)), rgb(var(--m-scrim) / 0) 100%);
}
.m-home .m-slide--hero .m-hero__icons ul{
  display:grid;grid-auto-flow:column;grid-auto-columns:calc(100% / var(--m-row-k));grid-template-columns:none;gap:0;height:100%;margin:0;padding:0;
  overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;list-style:none;
}
.m-home .m-slide--hero .m-hero__icons ul::-webkit-scrollbar{display:none}
.m-home .m-slide--hero .m-hero__icons ul:is(.is-drag, .is-anim){scroll-snap-type:none}
.m-home .m-slide--hero .m-hero__icons ul.is-drag{cursor:grabbing;user-select:none}
.m-home .m-slide--hero .m-hero__icons ul:focus-visible{outline:2px solid var(--m-on-photo);outline-offset:-2px;box-shadow:inset 0 0 0 4px var(--m-ink-card)}
.m-home .m-slide--hero .m-hero__icons li{
  display:grid;grid-template-rows:var(--m-row-ic) auto;justify-items:center;align-content:start;row-gap:var(--m-row-g);min-width:0;margin:0;
  padding:var(--m-row-pt) 6px 0;scroll-snap-align:start;color:var(--m-on-photo);font-size:var(--m-row-fs);font-weight:var(--m-fw-semi);
  letter-spacing:.12em;line-height:var(--m-row-lh);text-align:center;text-transform:uppercase;
}
.m-home .m-slide--hero .m-hero__icons .m-ico{display:block;width:auto;height:var(--m-row-ic);aspect-ratio:925 / 779;color:var(--m-ico-ink)}
.m-home .m-slide--hero .m-hero__icons li > span{display:block;max-width:13em;text-wrap:balance}
.m-home .m-slide--hero .m-hero__icons .m-nt{text-transform:none}

/* arrows: only with more than one slide, only on the "wide" layout */
.m-home .m-hero.m-hero--v3 .m-hero__arrow{display:none}

/* ---- "photo": portrait windows of any width = one screen, everything on the photo (ref/v3/geom.mjs photo()) ---- */
@media (orientation: portrait){
  .m-home .m-slide.m-slide--hero{
    /* top block: two captions 2 x 11 x 1.75, line .4em + 1 + .4em, H1 13 x 1.6; bottom: slogan 2 x 20 x 1.25 + 12 + button 40; 28 px to the row */
    --m-cap-h:69px;--m-top0:14px;--m-gap-row:28px;--m-cta-h:calc(2 * 20px * 1.25 + 12px + 40px);
    --m-ph-room:calc(var(--m-row-h) + var(--m-gap-row) + var(--m-cta-h) + 8px);
    --m-row-ext:calc(var(--m-gap-row) + var(--m-cta-h) + 8px);--m-row-fade:24px;
    /* the slide never shorter than the blocks and the products need (products = .354 x 1.625 of the width = 57.5vw) */
    --m-H:max(var(--m-hero-h), var(--m-hero-min), calc(var(--m-top0) + var(--m-cap-h) + 8px + 57.5vw + var(--m-ph-room)));
    /* the frame position as the picture computes it, for the top block: top of the products = T + top x frame height */
    --m-iH:max(var(--m-ph-k) * 100vw, var(--m-H));
    --m-T:clamp(var(--m-H) - var(--m-iH), var(--m-H) - var(--m-ph-room) - var(--m-ph-base) * var(--m-iH), 0px);
    display:grid;grid-template-columns:minmax(0, 1fr);grid-template-rows:minmax(0, 1fr);min-height:var(--m-H);
  }
  .m-home .m-slide--hero .m-slide__media{grid-area:1 / 1}
  /* top: captions, a short line, the H1, centred in the sky above the products */
  .m-home .m-slide--hero .m-hero__say{left:var(--m-f);right:var(--m-f);top:max(var(--m-top0), calc((var(--m-T) + var(--m-ph-top) * var(--m-iH) - var(--m-cap-h)) / 2));text-align:center}
  .m-home .m-slide--hero .m-hero__say li{margin:0 -.25em 0 0}
  .m-home .m-slide--hero .m-hero__say li:last-of-type{margin-bottom:0}
  .m-home .m-slide--hero .m-hero__say ul::after{width:24px;height:1px;margin:.4em auto}
  .m-home .m-slide--hero .m-hero__say .m-hero__h1{margin-right:-.25em}
  /* bottom: slogan and button on the photo, white, 28 px over the icon row; lotus and the line not on phones */
  .m-home .m-slide--hero .m-hero__card{
    position:absolute;z-index:2;left:0;right:0;bottom:calc(var(--m-row-h) + var(--m-gap-row));padding:0 var(--m-f);background:none;border-radius:0;outline:0;
  }
  .m-home .m-slide--hero .m-hero__card .m-hero__slogan{max-width:14em;color:var(--m-on-photo)}
  /* more than one slide: the numbers under the photo (reserved only when there are numbers) */
  .m-home .m-hero:has(.m-hero__num) .m-slide--hero{min-height:calc(var(--m-H) + 44px);padding-bottom:44px}
  .m-home .m-hero.m-hero--v3 .m-hero__nav{left:0;right:0;bottom:0;width:auto;justify-content:center;gap:0}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num,
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num:hover{position:relative;min-width:40px;width:40px;height:44px;font-size:0;color:var(--m-clear)}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num::before{content:"";position:absolute;left:8px;top:21px;width:24px;height:2px;background:var(--m-nav-ink)}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num[aria-current="true"]::before{top:20.5px;height:3px;background:var(--m-gold-btn)}
}
/* short phones (lower than 760): smaller type and a slimmer row */
@media (orientation: portrait) and (width < 600px) and (height < 760px){
  .m-home .m-slide.m-slide--hero{
    --m-row-h:62px;--m-row-ic:24px;--m-row-fs:8.5px;--m-row-lh:1.15;--m-row-pt:7px;--m-row-g:4px;
    --m-cap-h:63px;--m-cta-h:calc(2 * 16px * 1.2 + 12px + 40px);
  }
  .m-home .m-slide--hero .m-hero__say{font-size:10px}
  .m-home .m-slide--hero .m-hero__say .m-hero__h1{font-size:12px}
  .m-home .m-slide--hero .m-hero__card .m-hero__slogan{font-size:16px;line-height:1.2}
}
/* portrait tablets (both sides from 600): larger type; the line under the slogan from 768 */
@media (orientation: portrait) and (width >= 600px) and (height >= 600px){
  .m-home .m-slide.m-slide--hero{--m-row-h:80px;--m-row-k:5;--m-row-ic:34px;--m-row-fs:10px;--m-row-g:6px;--m-cap-h:83px;--m-top0:28px;--m-cta-h:calc(2 * 30px * 1.25 + 12px + 40px)}
  .m-home .m-slide--hero .m-hero__say{font-size:13px}
  .m-home .m-slide--hero .m-hero__say .m-hero__h1{font-size:16px}
  .m-home .m-slide--hero .m-hero__card .m-hero__slogan{font-size:30px}
}
@media (orientation: portrait) and (width >= 768px) and (height >= 600px){
  .m-home .m-slide.m-slide--hero{--m-cta-h:calc(2 * 30px * 1.25 + 12px + 2 * 15px * 1.55 + 12px + 40px)}
  .m-home .m-slide--hero .m-hero__card .m-slide__text{display:block;margin:12px 0 0;color:var(--m-on-photo);font-size:15px}
}

/* ---- "wide": landscape windows of any width ---- */
@media (orientation: landscape){
  .m-home .m-slide.m-slide--hero{
    --m-row-k:6;--m-row-ic:40px;--m-row-fs:10px;--m-row-lh:1.3;--m-row-pt:14px;--m-row-g:8px;--m-row-h:100px;--m-say-veil:.5;
    --m-ph-k:.5625;--m-ph-base:var(--m-base-l, .772);--m-ph-x:30%;--m-ph-room:calc(var(--m-row-h) + 32px);
    --m-ph-h:max(var(--m-hero-h), var(--m-hero-min));
    /* card: one proportion everywhere (all its sizes = shares of its width --m-c-w), never taller than the photo above the row */
    --m-c-w:min(clamp(340px, 24vw, 480px), calc((var(--m-ph-h) - var(--m-row-h) - 32px) / .96));
    /* right margin (patch 01, owner: "чуть-чуть левее, чтобы солнце не закрыл"): up to 6vw, but the left edge of the card
       stays 24 px right of the sun disc of photo B (sun at 65.6 % of the frame, disc 2 %: 32.4vw - card - 24px) */
    --m-c-r:max(40px, min(6vw, 32.4vw - var(--m-c-w) - 24px));
    display:grid;grid-template-columns:minmax(0, 1fr);grid-template-rows:minmax(0, 1fr) var(--m-row-h);
    min-height:max(var(--m-hero-h), var(--m-hero-min));
  }
  .m-home .m-slide--hero .m-slide__media{grid-area:1 / 1 / -1 / -1}
  .m-home .m-slide--hero .m-hero__icons{grid-area:2 / 1}

  .m-home .m-slide--hero .m-hero__say{left:max(var(--m-f), 6.5vw);top:clamp(16px, calc(var(--m-ph-h) * .1), 88px);max-width:24em;font-size:clamp(13px, 1.111vw, 20px);letter-spacing:.3em;text-align:left}
  .m-home .m-slide--hero .m-hero__say li{margin-bottom:0}
  .m-home .m-slide--hero .m-hero__say li:last-of-type{margin-bottom:0}
  .m-home .m-slide--hero .m-hero__say ul::after{margin:.4em 0}
  .m-home .m-slide--hero .m-hero__say .m-hero__h1{margin:0 -.3em 0 0;font-size:1.1em;letter-spacing:.3em;line-height:1.6}

  .m-home .m-slide--hero .m-hero__card{
    grid-area:1 / 1;justify-self:end;align-self:center;position:relative;z-index:2;isolation:isolate;box-sizing:border-box;
    width:var(--m-c-w);margin:0 var(--m-c-r) 0 0;padding:calc(var(--m-c-w) * .09);
  }
  .m-home .m-slide--hero .m-hero__card .m-slide__sign{display:block;width:calc(var(--m-c-w) * .09);margin:0 0 calc(var(--m-c-w) * .05);background:var(--m-ink-60)}
  .m-home .m-slide--hero .m-hero__card .m-hero__slogan{max-width:10.4em;font-size:calc(var(--m-c-w) * .07);line-height:1.3}
  .m-home .m-slide--hero.m-h1-b .m-hero__card .m-hero__slogan{max-width:10.6em;font-size:calc(var(--m-c-w) * .078);line-height:1.18}
  .m-home .m-slide--hero .m-hero__card .m-slide__text{display:block;margin-top:calc(var(--m-c-w) * .055);font-size:max(12px, calc(var(--m-c-w) * .037))}
  .m-home .m-slide--hero .m-hero__card .m-gbtn{height:max(40px, calc(var(--m-c-w) * .105));margin-top:calc(var(--m-c-w) * .065);padding-inline:calc(var(--m-c-w) * .055 + .2em) calc(var(--m-c-w) * .055);font-size:max(12px, calc(var(--m-c-w) * .0315))}
  .m-home .m-slide--hero.m-soft .m-hero__card{border-radius:12px}

  /* card view "label" (owner's choice for the main slide): a thin gold frame inside, as on the brand's packaging */
  .m-home .m-slide--hero.m-card-label .m-hero__card{outline:1px solid var(--m-gold);outline-offset:calc(var(--m-c-w) * -.035)}
  /* card view "jar": black like the mud jar label, gold lotus, light text, a thin gold line under the slogan */
  .m-home .m-slide--hero.m-card-jar .m-hero__card{background:var(--m-jar);color:var(--m-ivory)}
  .m-home .m-slide--hero.m-card-jar .m-hero__card .m-slide__sign{background:var(--m-gold)}
  .m-home .m-slide--hero.m-card-jar .m-hero__card .m-hero__slogan{color:var(--m-ivory)}
  .m-home .m-slide--hero.m-card-jar .m-hero__card .m-slide__text{margin-top:calc(var(--m-c-w) * .035);color:var(--m-jar-text)}
  .m-home .m-slide--hero.m-card-jar .m-hero__card .m-slide__text::before{content:"";display:block;width:calc(var(--m-c-w) * .16);height:1px;margin:0 auto calc(var(--m-c-w) * .035);background:var(--m-gold)}
  /* card view "none": lotus, text and line in white on the photo, a soft oval darkening under them (pixels of B) */
  .m-home .m-slide--hero.m-card-none .m-hero__card{background:none;border-radius:0;outline:0}
  .m-home .m-slide--hero.m-card-none .m-hero__card::before{
    content:"";position:absolute;z-index:-1;left:50%;top:50%;width:150%;height:140%;transform:translate(-50%, -50%);pointer-events:none;
    background:radial-gradient(closest-side, rgb(var(--m-scrim) / var(--m-card-veil)) 55%, rgb(var(--m-scrim) / calc(var(--m-card-veil) * .85)) 67%, rgb(var(--m-scrim) / calc(var(--m-card-veil) * .5)) 77.5%, rgb(var(--m-scrim) / calc(var(--m-card-veil) * .16)) 88%, rgb(var(--m-scrim) / 0) 100%);
  }
  .m-home .m-slide--hero.m-card-none .m-hero__card .m-slide__sign{background:var(--m-on-photo)}
  .m-home .m-slide--hero.m-card-none .m-hero__card .m-hero__slogan,
  .m-home .m-slide--hero.m-card-none .m-hero__card .m-slide__text{color:var(--m-on-photo)}

  .m-home .m-hero.m-hero--v3 .m-hero__arrow{
    position:absolute;z-index:3;top:calc((max(var(--m-hero-h), var(--m-hero-min)) - var(--m-row-h)) / 2 - 22px);display:grid;place-items:center;
    width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;background:var(--m-on-photo-85);color:var(--m-ink-80);box-shadow:none;cursor:pointer;
  }
  .m-home .m-hero.m-hero--v3 .m-hero__arrow--prev{left:16px}
  .m-home .m-hero.m-hero--v3 .m-hero__arrow--next{right:16px}
  .m-home .m-hero.m-hero--v3 .m-hero__arrow:hover{background:var(--m-on-photo);color:var(--m-ink-80)}
  .m-home .m-hero.m-hero--v3 .m-hero__arrow:focus-visible{outline:2px solid var(--m-ink-card);outline-offset:-4px}
  .m-home .m-hero.m-hero--v3 .m-hero__arrow[hidden]{display:none}

  /* more than one slide: bars above the row, the right end of the last bar = the right edge of the card */
  .m-home .m-hero.m-hero--v3 .m-hero__nav{left:auto;width:auto;right:calc(var(--m-c-r) - 8px);bottom:calc(var(--m-row-h) + 6px);gap:0}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num,
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num:hover{position:relative;min-width:40px;width:40px;height:44px;font-size:0;color:var(--m-clear)}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num::before{content:"";position:absolute;left:8px;top:21px;width:24px;height:2px;background:var(--m-on-photo-85)}
  .m-home .m-hero.m-hero--v3 .m-hero__nav .m-hero__num[aria-current="true"]::before{top:20.5px;height:3px;background:var(--m-gold)}
  .m-home .m-hero.m-hero--v3 .m-hero__nav button:focus-visible{outline:2px solid var(--m-on-photo);outline-offset:-2px;box-shadow:inset 0 0 0 4px var(--m-ink-card)}
}
/* landscape narrower than 1024 (phones and small tablets held landscape): a smaller card */
@media (orientation: landscape) and (width < 1024px){
  .m-home .m-slide.m-slide--hero{--m-c-w:min(clamp(280px, 34vw, 340px), calc((var(--m-ph-h) - var(--m-row-h) - 32px) / .96))}
}
@media (orientation: landscape) and (width >= 1240px){.m-home .m-slide.m-slide--hero{--m-row-k:7}}
@media (orientation: landscape) and (width >= 1280px){.m-home .m-slide.m-slide--hero{--m-row-ic:44px;--m-row-fs:10.5px;--m-row-h:105px}}
@media (orientation: landscape) and (width >= 1440px){.m-home .m-slide.m-slide--hero{--m-row-k:8}}
/* low landscape windows (1366 x 650, 1024 x 600, phones held landscape): a slimmer row, captions at 13 px; the long caption
   wraps (15em: one line would touch the tube there), on the same 1.75em rhythm */
@media (orientation: landscape) and (height < 700px){
  .m-home .m-slide.m-slide--hero{--m-row-ic:36px;--m-row-fs:10px;--m-row-lh:1.2;--m-row-pt:10px;--m-row-g:6px;--m-row-h:86px}
  .m-home .m-slide--hero .m-hero__say{font-size:13px;max-width:15em}
}
/* lower than 560 (phones held landscape): captions at 12 px in rows from the top, as wide as the room before the card;
   they sit in the bright sky there, so the oval under them is stronger (.6, pixels of B: needed up to .54) */
@media (orientation: landscape) and (height < 560px){
  .m-home .m-slide.m-slide--hero{--m-say-veil:.6}
  .m-home .m-slide--hero .m-hero__say{top:16px;max-width:calc(100% - var(--m-c-w) - var(--m-c-r) - max(var(--m-f), 6.5vw) - 32px);font-size:12px}
  .m-home .m-slide--hero .m-hero__say ul{display:flex;flex-wrap:wrap;column-gap:1.6em;row-gap:0}
  .m-home .m-slide--hero .m-hero__say li,
  .m-home .m-slide--hero .m-hero__say li:last-of-type{margin:0}
  .m-home .m-slide--hero .m-hero__say ul::after{flex:0 0 32px;margin:.4em calc(100% - 32px) .4em 0}
}
@media (prefers-reduced-motion: reduce){.m-home .m-slide--hero .m-hero__icons ul{scroll-behavior:auto}}


/* == one style for the section heads: the shelf head "Parūpējies par savu ādu" reads like every other head == */
.m-home .m-head .m-h3{color:var(--m-h-ink);font-size:var(--m-t-h2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-h2s);text-transform:uppercase}

/* == shelves: the card content lines up with the page edge and the heads (Goya puts 15 px inside every li) == */
@media (max-width:1023px){
  .m-home .m-loop ul.products.row:not(.shop_display_list){padding-inline:calc(var(--m-f) - var(--m-gut));scroll-padding-inline:calc(var(--m-f) - var(--m-gut))}
}
@media (min-width:1024px){
  .m-home .m-loop ul.products.row:not(.shop_display_list){margin-inline:calc(-1 * var(--m-gut))}
}

/* == men (v3.5, D-133): the man larger, frame 2:3 "man + three tubes" (men-products-1/2). From 1024 a grid of 10 half
   columns: photo four of them (two shelf columns) over two rows, three cards on row 1, two cards centred on row 2;
   card width stays that of the other shelves. Phone: the photo is the first, wider cell of the ribbon. == */
:root{--m-men-ph:62%;--m-men-btn:44%}
@media (min-width:640px){:root{--m-men-ph:44%}}
.m-home .m-loop ul.products.row:not(.shop_display_list) > li.m-men-lead{padding-inline:var(--m-gut)}
.m-home .m-men-lead .m-pe{--m-tl-y:var(--m-men-btn)}
@media (max-width:1023px){
  .m-home .m-loop-men--photo .m-loop ul.products.row:not(.shop_display_list){grid-template-columns:var(--m-men-ph)}
}
@media (min-width:1024px){
  .m-home .m-loop-men--photo .m-loop ul.products.row:not(.shop_display_list){grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(10, minmax(0, 1fr));row-gap:var(--m-shelf-gap);overflow:visible}
  .m-home .m-loop-men--photo ul.products > li.m-men-lead{grid-column:1 / span 4;grid-row:1 / span 2}
  .m-home .m-loop-men--photo ul.products > li.product{grid-column:span 2}
  .m-home .m-loop-men--photo ul.products > li.product:nth-child(5){grid-column:6 / span 2}
  .m-home .m-loop-men--photo ul.products > li.product:nth-child(6){grid-column:8 / span 2}
}

/* == holiday (v3.5, D-133): live timer (days, hours, minutes, seconds; only the digits change) and two gold gift links
   in the head; nothing hangs in an empty field.
   ev-a: photo two columns of five on the left, as tall as head + sets; head, timer, gift links centred over the sets
   ev-b: head, timer, gift links centred over the whole shelf, photo as tall as a card. Phone: the same for both.
   Timer markup (engineer): p.m-count__fig.m-timer > 4 x span.m-timer__u > span.m-timer__n + span.m-timer__l, then
   div.m-event__gifts > 2 x a.m-gbtn, both inside .m-count. Until it lands, the days-only figure is styled as in v3.4. == */
:root{--m-tm-n:clamp(30px, 23.14px + 1.758vw, 48px);--m-tm-gap:clamp(18px, 12.29px + 1.465vw, 36px);--m-tm-l:10px}
@media (min-width:1024px){:root{--m-tm-l:11px}}
/* the whole layout below needs display: contents; without it the v3.3 photo panel of brand.css stays as it is */
@supports (display:contents){
.m-home .m-event{grid-template-areas:"h" "d" "n" "g" "p" "s";grid-template-columns:minmax(0, 1fr);gap:0}
.m-home .m-event .m-count{display:contents}
.m-home .m-event .m-count h2.m-h2{grid-area:h;justify-self:center;max-width:none;color:var(--m-h-ink);text-align:center}
.m-home .m-event .m-count .m-small{grid-area:d;justify-self:center;max-width:none;margin-top:var(--m-s2);color:var(--m-ink-2)}
.m-home .m-event .m-count__fig{grid-area:n;display:flex;align-items:baseline;justify-content:center;gap:var(--m-s2);max-width:none;margin:var(--m-s4) 0 var(--m-s5)}
.m-home .m-event .m-count__fig[hidden]{display:none}
.m-home .m-event .m-count__n{color:var(--m-gold-btn);font-size:var(--m-ev-num)}
.m-home .m-event .m-count__u{color:var(--m-ink-2)}
.m-home .m-event .m-timer{align-items:start;gap:var(--m-tm-gap)}
.m-home .m-timer__u{display:grid;justify-items:center;gap:var(--m-s2)}
.m-home .m-timer__n{color:var(--m-gold-btn);font-size:var(--m-tm-n);font-weight:var(--m-fw-light);line-height:var(--m-lh-0);font-variant-numeric:tabular-nums}
.m-home .m-timer__l{color:var(--m-ink-2);font-size:var(--m-tm-l);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-q);line-height:var(--m-lh-0);text-transform:uppercase}
.m-home .m-event__gifts{grid-area:g;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--m-s3);max-width:none;margin-bottom:var(--m-s6)}
.m-home .m-event__gifts .m-gbtn{padding-inline:calc(var(--m-tl-pad) + var(--m-track-q)) var(--m-tl-pad);max-width:none}
.m-home .m-event .m-count__bg{position:static;grid-area:p;width:100%;height:auto;aspect-ratio:4 / 3;contain:size;border-radius:var(--m-r-media);object-fit:cover;object-position:var(--m-ev-pos)}
.m-home .m-event .m-count > .m-gbtn{grid-area:p;align-self:start;justify-self:center;z-index:1;margin-top:var(--m-ev-btn-y)}
.m-home .m-event .m-sets{grid-area:s;min-width:0;margin-top:var(--m-s5)}
@media (min-width:1024px){
  .m-home .m-event{align-items:start;grid-template-columns:repeat(5, minmax(0, 1fr));column-gap:var(--m-shelf-gap);grid-template-areas:"p p h h h" "p p d d d" "p p n n n" "p p g g g" "p p s s s";grid-template-rows:auto auto auto auto 1fr}
  .m-home .m-event .m-count__bg{height:100%;aspect-ratio:auto;align-self:stretch}
  .m-home .m-event .m-sets{margin-top:0}
  .ev-b .m-home .m-event{grid-template-areas:"h h h h h" "d d d d d" "n n n n n" "g g g g g" "p p s s s";grid-template-rows:none}
}
}


/* == owner 02.10 (v3.5.1 on staging): H1 in three lines without a break inside "dabas spēks"; gold buttons always white
   text (the reset ".m-home a:not(.m-loop *){color:inherit}" of stage 1 beat ".m-home .m-gbtn" on links: the slide button
   was dark on gold); hover and focus darker gold, press darker still, colour only == */
:root{--m-gold-hover:#75591A;--m-gold-active:#5F4815;--m-d-gold:.2s}
.m-home .m-h1 .m-nw{white-space:nowrap}
.m-home a.m-gbtn:not(.m-loop *),
.m-home a.m-gbtn:not(.m-loop *):is(:hover, :focus-visible, :active){color:var(--m-paper)}
.m-home a.m-gbtn:not(.m-loop *):is(:hover, :focus-visible),
.m-home .m-pe:is(:hover, :focus-visible) > .m-gbtn{background:var(--m-gold-hover)}
.m-home a.m-gbtn:not(.m-loop *):active,
.m-home .m-pe:active > .m-gbtn{background:var(--m-gold-active)}
@media (prefers-reduced-motion:no-preference){.m-home .m-gbtn,.m-home .m-pe > .m-gbtn{transition:background-color var(--m-d-gold), transform var(--m-d-tile) var(--m-ease-tile)}}

/* == home, phone only (owner 04.10 late and 05.10, design/homepage-mobile-2026-10-05/recipe-mobile.md): holiday photo
   1:1 across the screen with the gift buttons on it (only when the record has a photo), two-colour focus ring of the
   holiday buttons, tabs in rows, even gutters in the shelves. == */
:root{
  --m-ev-in:16px;--m-ev-gap:8px;--m-ev-fs:12px;--m-ev-tr:.15em;--m-ev-frame:3px;
  --m-fil-px-m:14px;
  --m-gut-m:7.5px;
}

@supports (display:contents){
@media (max-width:767px){
  .m-home .m-event .m-event__gifts > .m-gbtn{position:relative}
  .m-home .m-event .m-count .m-gbtn:focus-visible{outline:var(--m-focus) solid var(--m-paper);outline-offset:var(--m-focus)}
  .m-home .m-event .m-count .m-gbtn:focus-visible::after{content:"";position:absolute;inset:calc(-3 * var(--m-focus));border:var(--m-focus) solid var(--m-ink);pointer-events:none}
  .m-home .m-event:has(.m-count__bg){grid-template-areas:"h" "d" "n" "p" "s"}
  .m-home .m-event:has(.m-count__bg) .m-count__bg{width:calc(100% + 2 * var(--m-f));max-width:none;margin-inline:calc(-1 * var(--m-f));aspect-ratio:1 / 1;border-radius:0;object-position:50% 100%}
  .m-home .m-event:has(.m-count__bg) .m-event__gifts{grid-area:p;align-self:start;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0, 1fr);gap:var(--m-ev-gap);max-width:none;margin:var(--m-ev-in) 0 0;z-index:1}
  .m-home .m-event:has(.m-count__bg) .m-count .m-gbtn{font-size:var(--m-ev-fs);letter-spacing:var(--m-ev-tr);line-height:var(--m-lh-gb);white-space:normal;overflow-wrap:anywhere;text-align:center;text-wrap:balance}
  .m-home .m-event:has(.m-count__bg) .m-event__gifts > .m-gbtn{width:auto;max-width:none;height:auto;min-height:var(--m-tl-h);padding:var(--m-s2) var(--m-s2) var(--m-s2) calc(var(--m-s2) + var(--m-ev-tr))}
  .m-home .m-event:has(.m-count__bg) .m-count > .m-gbtn{grid-area:p;align-self:end;justify-self:center;height:auto;min-height:var(--m-tl-h);max-width:calc(100% - 2 * var(--m-ev-in));margin:0 0 var(--m-ev-in);padding:var(--m-s2) var(--m-s4) var(--m-s2) calc(var(--m-s4) + var(--m-ev-tr))}
  .m-home .m-event:has(.m-count__bg) .m-event__gifts > a.m-gbtn:first-child:not(:only-child):not(.m-loop *){background:var(--m-ivory);color:var(--m-ink)}
  .m-home .m-event:has(.m-count__bg) .m-event__gifts > a.m-gbtn:first-child:not(:only-child):not(.m-loop *)::before{content:"";position:absolute;inset:var(--m-ev-frame);border:var(--m-line) solid var(--m-gold);pointer-events:none}
  .m-home .m-event:has(.m-count__bg) .m-event__gifts > a.m-gbtn:first-child:not(:only-child):not(.m-loop *):is(:hover, :focus-visible, :active){background:var(--m-ground);color:var(--m-ink)}
}
}

@media (max-width:767px){
  .m-home .m-filters{display:flex;flex-wrap:wrap;justify-content:center;margin-inline:0;padding-inline:0;overflow:visible}
  .m-home .m-filters a{max-width:100%;padding-inline:var(--m-fil-px-m);white-space:normal;text-align:center;overflow-wrap:anywhere}
}

@media (max-width:575px){
  .m-home .m-loop ul.products.row:not(.shop_display_list){padding-inline:calc(var(--m-f) - var(--m-gut-m));scroll-padding-inline:calc(var(--m-f) - var(--m-gut-m))}
  .m-home .m-loop ul.products.row:not(.shop_display_list) > li:is(.product, .m-men-lead){padding-inline:var(--m-gut-m)}
}

/* == home tabs ribbon from 1024 px (ribbon-v1, owner 05.10): design/home-ribbon-2026-10-05 == */
/* == home: the tabs block "Parupejies par savu adu" as a ribbon from 1024 px (owner 05.10: a ribbon to the right, up to 10
   products a tab; his choice on the stand: arrows at the sides on the middle of the photo, exactly 5 cards in view, one
   step = one screen). Values and checks: design/home-ribbon-2026-10-05/recipe-ribbon.md, section "Itog".
   Markup of marence-home-middle.php (ribbon-v1): .m-rb[data-m-rb] > the panels .m-ribbon-box, then .m-rb__ctl[hidden]
   with .m-rb__btn--prev and .m-rb__btn--next (aria-disabled on the end one, set by the script).
   Mechanics = the scroll-snap ribbon of the phone (this file, "shop cards"); the cell = 1/5 of the list, so a card is as wide
   as in the old 5-column grid and in every other shelf (173 / 219 / 248 px at 1024 / 1280 / 1440 and wider).
   The arrows stand over the side edges of the ribbon at the height of the middle of the photo; the block is not taller than
   before (no band for the arrows). Below 1024 nothing changes: the only rule outside the media query hides the new arrows.
   Every selector carries .m-ribbon-box or .m-rb: men, top 5 and the holiday sets are not touched. Tokens only. == */
.m-rb__ctl{display:none}
@media (min-width:1024px){
  .m-rb{
    --m-rb-n:5;                                  /* cards in view */
    --m-rb-room:8px;                             /* room inside the scroller: Goya lifts the photo 5 px on hover, the focus ring of a card takes 2 + 3 px */
    --m-rb-ico:16px;                             /* the chevron of the first screen arrows (viewBox 16, stroke 1.5) */
    --m-rb-out:calc(var(--m-tap) + var(--m-s2)); /* where the page margin allows it, the square stands 8 px outside the photo */
    position:relative;display:flow-root;         /* flow-root: the -8 px margins of the list stay inside, the cards do not move */
  }
  /* the list of a panel: from the 5-column grid back to the ribbon of the phone, 5 cells in view */
  .m-home .m-ribbon-box .m-loop ul.products.row:not(.shop_display_list){
    grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc(100% / var(--m-rb-n, 5));
    margin-block:calc(-1 * var(--m-rb-room, 8px));padding-block:var(--m-rb-room, 8px);
    overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:0;scrollbar-width:none;
  }
  /* the list takes the focus (tabindex from the script while it scrolls): the ring inside, in the 15 px gutters of the cards */
  .m-home .m-ribbon-box .m-loop ul.products.row:not(.shop_display_list):focus-visible{outline-offset:calc(-1 * var(--m-focus))}
  @media (prefers-reduced-motion:no-preference){
    .m-home .m-ribbon-box .m-loop ul.products.row:not(.shop_display_list){scroll-behavior:smooth}
  }

  /* the arrows: a line of zero height across the ribbon at the middle of the photo (padding in % of the width = half a card:
     ((ribbon + 30 px) / 5 - 30 px) / 2); it takes no clicks itself, only its buttons do */
  .m-rb__ctl[hidden]{display:none}
  .m-rb__ctl:not([hidden]){display:block}
  .m-rb__ctl{
    position:absolute;z-index:1;top:0;left:0;right:0;height:0;margin:0;
    padding-top:calc(((100% + 2 * var(--m-gut)) / var(--m-rb-n) - 2 * var(--m-gut)) / 2);pointer-events:none;
  }
  /* the button: a square of the tabs family (field, 2 px corners, no frame, no shadow), a thin chevron, centred on the line;
     outside by the page margin, never past the page edge: 24 px over the photo at 1024, 11.7 at 1280, 4 at 1440, none
     from 1464, 8 px clear from 1480 (the margin is taken as max(--m-f, (100vw - ribbon) / 2 - 8 px), never more than the
     real one, with or without a 15 px window scrollbar) */
  .m-home .m-rb .m-rb__btn{
    position:absolute;top:calc(100% - var(--m-tap) / 2);
    display:grid;place-items:center;width:var(--m-tap);height:var(--m-tap);min-width:0;min-height:0;margin:0;padding:0;
    background:var(--m-ground);color:var(--m-ink);border:0;border-radius:var(--m-r-ctl);box-shadow:none;line-height:var(--m-lh-0);
    cursor:pointer;pointer-events:auto;
  }
  .m-home .m-rb .m-rb__btn--prev{left:calc(-1 * min(var(--m-rb-out), max(var(--m-f), (100vw - 100%) / 2 - var(--m-s2))))}
  .m-home .m-rb .m-rb__btn--next{right:calc(-1 * min(var(--m-rb-out), max(var(--m-f), (100vw - 100%) / 2 - var(--m-s2))))}
  .m-home .m-rb .m-rb__btn svg{display:block;width:var(--m-rb-ico);height:var(--m-rb-ico)}
  /* focus: the ring INSIDE the square (at 1024 the square touches the page edge, a ring outside would be cut); black on the
     field, white on the black of hover and press */
  .m-home .m-rb .m-rb__btn:focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:calc(-2 * var(--m-focus))}
  @media (hover:hover){
    .m-home .m-rb .m-rb__btn:hover{background:var(--m-ink);color:var(--m-paper)}
    .m-home .m-rb .m-rb__btn:hover:focus-visible{outline-color:var(--m-paper)}
  }
  .m-home .m-rb .m-rb__btn:active{background:var(--m-ink-80);color:var(--m-paper)}
  .m-home .m-rb .m-rb__btn:active:focus-visible{outline-color:var(--m-paper)}
  /* nothing more in this direction (aria-disabled, the button keeps the focus): the square goes away, the chevron stays
     pale; clicks pass through to the photo under it; with the keyboard focus on it the field comes back under the ring */
  .m-home .m-rb .m-rb__btn[aria-disabled="true"]{background:none;color:var(--m-rule);cursor:default;pointer-events:none}
  .m-home .m-rb .m-rb__btn[aria-disabled="true"]:focus-visible{background:var(--m-ground);color:var(--m-rule);outline-color:var(--m-ink)}
}

/* == about page "Par mums" (LV 129, RU 67453, EN 67459; D-174...D-186): BEGIN. design/about-2026-10-05/layer-about.css md5 b87aab32, built by
   scripts/about/build.mjs for release 062 (kegl literals as tokens of this :root, + engineering rules of the bundle). Only
   .m-about selectors; the page markup comes from mu-plugins/marence-about.php; rollback = ~/bin/rollback-about.sh. == */
/* == about (LV 129 /par-mums/; D-174 rebuild): design/about-2026-10-05/recipe-about.md. Markup src/about-body.html,
   motion src/about-motion.js. The look of the home page: first screen as the main slider (photo, crumb, short line, H1,
   line; the "label" card on the right), below it a mosaic of 50/50 rows without gaps (photo | text, then text | photo),
   facts in thin frames, questions, company details, a closing slogan. Montserrat with the weights and tracking of the
   home page, fonds white / ivory / ground, one dark row, gold only in the button, the card frame and the icons; no short
   decorative rules anywhere (D-177): space, fond and size separate. Colours only as tokens
   (D-106); alphas of the darkenings are numbers measured on the photos. Every selector from (0,2,0). Motion: transform
   and opacity only, only with JS and without reduce (otherwise everything simply stands). == */
:root{
  --m-ab-crumb-l:clamp(11px, 8px + .3vw, 14px);--m-ab-end:clamp(22px, 14px + 1.8vw, 40px);--m-ab-lh-req:2;--m-ab-yr:clamp(24px, 18px + 1vw, 34px);
  --m-ab-gold-ink:var(--m-gold-hover);
  --m-ab-h1:clamp(40px, 20px + 4.2vw, 84px);--m-ab-h1b:clamp(13px, 10.5px + .65vw, 20px);--m-ab-h1x:clamp(34px, 16px + 3.6vw, 72px);
  --m-ab-h2:var(--m-t-h2);--m-ab-lede:clamp(16px, 13.9px + .55vw, 21px);--m-ab-num:clamp(30px, 22px + 1.6vw, 48px);
  --m-ab-text:var(--m-t-body);--m-ab-measure:34rem;--m-ab-card-w:clamp(300px, 24vw, 480px);--m-ab-nav-h:calc(var(--m-s5) * 2 + var(--m-tap));--m-ab-nav-veil:.35;--m-ab-chip-veil:.55;--m-ab-top:calc(var(--m-tb) + var(--m-hdr-h));--m-ab-hero-in:clamp(20px, 2.4vw, 44px);
  --m-ab-pad:clamp(48px, 4px + 7.5vw, 120px);--m-ab-row:clamp(520px, 44vw, 760px);--m-ab-ico:32px;--m-ab-draw:48px;
  --m-ab-veil:.56;--m-ab-veil-p:.6;--m-ab-cap-veil:.6;
  --m-ab-d-rise:600ms;--m-ab-d-photo:1.2s;--m-ab-zoom:1.04;--m-ab-lift:-4px;
}

/* base */
.m-about{--m-ab-x:var(--m-pad);--m-ab-slogan:clamp(20px, 17px + .8vw, 24px);color:var(--m-char);background:var(--m-paper);font-size:var(--m-ab-text);line-height:var(--m-lh-3)}
.m-about :is(h1, h2, h3, p, ul, ol, li, dl, dt, dd, figure, figcaption, blockquote){margin:0;padding:0}
.m-about :is(ul, ol){list-style:none}
.m-about img{display:block;max-width:100%;height:auto}
.m-about a{color:inherit}
.m-about :is(a, summary):focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}
.m-about .m-about__ico{display:block;width:var(--m-ab-ico);height:var(--m-ab-ico);fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}

/* section heads of the page: a small gold caption with a thin line that draws itself, the head in capitals (home) */
.m-about .m-about__eyebrow{display:flex;align-items:center;gap:var(--m-s3);margin-bottom:var(--m-s4);color:var(--m-ab-gold-ink);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-1);text-transform:uppercase}
.m-about .m-about__eyebrow--c{justify-content:center}
.m-about .m-about__h2{margin-bottom:var(--m-s5);color:var(--m-h-ink);font-family:inherit;font-size:var(--m-ab-h2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-h2s);text-transform:uppercase;text-wrap:balance}
.m-about .m-about__h2--c{text-align:center}
.m-about .m-about__prose{display:grid;gap:var(--m-s4);max-width:var(--m-ab-measure)}
.m-about .m-about__prose p{text-wrap:pretty}
.m-about :is(.m-about__prose, .m-about__pt, .m-about__note, .m-about__cells, .m-about__a, .m-about__nums, .m-about__req-lines) a{text-decoration:underline;text-decoration-color:var(--m-gold);text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s)}
.m-about :is(.m-about__prose, .m-about__pt, .m-about__note, .m-about__cells, .m-about__a, .m-about__nums, .m-about__req-lines) a:hover{text-decoration-thickness:var(--m-ul-hover)}

/* the gold button of the site (no arrow, D-147) and its line twin; colour changes at once */
.m-about .m-about__btn{display:inline-grid;place-items:center;min-height:var(--m-btn-h);padding:var(--m-s2) var(--m-s5) var(--m-s2) calc(var(--m-s5) + var(--m-track-q));background:var(--m-gold-btn);color:var(--m-paper);border:var(--m-line) solid var(--m-gold-btn);border-radius:var(--m-r-ctl);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-q);line-height:var(--m-lh-1);text-align:center;text-decoration:none;text-transform:uppercase}
.m-about .m-about__btn:is(:hover, :focus-visible){background:var(--m-gold-hover);border-color:var(--m-gold-hover);color:var(--m-paper)}
.m-about .m-about__btn:active{background:var(--m-gold-active)}
.m-about .m-about__btn--line{background:none;border-color:var(--m-ink);color:var(--m-ink)}
.m-about .m-about__btn--line:is(:hover, :focus-visible){background:var(--m-ink);border-color:var(--m-ink);color:var(--m-paper)}
.m-about .m-about__more a{display:inline-flex;align-items:center;min-height:var(--m-tap);color:var(--m-ink);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;text-decoration:underline;text-decoration-color:var(--m-gold);text-underline-offset:var(--m-ul-off)}
.m-about .m-about__more a:hover{text-decoration-thickness:var(--m-ul-hover)}

/* 1. first screen = the main slider of the home page, exactly in the window: height = 100svh minus the top bar and the
   header (measured at load into --m-ab-top by src/about-motion.js; without JS the home tokens 36 + 96). Portrait: crumb,
   H1 and line on top, the card above the anchor row, all on the photo; landscape from 900: H1 left over a soft
   darkening, the card right as the home card (24vw, 300-480 px, no taller than its content), anchors at the bottom */
.m-about .m-about__hero{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);grid-template-rows:auto minmax(var(--m-s5), 1fr) auto auto;min-height:max(520px, calc(100svh - var(--m-ab-top)));background:var(--m-ink-card);overflow:hidden}
.m-about .m-about__hero-media{grid-area:1 / 1 / -1 / -1;position:relative;display:block;overflow:hidden;background:var(--m-ink-card)}
.m-about .m-about__hero-media img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 62%}
.m-about .m-about__say{grid-area:1 / 1;z-index:1;padding:var(--m-s6) var(--m-ab-x) var(--m-s7);color:var(--m-on-photo);background:linear-gradient(to bottom, rgb(var(--m-scrim) / var(--m-ab-veil-p)) 0, rgb(var(--m-scrim) / var(--m-ab-veil-p)) calc(100% - var(--m-s7)), rgb(var(--m-scrim) / 0) 100%)}
.m-about .m-about__crumb{font-size:var(--m-fs-1);font-weight:var(--m-fw-med);letter-spacing:var(--m-track);line-height:var(--m-lh-kick);text-transform:uppercase}
.m-about .m-about__h1{margin-top:var(--m-s3);color:var(--m-on-photo);font-family:inherit;font-weight:var(--m-fw-semi);text-transform:uppercase}
.m-about .m-about__h1-a{display:block;font-size:var(--m-ab-h1);letter-spacing:var(--m-track-q);line-height:var(--m-lh-h2)}
.m-about .m-about__h1-b{display:block;max-width:24em;margin-top:var(--m-s3);font-size:var(--m-ab-h1b);font-weight:var(--m-fw-med);letter-spacing:var(--m-track-q);line-height:var(--m-lh-kick);text-wrap:balance}
.m-about .m-about__h1-x{display:block;max-width:9em;font-size:var(--m-ab-h1x);letter-spacing:var(--m-track-s);line-height:var(--m-lh-h2);text-wrap:balance}
.m-about .m-about__lede{max-width:24em;margin-top:var(--m-s4);font-size:var(--m-ab-lede);line-height:var(--m-lh-1);text-wrap:balance}
.m-about .m-about__card{grid-area:3 / 1;justify-self:center;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;width:min(calc(100% - 2 * var(--m-ab-x)), 420px);margin:0 0 var(--m-s3);padding:var(--m-s5) var(--m-s5);background:var(--m-ivory);color:var(--m-ink-card);text-align:center;outline:var(--m-line) solid var(--m-gold);outline-offset:calc(-1 * var(--m-s2))}
.m-about .m-about__sign{display:block;width:var(--m-lotus);aspect-ratio:var(--m-hero-sign-ar);margin-bottom:var(--m-s3);background:var(--m-ink-60);-webkit-mask:url(img/marence-sign.svg) center / contain no-repeat;mask:url(img/marence-sign.svg) center / contain no-repeat}
.m-about .m-about__slogan{max-width:14em;margin-right:calc(-1 * var(--m-track));color:var(--m-ink-card);font-size:var(--m-ab-slogan);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-1);text-transform:uppercase;text-wrap:balance}
.m-about .m-about__card-text{max-width:22em;margin-top:var(--m-s2);color:var(--m-ink-80);font-size:var(--m-fs-3);line-height:var(--m-lh-2);text-wrap:balance}
.m-about .m-about__card .m-about__btn{margin-top:var(--m-s4)}
@media (orientation:portrait) and (max-height:700px){.m-about .m-about__card-text{display:none}}
@media (orientation:landscape) and (min-width:900px){
  .m-about .m-about__hero{
    --m-ab-slogan:calc(var(--m-ab-card-w) * .068);
    grid-template-columns:max(var(--m-pad), 7vw) minmax(0, 1fr) var(--m-s6) var(--m-ab-card-w) max(40px, 6vw);grid-template-rows:minmax(0, 1fr);
    height:max(480px, calc(100svh - var(--m-ab-top)));min-height:0;
  }
  .m-about .m-about__hero-media{grid-area:1 / 1 / 2 / -1}
  .m-about .m-about__say{grid-area:1 / 2 / 2 / 3;align-self:center;position:relative;isolation:isolate;padding:0;background:none}
  /* soft linear darkening of the left part of the photo for the white text (as the home first screen): no oval, no
     edge on the sky; alphas from the pixels of the dawn frame (recipe 7) */
  .m-about .m-about__hero-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right, rgb(var(--m-scrim) / var(--m-ab-veil)) 0, rgb(var(--m-scrim) / var(--m-ab-veil)) 30%, rgb(var(--m-scrim) / calc(var(--m-ab-veil) * .8)) 42%, rgb(var(--m-scrim) / calc(var(--m-ab-veil) * .45)) 54%, rgb(var(--m-scrim) / calc(var(--m-ab-veil) * .15)) 64%, rgb(var(--m-scrim) / 0) 74%)}
  .m-about .m-about__crumb{font-size:var(--m-ab-crumb-l)}
  .m-about .m-about__card{grid-area:1 / 4 / 2 / 5;align-self:center;justify-self:stretch;width:auto;margin:0;padding:9%;outline-offset:calc(var(--m-ab-card-w) * -.035)}
  .m-about .m-about__card .m-about__sign{width:calc(var(--m-ab-card-w) * .09);margin-bottom:calc(var(--m-ab-card-w) * .05)}
  .m-about .m-about__slogan{max-width:10.4em}
  .m-about .m-about__card-text{margin-top:calc(var(--m-ab-card-w) * .055);font-size:max(var(--m-fs-2), calc(var(--m-ab-card-w) * .037))}
  .m-about .m-about__card .m-about__btn{min-height:max(40px, calc(var(--m-ab-card-w) * .105));margin-top:calc(var(--m-ab-card-w) * .065);font-size:max(var(--m-fs-2), calc(var(--m-ab-card-w) * .0315))}
}

/* 2. anchors on the first screen = visible buttons at the lower edge of the photo (owner D-178: "чтобы видно было, что
   это как кнопки"): sharp corners, a thin white frame, a dark see-through fond, white capitals; hover and focus = white
   fill, black text; one even row in the middle, sideways scroll where it does not fit */
.m-about .m-about__toc{grid-area:4 / 1;align-self:end;z-index:1;padding:0 0 var(--m-s5);background:none}
.m-about .m-about__toc ol{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--m-s2);justify-content:start;padding:0 var(--m-ab-x);overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:var(--m-ab-x);scrollbar-width:none}
.m-about .m-about__toc ol::-webkit-scrollbar{display:none}
.m-about .m-about__toc li{scroll-snap-align:start}
.m-about .m-about__toc a{display:flex;align-items:center;min-height:var(--m-tap);padding:0 var(--m-s4) 0 calc(var(--m-s4) + var(--m-track));background:rgb(var(--m-scrim) / var(--m-ab-chip-veil));border:var(--m-line) solid var(--m-on-photo-85);border-radius:var(--m-r-ctl);color:var(--m-on-photo);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-1);text-decoration:none;text-transform:uppercase;white-space:nowrap}
.m-about .m-about__toc a:is(:hover, :focus-visible){background:var(--m-on-photo);border-color:var(--m-on-photo);color:var(--m-ink)}
.m-about .m-about__toc a:focus-visible{outline:var(--m-focus) solid var(--m-on-photo);outline-offset:var(--m-focus-off)}
@media (orientation:landscape) and (min-width:900px){
  .m-about .m-about__toc{grid-area:1 / 1 / 2 / -1;align-self:end;padding:0 0 var(--m-s5)}
  .m-about .m-about__toc ol{justify-content:center;padding:0 max(var(--m-pad), 7vw)}
}
@media (min-width:1200px){.m-about .m-about__toc ol{gap:var(--m-s3)}}

/* 3. the mosaic: rows 50/50 without gaps, photo across its half (cover), text half on its own fond; phone = photo 4:3
   on top, text under it */
.m-about .m-about__row{display:grid;grid-template-columns:minmax(0, 1fr);background:var(--m-ivory);scroll-margin-top:var(--m-s5)}
.m-about .m-about__ph{position:relative;aspect-ratio:4 / 3;overflow:hidden;background:var(--m-ground)}
.m-about .m-about__ph img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.m-about .m-about__ph figcaption{position:absolute;left:0;right:0;bottom:0;padding:var(--m-s7) var(--m-s5) var(--m-s4);color:var(--m-on-photo);font-size:var(--m-fs-1);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-kick);text-transform:uppercase;background:linear-gradient(to top, rgb(var(--m-scrim) / var(--m-ab-cap-veil)) 0, rgb(var(--m-scrim) / var(--m-ab-cap-veil)) calc(100% - var(--m-s7)), rgb(var(--m-scrim) / 0) 100%)}
.m-about .m-about__ph--line img{object-position:50% 70%}
@media (min-width:900px){.m-about .m-about__ph--line img{object-position:30% 48%}}
.m-about .m-about__ph--pack{background:var(--m-ground)}
.m-about .m-about__ph--pack img{inset:var(--m-s6) 8% 0;width:84%;height:calc(100% - var(--m-s6));object-fit:contain;object-position:50% 100%}
.m-about .m-about__tx{display:grid;align-content:center;justify-items:start;padding:var(--m-s7) var(--m-ab-x)}
.m-about .m-about__tx > *{max-width:var(--m-ab-measure)}
.m-about .m-about__tx--c{justify-items:center;text-align:center}
.m-about .m-about__tx--c .m-about__prose{justify-items:center}
@media (min-width:900px){
  .m-about .m-about__row{grid-template-columns:repeat(2, minmax(0, 1fr));min-height:var(--m-ab-row)}
  .m-about .m-about__ph{aspect-ratio:auto;min-height:100%}
  .m-about .m-about__row--flip .m-about__ph{order:2}
  .m-about .m-about__tx{padding:var(--m-ab-pad)}
}

/* row 1: figures large, two by two */
.m-about .m-about__nums{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--m-s5) var(--m-s6);width:100%;margin-top:var(--m-s6)}
.m-about .m-about__nums > div{display:grid;align-content:start;gap:var(--m-s2)}
.m-about .m-about__nums dt{color:var(--m-gold-btn);font-size:var(--m-ab-num);font-weight:var(--m-fw-light);letter-spacing:0;line-height:var(--m-lh-0);white-space:nowrap;font-variant-numeric:lining-nums}
.m-about .m-about__nums dd{color:var(--m-char-2);font-size:var(--m-fs-2);line-height:var(--m-lh-2)}

/* row 2 (dark): three points with thin line icons, no circles */
.m-about .m-about__points{display:grid;gap:var(--m-s5);width:100%}
.m-about .m-about__pt{display:grid;grid-template-columns:var(--m-ab-ico) minmax(0, 1fr);column-gap:var(--m-s4);row-gap:var(--m-s1)}
.m-about .m-about__pt .m-about__ico{grid-row:1 / span 3;color:var(--m-gold-btn)}
.m-about .m-about__pt h3{color:var(--m-h-ink);font-family:inherit;font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);line-height:var(--m-lh-1);text-transform:uppercase}
.m-about .m-about__pt p{grid-column:2;color:var(--m-char);font-size:var(--m-ab-text);line-height:var(--m-lh-3)}
.m-about .m-about__note{margin-top:var(--m-s5);color:var(--m-char-2);font-size:var(--m-fs-3);line-height:var(--m-lh-2)}

/* row 4: the contour of Latvia with a point at Ķekava (decor) */
.m-about .m-about__map{display:block;justify-self:center;width:min(100%, 420px);margin:0 0 var(--m-s6);color:var(--m-gold)}
.m-about .m-about__map svg{display:block;width:100%;height:auto;overflow:visible;fill:none;stroke:currentColor;stroke-width:4}
.m-about .m-about__map circle{fill:var(--m-gold-btn);stroke:none}

/* row 5: the words of the team, two buttons */
.m-about .m-about__quote{margin:var(--m-s2) 0 var(--m-s5)}
.m-about .m-about__quote blockquote{margin:0;padding:0;border:0;background:none;quotes:"„" "”" "«" "»"}
.m-about .m-about__quote blockquote:lang(ru){quotes:"«" "»" "„" "“"}
.m-about .m-about__quote blockquote:lang(en){quotes:"“" "”" "‘" "’"}
.m-about .m-about__quote blockquote p{color:var(--m-ink-card);font-size:var(--m-ab-lede);font-style:normal;font-weight:var(--m-fw-reg);line-height:var(--m-lh-1);text-wrap:balance}
.m-about .m-about__quote blockquote p::before{content:open-quote}
.m-about .m-about__quote blockquote p::after{content:close-quote}
.m-about .m-about__quote figcaption{margin-top:var(--m-s3);color:var(--m-char-2);font-size:var(--m-fs-1);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase}
.m-about .m-about__ctas{display:flex;flex-wrap:wrap;gap:var(--m-s3);margin-top:var(--m-s5)}

/* 4. facts: thin frames on ivory, line icon, hover = gold frame and the icon a little up; phone = a swipe strip */
.m-about .m-about__sec{scroll-margin-top:var(--m-s5);padding:var(--m-ab-pad) max(var(--m-ab-x), calc((100% - var(--m-wrap)) / 2))}
.m-about .m-about__facts{background:var(--m-ivory)}
.m-about .m-about__cells{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:var(--m-s3);margin:var(--m-s5) calc(-1 * var(--m-ab-x)) 0;padding:0 var(--m-ab-x) var(--m-s2);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m-ab-x);scrollbar-width:none}
.m-about .m-about__cells::-webkit-scrollbar{display:none}
.m-about .m-about__cells > :is(div, li){display:grid;align-content:start;gap:var(--m-s3);padding:var(--m-s5);background:var(--m-paper);border:var(--m-line) solid var(--m-rule-warm);border-radius:var(--m-r-media);scroll-snap-align:start}
.m-about .m-about__cells dt{display:grid;gap:var(--m-s4);color:var(--m-h-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);line-height:var(--m-lh-1);text-transform:uppercase}
.m-about .m-about__cells .m-about__ico,.m-about .m-about__cells--icons svg{color:var(--m-gold-btn)}
.m-about .m-about__cells dd{color:var(--m-char-2);font-size:var(--m-fs-3);line-height:var(--m-lh-2)}
.m-about .m-about__cells--icons > li{justify-items:center;align-content:center;text-align:center;color:var(--m-h-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);text-transform:uppercase}
.m-about .m-about__cells--icons svg{width:56px;height:auto;aspect-ratio:925 / 779}
@media (hover:hover){
  .m-about .m-about__cells > :is(div, li):hover{border-color:var(--m-gold)}
  .m-about .m-about__cells > :is(div, li):hover :is(.m-about__ico, svg){transform:translateY(var(--m-ab-lift))}
}
@media (min-width:768px){.m-about .m-about__cells{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(3, minmax(0, 1fr));margin-inline:0;padding:0;overflow:visible}}
@media (min-width:1200px){.m-about .m-about__cells{grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))}}

/* 5. questions: native details with H3, several may stay open, no FAQPage */
.m-about .m-about__faq{background:var(--m-paper)}
.m-about .m-about__faq-list{margin-top:var(--m-s5)}
/* 09.10 (105): the questions moved to the FAQ, the block = head + one line with the link; centred like the cooperation block */
.m-about .m-about__faq:not(:has(.m-about__faq-list)){display:grid;justify-items:center;text-align:center}
.m-about .m-about__faq > .m-about__prose{justify-items:center;margin-top:var(--m-s5);color:var(--m-char)}
.m-about .m-about__qa + .m-about__qa{margin-top:var(--m-s2)}
.m-about .m-about__qa summary{display:grid;grid-template-columns:minmax(0, 1fr) var(--m-glyph);align-items:center;column-gap:var(--m-s4);min-height:var(--m-tap);padding:var(--m-s4) 0;color:var(--m-ink);cursor:pointer;list-style:none}
.m-about .m-about__qa summary::-webkit-details-marker{display:none}
.m-about .m-about__qa summary h3{color:var(--m-h-ink);font-family:inherit;font-size:var(--m-fs-4);font-weight:var(--m-fw-semi);letter-spacing:0;line-height:var(--m-lh-1);text-transform:none}
.m-about .m-about__qa summary::after{content:"";width:var(--m-glyph);height:var(--m-glyph);background:linear-gradient(currentColor, currentColor) center / 100% var(--m-hair) no-repeat, linear-gradient(currentColor, currentColor) center / var(--m-hair) 100% no-repeat}
.m-about .m-about__qa[open] summary::after{transform:rotate(45deg)}
.m-about .m-about__a{padding:0 calc(var(--m-glyph) + var(--m-s4)) var(--m-s5) 0}
.m-about .m-about__a p{max-width:var(--m-ab-measure);color:var(--m-char)}

/* 6. company details, social, ratings with dates and the line of UCPD art. 7(6); no "Atsauksmes", no AggregateRating */
.m-about .m-about__req{padding-block:var(--m-s7);background:var(--m-ground);text-align:center}
.m-about .m-about__req-lines{display:grid;justify-items:center;gap:var(--m-s1)}
.m-about .m-about__req-lines > li{display:flex;flex-wrap:wrap;justify-content:center;color:var(--m-char);font-size:var(--m-fs-3);line-height:var(--m-ab-lh-req)}
.m-about .m-about__req-lines > li > span + span::before{content:"·";margin:0 var(--m-s3);color:var(--m-gold-btn)}
.m-about .m-about__req-lines > .m-about__req-note{max-width:40rem;color:var(--m-char-2);font-size:var(--m-fs-2);line-height:var(--m-lh-2)}

/* 4b. years (05.10): a two-column list on the phone, one row of five on a computer; gold light numerals as in the
   story row, no rules between the years */
.m-about .m-about__years{margin-top:var(--m-s7)}
.m-about .m-about__yr{display:grid;gap:var(--m-s4);max-width:var(--m-ab-measure);margin:var(--m-s5) auto 0;text-align:left}
.m-about .m-about__yr > div{display:grid;grid-template-columns:4.5rem minmax(0, 1fr);column-gap:var(--m-s4);align-items:baseline}
.m-about .m-about__yr dt{color:var(--m-gold-btn);font-size:var(--m-ab-yr);font-weight:var(--m-fw-light);letter-spacing:0;line-height:var(--m-lh-0);font-variant-numeric:lining-nums}
.m-about .m-about__yr dd{color:var(--m-char-2);font-size:var(--m-fs-3);line-height:var(--m-lh-2)}
.m-about .m-about__yr a{text-decoration:underline;text-decoration-color:var(--m-gold);text-decoration-thickness:var(--m-line);text-underline-offset:.2em}
@media (min-width:900px){
  .m-about .m-about__yr{grid-template-columns:repeat(5, minmax(0, 1fr));gap:var(--m-s6);max-width:none}
  .m-about .m-about__yr > div{grid-template-columns:none;row-gap:var(--m-s3);align-content:start}
}

/* 6a. cooperation (05.10): centred text on ivory, the same measure as the rows */
.m-about .m-about__co{display:grid;justify-items:center;background:var(--m-ivory);text-align:center}
.m-about .m-about__co .m-about__prose{justify-items:center;margin-top:var(--m-s5);color:var(--m-char)}

/* 7. closing: small lotus, the slogan large, the button */
.m-about .m-about__end{display:grid;justify-items:center;gap:var(--m-s5);padding:var(--m-ab-pad) var(--m-ab-x);background:var(--m-paper);text-align:center}
.m-about .m-about__end .m-about__sign{width:var(--m-lotus);margin:0}
.m-about .m-about__end-slogan{max-width:16em;margin-right:calc(-1 * var(--m-track));color:var(--m-ink-card);font-size:var(--m-ab-end);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-1);text-transform:uppercase;text-wrap:balance}

/* motion (src/about-motion.js adds .is-motion only with IntersectionObserver and without reduce, and .is-in on entry):
   blocks rise 20 px and fade in, the photo of a row settles from 1.04, the gold line draws itself; nothing on the first
   screen, no parallax */
.m-about.is-motion [data-rise]{transition:opacity var(--m-ab-d-rise) var(--m-ease), transform var(--m-ab-d-rise) var(--m-ease)}
.m-about.is-motion [data-rise]:not(.is-in){opacity:0;transform:translateY(20px)}
.m-about.is-motion .m-about__ph img{transition:transform var(--m-ab-d-photo) var(--m-ease)}
.m-about.is-motion .m-about__row:not(.is-in) .m-about__ph:not(.m-about__ph--pack) img{transform:scale(var(--m-ab-zoom))}
@media (prefers-reduced-motion:no-preference){
  html:has(.m-about){scroll-behavior:smooth}
  .m-about .m-about__qa summary::after,.m-about .m-about__cells :is(.m-about__ico, svg){transition:transform var(--m-d-in) var(--m-ease)}
}

/* 8. checks, ratings, social (D-177): two soft panels on the white, the radius of the media token; the ratings as large
   figures with the platform, link and date (no stars), the social row with line icons */
.m-about .m-about__trust{background:var(--m-paper)}
.m-about .m-about__trust-grid{display:grid;gap:var(--m-s4);margin-top:var(--m-s6)}
.m-about .m-about__panel{display:grid;align-content:start;gap:var(--m-s4);padding:var(--m-s6) var(--m-s5);background:var(--m-ivory);border-radius:var(--m-r-media)}
.m-about .m-about__h3{color:var(--m-ab-gold-ink);font-family:inherit;font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-1);text-transform:uppercase}
.m-about .m-about__h3--soc{margin-top:var(--m-s4)}
.m-about .m-about__docs{display:grid;gap:var(--m-s5)}
.m-about .m-about__docs dt{color:var(--m-h-ink);font-size:var(--m-fs-4);font-weight:var(--m-fw-semi);line-height:var(--m-lh-1)}
.m-about .m-about__docs dd{margin-top:var(--m-s2);color:var(--m-char);font-size:var(--m-fs-3);line-height:var(--m-lh-2)}
.m-about .m-about__rates{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--m-s5)}
.m-about .m-about__rates dt{color:var(--m-gold-btn);font-size:var(--m-ab-num);font-weight:var(--m-fw-light);line-height:var(--m-lh-0)}
.m-about .m-about__rates dd{margin-top:var(--m-s2);color:var(--m-char-2);font-size:var(--m-fs-3);line-height:var(--m-lh-2)}
.m-about .m-about__rates a{color:var(--m-ink);font-weight:var(--m-fw-semi);text-decoration:underline;text-decoration-color:var(--m-gold);text-underline-offset:var(--m-ul-off-s)}
.m-about .m-about__fine{color:var(--m-char-2);font-size:var(--m-fs-2);line-height:var(--m-lh-2)}
.m-about .m-about__soc{display:flex;flex-wrap:wrap;gap:var(--m-s2) var(--m-s6)}
.m-about .m-about__soc a{display:inline-flex;align-items:center;gap:var(--m-s3);min-height:var(--m-tap);color:var(--m-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);text-decoration:none;text-transform:uppercase}
.m-about .m-about__soc .m-about__ico{width:22px;height:22px;color:var(--m-gold-btn)}
.m-about .m-about__soc a:hover span{text-decoration:underline;text-decoration-color:var(--m-gold);text-underline-offset:var(--m-ul-off)}
@media (min-width:900px){.m-about .m-about__trust-grid{grid-template-columns:minmax(0, 7fr) minmax(0, 5fr)}.m-about .m-about__panel{padding:var(--m-s7)}}
.m-about .m-about__panel--org{grid-column:1 / -1}
.m-about .m-about__org{display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:var(--m-s3) var(--m-s5)}
.m-about .m-about__org li{color:var(--m-char);font-size:var(--m-fs-4);line-height:var(--m-lh-2)}

/* D-180: one large figure in the mud row ("7000", with "aptuveni"); the organisations as an editorial inset (centred head,
   names in the capitals of the site captions, an even grid, air, no lines); the blog as a quiet line before the end */
.m-about .m-about__nums--one{grid-template-columns:minmax(0, 1fr)}
.m-about .m-about__h3--c{text-align:center}
.m-about .m-about__panel--org{justify-items:center;gap:var(--m-s6);padding:var(--m-s7) var(--m-s5)}
.m-about .m-about__org{width:100%;max-width:60rem;grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));gap:var(--m-s5) var(--m-s6);text-align:center}
.m-about .m-about__org li{color:var(--m-h-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-2);text-transform:uppercase;text-wrap:balance}
.m-about .m-about__blog{display:grid;justify-items:center;gap:var(--m-s4);background:var(--m-ivory);text-align:center}
.m-about .m-about__blog .m-about__eyebrow{margin:0;font-family:inherit}
.m-about .m-about__blog-line{max-width:30em;color:var(--m-char);font-size:var(--m-ab-lede);line-height:var(--m-lh-2);text-wrap:balance}
.m-about .m-about__blog-cta{margin-top:var(--m-s2)}
@media (min-width:900px){.m-about .m-about__panel--org{padding:var(--m-s7)}}

/* D-181: the organisations as a wall of names (no marks of others without their permission): even cells, one size and
   grey of the site, the name in the middle, light cells on the ivory panel, no lines */
.m-about .m-about__org{max-width:none;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:var(--m-s3)}
.m-about .m-about__org li{display:grid;place-items:center;min-height:96px;padding:var(--m-s4);background:var(--m-paper);border-radius:var(--m-r-media);color:var(--m-char-2);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);line-height:var(--m-lh-2);text-align:center;text-transform:uppercase;text-wrap:balance}

/* swipe hint (owner 16:05): under a row that really scrolls sideways (anchors, facts on the phone) three small drops of
   mud glow one after another; shown by about-motion.js only while the row overflows, gone after the first swipe; static
   under reduce */
.m-about .m-about__swipe{display:none;justify-content:center;gap:var(--m-s2);margin-top:var(--m-s3);color:var(--m-char)}
.m-about .m-about__swipe.is-on{display:flex}
.m-about .m-about__toc .m-about__swipe{color:var(--m-on-photo)}
.m-about .m-about__swipe i{display:block;width:7px;height:7px;background:currentColor;border-radius:50% 50% 50% 0;rotate:-45deg;opacity:.35}
@keyframes m-ab-drop{0%, 100%{opacity:.35;scale:.85}33%{opacity:1;scale:1.1}}
@media (prefers-reduced-motion:no-preference){
  .m-about .m-about__swipe.is-on i{animation:m-ab-drop 1.2s var(--m-ease) infinite}
  .m-about .m-about__swipe.is-on i:nth-child(2){animation-delay:.4s}
  .m-about .m-about__swipe.is-on i:nth-child(3){animation-delay:.8s}
}

/* row Klāsts (16:15): one real frame with the product, chosen in the panel; cover, framed so the product stays whole */
.m-about .m-about__ph--kl img{object-position:50% 50%}
.m-about .m-about__ph--kl[data-kl="foam"] img{object-position:62% 22%}
.m-about .m-about__ph--kl[data-kl="deo"] img{object-position:50% 45%}
.m-about .m-about__ph--girl img{object-position:50% 20%}
.m-about .m-about__ph--kl[data-kl="men"] img{object-position:50% 88%}
.m-about .m-about__ph--kl[data-kl="xmas"] img{object-position:70% 82%}
.m-about .m-about__ph--kl[data-kl="lineup"]{background:var(--m-ground)}
.m-about .m-about__ph--kl[data-kl="lineup"] img{inset:var(--m-s6) 8% 0;width:84%;height:calc(100% - var(--m-s6));object-fit:contain;object-position:50% 100%}

/* organisations (16:15): one even window: 7 in a row from 1200 px, 4 + 3 (second row centred) from 768, 2 columns on the
   phone with the last centred; one height for every cell */
.m-about .m-about__org{grid-template-columns:repeat(4, minmax(0, 1fr));grid-auto-rows:1fr;gap:var(--m-s3)}
.m-about .m-about__org li{grid-column:span 2;min-height:88px}
.m-about .m-about__org li:nth-child(7):last-child{grid-column:2 / span 2}
@media (min-width:768px){
  .m-about .m-about__org{grid-template-columns:repeat(8, minmax(0, 1fr))}
  .m-about .m-about__org li:nth-child(7):last-child{grid-column:auto / span 2}
  .m-about .m-about__org li:nth-child(5){grid-column:2 / span 2}
}
@media (min-width:1200px){
  .m-about .m-about__org{grid-template-columns:repeat(7, minmax(0, 1fr))}
  .m-about .m-about__org li,.m-about .m-about__org li:nth-child(5),.m-about .m-about__org li:nth-child(7):last-child{grid-column:auto}
}

/* D-186 (owner 05.10 evening): the mosaic goes on under Klāsts. Fakti = text left, photo right (--flip); Uzticība = photo
   left, text right. In the text half: facts as a list (icon and title, the line under it), the years as a list (year |
   line), checks and ratings without panels; the wall of organisations stays a band of its own under the mosaic. No new
   lines, shadows or radii: grouping by air only */
.m-about .m-about__tx--list > *{width:100%;max-width:36rem}
.m-about .m-about__ph--shelf img{object-position:50% 50%}
.m-about .m-about__ph--care img{object-position:72% 35%}
.m-about .m-about__row--facts .m-about__cells{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:minmax(0, 1fr);gap:var(--m-s5);margin:var(--m-s2) 0 0;padding:0;overflow:visible;scroll-snap-type:none}
.m-about .m-about__row--facts .m-about__cells > :is(div, li){display:block;padding:0;background:none;border:0;border-radius:0}
.m-about .m-about__row--facts .m-about__cells dt{display:flex;align-items:center;gap:var(--m-s3)}
.m-about .m-about__row--facts .m-about__cells .m-about__ico{flex:none;width:24px;height:24px}
.m-about .m-about__row--facts .m-about__cells dd{margin:var(--m-s2) 0 0 calc(24px + var(--m-s3));color:var(--m-char);font-size:var(--m-ab-text);line-height:var(--m-lh-3)}
.m-about .m-about__row--facts .m-about__cells--icons{grid-template-columns:repeat(3, minmax(0, 1fr));gap:var(--m-s5) var(--m-s4)}
.m-about .m-about__row--facts .m-about__cells--icons > li{display:grid;justify-items:center;gap:var(--m-s2)}
.m-about .m-about__row--facts .m-about__years{margin-top:var(--m-s6)}
.m-about .m-about__row--facts .m-about__yr{grid-template-columns:minmax(0, 1fr);gap:var(--m-s4);max-width:none;margin:var(--m-s4) 0 0}
.m-about .m-about__row--facts .m-about__yr > div{grid-template-columns:4.5rem minmax(0, 1fr);row-gap:0;align-items:baseline}
.m-about .m-about__row--trust .m-about__panel{gap:var(--m-s4);margin-top:var(--m-s5);padding:0;background:none;border-radius:0}
/* ratings of the trust row: the whole list is one grid, the figure column = the widest figure on one line (owner 06.10: in
   5.5rem "100 %" broke in two and EN "100%" ran into its line), so the figures stand one under the other and every line
   starts at one edge */
.m-about .m-about__row--trust .m-about__rates{grid-template-columns:max-content minmax(0, 1fr);gap:var(--m-s4);align-items:baseline}
.m-about .m-about__row--trust .m-about__rates > div{display:contents}
.m-about .m-about__row--trust .m-about__rates dt{white-space:nowrap}
.m-about .m-about__row--trust .m-about__rates dd{margin-top:0}
.m-about .m-about__orgs{padding-top:var(--m-ab-pad)}
/* a row whose photo field is empty (plugin class m-about__row--solo): the text takes the full width */
@media (min-width:900px){.m-about .m-about__row--solo{grid-template-columns:minmax(0, 1fr)}}
/* anchor row on a computer: centred while it fits, otherwise it starts at the left edge and scrolls (a centred grid wider
   than its box cut off the first buttons, RU up to ~1440 px; review of 05.10, item 2) */
@media (orientation:landscape) and (min-width:900px){.m-about .m-about__toc ol{width:max-content;max-width:100%;margin-inline:auto;justify-content:start}}
/* three figures in the story row (plugin class m-about__nums--3, texts v3): a row of three where a column gets about
   8 rem or more (one-column layout 600-899 px, half width from 1280 px), otherwise a list "figure | line" with the figures
   in one column; never two plus a lone third */
.m-about .m-about__nums--3{grid-template-columns:max-content minmax(0, 1fr);gap:var(--m-s4) var(--m-s5);align-items:baseline}
.m-about .m-about__nums--3 > div{display:contents}
@media (min-width:600px) and (max-width:899px), (min-width:1280px){.m-about .m-about__nums--3{grid-template-columns:repeat(3, minmax(0, 1fr));gap:var(--m-s5) var(--m-s6);align-items:start}.m-about .m-about__nums--3 > div{display:grid}}
/* == about page "Par mums": END == */

/* == wishlist (YITH WooCommerce Wishlist 4.18.1, owner 08.10.2026): BEGIN. research/wishlist-2026-10-08/SPEC.md; markup
   mu-plugins/marence-wishlist.php and goya-child/woocommerce/ wishlist-view.php, wishlist-view-mobile.php,
   add-to-wishlist-button.php, add-to-wishlist-remove.php. Status line, hearts, the list page (layout B: the shop grid), empty
   state, shelf. No shadow, no capsule, no circle, no line between rows; the only radius is the button one (--m-r-ctl). == */
:root{--m-z-wlbar:596;--m-pbar-d:80px;--m-heart-out:7px;--m-wl-gap:15px;--m-fs-5:16px}

/* status line: black, at the bottom edge, content in the site frame; phone: over the bottom bar (595) or over the product
   add-to-cart bar; under the theme panels (600 and up). Hidden = moved down and transparent, no pointer, action not tabbable */
.m-wl-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:var(--m-z-wlbar);
  padding-bottom:var(--m-safe, 0);background:var(--m-ink);color:var(--m-paper);border-radius:0;box-shadow:none;
  opacity:0;transform:translateY(100%);pointer-events:none;
  transition:transform var(--m-d-out) var(--m-ease), opacity var(--m-d-out) var(--m-ease);
}
.m-wl-bar.is-on{opacity:1;transform:none;pointer-events:auto;transition-duration:var(--m-d-in)}
.m-wl-bar__in{
  display:grid;grid-template-columns:minmax(0, 1fr) auto;align-items:center;gap:var(--m-s4);
  box-sizing:border-box;width:100%;min-height:var(--m-btn-h);margin:0 auto;
  padding:0 var(--m-pad-r, var(--m-pad)) 0 var(--m-pad-l, var(--m-pad));
}
.m-wl-bar__msg{margin:0;color:var(--m-paper);font-size:var(--m-fs-3);font-weight:var(--m-fw-reg);line-height:var(--m-lh-1)}
.m-wl-bar .m-wl-bar__act{
  display:inline-flex;align-items:center;min-height:var(--m-tap);
  color:var(--m-paper);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);
  text-transform:uppercase;line-height:var(--m-lh-1);white-space:nowrap;
  text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s);
}
.m-wl-bar .m-wl-bar__act:is(:hover, :focus){color:var(--m-paper)}
.m-wl-bar .m-wl-bar__act[hidden]{display:none}
.m-wl-bar .m-wl-bar__act:focus-visible{outline:var(--m-focus) solid var(--m-paper);outline-offset:var(--m-focus-off)}
@media (max-width:1023px){
  body.m-has-tabbar .m-wl-bar{bottom:calc(var(--m-bar-h) + var(--m-safe));padding-bottom:0}
  body.single-product.product-bar-visible .m-wl-bar{bottom:calc(var(--m-sbar-h) + var(--m-safe));padding-bottom:0}
}
@media (min-width:1024px){
  .m-wl-bar__in{width:calc(100% - 2 * var(--m-pad));max-width:var(--m-wrap);padding:0}
  body.fixed-product-bar-bottom.product-bar-visible.single-product .m-wl-bar{bottom:var(--m-pbar-d)}
}
@media (prefers-reduced-motion:reduce){
  .m-wl-bar,.m-wl-bar.is-on{transform:none;transition:opacity var(--m-d-out) linear}
}

/* hearts of the shop cards (Goya listing style 1: right of the name): glyph 18 in a 44 x 44 tap zone that reaches at most
   7 px into the 15 px gap between cards and does not make the name row taller; outline glyph = second ink, filled = ink;
   no glyph swap and no zoom on hover (theme shop.css), colour on hover only where there is a mouse; the theme tooltip
   (dark bubble with a shadow) off, the name is in aria-label. The box keeps its width while the heart loads by ajax */
body .products .yith-wcwl-add-to-wishlist{min-width:calc(var(--m-tap) - var(--m-heart-out));min-height:var(--m-glyph);padding-left:var(--m-s2)}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button{display:flex;justify-content:flex-end}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a{
  display:grid;place-items:center;box-sizing:border-box;width:var(--m-tap);height:var(--m-tap);
  margin:calc((var(--m-glyph) - var(--m-tap)) / 2) calc(-1 * var(--m-heart-out)) calc((var(--m-glyph) - var(--m-tap)) / 2) 0;
  padding:0;background:none;border:0;border-radius:0;box-shadow:none;
}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a .icon,
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a:hover .icon{
  display:block;margin:0;font-size:var(--m-glyph);line-height:var(--m-lh-0);color:var(--m-ink-2);transform:none;
}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a .et-heart-fill,
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a:hover .et-heart-fill{color:var(--m-ink)}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a:hover .et-heart::before{content:"\e946"}
body .products .yith-wcwl-add-to-wishlist .et-tooltip .text{display:none}
body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a:focus-visible{
  outline:var(--m-focus) solid var(--m-ink);outline-offset:calc(var(--m-focus-off) - (var(--m-tap) - var(--m-glyph)) / 2);
}
@media (hover:hover){
  body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a:hover .icon{color:var(--m-ink)}
  body .products .yith-wcwl-add-to-wishlist .yith-wcwl-add-button > a .icon{transition:color var(--m-d-out) var(--m-ease)}
}

/* product page: a quiet text action under the black button instead of the grey bar (glyph, then the label) */
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist{margin:var(--m-s2) 0 0}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div{margin:0}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div > a{
  display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--m-s2);
  box-sizing:border-box;width:100%;min-height:var(--m-tap);margin:0;padding:0;
  background:var(--m-clear);border:0;border-radius:0;box-shadow:none;color:var(--m-ink);
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);text-transform:uppercase;
  line-height:var(--m-lh-1);text-decoration:none;
}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div > a .text{
  order:2;font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;text-decoration:inherit;
}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div > a .icon{
  order:1;margin:0;font-size:var(--m-glyph);line-height:var(--m-lh-0);color:var(--m-ink);transform:none;
}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div > a:is(:hover, :focus-visible) .text{
  text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s);
}
body.single-product .et-product-detail .summary .yith-wcwl-add-to-wishlist > div > a:focus-visible{
  outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off);
}

/* list page (page 12 and its translations, body.woocommerce-wishlist): the theme column col-lg-8 widened to the site frame */
body.woocommerce-wishlist .page-padding > .regular-title > .page-header.container,
body.woocommerce-wishlist .page-padding > .container{
  box-sizing:border-box;width:100%;max-width:none;margin-inline:auto;
  padding-inline:var(--m-pad-l, var(--m-pad)) var(--m-pad-r, var(--m-pad));
}
@media (min-width:1024px){
  body.woocommerce-wishlist .page-padding > .regular-title > .page-header.container,
  body.woocommerce-wishlist .page-padding > .container{width:calc(100% - 2 * var(--m-pad));max-width:var(--m-wrap);padding-inline:0}
}
body.woocommerce-wishlist .page-padding :is(.page-header, .container) > .row{margin-inline:0}
body.woocommerce-wishlist .page-padding :is(.page-header, .container) > .row > .col-lg-8{flex:0 0 100%;max-width:100%;padding-inline:0}
body.woocommerce-wishlist .page-header :is(.title_outer, .page-title){text-align:left}
body.woocommerce-wishlist .page-header .page-title{
  margin:0;color:var(--m-h-ink);font-size:var(--m-t-h3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);
  text-transform:uppercase;line-height:var(--m-lh-h2s);
}
body.woocommerce-wishlist:has(.m-wl-empty) .page-header :is(.title_outer, .page-title){text-align:center}

/* count of the products and "share" (owner only) above the grid */
body.woocommerce-wishlist .m-wl-head{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 var(--m-s4);
  min-height:var(--m-tap);margin:0 0 var(--m-s5);
}
body.woocommerce-wishlist .m-wl-count{
  margin:0;color:var(--m-ink-2);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);
  text-transform:uppercase;line-height:var(--m-lh-1);
}
body.woocommerce-wishlist #yith-wcwl-form .m-wl-share{
  display:inline-flex;align-items:center;min-height:var(--m-tap);margin:0;padding:0;
  background:var(--m-clear);border:0;border-radius:0;box-shadow:none;color:var(--m-ink);
  font-family:inherit;font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);
  text-transform:uppercase;line-height:var(--m-lh-1);cursor:pointer;
}
body.woocommerce-wishlist #yith-wcwl-form .m-wl-share:is(:hover, :focus-visible){
  background:var(--m-clear);color:var(--m-ink);
  text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s);
}
body.woocommerce-wishlist #yith-wcwl-form .m-wl-share:focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}

/* the grid and the shelf = the catalogue grid: 2 columns on the phone, 3 on a tablet, 4 from 1024; no lines, air only */
body.woocommerce-wishlist .m-wl{margin:0;padding:0;border:0;list-style:none}
body.woocommerce-wishlist :is(.m-wl, .m-wl-shelf) ul.products.row{
  display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--m-s6) var(--m-wl-gap);margin:0;padding:0;
}
body.woocommerce-wishlist :is(.m-wl, .m-wl-shelf) ul.products.row > li.product{
  width:auto;max-width:none;flex:none;margin:0;padding:0;border:0;list-style:none;
}
@media (min-width:768px){
  body.woocommerce-wishlist .m-wl ul.products.row{grid-template-columns:repeat(3, minmax(0, 1fr))}
  body.woocommerce-wishlist .m-wl-shelf ul.products.row{grid-template-columns:repeat(4, minmax(0, 1fr))}
}
@media (min-width:1024px){
  body.woocommerce-wishlist :is(.m-wl, .m-wl-shelf) ul.products.row{grid-template-columns:repeat(4, minmax(0, 1fr));gap:var(--m-s7) var(--m-s5)}
}
body.woocommerce-wishlist :is(.m-wl, .m-wl-shelf) .product_thumbnail img{width:100%;aspect-ratio:1 / 1;object-fit:contain;background:var(--m-paper)}
/* "sold out" as text, not the theme capsule */
body.woocommerce-wishlist .m-wl .badge.out-of-stock{
  padding:0;background:var(--m-clear);border:0;border-radius:0;color:var(--m-ink-2);
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);text-transform:uppercase;line-height:var(--m-lh-1);
}
/* "remove" under the card */
body.woocommerce-wishlist .m-wl .m-wl-rm{
  display:inline-flex;align-items:center;min-height:var(--m-tap);margin:var(--m-s1) 0 0;padding:0;
  color:var(--m-ink-2);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);
  text-transform:uppercase;line-height:var(--m-lh-1);text-decoration:none;
}
body.woocommerce-wishlist .m-wl .m-wl-rm:focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}
@media (hover:hover){
  body.woocommerce-wishlist .m-wl .m-wl-rm:hover{color:var(--m-ink);text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s)}
}

/* empty list: centred under the H1, the phrase, the black button to the shop of the language */
body.woocommerce-wishlist .m-wl-empty{display:grid;justify-items:center;gap:var(--m-s5);padding:var(--m-s7) 0 0;text-align:center}
@media (min-width:1024px){body.woocommerce-wishlist .m-wl-empty{padding-top:calc(2 * var(--m-s7))}}
body.woocommerce-wishlist .m-wl-empty__text{
  max-width:var(--m-text-w);margin:0;color:var(--m-w-text);font-size:var(--m-fs-5);font-weight:var(--m-fw-light);line-height:var(--m-lh-3);
}
body.woocommerce-wishlist .m-wl-empty .m-wl-btn{
  display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--m-btn-h);
  padding:var(--m-s3) var(--m-s6);background:var(--m-ink);color:var(--m-paper);border:0;border-radius:var(--m-r-ctl);box-shadow:none;
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;
  line-height:var(--m-lh-1);text-align:center;text-decoration:none;
}
body.woocommerce-wishlist .m-wl-empty .m-wl-btn:hover{background:var(--m-ink-80);color:var(--m-paper)}
body.woocommerce-wishlist .m-wl-empty .m-wl-btn:focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}

/* shelf of popular products under the list: separated by air, head like the home section heads */
body.woocommerce-wishlist .m-wl-shelf{margin-top:var(--m-s7)}
@media (min-width:1024px){body.woocommerce-wishlist .m-wl-shelf{margin-top:calc(2 * var(--m-s7))}}
body.woocommerce-wishlist .m-wl-shelf .m-wl-h2{
  margin:0 0 var(--m-s5);color:var(--m-h-ink);font-size:var(--m-t-h2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);
  text-transform:uppercase;line-height:var(--m-lh-h2s);
}
/* == wishlist: END == */
/* == gift card block (YITH WooCommerce Gift Cards 4.10.0, D-220, owner 08.10.2026): BEGIN. Passport
   docs/plugins/yith-woocommerce-gift-cards-premium/README.md. The separate gift card block above the cart and the checkout
   form (templates/checkout/form-gift-cards.php) in the shop look: the question line with a thin rule instead of the plugin
   shadow and 10 px right band; the apply button in the colour of the theme buttons (#282828, Kirki) instead of the plugin
   teal (inline style ywgc-frontend-inline-css carries !important, so !important here too); phones: field and button one
   under the other, as the theme does for the coupon field (shop.css .inner_coupon below 576 px). == */
body .ywgc_have_code{box-shadow:none;border:var(--m-line) solid var(--m-rule);border-radius:0;padding:var(--m-s4)}
body .ywgc_enter_code .ywgc_apply_gift_card_button{background-color:#282828 !important;color:var(--m-paper) !important;border-radius:0}
body .ywgc_enter_code .ywgc_apply_gift_card_button:hover{background-color:var(--m-ink) !important;color:var(--m-paper) !important}
@media (max-width:575px){
  body .ywgc_enter_code .form-row{float:none;width:100%}
  body .ywgc_enter_code .form-row .input-text,body .ywgc_enter_code .form-row .button{width:100%}
}
/* == gift card block: END == */
/* == loyalty page (D-231..D-234, owner 09.10.2026): BEGIN. LV page 28318 and its RU/EN translations (migration 103 puts
   <div class="m-loyalty"> around the text). "In short" plate on top = variant A: rounded soft plate, a deliberate exception
   from the brand canon for this block only (D-234, do not copy to other blocks). Below it a calm reading column. == */
.m-loyalty{max-width:760px;margin:0 auto}
.m-loyalty .m-lp-short{background:#ECEAE9;border-radius:22px;padding:22px;margin:0 0 var(--m-s7)}
.m-loyalty .m-lp-title{margin:0 0 var(--m-s4);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;color:var(--m-ink)}
.m-loyalty .m-lp-levels{display:grid;grid-template-columns:1fr 1fr;gap:var(--m-s3);margin:0 0 var(--m-s3)}
.m-loyalty .m-lp-level{border-radius:16px;padding:18px var(--m-s4);text-align:center}
.m-loyalty .m-lp-level span{display:block}
.m-loyalty .m-lp-level .n{font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track)}
.m-loyalty .m-lp-level .p{font-size:40px;font-weight:var(--m-fw-semi);line-height:1.1;margin:6px 0 4px}
.m-loyalty .m-lp-level .h{font-size:14px}
.m-loyalty .m-lp-silver{background:linear-gradient(135deg,#E3E3E3,#B2B2B2);color:var(--m-ink)}
.m-loyalty .m-lp-gold{background:#85754E;color:var(--m-paper)}
.m-loyalty .m-lp-rows{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:mlp}
.m-loyalty .m-lp-rows li{counter-increment:mlp;display:grid;grid-template-columns:40px 1fr;align-items:center;gap:var(--m-s3);margin:0;padding:14px var(--m-s4);background:var(--m-paper);border-radius:14px;font-size:15px;line-height:1.5;color:var(--m-ink)}
.m-loyalty .m-lp-rows li::before{content:counter(mlp);font-size:20px;font-weight:var(--m-fw-semi);text-align:center}
.m-loyalty .m-lp-body h2{margin:var(--m-s7) 0 var(--m-s4);font-size:var(--m-fs-4);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track);text-transform:uppercase;line-height:1.4;color:var(--m-ink)}
.m-loyalty .m-lp-body > p:first-child{font-size:17px}
.m-loyalty .m-lp-body p,.m-loyalty .m-lp-body li{font-size:16px;line-height:1.65;color:var(--m-ink)}
.m-loyalty .m-lp-body p{margin:0 0 var(--m-s4)}
.m-loyalty .m-lp-body ol,.m-loyalty .m-lp-body ul{margin:0 0 var(--m-s4);padding-left:1.25em}
.m-loyalty .m-lp-body li{margin:0 0 var(--m-s3)}
/* links: the theme content-link line only (an own underline on top gave a double line on phones, owner 09.10) */
@media (max-width:520px){
  .m-loyalty .m-lp-short{padding:var(--m-s4);border-radius:18px}
  .m-loyalty .m-lp-levels{grid-template-columns:1fr}
  .m-loyalty .m-lp-level .p{font-size:34px}
  .m-loyalty .m-lp-rows li{grid-template-columns:28px 1fr;padding:12px 14px}
}
/* == loyalty page: END == */

/* membership notices (D-236): the link in the Memberships notices must read as a link */
.wc-memberships-member-discount-message a,.wc-memberships-message a{color:inherit;font-weight:var(--m-fw-semi);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;border-bottom:0;box-shadow:none;background-image:none}
.wc-memberships-member-discount-message a:hover,.wc-memberships-message a:hover{text-decoration-thickness:2px}

/* account forms: WooCommerce adds a "show password" button to every password field (woocommerce.js); the theme does not
   load the WooCommerce stylesheet that draws it, so it showed as an empty bar under the field (owner 11.10). Hidden. */
.woocommerce form .password-input .show-password-input{display:none}

/* == cart on the phone (owner 13.10.2026): BEGIN. Stand design/cart-mobile-2026-10-13/ (build-cart.mjs), bar markup and
   script mu-plugins/marence-cart-bar.php, review research/council-2026-10-13-cart-mobile/razbor.md. Three things, nothing
   else on the cart is restyled (the free delivery strip above the products is not touched): the loyalty notice links read
   as links, the delivery list is one tidy row per method, the order button stays in reach in a bottom bar. == */

/* loyalty notice (WooCommerce Memberships prints it as a shop notice): the theme makes every notice link an inline-flex
   box with 10 px margins (shop.css ".woocommerce-info a"), fine for a button, wrong for words inside a sentence */
.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info a:not(.button){display:inline;margin:0;color:inherit;font-weight:var(--m-fw-semi);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

/* delivery list, every width (owner 13.10: uneven on the computer too): name on the left, price in its own column on the right, carrier mark of one size after it. The theme
   floats the price inside the name (shop.css "#shipping_method .amount{float:right}"), so it jumped from line to line */
.woocommerce-cart .cart_totals #shipping_method li{align-items:flex-start;gap:10px;margin:0;padding:0}
.woocommerce-cart .cart_totals #shipping_method li > input{flex:none;margin:14px 0 0}
/* the whole row is the tap zone (44 px and more), not only the 16 px dot */
.woocommerce-cart .cart_totals #shipping_method li > label{display:block;min-width:0;min-height:44px;box-sizing:border-box;padding:11px 0}
.woocommerce-cart .cart_totals #shipping_method label > div{align-items:flex-start;gap:10px}
/* the name is a bare text node next to the price: as a grid item it takes the free column and wraps inside it */
.woocommerce-cart .cart_totals #shipping_method .multiparcels-grid-display-text{flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1fr) max-content;column-gap:10px;align-items:baseline;min-width:0;padding-left:0 !important;line-height:1.35;overflow-wrap:anywhere}
.woocommerce-cart .cart_totals #shipping_method .multiparcels-grid-display-text .amount{float:none;margin:0;white-space:nowrap;font-variant-numeric:tabular-nums}
.woocommerce-cart .cart_totals #shipping_method .multiparcels-carrier-icon-image-holder{flex:none;width:52px;margin:0}
.woocommerce-cart .cart_totals #shipping_method .multiparcels-carrier-icon-image-holder img{display:block;width:52px;height:22px;max-width:none !important;object-fit:contain;object-position:right center}

@media (max-width:1023px){
  /* bottom bar: the total and the order button, the look of the product page bar (section "phone (stage 4)"). Shown only
     while the real button is still below it (class is-off set by the plugin script); layer 595 like the tab bar, which is
     never printed on the cart. A tap anywhere on it scrolls down to the delivery, the total and the real button */
  .m-cart-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:595;display:flex;align-items:center;justify-content:space-between;gap:12px;
    box-sizing:border-box;min-height:calc(var(--m-sbar-h) + var(--m-safe));
    padding:8px var(--m-pad-r) calc(8px + var(--m-safe)) var(--m-pad-l);
    background:var(--m-paper);border-top:1px solid var(--m-ink);
    transition:transform .2s ease,visibility .2s;cursor:pointer;
  }
  .m-cart-bar.is-off{transform:translateY(100%);visibility:hidden}
  .m-cart-bar__sum{
    flex:none;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:48px;
    margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;color:var(--m-ink);
    font:inherit;line-height:1.2;text-align:left;white-space:nowrap;cursor:pointer;
  }
  .m-cart-bar__sum:hover,.m-cart-bar__sum:focus{background:none;color:var(--m-ink)}
  .m-cart-bar__k{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
  .m-cart-bar__v{font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}
  /* a small corner after the amount: the total leads down to what it is made of */
  .m-cart-bar__v::after{content:"";display:inline-block;width:6px;height:6px;margin:0 0 3px 8px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg)}
  .m-cart-bar__go{
    flex:0 1 56%;display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:48px;
    margin:0;padding:8px 16px;box-sizing:border-box;background:var(--m-ink);color:var(--m-paper);border:0;border-radius:0;box-shadow:none;
    font-family:inherit;font-size:12px;font-weight:600;line-height:1.25;letter-spacing:.12em;text-transform:uppercase;text-align:center;cursor:pointer;
  }
  .m-cart-bar__go:hover,.m-cart-bar__go:focus{background:var(--m-ink);color:var(--m-paper)}
}
/* typing (coupon, gift card code): the bar leaves, like the tab bar does on the other pages */
@media (max-width:1023px) and (hover:none) and (pointer:coarse){
  body:has(:is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"], [type="range"], [type="color"], [type="file"]), textarea):focus) .m-cart-bar{display:none}
}
@media (min-width:1024px){
  .m-cart-bar{display:none}
  /* the totals box is wider on the computer: the carrier mark a little larger */
  .woocommerce-cart .cart_totals #shipping_method .multiparcels-carrier-icon-image-holder{width:64px}
  .woocommerce-cart .cart_totals #shipping_method .multiparcels-carrier-icon-image-holder img{width:64px;height:26px}
}
@media (prefers-reduced-motion:reduce){.m-cart-bar{transition:none}}
/* == cart on the phone: END == */

/* == cart: bought together (owner 13.10.2026): BEGIN. The theme's own "You may be interested in" block under the cart
   (a Slick carousel at every width). Which products it shows and in which order: mu-plugins/marence-cart-crosssells.php
   and the native Cross-sells field of the products. Here only the heights: the cards of one row stand level, the
   name keeps room for three lines, price, rating and button sit on one line. No card is hidden or moved. == */

/* Before Slick starts, the theme row keeps its columns, gutters and wrapping. */
.woocommerce-cart .cross-sells > ul.products.row:not(.slick-initialized){
  align-items:stretch;
}

/* After Slick starts, stretch its direct li slides without changing their widths. */
.woocommerce-cart .cross-sells > ul.products.slick-initialized > .slick-list > .slick-track{
  display:flex;align-items:stretch;
}
.woocommerce-cart .cross-sells > ul.products.slick-initialized > .slick-list > .slick-track::before,
.woocommerce-cart .cross-sells > ul.products.slick-initialized > .slick-list > .slick-track::after{
  content:none;
}
.woocommerce-cart .cross-sells > ul.products.slick-initialized > .slick-list > .slick-track > li.product.slick-slide{
  flex:0 0 auto;height:auto;
}

/* Use the same card structure before and after Slick starts. */
.woocommerce-cart .cross-sells > ul.products > li.product,
.woocommerce-cart .cross-sells > ul.products.slick-initialized > .slick-list > .slick-track > li.product.slick-slide{
  display:flex;flex-direction:column;align-self:stretch;
}
.woocommerce-cart .cross-sells > ul.products li.product > .product-inner{
  display:flex;flex-direction:column;flex:1 1 auto;min-width:0;
}
.woocommerce-cart .cross-sells > ul.products li.product > .product-inner > .product_thumbnail{
  flex:0 0 auto;
}
.woocommerce-cart .cross-sells > ul.products li.product > .product-inner > .caption{
  display:flex;flex-direction:column;flex:1 1 auto;min-width:0;
}
.woocommerce-cart .cross-sells > ul.products li.product .caption > .product-title{
  flex:0 0 auto;
}

/* Reserve three lines at the title's own font size. Longer names can grow. */
.woocommerce-cart .cross-sells > ul.products li.product .product-title > h2{
  display:block;min-height:4.2em;max-height:none;line-height:1.4;
  white-space:normal;overflow:visible;text-overflow:clip;-webkit-line-clamp:unset;
}
.woocommerce-cart .cross-sells > ul.products li.product .product-title > h2 > .product-link{
  display:block;max-height:none;line-height:inherit;white-space:normal;
  overflow:visible;text-overflow:clip;overflow-wrap:anywhere;-webkit-line-clamp:unset;
}
.woocommerce-cart .cross-sells > ul.products li.product .caption > .product_after_title{
  display:flex;flex-direction:column;flex:1 1 auto;min-width:0;
}

/* Reserve two price lines and a rating row, including cards without a rating. */
.woocommerce-cart .cross-sells > ul.products li.product .product_after_title > .product_after_shop_loop_price{
  display:grid;grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(2.8em,auto) 1.2em;row-gap:6px;
  align-content:start;align-items:start;flex:0 0 auto;min-width:0;
}
.woocommerce-cart .cross-sells > ul.products li.product .product_after_shop_loop_price > .price{
  grid-column:1;grid-row:1;display:block;position:static;float:none;
  min-width:0;min-height:2.8em;margin:0;line-height:1.4;transform:none;
}
.woocommerce-cart .cross-sells > ul.products li.product .product_after_shop_loop_price > .star-rating{
  grid-column:1;grid-row:2;align-self:start;justify-self:start;
  position:relative;top:auto;right:auto;bottom:auto;left:auto;
  float:none;margin:0;transform:none;
}

/* Push a native button or its action wrapper to the bottom of the card.
   Leave the price block, excerpt and image actions in their existing places. */
.woocommerce-cart .cross-sells > ul.products li.product .product-inner > .button,
.woocommerce-cart .cross-sells > ul.products li.product .caption > .button,
.woocommerce-cart .cross-sells > ul.products li.product .product_after_title > .button{
  margin-top:auto;flex:0 0 auto;
}
/* A separate rule: a browser that does not know :has() drops the whole selector list it stands in. */
.woocommerce-cart .cross-sells > ul.products li.product .product-inner > :is(div,p):not(.caption):has(.button),
.woocommerce-cart .cross-sells > ul.products li.product .caption > :is(div,p):not(.product-title):not(.product_after_title):has(.button),
.woocommerce-cart .cross-sells > ul.products li.product .product_after_title > :is(div,p):not(.product_after_shop_loop_price):not(.product-excerpt):has(.button){
  margin-top:auto;flex:0 0 auto;
}
.woocommerce-cart .cross-sells > ul.products li.product .product-inner > .button,
.woocommerce-cart .cross-sells > ul.products li.product .caption > .button,
.woocommerce-cart .cross-sells > ul.products li.product .product_after_title > .button{
  align-self:flex-start;
}
/* == cart: bought together: END == */

/* == order form: bare header and tidy top (owner 13.10.2026): BEGIN. Keep the logo and top blocks in place. == */

/* The theme sets position: relative !important. Use normal flow. */
body.woocommerce-checkout.checkout-distraction-free #header.site-header {
  position: static !important;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 10px 0;
  border: 0;
  background: var(--m-paper);
  color: var(--m-ink);
  box-shadow: none;
  transform: none !important;
  transition: none;
  animation: none;
}

/* The smart header keeps 36px above the page for the top bar. This page has no top bar. */
body.woocommerce-checkout.checkout-distraction-free .page-wrapper-inner {
  padding-top: 0;
}

body.woocommerce-checkout.checkout-distraction-free #top-bar,
body.woocommerce-checkout.checkout-distraction-free .et-top-bar,
body.woocommerce-checkout.checkout-distraction-free .et-global-campaign,
body.woocommerce-checkout.checkout-distraction-free .header-spacer,
body.woocommerce-checkout.checkout-distraction-free .hero-header {
  display: none;
}

body.woocommerce-checkout.checkout-distraction-free #header :is(
  .header-left-items,
  .header-right-items,
  .header-bottom,
  .hamburger-menu,
  .mobile-header-icons,
  .menu-toggle,
  .m-lang,
  nav
),
body.woocommerce-checkout.checkout-distraction-free #header .header-items > :not(.logo-holder),
body.woocommerce-checkout.checkout-distraction-free #header .header-mobile .header-contents > :not(.logo-holder) {
  display: none;
}

body.woocommerce-checkout.checkout-distraction-free #header.site-header::before,
body.woocommerce-checkout.checkout-distraction-free #header.site-header::after,
body.woocommerce-checkout.checkout-distraction-free #header .header-mobile::before,
body.woocommerce-checkout.checkout-distraction-free #header .header-mobile::after,
body.woocommerce-checkout.checkout-distraction-free #header .header-contents::before,
body.woocommerce-checkout.checkout-distraction-free #header .header-contents::after {
  content: none;
  display: none;
}

/*
 * Use the mobile copy from 1024px.
 * Its container has no desktop brand width override.
 * Use the main copy from 992px to 1023px for the same reason.
 */
body.woocommerce-checkout.checkout-distraction-free #header .header-main {
  display: none;
}

body.woocommerce-checkout.checkout-distraction-free #header .header-mobile {
  display: block;
}

body.woocommerce-checkout.checkout-distraction-free #header :is(.header-main, .header-mobile) {
  position: static;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--m-paper);
  box-shadow: none;
  transform: none;
}

body.woocommerce-checkout.checkout-distraction-free #header .header-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: auto;
  min-height: 0;
  padding-block: 0;
  border: 0;
  background: var(--m-paper);
  box-shadow: none;
  transform: none;
}

body.woocommerce-checkout.checkout-distraction-free #header .header-center-items {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: flex-start;
  position: static;
  height: auto;
  margin: 0;
  padding: 0;
}

body.woocommerce-checkout.checkout-distraction-free #header .logo-holder {
  display: block;
  position: static;
  inset: auto;
  flex: none;
  align-self: auto;
  height: auto;
  margin: 0;
  padding: 0;
  transform: none;
  transition: none;
}

body.woocommerce-checkout.checkout-distraction-free #header .logolink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: static;
  height: auto;
  margin: 0;
  padding: 0;
  line-height: 0;
  transform: none;
}

/* Same size as on the other pages: 69px high up to 1023px, the brand width from 1024px. */
body.woocommerce-checkout.checkout-distraction-free #header .logolink .logoimg {
  display: none;
  width: auto;
  height: 69px;
  max-width: 100%;
  max-height: none;
  margin: 0;
  opacity: 0;
  transform: none;
  transition: none;
}

body.woocommerce-checkout.checkout-distraction-free #header .logolink .logoimg.bg--light {
  display: block;
  opacity: 1;
}

body.woocommerce-checkout.checkout-distraction-free #header .logolink:focus-visible {
  outline: 2px solid var(--m-ink);
  outline-offset: 4px;
}

@media (max-width: 991px) {
  body.woocommerce-checkout.checkout-distraction-free #header .header-mobile .header-contents {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 15px;
  }
}

@media (min-width: 992px) {
  body.woocommerce-checkout.checkout-distraction-free #header.site-header {
    padding: 24px 0;
  }

  body.woocommerce-checkout.checkout-distraction-free #header .header-contents {
    justify-content: flex-start;
  }
}

@media (min-width: 1024px) {
  body.woocommerce-checkout.checkout-distraction-free #header .logolink .logoimg {
    width: var(--m-logo-w);
    height: auto;
  }
}

@media (min-width: 992px) and (max-width: 1023px) {
  /* The customizer hides this copy with display: none !important. */
  body.woocommerce-checkout.checkout-distraction-free #header .header-main {
    display: block !important;
  }

  /* The customizer shows this copy with display: block !important. */
  body.woocommerce-checkout.checkout-distraction-free #header .header-mobile {
    display: none !important;
  }
}

/* Leave space above the top blocks, wherever scripts put the notices. */
body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce {
  margin-top: 24px;
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper,
body.woocommerce-checkout.checkout-distraction-free .before-checkout .woocommerce-notices-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper {
  margin-bottom: 16px;
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper:empty,
body.woocommerce-checkout.checkout-distraction-free .before-checkout .woocommerce-notices-wrapper:empty {
  display: none;
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper:not(:has(> *)),
body.woocommerce-checkout.checkout-distraction-free .before-checkout .woocommerce-notices-wrapper:not(:has(> *)) {
  display: none;
}

@media (min-width: 992px) {
  /*
   * Match col-lg-7 inside a row with 15px gutters.
   * Keep the same 40px right padding as the customer fields.
   */
  body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper {
    width: calc((100% + 30px) * 7 / 12 - 30px);
    padding-right: 40px;
  }
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper > :is(
  .woocommerce-info,
  .woocommerce-message,
  .woocommerce-error
),
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .woocommerce-info,
  .woocommerce-message,
  .woocommerce-error
) {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 12px 0;
  border: 0;
  border-radius: 0;
  background: var(--m-paper);
  box-shadow: none;
  text-align: left;
  justify-content: flex-start;
  line-height: 1.6;
  animation: none;
}

body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper > :is(
  .woocommerce-info,
  .woocommerce-message
),
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .woocommerce-info,
  .woocommerce-message
) {
  color: var(--m-ink-2);
}

/* Keep the theme position and spacer logic for before-checkout. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout {
  gap: 8px;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .et-checkout-login,
  .et-checkout-coupon-title
) {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  text-align: left;
}

/* One frame, one inset, text from the left edge. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-login-title,
body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-coupon-title > .woocommerce-info,
body.woocommerce-checkout.checkout-distraction-free .before-checkout .ywgc_have_code {
  display: block;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 12px 16px;
  border: 1px solid var(--m-rule);
  border-radius: 0;
  background: var(--m-paper);
  color: var(--m-ink-2);
  box-shadow: none;
  font-family: inherit;
  font-size: 1rem;
  font-weight: inherit;
  line-height: 1.6;
  text-align: left;
  justify-content: flex-start;
  animation: none;
}

/* The theme sets both coupon backgrounds with !important. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-coupon-title > .woocommerce-info,
body.woocommerce-checkout.checkout-distraction-free .before-checkout form.checkout_coupon {
  background: var(--m-paper) !important;
}

/* The theme sets border: 0 !important on the coupon title. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-coupon-title > .woocommerce-info {
  border: 1px solid var(--m-rule) !important;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-login-title::before,
body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-checkout-coupon-title > .woocommerce-info::before {
  content: none;
}

/* Match the cart text links and leave notice buttons alone. */
body.woocommerce-checkout.checkout-distraction-free .post-content > .woocommerce > .woocommerce-notices-wrapper > :is(
  .woocommerce-info,
  .woocommerce-message,
  .woocommerce-error
) a:not(.button),
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .woocommerce-info,
  .woocommerce-message,
  .woocommerce-error,
  .et-checkout-login-title,
  .ywgc_have_code
) a:not(.button) {
  display: inline;
  margin: 0;
  padding: 0;
  color: inherit;
  font-weight: var(--m-fw-semi);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* Remove the extra arrow and animated underline from title links. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .et-checkout-login-title,
  .et-checkout-coupon-title,
  .ywgc_have_code
) a:not(.button)::before,
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  .et-checkout-login-title,
  .et-checkout-coupon-title,
  .ywgc_have_code
) a:not(.button)::after {
  content: none;
}

/* Scripts keep control of display and slide styles on these forms. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout :is(
  form.woocommerce-form-login,
  form.checkout_coupon,
  .ywgc_enter_code
) {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px 0;
  border: 0;
  border-radius: 0;
  background: var(--m-paper);
  color: var(--m-ink-2);
  box-shadow: none;
  text-align: left;
  overflow: visible;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .et-login-wrapper {
  margin: 0;
  padding: 0;
  text-align: left;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .woocommerce-form-login .form-actions {
  text-align: left;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .woocommerce-form-login .form-actions .button {
  float: none;
  margin-left: 0;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .checkout_coupon .inner_coupon {
  box-sizing: border-box;
  width: 100%;
  max-width: 420px;
  margin: 12px 0 0;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 8px;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .checkout_coupon .inner_coupon input {
  flex: 1 1 12rem;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .checkout_coupon .inner_coupon .button {
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: 0;
  white-space: normal;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .ywgc_enter_code > div {
  margin: 0;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .ywgc_enter_code p {
  padding-inline: 0;
  text-align: left;
}

body.woocommerce-checkout.checkout-distraction-free .before-checkout .ywgc_enter_code .form-row {
  float: none;
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 8px;
  padding: 0;
}

/* wp-custom-css adds 15px !important for the old gift card gutters. */
body.woocommerce-checkout.checkout-distraction-free .before-checkout .ywgc_enter_code .fl-label {
  margin-left: 0 !important;
}

@media (max-width: 1023px) {
  body.woocommerce-checkout.checkout-distraction-free .before-checkout .checkout_coupon .inner_coupon {
    flex-direction: column;
    align-items: flex-start;
  }

  body.woocommerce-checkout.checkout-distraction-free .before-checkout .checkout_coupon .inner_coupon input {
    flex: none;
    width: 100%;
  }
}

/* == order form: END == */

/* thank-you page */

body.woocommerce-order-received .woocommerce-order .m-ty-next {
  box-sizing: border-box;
  width: 100%;
  margin: 20px 0 28px;
  padding: 16px;
  border: 1px solid var(--m-rule);
  border-radius: 0;
  background: var(--m-paper);
  color: var(--m-ink-2);
  box-shadow: none;
  font: inherit;
  line-height: 1.6;
  text-align: left;
}

body.woocommerce-order-received .woocommerce-order .m-ty-message {
  margin: 0 0 12px;
  padding: 0;
  overflow-wrap: anywhere;
}

body.woocommerce-order-received .woocommerce-order .m-ty-message:last-child {
  margin-bottom: 0;
}

body.woocommerce-order-received .woocommerce-order .m-ty-links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 24px;
  margin: 0;
  padding: 0;
}

body.woocommerce-order-received .woocommerce-order .m-ty-link {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  box-shadow: none;
  font: inherit;
  font-weight: var(--m-fw-semi);
  line-height: 1.6;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body.woocommerce-order-received .woocommerce-order .m-ty-link:hover {
  color: var(--m-ink);
  text-decoration: underline;
}

body.woocommerce-order-received .woocommerce-order .m-ty-link:focus-visible {
  outline: 2px solid var(--m-ink);
  outline-offset: 4px;
}

body.woocommerce-order-received .woocommerce-order .m-ty-next::before,
body.woocommerce-order-received .woocommerce-order .m-ty-next::after,
body.woocommerce-order-received .woocommerce-order .m-ty-link::before,
body.woocommerce-order-received .woocommerce-order .m-ty-link::after {
  content: none;
}

body.woocommerce-order-received .woocommerce-order
.woocommerce-table--order-details .product-quantity {
  display: inline;
  position: static;
  float: none;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  box-shadow: none;
  font: inherit;
  line-height: inherit;
  vertical-align: baseline;
  white-space: nowrap;
  transform: none;
}

@media (max-width: 767px) {
  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > thead,
  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tbody {
    display: table;
    width: 100%;
    table-layout: fixed;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > thead .product-name,
  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tbody .product-name {
    width: 68%;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > thead .product-total,
  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tbody .product-total {
    width: 32%;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot {
    display: block;
    width: 100%;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot > tr {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 12px 0;
    border: 0;
    border-bottom: 1px solid var(--m-rule);
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot > tr > th,
  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot > tr > td {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    text-align: left;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    line-height: 1.5;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot > tr > th {
    margin-bottom: 4px;
    font-weight: var(--m-fw-semi);
    letter-spacing: 0;
    text-transform: none;
  }

  body.woocommerce-order-received .woocommerce-order
  .woocommerce-table--order-details > tfoot .woocommerce-Price-amount {
    white-space: nowrap;
  }

  body.woocommerce-order-received .woocommerce-order .m-ty-links {
    gap: 10px 24px;
  }
}

/* == product card v2 (owner 16.10.2026): BEGIN. Mockup research/product-card-2026-10-16/mockup/kartochka-523828-v1.html,
   order of the blocks and their markup: mu-plugins/marence-product-card.php (the buy block right under the price, the
   stray div of the icon block closed, so the form, the member line and the SKU share the left edge of the name).
   Buy row: quantity of a fixed width, the button takes the rest of the row, the heart = a bare outline glyph in a tap
   zone 14 px from the button from 1200 px; narrower columns (325 px at 992-1199, phones) put the heart on its own line with its label under
   the row, so the button label stays on one line in LV / RU / EN (12 px semibold capitals, the same as the button of
   the bottom bar). Member prices = one line in a thin frame. No shadow, no radius. == */
:root{--m-pc-qty:104px;--m-pc-row:54px;--m-pc-btn-track:.12em;--m-pc-heart:22px;--m-pc-icon:120px;--m-pc-icon-n:3}

body.single-product .et-product-detail .summary form.cart .et-wishlist-div-open{
  flex-direction:row;flex-wrap:wrap;align-items:stretch;gap:var(--m-s-quiet);
}
body.single-product .et-product-detail .summary form.cart .et-wishlist-div-open .quantity{
  flex:0 0 var(--m-pc-qty);width:var(--m-pc-qty);margin:0;
}
body.single-product .et-product-detail .summary form.cart .et-wishlist-div-open .single_add_to_cart_button.button{
  flex:1 1 0;min-width:0;min-height:var(--m-pc-row);margin:0;padding:var(--m-s2) var(--m-s4);
  border-radius:0;box-shadow:none;
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-pc-btn-track);text-transform:uppercase;
  line-height:var(--m-lh-1);text-align:center;
}
body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist{
  flex:1 0 100%;width:100%;min-height:var(--m-tap);margin:0;
}
body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist .text{
  display:inline !important;
}
body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist .icon{
  font-size:var(--m-pc-heart);color:var(--m-ink);
}
/* outline heart; filled on hover and when the product is in the list (glyph et-heart-fill of add-to-wishlist-remove.php) */
body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist > div > a:hover .et-heart::before{
  content:"\e946";
}
/* owner 16.10 evening: no frame and no square around the heart; a bare outline heart in a 44 x 44 tap zone, centred on
   the button height, 14 px from the button (row gap 10 + 4) */
@media (min-width:1200px){
  body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist{
    display:flex;align-items:center;justify-content:center;align-self:center;
    flex:0 0 var(--m-tap);width:var(--m-tap);min-height:var(--m-tap);margin:0 0 0 var(--m-s1);
  }
  body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist > div{
    display:flex;width:var(--m-tap);height:var(--m-tap);
  }
  body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist > div > a{
    position:relative;width:var(--m-tap);height:var(--m-tap);min-height:var(--m-tap);gap:0;padding:0;
    border:0;background:none;
  }
  /* the label stays for screen readers only (the theme hid it with display:none) */
  body.single-product .et-product-detail.et-cart-horizontal .summary form.cart .et-wishlist-div-open .yith-wcwl-add-to-wishlist .text{
    position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;
  }
}

/* member prices (owner 16.10 late: "SILVER in silver, GOLD in gold, clean"): caption, two even columns, a small square
   before each status (silver = the brand silver, gold = the BIOACTIVE foil substitute of tokens.json), the figures in
   tabular digits, the link on its own line; the thin frame stays, no ground, no radius */
:root{--m-pc-mark:10px;--m-gold-foil:linear-gradient(135deg, #C9A962 0%, #A8863A 50%, #E0C988 100%)}
body.single-product .et-product-detail .summary .mr-pc-member{
  display:grid;grid-template-columns:minmax(0, 1fr);row-gap:var(--m-s2);
  margin:0 0 var(--m-s4);padding:var(--m-s3) var(--m-s-count);
  border:var(--m-line) solid var(--m-rule);border-radius:0;background:none;
  color:var(--m-h-ink);font-size:var(--m-fs-3);line-height:var(--m-lh-2);text-align:left;
}
body.single-product .et-product-detail .summary .mr-pc-member__cap{margin:0;color:var(--m-w-text);font-size:var(--m-fs-2);line-height:var(--m-lh-1)}
body.single-product .et-product-detail .summary .mr-pc-member__list{
  display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));column-gap:var(--m-s4);margin:0;padding:0;list-style:none;
}
body.single-product .et-product-detail .summary .mr-pc-member__i{
  display:flex;align-items:center;gap:var(--m-s2);margin:0;padding:0;list-style:none;white-space:nowrap;
  font-variant-numeric:tabular-nums;line-height:var(--m-lh-1);
}
body.single-product .et-product-detail .summary .mr-pc-member__i::before{
  content:"";flex:0 0 var(--m-pc-mark);width:var(--m-pc-mark);height:var(--m-pc-mark);background:var(--m-silver);
}
body.single-product .et-product-detail .summary .mr-pc-member__i--gold::before{background:var(--m-gold-foil)}
body.single-product .et-product-detail .summary .mr-pc-member__n{
  color:var(--m-ink);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);text-transform:uppercase;
}
body.single-product .et-product-detail .summary .mr-pc-member__p{color:var(--m-ink);font-size:var(--m-pc-fs);font-weight:var(--m-fw-semi)}
body.single-product .et-product-detail .summary .mr-pc-member__p .amount{color:inherit;font-weight:inherit}
body.single-product .et-product-detail .summary .mr-pc-member__link{
  justify-self:start;color:var(--m-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);white-space:nowrap;
  text-decoration:underline;text-decoration-thickness:var(--m-line);text-underline-offset:var(--m-ul-off-s);
}
body.single-product .et-product-detail .summary .mr-pc-member__link:hover{text-decoration-thickness:var(--m-ul-hover)}

/* icons of the product (files of the theme, markup of the mu-plugin): one row on the left edge under the short
   description, up to 120 px each, all of them in the row (4 icons: 2 x 2 under 1200 px, where the column is 325 px or a
   phone); the grey of the files deepened by the gamma filter #mr-pc-ink, white stays white */
.mr-pc-ink{position:absolute;width:0;height:0;overflow:hidden}
body.single-product .et-product-detail .summary .mr-pc-icons{
  display:grid;grid-template-columns:repeat(var(--m-pc-icon-n), minmax(0, var(--m-pc-icon)));gap:var(--m-s3);
  justify-content:start;margin:0 0 var(--m-s5);padding:0;
}
body.single-product .et-product-detail .summary .mr-pc-icons--n1{--m-pc-icon-n:1}
body.single-product .et-product-detail .summary .mr-pc-icons--n2{--m-pc-icon-n:2}
body.single-product .et-product-detail .summary .mr-pc-icons--n4{--m-pc-icon-n:4}
@media (max-width:1199px){
  body.single-product .et-product-detail .summary .mr-pc-icons--n4{--m-pc-icon-n:2}
}
body.single-product .et-product-detail .summary .mr-pc-icons img{
  display:block;width:100%;height:auto;max-width:none;margin:0;opacity:1;filter:url(#mr-pc-ink);
}

/* storage sentences of the "Use" row as their own paragraph under a small heading (display only, mu-plugin) */
.mr-pc-store{margin-top:var(--m-s4)}
.mr-pc-store p{margin:0}
.mr-pc-store .mr-pc-store__h{
  margin:0 0 var(--m-s1);color:var(--m-ink);font-size:var(--m-fs-1);font-weight:var(--m-fw-semi);
  letter-spacing:var(--m-track);text-transform:uppercase;line-height:var(--m-lh-kick);
}

/* "At a glance" and "Pairs well with" (mu-plugin, points 5 and 6): small capital heads, no line between the rows */
:root{--m-pc-dt:120px;--m-pc-fs:14px;--m-pc-thumb:56px;--m-pc-plus:14px;--m-pc-v:28px;--m-pc-col:820px;--m-pc-tab-track:.14em;--m-pc-star:14px;--m-pc-zoom:1.45}
/* the theme free delivery bar (kept as it is, owner) stands on the left edge like the rest of the column */
body.single-product .et-product-detail .summary .free-shipping-progress-bar{max-width:none;margin-left:0;margin-right:0;text-align:left}
body.single-product .et-product-detail .summary .free-shipping-progress-bar .progress-bar-message{text-align:left}
body.single-product .et-product-detail .summary :is(.mr-pc-facts, .mr-pc-with){margin-top:0}
body.single-product .et-product-detail .summary h2.mr-pc-h{
  margin:0 0 var(--m-s-quiet);padding:0;color:var(--m-ink);font-size:var(--m-fs-1);font-weight:var(--m-fw-semi);
  letter-spacing:var(--m-track);text-transform:uppercase;line-height:var(--m-lh-kick);
}
body.single-product .et-product-detail .summary .mr-pc-facts__list{margin:0;padding:0}
body.single-product .et-product-detail .summary .mr-pc-facts__row{
  display:grid;grid-template-columns:var(--m-pc-dt) minmax(0, 1fr);column-gap:var(--m-s3);align-items:baseline;padding:var(--m-s1) 0;
}
body.single-product .et-product-detail .summary .mr-pc-facts__row dt{
  margin:0;color:var(--m-ink);font-size:var(--m-fs-1);font-weight:var(--m-fw-semi);letter-spacing:var(--m-track-s);
  text-transform:uppercase;line-height:var(--m-lh-2);
}
body.single-product .et-product-detail .summary .mr-pc-facts__row dd{
  margin:0;color:var(--m-h-ink);font-size:var(--m-pc-fs);line-height:var(--m-lh-2);overflow-wrap:break-word;
}
/* "Add to your order" (owner 16.10 late): compact, right under the buy row; no frame, no ground; a row = photo 56,
   name in at most two lines, price, a square "+" 44 x 44 in a thin black frame on the right; fluid from 320 to 2560 */
body.single-product .et-product-detail .summary .mr-pc-with__list{margin:0;padding:0;list-style:none}
body.single-product .et-product-detail .summary .mr-pc-with__item{
  display:grid;grid-template-columns:var(--m-pc-thumb) minmax(0, 1fr) var(--m-tap);column-gap:var(--m-s3);align-items:center;
  margin:0;padding:var(--m-s1) 0;list-style:none;
}
/* the shop photos carry wide white margins: the frame is zoomed so the jar fills the square (files unchanged) */
body.single-product .et-product-detail .summary .mr-pc-with__pic{display:block;width:var(--m-pc-thumb);height:var(--m-pc-thumb);overflow:hidden}
body.single-product .et-product-detail .summary .mr-pc-with__img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(var(--m-pc-zoom))}
body.single-product .et-product-detail .summary .mr-pc-with__txt{min-width:0}
body.single-product .et-product-detail .summary .mr-pc-with__name{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
  color:var(--m-h-ink);font-size:var(--m-fs-3);line-height:var(--m-lh-card);text-decoration:none;overflow-wrap:anywhere;
}
body.single-product .et-product-detail .summary .mr-pc-with__name:hover{text-decoration:underline;text-underline-offset:var(--m-ul-off-s)}
body.single-product .et-product-detail .summary .mr-pc-with__price{
  display:block;margin-top:var(--m-s1);color:var(--m-ink);font-size:var(--m-fs-3);font-weight:var(--m-fw-semi);line-height:var(--m-lh-1);
}
body.single-product .et-product-detail .summary .mr-pc-with__price .amount{color:inherit}
body.single-product .et-product-detail .summary .mr-pc-with__buy{display:flex;justify-content:flex-end}
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn{
  position:relative;display:block;flex:0 0 var(--m-tap);width:var(--m-tap);height:var(--m-tap);min-width:0;min-height:0;margin:0;padding:0;
  background:var(--m-paper);color:var(--m-ink);border:var(--m-line) solid var(--m-ink);border-radius:0;box-shadow:none;
  font-size:0;line-height:var(--m-lh-0);overflow:hidden;
}
/* the "+": an inline SVG of the mu-plugin (the pseudo elements of the button belong to the theme and the AJAX plugin) */
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn .mr-pc-plus{
  position:absolute;left:50%;top:50%;display:block;width:var(--m-pc-plus);height:var(--m-pc-plus);
  margin:calc(var(--m-pc-plus) / -2) 0 0 calc(var(--m-pc-plus) / -2);color:inherit;pointer-events:none;
}
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn:is(:hover, :focus-visible, .added){background:var(--m-ink);color:var(--m-paper)}
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn.loading{opacity:var(--m-busy)}
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn:focus-visible{outline:var(--m-focus) solid var(--m-ink);outline-offset:var(--m-focus-off)}
body.single-product .et-product-detail .summary .mr-pc-with__buy a.button.mr-pc-with__btn :is(.text, .icon){display:none}
body.single-product .et-product-detail .summary .mr-pc-with__buy .added_to_cart{display:none}

/* vertical rhythm of the right column (owner 16.10 late: the short description stuck to the buy row): price, member
   line, buy block, "add to your order", short description, icons, every gap 28 px (the price keeps its theme 10 px +
   the member line 16 = 26) */
body.single-product .et-product-detail .summary .mr-pc-member{margin:var(--m-s4) 0 var(--m-pc-v)}
body.single-product .et-product-detail .summary form.cart{margin:0 0 var(--m-pc-v)}
body.single-product .et-product-detail .summary form.cart .et-wishlist-div-open{padding-top:0}
body.single-product .et-product-detail .summary :is(.mr-pc-with, .mr-pc-facts, .mr-pc-icons, .woocommerce-product-details__short-description){margin-bottom:var(--m-pc-v)}
body.single-product .et-product-detail .summary .woocommerce-product-details__short-description{margin-top:0}

/* tabs (point 7): one row of small capitals on the left edge of the 820 px column of the panels, the active one
   underlined (theme underline), the count of reviews after the word; panels and reviews on the same edge */
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tabs{
  display:flex;flex-wrap:wrap;justify-content:flex-start;gap:0 var(--m-s6);
  max-width:var(--m-pc-col);margin:0 auto var(--m-s5);padding:0;list-style:none;text-align:left;font-size:inherit;
  border-bottom:var(--m-line) solid var(--m-rule);
}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tabs :is(li, li.active){display:flex;margin:0 0 calc(-1 * var(--m-line));padding:0;border:0;background:none}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tabs li a{
  display:block;padding:var(--m-s4) 0 var(--m-s3);color:var(--m-w-text);font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);
  letter-spacing:var(--m-pc-tab-track);text-transform:uppercase;line-height:var(--m-lh-1);white-space:nowrap;text-decoration:none;
}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tabs li:is(.active, :hover) a{color:var(--m-ink)}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tabs li a span{margin-left:var(--m-s1);font-size:inherit;font-weight:var(--m-fw-reg);vertical-align:baseline;color:var(--m-w-text)}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .tab-panel-inner > *{max-width:var(--m-pc-col);margin-left:auto;margin-right:auto}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .tab-panel-inner > .container{padding:0}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .tab-panel-inner > .container > .row{margin:0}
body.single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .tab-panel-inner > .container > .row > .col-12{padding:0}

/* reviews: on the same left edge, stars + name + date on one line over the text, no avatars (mu-plugin), no centred
   pieces; the "add a review" toggle = the thin black frame of the site, left */
body.single-product #reviews.woocommerce-Reviews{max-width:var(--m-pc-col);margin:0 auto;padding:0}
body.single-product #reviews .commentlist{max-width:none;margin:0;padding:0;list-style:none}
body.single-product #reviews .commentlist > li{margin:0;padding:0;border:0}
body.single-product #reviews .commentlist .comment_container{position:static}
body.single-product #reviews .commentlist .comment-text{
  display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--m-s-quiet);
  margin:0 0 var(--m-s5);padding:0;border:0;
}
/* the stars keep the theme box (position relative + overflow hidden): the words "Rated 5 out of 5" inside stay clipped */
body.single-product #reviews .commentlist .comment-text .star-rating{position:relative;overflow:hidden;float:none;flex:0 0 auto;display:inline-block;margin:0;font-size:var(--m-pc-star)}
body.single-product #reviews .commentlist .comment-text .meta{display:flex;flex-wrap:wrap;gap:0 var(--m-s2);margin:0;padding:0;font-size:var(--m-fs-3)}
body.single-product #reviews .commentlist .comment-text .meta strong{display:inline;color:var(--m-h-ink);font-weight:var(--m-fw-semi)}
body.single-product #reviews .commentlist .comment-text .meta time{color:var(--m-w-text)}
body.single-product #reviews .commentlist .comment-text .description{flex:1 0 100%;margin-top:var(--m-s1)}
body.single-product #reviews .woocommerce-noreviews{margin:0 0 var(--m-s4);text-align:left}
body.single-product #reviews #review_form_wrapper{margin-top:var(--m-s5)}
body.single-product #reviews .comment-reply-title{
  display:inline-flex;align-items:center;justify-content:center;min-width:0;max-width:none;min-height:var(--m-tap);margin:0;padding:0 var(--m-s4);
  border:var(--m-line) solid var(--m-ink);border-radius:0;color:var(--m-ink);
  font-size:var(--m-fs-2);font-weight:var(--m-fw-semi);letter-spacing:var(--m-pc-btn-track);text-transform:uppercase;line-height:var(--m-lh-1);
}
body.single-product #reviews .comment-reply-title:hover{background:var(--m-ink);color:var(--m-paper)}
body.single-product #reviews :is(.must-log-in, .comment-notes){margin:var(--m-s3) 0 0;text-align:left}

/* no green after "add to cart" (owner 16.10 late): the theme paints its notices ("… added to your basket") and the
   "View cart" link of the shop tiles #03a678 (shop.css "Info Boxes", ".products .added_to_cart"); here they are ink */
body.single-product :is(.woocommerce-message, .woocommerce-notice--success, .wc-block-components-notice-banner.is-success),
.products :is(.added_to_cart, .added_to_cart .icon, a.added_to_cart:hover .icon){color:var(--m-ink)}
body.single-product :is(.woocommerce-message, .woocommerce-notice--success){border-radius:0}

/* a long word of the name (RU "пентамолекулярный", 391 px) breaks instead of running past the column; a hyphen only on
   narrow screens and only in words of 14 letters and more (owner 16.10 late: "Об-лепиха" on a computer is wrong) */
body.single-product .et-product-detail .summary .product_title{overflow-wrap:break-word;-webkit-hyphens:manual;hyphens:manual}
@media (max-width:430px){
  body.single-product .et-product-detail .summary .product_title{-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:14 6 6}
}

/* the bottom bar no longer covers the last footer row: #colophon.site-footer{margin:0} of the footer section beat the
   two older rules (brand.css phone section, marence-product-bar.php) */
@media (min-width:1024px){
  body.fixed-product-bar-bottom.product-bar-visible.single-product #colophon.site-footer{margin-bottom:var(--m-pbar-d)}
}
@media (max-width:1023px){
  body.fixed-product-bar.product-bar-visible.single-product #colophon.site-footer{margin-bottom:calc(var(--m-sbar-h) + var(--m-safe))}
  /* owner 16.10 late: the shop bar (Shop · Search · Account · Cart, marence-tabbar.php) on the product page too; the
     product bar sits right on top of it (one thin line between them: the top border of the shop bar), under it in the
     layers so it slides in from behind; the page keeps room for both (#wrapper padding = shop bar, footer margin = product bar) */
  body.single-product.m-has-tabbar .sticky-product-bar{z-index:594;min-height:var(--m-sbar-h);padding-bottom:0}
  /* !important against the theme's own phone rule (shop.css, max 575 px: ".fixed-product-bar-mobile-1.product_on_scroll
     .sticky-product-bar{bottom:0 !important}"), which kept the bar behind the shop bar (checked in the browser 16.10) */
  body.single-product.m-has-tabbar.fixed-product-bar-bottom .sticky-product-bar.active,
  body.single-product.m-has-tabbar.fixed-product-bar-mobile-1.product_on_scroll .sticky-product-bar{bottom:calc(var(--m-bar-h) + var(--m-safe)) !important}
  body.m-has-tabbar.fixed-product-bar.product-bar-visible.single-product #colophon.site-footer{margin-bottom:var(--m-sbar-h)}
  body.m-has-tabbar.single-product.product-bar-visible .m-wl-bar{bottom:calc(var(--m-bar-h) + var(--m-sbar-h) + var(--m-safe))}
}
/* == product card v2: END == */

/* == m-even-rows v1 (D-308): home shelves, even rows without a script ==
   Replaces the plugin matchHeight 1.2.0 (jQuery, rule ".products .product-title h3"; it hit the 56 names of the home lists
   only after the names became h3 on 09.10, D-228). The card cell of a shelf is as tall as its row (grid stretch, Goya
   makes li.product a column: shop.css ".products .product"); here its inner box and its caption become columns too and
   the block under the name (price, rating, button) goes to the bottom of the card. Result in every row: the names start
   on one line under the photos, the prices and the buttons stand on one line, the free room sits between the name and
   the price, as the plugin made it. Without a script: no jump after loading, the same in hidden tabs, after a tab
   switch, after a resize. Home lists only (.m-home .m-loop); the men photo cell (li.m-men-lead) is not a card. Layout
   keywords only, no values (D-106). 013 key "matchheight" refuses without this section. Owner looks at the home
   LV / RU / EN at 1440, 1024 and 390, every tab of "Parūpējies par savu ādu", men, holiday sets, top 5. == */
.m-home .m-loop ul.products.row:not(.shop_display_list) > li.product > .product-inner{display:flex;flex:1 1 auto;flex-direction:column}
.m-home .m-loop ul.products.row:not(.shop_display_list) > li.product > .product-inner > .caption{display:flex;flex:1 1 auto;flex-direction:column}
.m-home .m-loop ul.products.row:not(.shop_display_list) > li.product > .product-inner > .caption > .product_after_title{margin-top:auto}
/* == m-even-rows v1 end == */

/* == m-ribbon-room v1 (17.10): room inside the home ribbons below 1024 px ==
   Below 1024 px every home list (.m-home .m-loop) is a sideways scroller (overflow-x:auto). A box that scrolls on one axis
   clips on the other one too, so the 1 px frame of a card button, a focus ring or the rounding of a zoomed browser could be
   cut at the bottom edge, and the list could move up and down by those pixels (owner 17.10, browser phone mode, 430 px).
   The list gets 8 px of room inside, top and bottom, and gives them back with negative margins: the cards stay where they
   were. flow-root on the wrapper keeps the negative margins inside it, so the shelf is exactly as tall as before (the panels
   of the tabs carry [hidden] on .m-ribbon-box, not on .m-loop). The same recipe as the tabs ribbon from 1024 px
   (--m-rb-room); from 1024 px the other home lists are grids and do not scroll. "not all and (min-width:1024px)" is the
   exact complement of the 1024 px rules, so a fractional width of a zoomed browser (1023.5 px) is covered too, and old
   browsers read it (a range query would be skipped by Safari before 16.4). Tokens only. == */
@media not all and (min-width:1024px){
  .m-home .m-loop{display:flow-root}
  .m-home .m-loop ul.products.row:not(.shop_display_list){margin-block:calc(-1 * var(--m-s2));padding-block:var(--m-s2)}
}
/* == m-ribbon-room v1 end == */

/* == a11y v1 (19.10.2026, live, owner "сделай"): PageSpeed accessibility, WCAG 2.5.8 target size and 1.4.3 contrast ==
   1. KONTAKTI from 768 px: the phone number, WhatsApp and e-mail links were as high as their text (about 20 px) and the
      first two sat right on top of each other; each link is now at least 24 px high, text, colour and order unchanged (the
      block grows by about 6 px). Below 768 px they already are 44 px (footer section, max-width:767px).
   2. Theme greys under 4.5:1 on white: breadcrumbs #999 (Goya shop.css 115), pagination #848485 (core.css 7449), product
      meta "SKU:" #848485 (shop.css 3591) take the brand grey --m-ink-2 (7.5:1 on white); hover and the current page keep
      the theme #282828; a product with the theme's light text showcase keeps the theme colours.
   3. Pagination on phones: numbers 19 px wide with 23 px between them; at least 24 px wide now (from 768 px the theme
      padding already makes them wider).
   4. Home below 768 px: the two lines band (.m-lines, tiles stacked, much taller than the 960 px placeholder of .m-below
      content-visibility:auto) overflowed its placeholder in the page geometry before it was drawn, so its black tile lay
      over the next heading and Lighthouse read "VISBIEZAK PIRKTIE" as #282828 on black (1.42:1), while the screen shows it
      on white (full page screenshot of the same run). Below 768 px this one band is always drawn; nothing changes on screen.
   Rollback: delete this section. == */
:root{--m-tgt:24px}
@media (min-width:768px){
  #colophon .m-ct a{display:inline-flex;align-items:center;min-height:var(--m-tgt);vertical-align:top}
  #colophon .m-ct a.m-ct__sub{display:flex;width:fit-content}
}
body:not(.product-showcase-light-text) :is(.woocommerce-breadcrumb, .woocommerce-breadcrumb a),
body:not(.product-showcase-light-text) .et-product-detail .product_meta,
:is(.pagination, .woocommerce-pagination) :is(a, span).page-numbers:not(.current):not(:hover){color:var(--m-ink-2)}
:is(.pagination, .woocommerce-pagination) :is(a, span).page-numbers{min-width:var(--m-tgt)}
@media (max-width:767px){
  .m-home .m-lines.m-below{content-visibility:visible}
}
/* == a11y v1 end == */