/**
 * Mefiat — child theme of lnwks (Hummingbird base)
 * Sober look after rapha.cc: very white and minimal (header, pages and footer on white), black type, square corners,
 * titles in Oswald caps, text in Lora; the brand pink (#ff8fba, the dot of the logo) only as a small accent.
 *
 * lnwks' theme.css is written in cascade layers (@layer ...), so every rule
 * in this unlayered file wins over it whatever the selector specificity.
 */

/* ---------- Fonts (self-hosted, latin subset, variable) ---------- */
@font-face{font-family:"Oswald";font-style:normal;font-weight:200 700;font-display:swap;src:url("../fonts/oswald-latin.woff2") format("woff2")}
@font-face{font-family:"Lora";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/lora-latin.woff2") format("woff2")}
@font-face{font-family:"Lora";font-style:italic;font-weight:400 500;font-display:swap;src:url("../fonts/lora-latin-italic.woff2") format("woff2")}

/* ---------- Brand tokens ---------- */
:root{
  /* Primary actions (buttons, checkboxes, active states): black */
  --rg-brand:#000;           --rg-brand-rgb:0,0,0;
  --rg-brand-hover:#333;
  /* Brand pink: badges, selection, accents on dark backgrounds (black text on it: 10:1) */
  --mf-pink:#ff8fba;         --mf-pink-rgb:255,143,186;
  /* Titles: Oswald caps; running text: Lora; labels, buttons, menu, prices: Oswald caps too */
  --rg-font:"Oswald","Arial Narrow",Arial,sans-serif;
  --rg-text-font:"Lora",Georgia,"Times New Roman",serif;
  --rg-caps:"Oswald","Arial Narrow",Arial,sans-serif;
  --rg-radius:0;
  --rg-pill:0;
}

/*
 * Two color schemes, chosen by data-bs-theme (layouts/layout-both-columns.tpl):
 * - light : everything (pages, header, top bar, footer), on white;
 * - dark  : only the black bands of some lnwkspages blocks (and pages listed in $rgDarkPages).
 * Every rule below uses these tokens, so a nested data-bs-theme (top bar, footer) gets its own scheme.
 */
:root,[data-bs-theme=light]{
  color-scheme:light;
  --rg-bg:#ffffff;           --rg-bg-rgb:255,255,255;
  --rg-surface:#f4f4f4;      --rg-surface-rgb:244,244,244;
  --rg-surface-2:#ebebeb;    --rg-surface-2-rgb:235,235,235;
  --rg-surface-3:#dedede;
  --rg-text:#000000;         --rg-text-rgb:0,0,0;
  --rg-text-2:#4d4d4d;       --rg-text-2-rgb:77,77,77;
  --rg-text-3:#707070;       --rg-text-3-rgb:112,112,112;
  --rg-text-soft:#262626;
  --rg-emphasis:#000;
  --rg-border:rgba(0,0,0,.12);
  --rg-border-strong:rgba(0,0,0,.35);
  --rg-overlay:rgba(0,0,0,.04);
  --rg-stripe:rgba(0,0,0,.025);
  /* Accent text and links: black on white (the pink is too light for text) */
  --rg-brand-2:#000000;      --rg-brand-2-rgb:0,0,0;
  --rg-danger:#c0392b;       --rg-danger-rgb:192,57,43;
}
/* The black bands of the lnwkspages blocks (tones "brand" and "black", cta_banner "brand") take the dark tokens too */
[data-bs-theme=dark],.lnwks-rich-text--tone-brand,.lnwks-rich-text--tone-black,.lnwks-features--tone-brand,.lnwks-features--tone-black,.lnwks-cta--brand{
  color-scheme:dark;
  --rg-bg:#000000;           --rg-bg-rgb:0,0,0;
  --rg-surface:#111111;      --rg-surface-rgb:17,17,17;
  --rg-surface-2:#1c1c1c;    --rg-surface-2-rgb:28,28,28;
  --rg-surface-3:#262626;
  --rg-text:#ffffff;         --rg-text-rgb:255,255,255;
  --rg-text-2:#b3b3b3;       --rg-text-2-rgb:179,179,179;
  --rg-text-3:#8c8c8c;       --rg-text-3-rgb:140,140,140;
  --rg-text-soft:#e0e0e0;
  --rg-emphasis:#fff;
  --rg-border:rgba(255,255,255,.14);
  --rg-border-strong:rgba(255,255,255,.35);
  --rg-overlay:rgba(255,255,255,.06);
  --rg-stripe:rgba(255,255,255,.03);
  /* On black the pink reads well: accents and links */
  --rg-brand-2:#ff8fba;      --rg-brand-2-rgb:255,143,186;
  --rg-danger:#ff8a7a;       --rg-danger-rgb:255,138,122;
}

/* ---------- Bootstrap tokens, from the scheme tokens ---------- */
:root,[data-bs-theme=dark],.lnwks-rich-text--tone-brand,.lnwks-rich-text--tone-black,.lnwks-features--tone-brand,.lnwks-features--tone-black,.lnwks-cta--brand,[data-bs-theme=light]{
  --bs-primary:var(--rg-brand);
  --bs-primary-rgb:var(--rg-brand-rgb);
  --bs-success:var(--rg-brand-2);
  --bs-success-rgb:var(--rg-brand-2-rgb);
  --bs-danger:var(--rg-danger);
  --bs-danger-rgb:var(--rg-danger-rgb);
  --bs-dark:#000;
  --bs-dark-rgb:0,0,0;
  --bs-primary-text-emphasis:var(--rg-brand-2);
  --bs-primary-bg-subtle:var(--rg-surface);
  --bs-primary-border-subtle:var(--rg-border-strong);
  --bs-success-text-emphasis:var(--rg-brand-2);
  --bs-success-bg-subtle:var(--rg-surface);
  --bs-success-border-subtle:var(--rg-border-strong);
  --bs-danger-text-emphasis:var(--rg-danger);
  --bs-danger-bg-subtle:rgba(var(--rg-danger-rgb),.08);
  --bs-danger-border-subtle:rgba(var(--rg-danger-rgb),.4);

  --bs-body-font-family:var(--rg-text-font);
  --bs-body-font-size:1rem;
  --bs-body-line-height:1.65;
  --bs-body-color:var(--rg-text);
  --bs-body-color-rgb:var(--rg-text-rgb);
  --bs-body-bg:var(--rg-bg);
  --bs-body-bg-rgb:var(--rg-bg-rgb);
  --bs-emphasis-color:var(--rg-emphasis);
  --bs-secondary-color:var(--rg-text-2);
  --bs-secondary-color-rgb:var(--rg-text-2-rgb);
  --bs-secondary-bg:var(--rg-surface-2);
  --bs-secondary-bg-rgb:var(--rg-surface-2-rgb);
  --bs-tertiary-color:var(--rg-text-3);
  --bs-tertiary-color-rgb:var(--rg-text-3-rgb);
  --bs-tertiary-bg:var(--rg-surface);
  --bs-tertiary-bg-rgb:var(--rg-surface-rgb);
  --bs-heading-color:var(--rg-text);
  --bs-link-color:var(--rg-brand-2);
  --bs-link-color-rgb:var(--rg-brand-2-rgb);
  --bs-link-hover-color:var(--rg-text);
  --bs-link-hover-color-rgb:var(--rg-text-rgb);
  --bs-border-color:var(--rg-border);
  --bs-border-color-translucent:var(--rg-border);
  --bs-border-radius:var(--rg-radius);
  --bs-border-radius-sm:0;
  --bs-border-radius-lg:0;
  --bs-focus-ring-color:rgba(var(--rg-brand-2-rgb),.4);
  --bs-form-valid-color:var(--rg-brand-2);
  --bs-form-valid-border-color:var(--rg-brand-2);
  --bs-form-invalid-color:var(--rg-danger);
  --bs-form-invalid-border-color:var(--rg-danger);
}

::selection{background:var(--mf-pink);color:#000}

body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* ---------- Typography ---------- */
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
  font-family:var(--rg-font);font-weight:500;text-transform:uppercase;letter-spacing:.02em;line-height:1.1
}
/* Oswald has no italic: an accent in a title is the same caps */
h1 em,h2 em,h3 em,.h1 em,.h2 em{font-style:normal;color:inherit}
.page-title,.page-content h1{font-size:clamp(2rem,4vw,3rem)}

/* Small caps labels, like the landing page eyebrows */
.rg-eyebrow,
.footer-block__title,
.breadcrumb,
.badge,
.product-flags .badge,
.nav-tabs .nav-link,
.form-label,
.main-menu .menu__link,
.header-top a,
.header-block__title{
  font-family:var(--rg-caps);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:500
}
.rg-eyebrow{font-size:.75rem;letter-spacing:.05em;color:var(--rg-text-2);line-height:1.4;margin:0}
.breadcrumb,.form-label{font-size:.75rem}
.badge{letter-spacing:.06em;font-weight:600}

a{text-underline-offset:.2em}

/* ---------- Buttons: square, black, small caps ---------- */
.btn{
  --bs-btn-font-family:var(--rg-caps);
  --bs-btn-font-weight:500;
  --bs-btn-font-size:.8125rem;
  --bs-btn-padding-x:1.625rem;
  --bs-btn-padding-y:.875rem;
  --bs-btn-border-radius:var(--rg-pill);
  --bs-btn-focus-box-shadow:0 0 0 .2rem rgba(var(--mf-pink-rgb),.6);
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1.4
}
.btn-sm{--bs-btn-padding-x:1.125rem;--bs-btn-padding-y:.5rem;--bs-btn-font-size:.75rem}
.btn-lg{--bs-btn-padding-x:2rem;--bs-btn-padding-y:1rem;--bs-btn-font-size:.8125rem}
.btn-primary{
  --bs-btn-color:#fff;--bs-btn-bg:var(--rg-brand);--bs-btn-border-color:var(--rg-brand);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:var(--rg-brand-hover);--bs-btn-hover-border-color:var(--rg-brand-hover);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:var(--rg-brand-hover);--bs-btn-active-border-color:var(--rg-brand-hover);
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:var(--rg-brand);--bs-btn-disabled-border-color:var(--rg-brand)
}
[data-bs-theme=dark] .btn-primary,.lnwks-cta--brand .btn-primary,.lnwks-rich-text--tone-brand .btn-primary,.lnwks-features--tone-brand .btn-primary{
  --bs-btn-color:#000;--bs-btn-bg:#fff;--bs-btn-border-color:#fff;
  --bs-btn-hover-color:#000;--bs-btn-hover-bg:var(--mf-pink);--bs-btn-hover-border-color:var(--mf-pink);
  --bs-btn-active-color:#000;--bs-btn-active-bg:var(--mf-pink);--bs-btn-active-border-color:var(--mf-pink)
}
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-light{
  --bs-btn-color:var(--rg-text);--bs-btn-border-color:var(--rg-border-strong);
  --bs-btn-hover-color:var(--rg-text);--bs-btn-hover-bg:transparent;--bs-btn-hover-border-color:var(--rg-text);
  --bs-btn-active-color:var(--rg-text);--bs-btn-active-bg:var(--rg-overlay);--bs-btn-active-border-color:var(--rg-text);
  --bs-btn-disabled-color:var(--rg-text-3);--bs-btn-disabled-border-color:var(--rg-border)
}
.btn-secondary,.btn-dark{
  --bs-btn-color:var(--rg-text);--bs-btn-bg:var(--rg-surface-2);--bs-btn-border-color:var(--rg-surface-2);
  --bs-btn-hover-color:var(--rg-text);--bs-btn-hover-bg:var(--rg-surface-3);--bs-btn-hover-border-color:var(--rg-surface-3);
  --bs-btn-active-color:var(--rg-text);--bs-btn-active-bg:var(--rg-surface-3);--bs-btn-active-border-color:var(--rg-surface-3)
}
.btn-link{--bs-btn-color:var(--rg-brand-2);--bs-btn-hover-color:var(--rg-text);text-transform:none;letter-spacing:0;font-family:var(--rg-text-font);font-size:1rem}
[data-bs-theme=dark] .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}

/* ---------- Forms ---------- */
/* Every single-line field the same height (48px): text, email, password (with its show button), select, date */
.form-control:not(textarea):not([type=file]),.form-select{height:3rem;padding-block:0;line-height:3rem}
.form-control[type=file]{height:3rem;line-height:2rem}
.input-group>.btn{height:3rem}
.form-control::placeholder{color:var(--rg-text-3);opacity:1}
.form-control,.form-select{
  background-color:transparent;border-color:var(--rg-border-strong);color:var(--rg-text);border-radius:var(--rg-radius)
}
.form-control::placeholder{color:var(--rg-text-3)}
.form-control:focus,.form-select:focus,.form-check-input:focus{
  background-color:transparent;border-color:var(--rg-brand);box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.25);color:var(--rg-text)
}
.form-select option{background:var(--rg-surface);color:var(--rg-text)}
.form-check-input{background-color:transparent;border-color:var(--rg-border-strong)}
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate{background-color:var(--rg-brand);border-color:var(--rg-brand)}
.form-range::-webkit-slider-thumb{background-color:var(--rg-brand-2)}
.form-range::-moz-range-thumb{background-color:var(--rg-brand-2)}
.input-group-text{background:var(--rg-surface);border-color:var(--rg-border-strong);color:var(--rg-text-2)}
/* Input groups: the rounded .form-control above (unlayered) beats Bootstrap's joined corners (layered), restore them:
   only the outer corners are rounded, with the field radius (no pill button glued to a rounded field) */
.input-group>.form-control:not(:last-child),.input-group>.form-select:not(:last-child),.input-group>.btn:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.input-group>.form-control:not(:first-child),.input-group>.form-select:not(:first-child),.input-group>.btn:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}
.input-group>.btn:first-child{border-top-left-radius:var(--rg-radius);border-bottom-left-radius:var(--rg-radius)}
.input-group>.btn:last-child{border-top-right-radius:var(--rg-radius);border-bottom-right-radius:var(--rg-radius)}
.input-group>.btn{--bs-btn-padding-x:1.125rem}
/* Show / hide password: part of the field (same border, transparent), not a green button */
.password-field>[data-ps-action=toggle-password]{--bs-btn-bg:transparent;--bs-btn-border-color:var(--rg-border-strong);--bs-btn-color:var(--rg-text-2);--bs-btn-hover-bg:transparent;--bs-btn-hover-border-color:var(--rg-border-strong);--bs-btn-hover-color:var(--rg-text);--bs-btn-active-bg:transparent;--bs-btn-active-border-color:var(--rg-border-strong);--bs-btn-active-color:var(--rg-text);--bs-btn-padding-x:.875rem;border-left:0}
.password-field>.form-control:not(:last-child){border-right:0}
.password-field>.form-control:focus{box-shadow:none}
.password-field>.form-control:focus~[data-ps-action=toggle-password]{border-color:var(--rg-brand)}
.password-field [data-ps-action=toggle-password] .material-icons{font-size:1.25rem}
/* Browser autofill paints the field light blue (and not the button next to it): keep the page background and text */
.form-control:-webkit-autofill,.form-control:-webkit-autofill:hover,.form-control:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--rg-bg) inset;box-shadow:0 0 0 1000px var(--rg-bg) inset;-webkit-text-fill-color:var(--rg-text);caret-color:var(--rg-text);transition:background-color 9999s ease-out}
.nav-link:focus-visible,.btn:focus-visible,a:focus-visible{outline:2px solid var(--rg-brand-2);outline-offset:3px;box-shadow:none}

/* ---------- Bootstrap components (blue values compiled into theme.css) ---------- */
.nav-pills{--bs-nav-pills-link-active-bg:var(--rg-brand)}
.nav-tabs{--bs-nav-tabs-link-active-color:var(--rg-text);--bs-nav-tabs-link-active-bg:transparent;--bs-nav-tabs-link-active-border-color:var(--rg-border) var(--rg-border) var(--rg-bg)}
.nav-tabs .nav-link{font-size:.75rem;color:var(--rg-text-2)}
.dropdown-menu{
  --bs-dropdown-bg:var(--rg-surface);--bs-dropdown-border-color:var(--rg-border);
  --bs-dropdown-link-color:var(--rg-text);--bs-dropdown-link-hover-color:var(--rg-text);--bs-dropdown-link-hover-bg:var(--rg-surface-2);
  --bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:var(--rg-brand)
}
.list-group{--bs-list-group-bg:transparent;--bs-list-group-active-bg:var(--rg-brand);--bs-list-group-active-border-color:var(--rg-brand)}
.pagination{
  --bs-pagination-color:var(--rg-text-2);--bs-pagination-hover-color:var(--rg-text);--bs-pagination-hover-bg:var(--rg-surface-2);
  --bs-pagination-focus-color:var(--rg-text);--bs-pagination-focus-box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.35);
  --bs-pagination-active-bg:var(--rg-brand);--bs-pagination-active-border-color:var(--rg-brand);
  font-family:var(--rg-caps);font-size:.8125rem
}
.accordion{
  --bs-accordion-bg:transparent;--bs-accordion-border-color:var(--rg-border);
  --bs-accordion-active-color:var(--rg-text);--bs-accordion-active-bg:var(--rg-surface);
  --bs-accordion-btn-focus-box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.3)
}
.progress,.progress-stacked{--bs-progress-bg:var(--rg-surface-2);--bs-progress-bar-bg:var(--rg-brand-2)}
.card{--bs-card-bg:var(--rg-surface);--bs-card-border-color:var(--rg-border);--bs-card-cap-bg:transparent}
.modal{--bs-modal-bg:var(--rg-bg);--bs-modal-border-color:var(--rg-border);--bs-modal-header-border-color:var(--rg-border);--bs-modal-footer-border-color:var(--rg-border)}
.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm{--bs-offcanvas-bg:var(--rg-bg);--bs-offcanvas-border-color:var(--rg-border)}
.toast{--bs-toast-bg:var(--rg-surface);--bs-toast-border-color:var(--rg-border)}
.alert{--bs-alert-border-radius:var(--rg-radius)}
.table{--bs-table-bg:transparent;--bs-table-border-color:var(--rg-border);--bs-table-striped-bg:var(--rg-stripe)}
.carousel-indicators [data-bs-target]{background-color:var(--rg-text)}
.carousel-control-next-icon,.carousel-control-prev-icon{background-color:rgba(11,11,11,.7);color:var(--rg-text)}
.noui-tooltip{background:var(--rg-surface);border-color:var(--rg-border);color:var(--rg-text)}
.noUi-connect{background:var(--rg-brand-2)}
.material-icons{color:inherit}

/* ---------- Full width ---------- */
/* Every container spans the whole screen with a proportional side margin (5% of the width, 16px minimum on
   mobile): header, sections and footer, no centered max-width */
.container,.container-sm,.container-md,.container-lg,.container-xl,.container-xxl,.container-fluid{max-width:none;padding-inline:max(1rem,5vw)}
/* Module product blocks (featured products, cross-selling…) open their own container (components/module-products.tpl):
   inside a page container (cart, order confirmation) it doubled the side margin */
.container .module-products.container,.row .module-products.container{padding-inline:0}

/* ---------- Page transitions (View Transitions API, cross-document) ---------- */
/* A short cross-fade between two pages of the shop, CSS only (no JS, nothing hidden at load: no PageSpeed cost).
   The header has its own name so it stays in place instead of fading with the page. Browsers without support
   (Firefox for now) navigate as usual; none with reduced motion */
@view-transition{navigation:auto}
#header{view-transition-name:rg-header}
::view-transition-old(root),::view-transition-new(root){animation-duration:.25s}
::view-transition-group(rg-header){animation-duration:.25s}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* ---------- Header ---------- */
/* The translucent background is on ::before: a backdrop-filter on .header itself would make it the containing
   block of the fixed mobile menu (offcanvas), which then shows only inside the header height */
.header{background:transparent}
/* Only the header-bottom row sticks: the header stays sticky but its top is offset by the top bar height (30px,
   shown from md), so the top bar scrolls away with the page */
@media (max-width:767.98px){.header-top{display:none}}
@media (min-width:768px){.header{top:-34px}}
.header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:opacity .3s}
/* Every header text is black (light scheme) */
.header,.header a,.header .header-block__action-btn,.header .header-block__title,.header .menu-toggle,.header .btn-close{color:var(--rg-text)}
/* Top bar: opaque, darker than the header row */
.header-top{position:relative;background:var(--rg-bg);border-bottom:1px solid var(--rg-border);font-size:.75rem;padding:0;max-height:34px}
.header-top>.container-md,.header-top .row,.header-top__left,.header-top__right{height:33px}
.header-top .row>*{display:flex;align-items:center}
.header-top .header-block__action-btn,.header-top .dropdown-toggle,.header-top .form-select{padding-block:0;line-height:1}
.header-top .header-block__icon{font-size:1rem}
.header-top .header-block__badge{height:1.125rem;min-width:1.125rem;font-size:.6875rem}
.header-top a,.header-top .dropdown-toggle{color:var(--rg-text);font-size:.75rem;letter-spacing:.1em}
.header-top a:hover{color:var(--rg-brand-2)}
/* Top bar links (EN, EUR, Sign in): muted, light on hover */
.header-top a.header-block__action-btn,.header-top .dropdown-toggle{color:var(--rg-text-2);transition:color .2s}
.header-top .header-block__action-btn:hover,.header-top .header-block__action-btn:focus-visible,.header-top .header-block__action-btn[aria-expanded=true]{color:var(--rg-text)}
/* Sign in: the block and its link are flex items centered in the 29px bar */
.header-top__right>*,.header-top .header-block,.header-top .header-block__action-btn{display:flex;align-items:center}
.header-top .header-block__action-btn{gap:.375rem;height:100%}
.header-top .header-block__title{line-height:1;color:inherit}
/* No person icon once the label shows ("Sign in", or the customer's initials then name), from 768px */
@media (min-width:768px){.header-top .header-block__action-btn .header-block__icon{display:none}}
/* Header-bottom row: 64px on mobile; from 768px 80px (logo 44px high), 60px once stuck at the top (logo 36px).
   The header shrinks inside the page flow: its margin-bottom grows by the same 20px at the same pace, so the content
   below never jumps. --rg-header-h = full header height (top bar 30px + row), used to overlap the hero */
:root{--rg-header-h:64px;--rg-header-shrink:0px}
@media (min-width:768px){:root{--rg-header-h:114px}.rg-header-stuck{--rg-header-shrink:20px}}
.header{margin-bottom:var(--rg-header-shrink);transition:margin-bottom .3s ease}
.header-bottom{height:64px;padding:0;border-bottom:1px solid var(--rg-border);transition:height .3s ease}
@media (min-width:768px){.header-bottom{height:calc(80px - var(--rg-header-shrink))}}
.header-bottom__container,.header-bottom__row{height:100%}
.header-bottom__logo picture{display:block}
.header-bottom .logo{display:block;width:auto;height:2.75rem;max-height:2.75rem;max-width:none;transition:height .3s ease,max-height .3s ease}
@media (min-width:768px){.rg-header-stuck .header-bottom .logo{height:2.25rem;max-height:2.25rem}}
.header-block__action-btn{color:var(--rg-text)}
.header-block__action-btn:hover{color:var(--rg-brand-2)}
.header-block__icon{color:inherit}
.header-block__badge{background:var(--mf-pink);color:#000;font-family:var(--rg-caps);font-weight:600}
/* Main menu (desktop and mobile): Oswald caps */
.ps-mainmenu__tree-link,.ps-mainmenu--mobile .menu__link{font-family:var(--rg-caps);font-size:.9375rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link,.ps-mainmenu--mobile .menu__link{color:var(--rg-text)}
/* Hover: same color, underlined */
.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:hover,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:active,.ps-mainmenu--mobile .menu__link:hover{color:var(--rg-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.5em}
.ps-mainmenu--mobile .menu__link{font-size:1rem;padding:.875rem 1.5rem}
/* No focus frame on click (Hummingbird outlines :focus in the link color); keyboard focus keeps a discreet
   underline-style ring for accessibility */
.header a:focus,.header button:focus,.ps-mainmenu--mobile a:focus,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:focus,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-dropdown-toggle:focus{outline:none;box-shadow:none}
.header a:focus-visible,.header button:focus-visible,.ps-mainmenu--mobile a:focus-visible,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:focus-visible{outline:1px solid rgba(var(--rg-text-rgb),.5);outline-offset:4px;border-radius:2px}
/* Language and currency switchers (top bar, in place of "Contact us"): compact dropdowns, current ISO code + chevron */
.header-top__left{gap:1.5rem}
.header-top,.header-top .row,.header-top__left{overflow:visible}
.rg-switch__toggle{display:inline-flex;align-items:center;gap:.125rem;padding:0;border:0;background:none;color:var(--rg-text-2);font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.1em;line-height:1;cursor:pointer;transition:color .2s}
.rg-switch__toggle:hover,.rg-switch__toggle[aria-expanded=true]{color:var(--rg-text)}
.rg-switch__toggle:hover .rg-switch__current,.rg-switch__toggle[aria-expanded=true] .rg-switch__current{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.4em}
.rg-switch__chevron{font-size:1rem;transition:transform .2s}
.rg-switch__toggle[aria-expanded=true] .rg-switch__chevron{transform:rotate(180deg)}
.rg-switch__toggle:focus{outline:none}
.rg-switch__toggle:focus-visible{outline:1px solid rgba(var(--rg-text-rgb),.5);outline-offset:4px;border-radius:2px}
.rg-switch__menu{--bs-dropdown-min-width:11rem;--bs-dropdown-padding-y:.375rem;--bs-dropdown-item-padding-y:.5rem;--bs-dropdown-item-padding-x:1rem;--bs-dropdown-font-size:.875rem;--bs-dropdown-border-radius:var(--rg-radius);margin-top:.5rem!important;box-shadow:0 12px 32px rgba(0,0,0,.12)}
/* ".header-top a" (caps, letter-spaced) must not reach the menu items */
.rg-switch__item,.header-top a.rg-switch__item{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;font-family:var(--rg-text-font);font-size:.875rem;letter-spacing:0;text-transform:none;color:var(--rg-text);text-decoration:none}
.header-top a.rg-switch__item:hover{color:var(--rg-text)}
.rg-switch__code{font-family:var(--rg-caps);font-size:.75rem;letter-spacing:.06em;color:var(--rg-text-3)}
.rg-switch__item.is-current{color:var(--rg-text);background:transparent;cursor:default}
.rg-switch__item.is-current .rg-switch__name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.35em}
.rg-switch__item.is-current .rg-switch__code{color:var(--rg-brand-2)}
/* Every top bar dropdown (language, currency, account): compact, caps like the bar, one type size */
.header-top .dropdown-menu{--bs-dropdown-min-width:9rem;--bs-dropdown-padding-y:.25rem;--bs-dropdown-item-padding-y:.375rem;--bs-dropdown-item-padding-x:.875rem;--bs-dropdown-font-size:.75rem}
.header-top .dropdown-menu .dropdown-item{gap:1rem;font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.06em;line-height:1.3;text-transform:uppercase}
.header-top .dropdown-menu .rg-switch__code{font-size:inherit;letter-spacing:inherit}
.header-top .dropdown-menu .dropdown-item .material-icons{font-size:1rem;vertical-align:-.25em}
.header-top .dropdown-menu .dropdown-divider{margin-block:.25rem}
/* In the mobile menu (blocks moved into #_mobile_ps_languageselector / #_mobile_ps_currencyselector): plain lists */
.ps-mainmenu__selects{flex-direction:column;gap:1.5rem!important;width:100%;padding:1rem 1.5rem}
.ps-mainmenu__selects .rg-switch__toggle{display:none}
.ps-mainmenu__selects .rg-switch__menu{position:static!important;display:block;transform:none!important;margin:0!important;padding:0;min-width:0;border:0;background:transparent;box-shadow:none}
.ps-mainmenu__selects .rg-switch__item{padding-inline:0}
/* Burger on the left | logo centered | cart on the right (below 1200px; from 1200px see the left column below).
   The logo is taken out of the flow and centered in the row */
.header-bottom__row{position:relative}
.header-bottom__logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0!important;padding:0;width:auto;z-index:1}
.header-bottom__cart{margin-left:auto}
/* Mobile (below 768px): account and cart on the right */
@media (max-width:767.98px){#_mobile_ps_customersignin{margin-left:auto}}
.header-bottom__cart .header-block__title{font-family:var(--rg-caps);font-size:.875rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase}

/* Header over the hero (body.rg-header-over: home, The Method, Custom Putting Surface): the header overlaps the hero,
   the header-bottom row is transparent until the page is scrolled (assets/js/custom.js); the top bar stays opaque */
/* Still sticky (top bar scrolls away), pulled over the hero by its own height (--rg-header-h) */
.rg-header-over .header{margin-bottom:calc(var(--rg-header-shrink) - var(--rg-header-h))}
.rg-header-over .header::before{opacity:0}
.rg-header-over .header-bottom{border-bottom-color:transparent;transition:border-color .3s}
.rg-header-over.rg-header-scrolled .header::before{opacity:1}
.rg-header-over.rg-header-scrolled .header-bottom{border-bottom-color:var(--rg-border)}
.rg-header-over .breadcrumb__wrapper{display:none}
/* The hero starts at the top of the page under the fixed header: its eyebrow is at 40% of the viewport height,
   and never under the header (top bar 30px + row about 92px) */
/* (the hero itself keeps its text clear of the header: hero.css, padding-top from --rg-header-h) */

/* ---------- Header as a narrow left column (from 1200px) ---------- */
/* After the Ohio demo 29: the header is a fixed 100px column on the left, full height: logo turned a quarter
   anticlockwise at the top, burger in the middle, cart at the bottom. The burger opens the offcanvas beside the
   column: accordion menu, then account and contact (modules/ps_mainmenu/ps_mainmenu.tpl).
   The header markup is the mobile/tablet one (templates/_partials/header.tpl): its header-bottom wrappers become
   display:contents so that every block is a flex item of the column; the top bar is hidden (its links are in the
   burger). The page beside it (wrapper, footer) is pushed right by the column width. The top bar and shrinking row
   mechanics above (top:-34px, --rg-header-shrink, header over the hero) do not apply */
:root{--rg-side-w:100px}
/* Blocks reached by a scroll (hero scroll cue) stop under the stuck header bar: 64px on mobile, 60px from 768px, none
   beside the left column */
.lnwks-block{scroll-margin-top:64px}
@media (min-width:768px){.lnwks-block{scroll-margin-top:60px}}
@media (min-width:1200px){.lnwks-block{scroll-margin-top:0}}
@media (min-width:1200px){
  :root,.rg-header-stuck{--rg-header-h:0px;--rg-header-shrink:0px}
  /* Above the offcanvas backdrop (1040): the column stays visible and its burger closes the menu; the offcanvases are
     inside the header, so they share its stacking level */
  .header{position:fixed;top:0;bottom:0;left:0;z-index:1050;width:var(--rg-side-w);max-width:none;margin:0!important;display:flex;flex-direction:column;align-items:center;padding:2.5rem 0;overflow-y:auto;overscroll-behavior:contain;background:var(--rg-bg);border-right:1px solid var(--rg-border)}
  .header::before{display:none}
  .header~.wrapper,.header~.footer{margin-left:var(--rg-side-w)}
  .header-top{display:none}
  .header-bottom,.header-bottom__container,.header-bottom__row{display:contents!important}
  /* Logo, a quarter turn anticlockwise: the vertical SVG (mefiat-bk-v.svg, templates/_partials/header.tpl), 4rem wide.
     No CSS rotate: a transformed image is rasterized, then turned, and looked blurred */
  .header-bottom__logo{order:1;position:static;transform:none;justify-content:center;width:auto;padding:0;margin:0!important}
  .header-bottom .logo,.rg-header-stuck .header-bottom .logo{width:4rem;height:auto;max-height:none}
  /* Burger, in the middle of the column height */
  /* Burger in the middle of the column height, its top rounded down to a whole pixel (an odd window height would put
     it, and its lines, on half a pixel: blurred on standard screens); no translateY(-50%) for the same reason */
  .header-bottom__row>.ps-mainmenu--desktop{position:absolute;top:calc(50% - 1.75rem);top:round(down,50% - 1.75rem,1px);left:0;right:0;height:3.5rem;display:flex;justify-content:center;width:auto;max-width:none;padding:0}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle{display:flex}
  /* On a #F2F2F2 disc: darker on hover, sinks on press, sends a ripple on click; the two lines cross while the menu is
     open (classes set by assets/js/custom.js). No scale at rest or on hover: the 2px lines stay on whole pixels */
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;padding:0;border:0;border-radius:50%;background:#f2f2f2;color:var(--rg-text);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .2s}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle:hover{background:#e6e6e6}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle:active{transform:scale(.92);transition-duration:.1s}
  .menu-toggle::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:#f2f2f2;opacity:0}
  .menu-toggle.rg-ripple::before{animation:rg-burger-ripple .6s cubic-bezier(.2,.7,.3,1)}
  .ps-mainmenu__mobile-toggle .menu-toggle .material-icons{display:none}
  /* Two 2px lines 6px apart, in px so that both land on whole pixels; they meet at 4px and turn into a cross */
  .rg-burger{position:relative;display:block;width:22px;height:10px}
  .rg-burger>span{position:absolute;top:0;left:0;width:100%;height:2px;background:currentColor;transition:top .3s ease,transform .3s ease}
  .rg-burger>span:last-child{top:8px}
  .menu-toggle.is-open .rg-burger>span{top:4px}
  .menu-toggle.is-open .rg-burger>span:first-child{transform:rotate(45deg)}
  .menu-toggle.is-open .rg-burger>span:last-child{transform:rotate(-45deg)}
  /* Cart, at the bottom: the counterpart of the burger. Same 56px disc, in black (the main action) where the burger's
     is light grey; a line bag drawn with the weight of the burger lines; same press. The count sits in the pink badge
     on the disc edge, hidden when the cart is empty, with a short pop when it changes (assets/js/custom.js). The
     column has the same 2.5rem above the logo and below the cart */
  .header-bottom__cart{order:4;width:auto;margin:auto 0 0;padding:0}
  .header .header-bottom__cart .header-block__action-btn{position:relative;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;padding:0!important;border-radius:50%;background:var(--rg-text);color:#fff;transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .2s}
  .header .header-bottom__cart .header-block__action-btn:hover{background:#333;color:#fff}
  .header .header-bottom__cart .header-block__action-btn:active{transform:scale(.92);transition-duration:.1s}
  .header-bottom__cart .material-icons{display:none}
  .rg-cart-icon{display:block;stroke-linejoin:miter}
  .header-bottom__cart .header-block__badge{position:absolute;top:-.125rem;right:-.125rem;height:1.375rem;min-width:1.375rem;padding:0 .3125rem;border:2px solid var(--rg-bg);font-size:.6875rem;line-height:1}
  .header-bottom__cart .inactive .header-block__badge{display:none}
  .header-bottom__cart .header-block__badge.rg-pop{animation:rg-badge-pop .45s cubic-bezier(.34,1.56,.64,1)}
  /* Burger offcanvas: opens beside the column (fades in and slides a little, so that it never passes over it) */
  .ps-mainmenu--mobile.offcanvas-start{left:var(--rg-side-w);width:26rem;border-right:1px solid var(--rg-border);opacity:0;transform:translateX(-1.5rem);transition:transform .3s ease,opacity .3s ease,visibility .3s}
  .ps-mainmenu--mobile.offcanvas-start.showing,.ps-mainmenu--mobile.offcanvas-start.show:not(.hiding){opacity:1;transform:none}
  /* Bootstrap puts the backdrop next to the offcanvas, inside the header: it starts after the column */
  .header .offcanvas-backdrop{left:var(--rg-side-w)}
  .ps-mainmenu--mobile .offcanvas-header{justify-content:flex-end;padding:1.25rem 1.25rem 0}
  .ps-mainmenu--mobile .rg-sidenav{margin-top:auto;padding:0 3rem}
  .ps-mainmenu--mobile .rg-sidenav__list .rg-sidenav__list{padding-left:1rem}
  .rg-sidenav__list--depth-1>.rg-sidenav__item>.rg-sidenav__row .rg-sidenav__link{padding:.5rem 0;font-size:1.75rem;letter-spacing:.04em}
  .rg-sidenav__links{margin:2.5rem 3rem auto;padding:1.5rem 0 0;border-top:1px solid var(--rg-border);list-style:none;display:grid;gap:.625rem}
  .rg-sidenav__links a{font-family:var(--rg-caps);font-size:.8125rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--rg-text-2)}
  .rg-sidenav__links a:hover{color:var(--rg-text)}
  .ps-mainmenu--mobile .ps-mainmenu__additionnals{flex-grow:0;padding:0}
  /* Sticky blocks (product details, cart summary): no header bar above them any more */
  :root{--rg-sticky-top:2rem}
  /* Full-bleed breakout: the viewport minus the column */
  .rg-product-story{margin-inline:calc(50% - 50vw + var(--rg-side-w) / 2)}
}
/* Accordion menu: Oswald caps at the first level, Lora below; + turns into × when open */
.rg-sidenav__list{margin:0;padding:0;list-style:none}
.rg-sidenav__row{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.rg-sidenav__link{display:block;padding:.375rem 0;font-family:var(--rg-caps);font-size:1.125rem;font-weight:500;letter-spacing:.06em;line-height:1.3;text-transform:uppercase;text-decoration:none;color:var(--rg-text)}
.rg-sidenav__link:hover,.rg-sidenav__link[aria-current=page]{color:var(--rg-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.rg-sidenav__toggle{display:flex;flex:none;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;border:0;background:none;color:var(--rg-text);cursor:pointer}
.rg-sidenav__toggle .material-icons{font-size:1.25rem;transition:transform .25s ease}
.rg-sidenav__toggle:not(.collapsed) .material-icons{transform:rotate(45deg)}
.rg-sidenav__list .rg-sidenav__list{padding:.125rem 0 .75rem .875rem}
.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link{padding:.25rem 0;font-family:var(--rg-text-font);font-size:.9375rem;letter-spacing:0;text-transform:none;color:var(--rg-text-2)}
.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link:hover,.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link[aria-current=page]{color:var(--rg-text)}
@media (max-width:1199.98px){.rg-burger,.rg-cart-icon{display:none}}
@keyframes rg-badge-pop{0%{transform:scale(.4)}100%{transform:scale(1)}}
@keyframes rg-burger-ripple{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
@media (prefers-reduced-motion:reduce){.rg-sidenav__toggle .material-icons,.ps-mainmenu--mobile.offcanvas-start,.menu-toggle,.rg-burger>span{transition:none!important}.menu-toggle.rg-ripple::before,.header-bottom__cart .header-block__badge.rg-pop{animation:none}}

/* ---------- Form pages (sign in, create an account, forgotten password, guest order tracking, contact): one centered 640px column ---------- */
.rg-narrow{max-width:640px;margin-inline:auto;padding-block:clamp(2rem,5vw,4rem)}
/* The form in a hairline frame on the white page */
.rg-narrow>.page-content{padding:clamp(1.5rem,4vw,2.5rem);background:var(--rg-bg);border:1px solid var(--rg-border);border-radius:var(--rg-radius)}
/* Intro sentence under the title, above the card: the title keeps .75rem below it, the sentence the header's 2rem */
.rg-narrow>.page-header:has(+.rg-page-intro){margin-bottom:.75rem}
.rg-page-intro{margin:0 0 2rem;color:var(--rg-text-2);font-size:1rem;line-height:1.6}
/* Forgotten password: its sentence is the intro under the title (customer/password-email.tpl), not repeated in the card */
.forgotten-password>header{display:none}
/* Guest order tracking: its "To track your order…" sentence is replaced by the intro (customer/guest-login.tpl) */
#guestOrderTrackingForm>p:first-of-type{display:none}

/* ---------- Product page: images 7/12, details 5/12; images stacked in one column on desktop (the details stay in
   view beside them), carousel on mobile ----------
   Scoped to .product__container (the product page itself): the quickview modal is also .page-product but keeps the
   carousel */
.page-product .product__container{grid-template-columns:minmax(0,1fr);gap:2rem}
.rg-gallery{display:none;margin:0;padding:0;list-style:none}
/* Product name: smaller than the page titles (it sits in the 5/12 column) */
/* Short description bullets, also in the quickview */
/* Short description: dashes instead of bullets, no rules between the items (product page and quickview) */
.product__description-short{color:var(--rg-text-2);font-size:1rem;line-height:1.65}
.product__description-short p{margin-bottom:1rem}
.product__description-short strong{color:var(--rg-text);font-weight:600}
.product__description-short ul{list-style:none;padding:0;margin:0 0 1.25rem}
.product__description-short li{position:relative;padding:.375rem 0 .375rem 1.5rem}
/* Dash centred on the first line: top padding + half the line height (1.65em / 2) */
.product__description-short li::before{content:"";position:absolute;left:0;top:calc(.375rem + .825em);width:.75rem;height:1px;background:var(--rg-text)}
/* Product details, sober and high-end (same language as the category page) */
.rg-product-eyebrow{margin:0 0 .75rem;font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--rg-text-3)}
.page-product h1.product__name{margin-bottom:.75rem;font-family:var(--rg-font);font-size:clamp(1.75rem,2.4vw,2.5rem);font-weight:500;line-height:1.1;letter-spacing:.02em}
.page-product .product__prices{margin-bottom:1.75rem;padding-bottom:1.75rem;border-bottom:1px solid var(--rg-border)}
.page-product .product__price{font-family:var(--rg-text-font);font-size:1.125rem;font-weight:400;letter-spacing:0;color:var(--rg-text)}
.page-product .product__prices .product__tax-label,.page-product .product__prices-block>:not(.product__prices-inline){font-family:var(--rg-caps);font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rg-text-3)}
.page-product .product__actions{margin-top:1.75rem;padding-top:1.75rem;border-top:1px solid var(--rg-border)}
.page-product .product__actions-qty-add{display:flex;gap:.75rem;align-items:stretch}
.page-product .product__quantity .input-group{height:100%;border:1px solid var(--rg-border-strong);border-radius:var(--rg-pill);overflow:hidden}
.page-product .product__quantity .btn,.page-product .product__quantity .form-control{border:0;border-radius:0;background:transparent}
.page-product .product__quantity .form-control{width:3rem;text-align:center;font-family:var(--rg-caps);font-size:.8125rem}
.page-product .product__add-to-cart{flex:1 1 auto}
/* Add to cart in black */
.page-product .product__add-to-cart-button{width:100%;min-height:3.25rem;--bs-btn-bg:var(--rg-brand);--bs-btn-border-color:var(--rg-brand);--bs-btn-color:#fff;--bs-btn-hover-bg:var(--rg-brand-hover);--bs-btn-hover-border-color:var(--rg-brand-hover);--bs-btn-hover-color:#fff;--bs-btn-active-bg:var(--rg-brand-hover);--bs-btn-active-border-color:var(--rg-brand-hover);--bs-btn-active-color:#fff;--bs-btn-disabled-bg:var(--rg-text-3);--bs-btn-disabled-border-color:var(--rg-text-3)}
/* Size choice (combinations): sober outlined pills, black when selected */
.page-product .product__variants{margin-bottom:1.5rem}
.page-product .product-variant__legend{float:none;display:block;width:100%;margin-bottom:.625rem;font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--rg-text-2)}
.page-product .product-variant__selected{display:none}
.page-product .product-variant__radios{display:flex;flex-wrap:wrap;gap:.5rem}
.page-product .product-variant__radio .btn{--bs-btn-color:var(--rg-text);--bs-btn-border-color:var(--rg-border-strong);--bs-btn-bg:transparent;--bs-btn-hover-color:var(--rg-text);--bs-btn-hover-bg:transparent;--bs-btn-hover-border-color:var(--rg-text);--bs-btn-active-color:var(--rg-bg);--bs-btn-active-bg:var(--rg-text);--bs-btn-active-border-color:var(--rg-text);--bs-btn-padding-x:1.25rem;--bs-btn-padding-y:.75rem;--bs-btn-font-size:.75rem;letter-spacing:.06em;text-transform:none}
.page-product .product-variant__radio .btn-check:checked+.btn{color:var(--rg-bg);background:var(--rg-text);border-color:var(--rg-text)}
.page-product .product__actions-qty-add{flex-wrap:nowrap}
.page-product .product__quantity{flex:0 0 auto;width:auto}
.page-product .product__quantity .input-group{flex-wrap:nowrap;width:auto}
.page-product .product__add-to-cart-button{white-space:nowrap}
@media (max-width:575.98px){
  .page-product .product__quantity .btn{padding-inline:.625rem}
  .page-product .product__quantity .form-control{width:2rem;padding-inline:0}
  .page-product .product__add-to-cart-button{--bs-btn-padding-x:1rem;--bs-btn-font-size:.75rem;letter-spacing:.06em}
  .page-product .product__add-to-cart-button .material-icons{display:none}
}
/* Carousel (below 992px, and the quickview): square image, nearly square corners, discreet controls */
.page-product .product__carousel{border-radius:0;background:var(--rg-surface)}
.page-product .product__carousel .carousel-item img{aspect-ratio:3/4;object-fit:cover}
.page-product .product__carousel .carousel-control-prev,.page-product .product__carousel .carousel-control-next{width:3rem;opacity:1}
.page-product .product__carousel .carousel-control-prev-icon,.page-product .product__carousel .carousel-control-next-icon{width:2.25rem;height:2.25rem;border-radius:50%;background-color:rgba(20,20,20,.45);background-size:40%;transition:background-color .2s}
.page-product .product__carousel .carousel-control-prev:hover .carousel-control-prev-icon,.page-product .product__carousel .carousel-control-next:hover .carousel-control-next-icon{background-color:rgba(20,20,20,.75)}
.page-product .product__zoom{width:2.5rem;height:2.5rem;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:none;color:var(--rg-text)}
.page-product .product__availability{font-family:var(--rg-caps);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--rg-text-2)}

/* Hummingbird's second part (accordion removed in product.tpl, reassurance): hidden while the reassurance hook is empty */
.product__container~.product__bottom:not(:has(.product__bottom-right *)){display:none}
/* Hummingbird's .page:not(body) padding-bottom (2rem) left a light band under the dark story: none when the story ends the page */
.page-product .page:has(.rg-product-story){padding-bottom:0}
/* Same for the home page and the lnwkspages pages, made of full-width blocks down to the footer */
#index .page:not(body),#module-lnwkspages-page .page:not(body){padding-bottom:0}
/* Bottom of the product page: the marketing story (lnwkspages blocks, displayFooterProduct), full width, dark */
.rg-product-story{margin-top:clamp(4rem,8vw,7rem);margin-inline:calc(50% - 50vw);background:var(--rg-bg);color:var(--rg-text)}
@media (min-width:992px){
  .page-product .product__container{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,4vw,4.5rem);align-items:start}
  /* The details stay in view while the images scroll by (under the 60px stuck header) */
  .page-product .product__container>.product__right{position:sticky;top:var(--rg-sticky-top,5rem)}
  .product__container .product__carousel{display:none}
  .product__container .product__images .product__flags{position:absolute;z-index:2}
  .product__container .product__images{position:relative}
  .product__container .rg-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:.5rem}
}
.rg-gallery__button{display:block;width:100%;padding:0;border:0;border-radius:0;overflow:hidden;background:var(--rg-surface);cursor:zoom-in}
.rg-gallery__image{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}
/* No zoom on hover: the zoom is PhotoSwipe, on click */
.rg-gallery__button:focus{outline:none}
.rg-gallery__button:focus-visible{outline:2px solid var(--rg-brand-2);outline-offset:2px}
/* PhotoSwipe (assets/vendor/photoswipe/photoswipe.css, loaded after this file: hence ".pswp.pswp") */
.pswp.pswp{--pswp-bg:#fff;--pswp-placeholder-bg:#f4f4f4;--pswp-icon-color:#000;--pswp-icon-color-secondary:#fff;--pswp-icon-stroke-color:#fff;--pswp-error-text-color:#000;--pswp-bg-opacity:1;font-family:var(--rg-caps)}
.pswp .pswp__counter{font-size:.75rem;letter-spacing:.08em;opacity:.8}
.page-product .js-product-carousel .carousel-item img{cursor:zoom-in}

/* ---------- Product images: never rounded, anywhere (listings, product page, cart, cart modal, order pages) ---------- */
img[class*="product"],.product-line__image img,.product-miniature__image-link,.product-miniature__top,.product__carousel,.product__images,.rg-gallery__button,.blockcart img,.cart-summary img{border-radius:0!important}

/* ---------- Quantity selector (cart lines, cart modal, product page): one thin pill, the number centred ---------- */
.quantity-button{width:auto;max-width:none}
.quantity-button__group{flex-wrap:nowrap;width:max-content;height:2.75rem;border:1px solid var(--rg-border-strong);border-radius:var(--rg-pill);overflow:hidden;background:transparent}
.quantity-button__group>.btn{width:2.5rem;min-width:2.5rem;height:100%;padding:0;margin:0!important;border:0;border-radius:0!important;background:transparent;color:var(--rg-text);display:inline-flex;align-items:center;justify-content:center}
.quantity-button__group>.btn .material-icons{font-size:1.125rem}
.quantity-button__group>.btn:hover{background:var(--rg-overlay,rgba(0,0,0,.04))}
.quantity-button__group>.form-control{flex:0 0 2.5rem;width:2.5rem;min-width:2.5rem;height:100%;padding:0;margin:0!important;border:0;border-radius:0!important;background:transparent;text-align:center;font-family:var(--rg-caps);font-size:.8125rem;letter-spacing:.04em;-moz-appearance:textfield;appearance:textfield}
.quantity-button__group>.form-control::-webkit-outer-spin-button,.quantity-button__group>.form-control::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.quantity-button__group>.form-control:focus{box-shadow:none}
.page-product .product__quantity .quantity-button__group{height:3.25rem}

/* ---------- Cart and order (checkout) pages: more air between the content and the summary; the summary on a plain
   surface, in view while scrolling ---------- */
@media (min-width:992px){
  .cart-grid,.checkout-grid{--bs-gutter-x:clamp(4rem,7vw,7rem)}
  .cart-grid__aside-wrapper,.checkout-grid__aside-wrapper{position:sticky;top:var(--rg-sticky-top,5rem)}
}
.cart-grid .page-title-section{margin-bottom:2rem}
.cart-grid .product-line{padding-block:1.5rem}
.cart-grid__aside-wrapper,.checkout-grid__aside-wrapper{padding:2rem;background:var(--rg-surface)}
/* One page checkout: sections separated by a hairline, generous spacing */
.page-order .checkout-grid{padding-block:clamp(1.5rem,3vw,2.5rem)}
.one-page-checkout__section{padding-block:2.5rem;border-top:1px solid var(--rg-border)}
.one-page-checkout>:first-child .one-page-checkout__section,.one-page-checkout>.one-page-checkout__section:first-child{padding-top:0;border-top:0}
.one-page-checkout__title{margin-bottom:1.5rem;font-family:var(--rg-font);font-size:clamp(1.25rem,1.6vw,1.5rem);font-weight:500;letter-spacing:.02em;text-transform:uppercase}
.one-page-checkout__field{margin-bottom:1rem}
/* ps_onepagecheckout adds 2em on the right of the form only (not of the payment section): same width for every section */
.page-order .one-page-checkout{padding-right:0}
/* Information messages (checkout, account…): plain surface and hairline instead of the Bootstrap light blue */
.alert-info{--bs-alert-bg:var(--rg-surface);--bs-alert-border-color:var(--rg-border);--bs-alert-color:var(--rg-text-2);--bs-alert-link-color:var(--rg-text)}
.checkout-grid__aside .one-page-checkout__section{padding-block:1.5rem 0;border-top:1px solid var(--rg-border)}
.checkout-grid__aside .one-page-checkout__title{font-size:1.25rem}

/* ---------- Breadcrumb ---------- */
.breadcrumb__wrapper{background:transparent;border-bottom:1px solid var(--rg-border)}
.breadcrumb{--bs-breadcrumb-divider-color:var(--rg-text-3);--bs-breadcrumb-item-active-color:var(--rg-text-2)}
.breadcrumb a{color:var(--rg-text-2);text-decoration:none}
.breadcrumb a:hover{color:var(--rg-text)}

/* ---------- Product miniatures ---------- */
/* Sober miniatures, like rapha.cc: portrait image (3:4) on a light grey surface, no border, no shadow, no zoom;
   name and price right under the image; no add to cart (product.tpl) */
.product-miniature__inner,.product-miniature__inner:hover{background:transparent;box-shadow:none}
.product-miniature__top,.product-miniature__inner:hover .product-miniature__top{background:var(--rg-surface);border:0;border-radius:0;overflow:hidden}
.product-miniature__image-container{aspect-ratio:3/4}
/* The link and the picture fill the 3:4 frame (Hummingbird sizes them square) */
.product-miniature__image-link,.product-miniature__image-container picture{display:block;width:100%;height:100%;aspect-ratio:auto}
.product-miniature__image,.product-miniature__inner:hover .product-miniature__image{display:block;width:100%;height:100%;object-fit:cover;transform:none;transition:none}
.product-miniature__bottom{gap:.25rem;padding:1rem 0 0}
.product-miniature__infos{gap:.25rem}
.product-miniature__title,.product-miniature__title a{font-family:var(--rg-caps);font-size:.9375rem;font-weight:500;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--rg-text);text-decoration:none}
.product-miniature__title:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
.product-miniature__prices{margin:0}
.product-miniature__price{font-family:var(--rg-text-font);font-size:.9375rem;font-weight:400;letter-spacing:0;color:var(--rg-text-2)}
.product-miniature__regular-price{font-family:var(--rg-text-font);font-size:.8125rem;letter-spacing:0;color:var(--rg-text-3)}
.product-flags{padding:.75rem}
.product-flags .badge,.product-flags .badge:not(.discount),.product-flags .badge.discount{padding:.25rem .5rem;border:0;border-radius:0;background:var(--rg-text);color:var(--rg-bg);font-family:var(--rg-caps);font-size:.6875rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
/* Listing grid: 3 wide columns with generous spacing; 2 on tablets and phones (from 360px); 1 below */
.layout-full-width .products{grid-template-columns:minmax(0,1fr);gap:2.5rem .75rem}
@media (min-width:360px){.layout-full-width .products{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:576px){.layout-full-width .products{gap:3rem 1.5rem}}
@media (max-width:575.98px){
  .product-miniature__bottom{padding-top:.75rem}
  .product-miniature__title,.product-miniature__title a{font-size:.8125rem}
  .product-miniature__price{font-size:.8125rem}
  .product-flags{padding:.5rem}
  .page-category .category__header{padding-block:2rem 1.5rem;margin-bottom:1.5rem}
}
@media (min-width:992px){.layout-full-width .products{grid-template-columns:repeat(3,minmax(0,1fr));gap:4rem 2rem}}
/* Cross-selling ("Clients also bought", same category): 4 columns on desktop, clear of the product gallery */
.page-product :is(.ps-crossselling,.ps-categoryproducts){margin-top:clamp(4rem,8vw,7rem)}
@media (min-width:992px){:is(.ps-crossselling,.ps-categoryproducts) .products{grid-template-columns:repeat(4,minmax(0,1fr));gap:3rem 1.5rem}}
/* Category header: large title, quiet description, a hairline before the products */
.page-category .category__header{display:grid;gap:1rem;padding-block:clamp(2.5rem,6vw,5rem) clamp(2rem,4vw,3rem);margin-bottom:clamp(2rem,4vw,3rem);border-bottom:1px solid var(--rg-border)}
.page-category .category__header .page-title-section{margin:0;font-family:var(--rg-font);font-size:clamp(2rem,4vw,3rem);font-weight:500;line-height:1.05;letter-spacing:.02em}
.page-category .category__description{max-width:44rem;color:var(--rg-text-2);font-size:1.125rem}
#js-product-list-top:empty{display:none}
.product-miniature__quickview-button{background:rgba(255,255,255,.94);color:#000;font-family:var(--rg-caps);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.product-flags .badge{background:#000;color:#fff;border:0}
.product-flags .badge.discount{background:var(--mf-pink);border:0;color:#000}

/* Product page */
.product__name,.product__title{font-size:clamp(2rem,4vw,3.25rem)}
.product__current-price,.product__price,.current-price{font-family:var(--rg-text-font);font-weight:400;color:var(--rg-text);letter-spacing:0}
/* Sticky add-to-cart bar (module lnwksstickyatc, mobile and tablet): white like the header, black square button */
.lnwks-sticky-atc{
  --lnwks-satc-bg:#fff;--lnwks-satc-text:#000;
  --lnwks-satc-accent:#000;--lnwks-satc-accent-text:#fff;
  --lnwks-satc-unavailable-bg:rgba(0,0,0,.04);--lnwks-satc-unavailable-text:#c0392b;
  --lnwks-satc-toggle-border:rgba(0,0,0,.35);
  --lnwks-satc-panel-bg:#fff;--lnwks-satc-panel-text:#000;--lnwks-satc-panel-border:rgba(0,0,0,.35);
  --lnwks-satc-btn-radius:var(--rg-pill);--lnwks-satc-option-radius:var(--rg-pill);
  --lnwks-satc-btn-font:var(--rg-caps);
  border-top-color:rgba(0,0,0,.12)
}
.lnwks-sticky-atc__name{font-family:var(--rg-font);font-size:.9375rem;font-weight:600}
.lnwks-sticky-atc__price{font-family:var(--rg-caps);font-size:.875rem;font-weight:600;letter-spacing:.04em}
.lnwks-sticky-atc__btn{padding:.875rem 1.5rem;font-size:.75rem;font-weight:600;letter-spacing:.08em}
.lnwks-sticky-atc__btn:hover,.lnwks-sticky-atc__btn:focus{opacity:1;background:var(--rg-brand-hover)}
#lnwksStickyAtcVariantPanel{padding:1rem max(1rem,5vw)}
#lnwksStickyAtcVariantPanel .control-label{font-family:var(--rg-caps);letter-spacing:.08em}
#lnwksStickyAtcVariantPanel .radio-label{height:2.25rem;padding:0 1rem;font-family:var(--rg-caps);letter-spacing:.08em}
#lnwksStickyAtcVariantPanel .input-container input:checked+.radio-label{background:#000;border-color:#000;color:#fff}

/* ---------- Section titles from modules (featured products, etc.) ---------- */
.section-title,.products-section-title{
  font-family:var(--rg-font);font-weight:500;font-size:clamp(1.5rem,2.6vw,2rem);letter-spacing:.02em;text-transform:uppercase
}

/* ---------- Footer ---------- */
.footer__before{background:var(--rg-bg);border-top:1px solid var(--rg-border)}
/* Newsletter band (modules/ps_emailsubscription/.../ps_emailsubscription.tpl): landing page style */
.rg-newsletter{padding-block:clamp(3.5rem,7vw,5.5rem);background:var(--rg-bg);color:var(--rg-text)}
.rg-newsletter__grid{display:grid;gap:2.5rem;align-items:center}
@media (min-width:992px){.rg-newsletter__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,6vw,6rem)}}
.rg-newsletter__intro{display:grid;gap:1.25rem}
.rg-newsletter__eyebrow{margin:0;font-family:var(--rg-caps);font-size:.75rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--rg-text-2)}
.rg-newsletter__title{margin:0;font-family:var(--rg-font);font-weight:500;font-size:clamp(1.75rem,3.4vw,2.5rem);line-height:1.1;letter-spacing:.02em;text-transform:uppercase;color:var(--rg-text)}
.rg-newsletter__title em{font-style:normal;color:inherit}
.rg-newsletter__text{margin:0;max-width:30rem;color:var(--rg-text-2);font-size:1.125rem}
.rg-newsletter__form{display:grid;gap:1rem;max-width:36rem;width:100%}
@media (min-width:992px){.rg-newsletter__form{justify-self:end}}
/* One pill: transparent field, the button inside on the right */
.rg-newsletter__field{display:flex;align-items:center;gap:.5rem;padding:.375rem .375rem .375rem 1.5rem;border:1px solid var(--rg-border-strong);border-radius:var(--rg-pill);background:var(--rg-surface);transition:border-color .2s}
.rg-newsletter__field:focus-within{border-color:var(--rg-brand-2)}
.rg-newsletter__input{flex:1 1 auto;min-width:0;padding:.625rem 0;border:0;background:transparent;color:var(--rg-text);font-family:var(--rg-text-font);font-size:1rem;outline:none}
.rg-newsletter__input::placeholder{color:var(--rg-text-3)}
.rg-newsletter__input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--rg-surface) inset;-webkit-text-fill-color:var(--rg-text)}
.rg-newsletter__submit{flex:0 0 auto}
.rg-newsletter__conditions,.rg-newsletter__consent{margin:0;padding-inline:1.5rem;font-size:.8125rem;color:var(--rg-text-3)}
.rg-newsletter__consent a,.rg-newsletter__conditions a{color:var(--rg-text-2)}
.rg-newsletter .alert{margin:0}
@media (max-width:575.98px){
  .rg-newsletter__field{flex-direction:column;align-items:stretch;padding:.375rem;border-radius:var(--rg-radius)}
  .rg-newsletter__input{padding:.75rem 1rem}
}
#footer{background:var(--rg-bg);border-top:1px solid var(--rg-border)}
#footer .footer__before{background:transparent}
.footer__main{background:transparent;color:var(--rg-text-3);padding-block:0}
/* Minimal footer, one line under the hairline (templates/_partials/copyright.tpl): copyright and signature on the
   left, legal links on the right, small grey Oswald caps; stacked on mobile */
.rg-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2.5rem;padding-block:1.75rem}
.rg-footer__brand{margin:0}
.rg-footer__links{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;margin:0;padding:0;list-style:none}
.rg-footer__brand,.rg-footer__links a{font-family:var(--rg-caps);font-size:.6875rem;font-weight:500;letter-spacing:.12em;line-height:1.4;text-transform:uppercase;color:var(--rg-text-3)}
.rg-footer__links a{text-decoration:none;transition:color .2s}
.rg-footer__links a:hover{color:var(--rg-text)}
@media (max-width:575.98px){.rg-footer{flex-direction:column;align-items:flex-start;padding-block:1.5rem 2rem}.rg-footer__links{gap:.5rem 1.25rem}}

/* Home hero: lnwkspages block, see assets/css/lnwkspages/hero.css */

/* ---------- CMS pages (La Marque…): full width, like the rest of the pages ---------- */
#cms .page-content p{margin-bottom:1.25rem;font-size:1.0625rem;line-height:1.75}

/* ---------- Product page accordion (description, details…), right column under the add to cart ----------
   Sober, like rapha.cc: hairlines between the items, Oswald caps titles, a thin + / − instead of the chevron */
.page-product .product__accordion{margin-top:2rem;border-top:1px solid var(--rg-border)}
.product__accordion{--bs-accordion-bg:transparent;--bs-accordion-border-width:0;--bs-accordion-btn-padding-x:0;--bs-accordion-btn-padding-y:1.125rem;--bs-accordion-body-padding-x:0;--bs-accordion-body-padding-y:0;--bs-accordion-active-bg:transparent;--bs-accordion-active-color:var(--rg-text);--bs-accordion-btn-focus-box-shadow:none}
.product__accordion .accordion-item{border:0;border-bottom:1px solid var(--rg-border);background:transparent}
.product__accordion .accordion-header{margin:0}
.product__accordion .accordion-button{font-family:var(--rg-caps);font-size:.875rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--rg-text);background:transparent;box-shadow:none}
.product__accordion .accordion-button:focus-visible{outline:1px solid var(--rg-text);outline-offset:2px}
.product__accordion .accordion-button::after{content:"+";width:auto;height:auto;background:none;transform:none;font-family:var(--rg-caps);font-size:1.25rem;font-weight:300;line-height:1;transition:none}
.product__accordion .accordion-button:not(.collapsed)::after{content:"−";background:none;transform:none}
.product__accordion .accordion-body{padding-bottom:1.5rem;font-size:.9375rem;line-height:1.7;color:var(--rg-text-2)}
.product__accordion .accordion-body p:last-child{margin-bottom:0}
.product__accordion .details__list{margin:0;padding:0;list-style:none}
.product__accordion .details__item{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:1px solid var(--rg-border)}
.product__accordion .details__item:last-child{border-bottom:0}
.product__accordion .details__title{font-family:var(--rg-caps);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--rg-text)}

/* ---------- Checkout steps: on white, a hairline below (Hummingbird puts them on a grey band) ---------- */
.checkout-steps{background:var(--rg-bg);border-bottom:1px solid var(--rg-border)}

/* ---------- Product thumbnails in the cart modal and the cart lines: the 3:4 image fills its box ---------- */
.blockcart-modal img,.product-line__image img,.cart-summary-product img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;background:var(--rg-surface)}

/* ---------- 404 / 410: the "contact us" link in the sentence is underlined, so it reads as a link ---------- */
#pagenotfound .page-content p a,.page-not-found p a{color:var(--rg-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}