/* ==========================================================================
   Direction 03 "L'art de la mosaïque" (approved 2026-10-12)
   Loaded after theme.css / woocommerce.css on every page.
   1. Tokens (also remaps the older --mdc-* tokens so every page follows)
   2. Shared pieces: wrap, type, buttons, links
   3. Header + navigation
   4. Footer
   5. Homepage sections
   6. Responsive + reduced motion
   Motif URLs (--mdcx-weave, --mdcx-diamonds, ...) and the Maison font face
   are printed in <head> by inc/mosaic.php so they resolve from the theme.
   ========================================================================== */

/* 1. Tokens ---------------------------------------------------------------- */
:root {
  --mdcx-green: #012718;
  --mdcx-green-2: #0b3422;
  --mdcx-green-3: #20452f;
  --mdcx-olive: #bcca3f;
  --mdcx-gold: #a79155;
  --mdcx-stone: #f5f3ec;
  --mdcx-white: #ffffff;
  --mdcx-muted: #5e6b59;
  --mdcx-line: #d7decf;
  --mdcx-on-green: #d1dcc6;
  --mdcx-serif: Maison, Georgia, "Times New Roman", serif;
  --mdcx-sans: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --mdcx-max: 1520px;
  --mdcx-gutter: 50px;

  /* Older theme tokens, remapped so shop, product and editorial pages pick up the palette. */
  --mdc-lime: var(--mdcx-olive);
  --mdc-green: var(--mdcx-green);
  --mdc-green-deep: #001a10;
  --mdc-green-rgb: 1, 39, 24;
  --mdc-cream: var(--mdcx-stone);
  --mdc-cream-rgb: 245, 243, 236;
  --mdc-panel: #ecebe2;
  --mdc-ink: var(--mdcx-green);
  --mdc-selection-bg: var(--mdcx-olive);
  --mdc-selection-fg: var(--mdcx-green);
}

/* 2. Shared ---------------------------------------------------------------- */
body.mdcx {
  background: var(--mdcx-white);
  color: var(--mdcx-green);
  font-family: var(--mdcx-sans);
  overflow-x: clip;
}
.mdcx ::selection { background: var(--mdcx-olive); color: var(--mdcx-green); }
.mdcx a:focus-visible,
.mdcx button:focus-visible,
.mdcx [tabindex]:focus-visible {
  outline: 3px solid var(--mdcx-gold);
  outline-offset: 4px;
}
.mdcx-wrap { width: min(var(--mdcx-max), calc(100% - 2 * var(--mdcx-gutter))); margin-inline: auto; }
.mdcx .screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
:where(.mdcx-home) :is(h1, h2, h3),
.mdcx-header, .mdcx-footer { font-family: var(--mdcx-serif); }
:where(.mdcx-home) :is(h1, h2, h3) {
  font-weight: 400; margin: 0; letter-spacing: -0.02em; line-height: 1; color: inherit; text-transform: none;
}
.mdcx-home em, .mdcx-header em, .mdcx-footer em { font-family: var(--mdcx-serif); font-style: italic; font-weight: 400; }
:where(.mdcx-home) :is(p, figure, blockquote) { margin: 0; }
:where(.mdcx-home) img { display: block; max-width: 100%; }
.mdcx-eyebrow + :is(h1, h2) { margin-top: .12em; }
.mdcx-eyebrow {
  font: 600 11px/1.4 var(--mdcx-sans);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin: 0 0 22px;
}
.mdcx-button {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 32px;
  min-height: 52px; padding: 15px 22px;
  background: var(--mdcx-green); color: var(--mdcx-white); border: 1px solid var(--mdcx-green);
  font: 600 14px/1.2 var(--mdcx-sans); text-decoration: none;
  transition: transform .25s, background-color .25s, color .25s;
}
.mdcx-button span[aria-hidden] { font-size: 20px; line-height: 1; }
.mdcx-button:hover { transform: translateY(-3px); background: var(--mdcx-green-3); color: var(--mdcx-white); }
.mdcx-button--olive { background: var(--mdcx-olive); border-color: var(--mdcx-olive); color: var(--mdcx-green); }
.mdcx-button--olive:hover { background: #cbd75b; color: var(--mdcx-green); }
.mdcx-link {
  display: inline-flex; align-items: center; gap: 18px;
  padding: 8px 0; border-bottom: 1px solid currentColor;
  font: 600 14px/1.3 var(--mdcx-sans); color: var(--mdcx-green); text-decoration: none;
}
.mdcx-link:hover { color: var(--mdcx-green-3); }
.mdcx-link--light { color: #e0e8c2; border-color: #8ea06c; }
.mdcx-link--light:hover { color: var(--mdcx-olive); }
.mdcx-round {
  width: 46px; height: 46px; display: inline-grid; place-items: center;
  border: 1px solid currentColor; border-radius: 50%; background: transparent; color: var(--mdcx-green);
  font-size: 20px; cursor: pointer; transition: background .2s, color .2s;
}
.mdcx-round:hover { background: var(--mdcx-green); color: var(--mdcx-white); }

/* Mosaic surface helpers */
.mdcx-weave { background-image: var(--mdcx-weave); background-size: 300px; }

/* 3. Header ---------------------------------------------------------------- */
.mdcx-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--mdcx-green); color: #f2f3e7;
  border-bottom: 1px solid #2f4c35;
}
.admin-bar .mdcx-header { top: 32px; }
.mdcx-header__inner { min-height: 96px; display: flex; align-items: center; gap: 32px; }
.mdcx-header__logo { flex: 0 0 auto; display: block; line-height: 0; }
.mdcx-brand { display: flex; flex-direction: column; align-items: center; font-family: var(--mdcx-serif); line-height: .95; color: #f2f3e7; text-decoration: none; text-align: center; }
.mdcx-brand small { font-size: 15px; letter-spacing: .07em; }
.mdcx-brand strong { font-weight: 400; font-size: 30px; letter-spacing: .03em; }
.mdcx-brand span { margin-top: 8px; font: 8px/1 var(--mdcx-sans); letter-spacing: .3em; }
a.mdcx-brand:hover { color: #f2f3e7; }
.mdcx-header__menu { display: none; }
.mdcx-nav { margin-left: auto; }
.mdcx-nav__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 34px; }
.mdcx-nav__item { position: relative; }
.mdcx-nav__item > a {
  display: inline-block; padding: 12px 0;
  font: 15px/1.2 var(--mdcx-sans); color: #f2f3e7; text-decoration: none;
}
.mdcx-nav__item > a:hover, .mdcx-nav__item > a[aria-current] {
  text-decoration: underline; text-underline-offset: 8px; text-decoration-color: var(--mdcx-olive);
}
.mdcx-nav__sub {
  list-style: none; margin: 0; padding: 10px 0;
  position: absolute; top: 100%; left: -18px; min-width: 220px;
  background: var(--mdcx-stone); box-shadow: 0 18px 40px rgba(1, 39, 24, .22);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .2s, transform .2s, visibility .2s;
}
.mdcx-nav__item:hover .mdcx-nav__sub,
.mdcx-nav__item:focus-within .mdcx-nav__sub { opacity: 1; visibility: visible; transform: none; }
.mdcx-nav__sub a { display: block; padding: 10px 18px; font: 14px/1.3 var(--mdcx-sans); color: var(--mdcx-green); text-decoration: none; }
.mdcx-nav__sub a:hover { background: #e6e9d4; }
.mdcx-header__tools { display: flex; align-items: center; gap: 6px; margin-left: 18px; padding-left: 22px; border-left: 1px solid #3b5a40; }
.mdcx-iconbtn {
  position: relative; display: inline-flex; align-items: center; gap: 9px;
  min-width: 44px; min-height: 44px; justify-content: center;
  color: #f2f3e7; text-decoration: none; font: 14px var(--mdcx-sans);
}
.mdcx-iconbtn:hover { color: var(--mdcx-olive); }
.mdcx-cart { padding: 0 6px 0 10px; border: 1px solid #56704a; }
.mdcx-cart .mdc-cart__count {
  position: static; display: inline-grid; place-items: center;
  min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px;
  background: #2c4a33; color: #f2f3e7; font: 600 12px var(--mdcx-sans); transform: none;
}
.mdcx-cart .mdc-cart__count.is-active { background: var(--mdcx-olive); color: var(--mdcx-green); }

/* 4. Footer ---------------------------------------------------------------- */
.mdcx-footer { background: var(--mdcx-green); color: #cbd5bb; padding: 56px 0 28px; border-top: 1px solid #48613c; }
.mdcx-footer a { color: inherit; text-decoration: none; }
.mdcx-footer a:hover { color: var(--mdcx-olive); text-decoration: underline; text-underline-offset: 5px; }
.mdcx-footer__top { display: flex; align-items: center; gap: 40px; }
.mdcx-footer__logo { font: 33px/1 var(--mdcx-serif); color: #f2f3e7; letter-spacing: -0.01em; white-space: nowrap; }
.mdcx-footer__brand { max-width: 420px; margin: 0; font: italic 22px/1.3 var(--mdcx-serif); color: #e3e9cf; }
.mdcx-footer__nav ul, .mdcx-footer__bottom ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.mdcx-footer__nav { margin-top: 36px; padding-top: 26px; border-top: 1px solid #345138; }
.mdcx-footer__nav ul { gap: 14px 34px; font: 15px/1.4 var(--mdcx-sans); }
.mdcx-footer__bottom {
  margin-top: 30px; padding-top: 20px; border-top: 1px solid #345138;
  display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  font: 13px/1.5 var(--mdcx-sans); color: #a8b899;
}
.mdcx-footer__bottom ul { gap: 8px 24px; }

/* 5. Homepage --------------------------------------------------------------- */
.mdcx-home.mdc-site { background: var(--mdcx-white); }

/* 5.1 Hero: three unequal columns on deep green */
.mdcx-hero {
  display: grid; grid-template-columns: 41% 39% 20%;
  min-height: 740px; background: var(--mdcx-green); color: #f9f9ee; overflow: hidden;
}
.mdcx-hero__intro {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  padding: 72px 36px 58px max(var(--mdcx-gutter), calc((100vw - var(--mdcx-max)) / 2));
}
.mdcx-hero__weave {
  position: absolute; inset: 0; z-index: -1;
  background: var(--mdcx-weave) center / 390px;
  opacity: .14;
  -webkit-mask-image: linear-gradient(125deg, transparent 25%, #000 100%);
  mask-image: linear-gradient(125deg, transparent 25%, #000 100%);
}
.mdcx-hero__intro .mdcx-eyebrow { color: #cdd79c; }
.mdcx-hero__title { font-size: clamp(64px, 6.7vw, 108px); line-height: .92; letter-spacing: -0.025em; }
.mdcx-hero__title em { display: block; color: var(--mdcx-olive); padding-left: .3em; }
.mdcx-hero__text { max-width: 330px; margin: 30px 0 30px; font-size: 16px; line-height: 1.75; color: var(--mdcx-on-green); }
.mdcx-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.mdcx-hero__origin { display: flex; align-items: center; gap: 16px; margin-top: 52px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #c5d3b1; line-height: 1.6; }
.mdcx-hero__origin b { font-weight: 400; opacity: .8; }
.mdcx-star { font-size: 29px; color: var(--mdcx-olive); }

.mdcx-hero__gallery {
  position: relative; isolation: isolate; min-width: 0;
  display: flex; flex-direction: column; padding: 28px 24px 26px;
  background: var(--mdcx-diamonds) center / 280px;
  border-inline: 1px solid #a6b27a;
}
.mdcx-hero__gallery::before { content: ''; position: absolute; inset: 0; background: rgba(226, 214, 171, .13); z-index: -1; }
.mdcx-hero__caption {
  display: flex; justify-content: space-between; gap: 10px;
  margin-bottom: 20px; padding: 11px 13px; background: #f5f1df; color: var(--mdcx-green);
  font: 600 11px/1.3 var(--mdcx-sans); letter-spacing: .12em; text-transform: uppercase;
}
.mdcx-hero__caption a { color: inherit; text-decoration: none; }
.mdcx-hero__window { position: relative; flex: 1; min-height: 470px; overflow: hidden; border: 8px solid #f7f4e7; box-shadow: 0 14px 30px rgba(1, 39, 24, .2); background: #e9e3cc; }
.mdcx-hero__frame { position: absolute; inset: 0; opacity: 0; visibility: hidden; transform: translateY(20px); transition: opacity .8s, transform 1.1s, visibility .8s; overflow: hidden; }
.mdcx-hero__frame.is-selected { opacity: 1; visibility: visible; transform: none; }
.mdcx-hero__frame img { width: 100%; height: 100%; object-fit: cover; object-position: 51% center; transform: scale(1.035); transition: transform 6s ease-out; }
.mdcx-hero__frame.is-selected img { transform: scale(1.09); }
.mdcx-hero__footer { position: relative; margin-top: 20px; padding: 18px 19px 14px; background: var(--mdcx-green); color: #f6f6eb; }
.mdcx-hero__label { margin: 0; }
.mdcx-hero__label em { display: block; font-size: 29px; line-height: 1.05; margin-bottom: 7px; }
.mdcx-hero__label span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #bbcba4; }
.mdcx-hero__controls { display: flex; align-items: center; gap: 16px; margin-top: 14px; font-size: 13px; color: #c8d4b4; }
.mdcx-hero__controls button {
  width: 40px; height: 40px; display: grid; place-items: center; padding: 0;
  background: none; border: 1px solid #6d8258; color: #e2eace; font-size: 18px; cursor: pointer;
}
.mdcx-hero__controls button:hover { background: #476136; }
.mdcx-hero__dots { position: absolute; right: 19px; bottom: 18px; display: flex; gap: 4px; }
.mdcx-hero__dots button { width: 28px; height: 32px; padding: 0; border: 0; background: none; position: relative; cursor: pointer; }
.mdcx-hero__dots button::after { content: ''; position: absolute; left: 3px; right: 3px; top: 15px; height: 2px; background: #57704b; }
.mdcx-hero__dots button[aria-pressed="true"]::after { background: var(--mdcx-olive); height: 3px; }

.mdcx-hero__roots {
  position: relative; isolation: isolate; min-width: 0;
  display: flex; flex-direction: column; padding: 42px 22px 34px;
  background: var(--mdcx-fans) center / 250px;
}
.mdcx-hero__roots::before { content: ''; position: absolute; inset: 0; background: rgba(22, 61, 41, .2); z-index: -1; }
.mdcx-hero__roots-label { align-self: flex-start; margin: 0 0 30px; padding: 8px 10px; background: var(--mdcx-green); color: #e9e8d2; font: 600 11px var(--mdcx-sans); letter-spacing: .14em; text-transform: uppercase; }
.mdcx-hero__roots-window { position: relative; height: 365px; overflow: hidden; border: 6px solid #d5cc9c; box-shadow: 0 15px 30px rgba(1, 39, 24, .27); background: #33452b; }
.mdcx-hero__roots-window img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.03); transition: opacity 1.3s, transform 6s; }
.mdcx-hero__roots-window img.is-visible { opacity: 1; transform: scale(1.08); }
.mdcx-hero__roots-card {
  flex: 1; min-height: 160px; margin-top: 28px; padding: 22px 17px;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  background: #d5df86; color: var(--mdcx-green);
}
.mdcx-hero__roots-card .mdcx-eyebrow { margin: 0; font-size: 10px; }
.mdcx-hero__roots-title { margin: 16px 0 14px; font: 35px/1.02 var(--mdcx-serif); letter-spacing: -0.02em; }
.mdcx-hero__roots-card a { font-size: 22px; line-height: 1; padding: 0 0 4px; border-bottom: 1px solid; color: inherit; text-decoration: none; min-width: 44px; }

/* 5.2 Collection */
.mdcx-collection { padding: 100px 0 90px; overflow: hidden; }
.mdcx-collection__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.mdcx-collection__head .mdcx-eyebrow { color: #6d765e; }
.mdcx-collection__head h2 { font-size: clamp(46px, 5vw, 68px); max-width: 720px; }
.mdcx-collection__head h2 em { display: inline-block; padding-left: 1.2em; }
.mdcx-collection__aside { max-width: 360px; display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.mdcx-collection__aside p { font-size: 16px; line-height: 1.7; color: var(--mdcx-muted); }
.mdcx-rail__controls { display: flex; gap: 10px; }
.mdcx-rail {
  list-style: none; margin: 0;
  display: flex; gap: 31px; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: thin; scrollbar-color: #a5b085 transparent;
  padding: 26px max(var(--mdcx-gutter), calc((100vw - var(--mdcx-max)) / 2)) 40px;
  scroll-padding-inline: max(var(--mdcx-gutter), calc((100vw - var(--mdcx-max)) / 2));
  cursor: grab; overscroll-behavior-x: contain;
}
.mdcx-rail.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.mdcx-card { flex: 0 0 290px; scroll-snap-align: start; margin-top: 30px; }
.mdcx-card:nth-child(even) { margin-top: 90px; }
.mdcx-card:nth-child(3n) { flex-basis: 330px; }
.mdcx-card__link { display: flex; flex-direction: column; color: var(--mdcx-green); text-decoration: none; height: 100%; }
.mdcx-card__image { position: relative; display: block; height: 360px; background: #fafaf7; border: 1px solid #eaeee3; overflow: hidden; }
.mdcx-card__image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transition: transform .35s; -webkit-user-drag: none; }
.mdcx-card__link:hover .mdcx-card__image img { transform: scale(1.03); }
.mdcx-card__no { position: absolute; top: 14px; left: 17px; z-index: 1; font: italic 19px var(--mdcx-serif); color: #788269; }
.mdcx-card__meta { display: flex; justify-content: space-between; margin-top: 20px; font: 600 11px var(--mdcx-sans); letter-spacing: .12em; text-transform: uppercase; color: #6e775d; }
.mdcx-card__title { margin-top: 8px; font: 31px/1.05 var(--mdcx-serif); letter-spacing: -0.015em; }
.mdcx-card__name { margin-top: 8px; font-size: 14px; line-height: 1.45; color: var(--mdcx-muted); }
.mdcx-card__foot { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: auto; padding: 16px 0 10px; border-bottom: 1px solid var(--mdcx-line); font-size: 14px; }
.mdcx-card__price { font-weight: 600; }
.mdcx-card__price del { opacity: .6; margin-right: 6px; }
.mdcx-card__price ins { text-decoration: none; }
.mdcx-card__cta { white-space: nowrap; }
.mdcx-card__link:hover .mdcx-card__cta { text-decoration: underline; text-underline-offset: 4px; }
.mdcx-collection__links { display: flex; flex-wrap: wrap; gap: 14px 36px; padding-top: 10px; }
.mdcx-formats {
  margin-top: 64px; padding: 40px 0 0; border-top: 1px solid var(--mdcx-line);
  display: grid; grid-template-columns: minmax(220px, .9fr) 2.4fr; gap: 28px 60px; align-items: start;
}
.mdcx-formats__title { font-size: clamp(32px, 3.2vw, 44px); line-height: 1.02; }
.mdcx-formats__title em { display: block; color: #58703c; }
.mdcx-formats__list { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }
.mdcx-formats__list div:nth-child(even) { margin-top: 26px; }
.mdcx-formats__list dt { font: 24px/1.1 var(--mdcx-serif); padding-bottom: 10px; border-bottom: 1px solid var(--mdcx-gold); margin-bottom: 10px; }
.mdcx-formats__list dd { margin: 0; font-size: 15px; line-height: 1.6; color: var(--mdcx-muted); }
.mdcx-formats > .mdcx-link { grid-column: 2; justify-self: start; }

/* 5.3 Heritage */
.mdcx-heritage { position: relative; isolation: isolate; overflow: hidden; padding: 85px 0 95px; background: var(--mdcx-green-2); color: #f3f5e8; }
.mdcx-heritage__floor {
  position: absolute; z-index: -1; left: -85px; top: 55px; width: 60%; height: 680px; opacity: .53;
  background: var(--mdcx-weave) left top / 380px;
  clip-path: polygon(0 0, 100% 0, 100% 18%, 92% 18%, 92% 36%, 84% 36%, 84% 54%, 76% 54%, 76% 74%, 66% 74%, 66% 100%, 0 100%);
}
.mdcx-heritage__layout { position: relative; min-height: 740px; }
.mdcx-heritage__main { position: absolute; top: 45px; left: 2%; width: 37%; height: 555px; border: 9px solid #d2c6a0; box-shadow: 0 12px 45px rgba(0, 0, 0, .27); }
.mdcx-heritage__stack { position: relative; width: 100%; height: 100%; overflow: hidden; background: #33452b; }
.mdcx-heritage__stack img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mdcx-heritage__stack .mdcx-heritage__art { opacity: 0; transition: opacity 1.1s; }
.mdcx-heritage__main.is-mosaic .mdcx-heritage__art { opacity: 1; }
.mdcx-heritage__toggle {
  position: absolute; z-index: 3; left: 16px; right: 16px; bottom: 18px;
  display: flex; justify-content: space-between; align-items: center; gap: 15px;
  min-height: 46px; padding: 12px 14px;
  background: rgba(244, 243, 230, .94); border: 1px solid #e0d8b1; color: var(--mdcx-green);
  font: 600 14px var(--mdcx-sans); cursor: pointer; text-align: left;
}
.mdcx-heritage__toggle:hover { background: var(--mdcx-olive); }
.mdcx-heritage__small { position: absolute; z-index: 2; top: 442px; left: 29%; width: 27%; height: 218px; padding: 7px; background: var(--mdcx-white); transform: rotate(3deg); box-shadow: 0 15px 35px rgba(0, 0, 0, .27); }
.mdcx-heritage__small img { width: 100%; height: 100%; object-fit: cover; }
.mdcx-heritage__copy { position: relative; z-index: 3; margin-left: 59%; max-width: 480px; padding-top: 3px; }
.mdcx-heritage__copy .mdcx-eyebrow { color: #b6c991; }
.mdcx-heritage__copy h2 { font-size: clamp(48px, 5vw, 70px); line-height: .98; }
.mdcx-heritage__copy h2 em { display: block; color: var(--mdcx-olive); font-size: .8em; padding-left: .35em; margin-top: 8px; }
.mdcx-heritage__copy p { margin: 28px 0 28px 24px; max-width: 380px; font-size: 16px; line-height: 1.8; color: #c4d0b7; }
.mdcx-heritage__copy .mdcx-link { margin-left: 24px; }
.mdcx-heritage__tile { position: absolute; right: 10px; bottom: 0; width: 100px; height: 100px; background: var(--mdcx-fans) center / 180px; opacity: .8; transform: rotate(6deg); }
.mdcx-quote { position: relative; margin: 32px 0 0 44%; max-width: 560px; text-align: center; font: italic 39px/1.15 var(--mdcx-serif); color: #d5ddba; }
.mdcx-quote::before { content: '“'; position: absolute; left: -25px; top: -48px; font-size: 110px; color: rgba(174, 191, 105, .4); }

/* 5.4 Flavours: the medallion lives here only */
.mdcx-flavours { position: relative; isolation: isolate; overflow: hidden; padding: 100px 0 85px; background: var(--mdcx-green); color: var(--mdcx-white); border-top: 1px solid #3d5431; }
.mdcx-flavours__ring { position: absolute; z-index: -1; right: -160px; top: -235px; width: 820px; height: 820px; background: var(--mdcx-ring) center / contain no-repeat; opacity: .29; }
.mdcx-flavours__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; }
.mdcx-flavours__head .mdcx-eyebrow { color: #c6d397; }
.mdcx-flavours__head h2 { font-size: clamp(52px, 5.4vw, 74px); line-height: .95; }
.mdcx-flavours__head h2 em { display: block; color: var(--mdcx-olive); padding-left: 1.1em; }
.mdcx-flavours__head > p { max-width: 280px; padding-bottom: 6px; font-size: 16px; line-height: 1.6; color: #c1cfb8; }
.mdcx-flavours__stage { position: relative; height: 660px; margin-top: 50px; }
.mdcx-flavours__scene { position: absolute; left: 0; top: 35px; width: 56%; height: 430px; clip-path: polygon(0 0, 88% 0, 88% 11%, 100% 11%, 100% 100%, 8% 100%, 8% 88%, 0 88%); }
.mdcx-flavours__scene img { width: 100%; height: 100%; object-fit: cover; }
.mdcx-flavours__spot { position: absolute; right: 14%; top: 0; width: 275px; height: 385px; background: #fafaf7; transform: rotate(4deg); box-shadow: 0 20px 60px rgba(0, 0, 0, .2); transition: transform .6s; }
.mdcx-flavours__spot.is-swapping { transform: rotate(0) translateY(-5px); }
.mdcx-flavours__bottle { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.mdcx-flavours__word { position: absolute; z-index: 2; right: 4%; top: 285px; font: italic 90px/1 var(--mdcx-serif); text-shadow: 0 3px 15px rgba(1, 39, 24, .6); transition: color .5s; pointer-events: none; }
.mdcx-flavours__caption { position: absolute; left: 50px; bottom: 5px; max-width: 260px; font: italic 32px/1.15 var(--mdcx-serif); color: #d7deb5; }
.mdcx-flavours__detail { position: absolute; right: 0; bottom: 0; width: 39%; padding-left: 8px; }
.mdcx-flavours__detail .mdcx-eyebrow { margin: 0; color: #e4ead2; }
.mdcx-flavours__text { max-width: 330px; min-height: 52px; margin: 12px 0 20px !important; font-size: 15px; line-height: 1.6; color: #d6deca; }
.mdcx-flavours__tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.mdcx-flavours__tabs a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 9px 16px;
  border: 1px solid #7e8e6c; color: #d3dec1; font-size: 14px; text-decoration: none;
  transition: background .3s, color .3s;
}
.mdcx-flavours__tabs a:hover { border-color: var(--mdcx-olive); color: var(--mdcx-white); }
.mdcx-flavours__tabs a[aria-pressed="true"] { background: var(--mdcx-olive); border-color: var(--mdcx-olive); color: var(--mdcx-green); }
.mdcx-flavours__bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 26px; padding-top: 22px; border-top: 1px solid #385638; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #b8c6a5; }
.mdcx-flavours__bottom .mdcx-link { letter-spacing: 0; text-transform: none; }
.mdcx-frieze { height: 40px; background: var(--mdcx-frieze) center / 160px 40px; }

/* 5.5 En cuisine */
.mdcx-cuisine { position: relative; isolation: isolate; overflow: hidden; padding: 95px 0 90px; }
.mdcx-cuisine__heading { max-width: 820px; position: relative; z-index: 2; }
.mdcx-cuisine__heading .mdcx-eyebrow { color: #6d765e; }
.mdcx-cuisine__heading h2 { font-size: clamp(52px, 6vw, 80px); }
.mdcx-cuisine__heading h2 em { display: block; padding-left: 1.8em; }
.mdcx-cuisine__collage { position: relative; height: 625px; margin-top: 5px; }
.mdcx-cuisine__tesserae { position: absolute; z-index: -1; left: -75px; top: 145px; width: 360px; height: 430px; background: var(--mdcx-fans) center / 250px; clip-path: polygon(0 0, 65% 0, 65% 14%, 82% 14%, 82% 28%, 100% 28%, 100% 100%, 0 100%); }
.mdcx-cuisine__picture { position: absolute; left: 20%; right: 4%; top: 42px; height: 510px; clip-path: polygon(0 0, 93% 0, 93% 10%, 100% 10%, 100% 100%, 10% 100%, 10% 90%, 0 90%); }
.mdcx-cuisine__picture img { width: 100%; height: 100%; object-fit: cover; object-position: center 61%; }
.mdcx-cuisine__stamp {
  position: absolute; right: 0; bottom: 10px; width: 150px; height: 150px; display: grid; place-content: center; text-align: center;
  background: var(--mdcx-green); color: #e2e9b7; font: italic 32px/.98 var(--mdcx-serif);
  clip-path: polygon(12% 0, 100% 0, 100% 88%, 88% 88%, 88% 100%, 0 100%, 0 12%, 12% 12%);
}
.mdcx-cuisine__body { display: grid; grid-template-columns: minmax(260px, 1fr) 1.6fr; gap: 40px 70px; margin-top: 30px; }
.mdcx-cuisine__intro p { margin-bottom: 22px; font-size: 17px; line-height: 1.75; color: var(--mdcx-muted); max-width: 420px; }
.mdcx-recipes { list-style: none; margin: 0; padding: 0; }
.mdcx-recipes__item:nth-child(2) { margin-left: 12%; }
.mdcx-recipes__item:nth-child(3) { margin-left: 5%; }
.mdcx-recipes__item a {
  display: grid; grid-template-columns: 48px 1fr auto; gap: 8px 18px; align-items: baseline;
  padding: 20px 0; border-bottom: 1px solid var(--mdcx-line); color: var(--mdcx-green); text-decoration: none;
}
.mdcx-recipes__item:first-child a { border-top: 1px solid var(--mdcx-line); }
.mdcx-recipes__no { font: italic 20px var(--mdcx-serif); color: var(--mdcx-gold); }
.mdcx-recipes__title { font: 27px/1.12 var(--mdcx-serif); letter-spacing: -0.01em; }
.mdcx-recipes__meta { font-size: 13px; color: var(--mdcx-muted); white-space: nowrap; }
.mdcx-recipes__item a:hover .mdcx-recipes__title { color: #58703c; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

/* 5.6 Closing panel */
.mdcx-closing {
  padding: 90px 0 100px; color: #f6f5e6;
  background-color: var(--mdcx-green);
  background-image: linear-gradient(90deg, rgba(1, 39, 24, .93) 0%, rgba(1, 39, 24, .9) 60%, rgba(1, 39, 24, .3) 100%), var(--mdcx-weave);
  background-size: auto, 330px;
}
.mdcx-closing .mdcx-eyebrow { color: #c1cd9d; }
.mdcx-closing h2 { font-size: clamp(46px, 5vw, 68px); }
.mdcx-closing h2 em { display: block; color: var(--mdcx-olive); }
.mdcx-closing p:not(.mdcx-eyebrow) { max-width: 440px; margin: 24px 0 30px; font-size: 17px; line-height: 1.7; color: var(--mdcx-on-green); }
.mdcx-closing__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; }

/* One-time reveals (only when JS added .mdcx-motion and motion is allowed) */
/* Movement only, never hidden: text stays readable before the observer fires
   (fast scroll, full-page captures, print). Boss 2026-10-12. */
.mdcx-motion .mdcx-reveal:not(.is-seen) { transform: translateY(24px); }
.mdcx-motion .mdcx-reveal { transition: transform 1s cubic-bezier(.2, .75, .25, 1); }

/* 6. Responsive ------------------------------------------------------------ */
@media (min-width: 1650px) {
  .mdcx-hero { min-height: 800px; }
  .mdcx-hero__gallery { padding: 35px 33px; }
  .mdcx-hero__window { min-height: 515px; }
  .mdcx-hero__roots-window { height: 400px; }
  .mdcx-hero__roots { padding: 48px 30px; }
}
@media (max-width: 1150px) {
  :root { --mdcx-gutter: 32px; }
  .mdcx-hero { grid-template-columns: 39% 39% 22%; min-height: 690px; }
  .mdcx-hero__intro { padding: 50px 22px 45px 32px; }
  .mdcx-hero__title { font-size: 72px; }
  .mdcx-hero__gallery { padding: 24px 17px 25px; }
  .mdcx-hero__window { min-height: 430px; border-width: 6px; }
  .mdcx-hero__roots { padding: 35px 15px 28px; }
  .mdcx-hero__roots-window { height: 330px; }
  .mdcx-hero__roots-title { font-size: 30px; }
  .mdcx-hero__label em { font-size: 25px; }
  .mdcx-heritage__copy { margin-left: 58%; }
  .mdcx-heritage__copy p, .mdcx-heritage__copy .mdcx-link { margin-left: 10px; }
  .mdcx-flavours__spot { right: 8%; width: 250px; }
  .mdcx-flavours__word { right: 0; font-size: 78px; }
  .mdcx-cuisine__picture { left: 17%; right: 3%; }
  .mdcx-formats { grid-template-columns: 1fr; }
  .mdcx-formats > .mdcx-link { grid-column: 1; }
  .mdcx-formats__list { grid-template-columns: repeat(2, 1fr); }
  .mdcx-nav__list { gap: 24px; }
}
@media (max-width: 960px) {
  .mdcx-header__inner { min-height: 82px; gap: 14px; }
  .mdcx-brand small { font-size: 13px; } .mdcx-brand strong { font-size: 25px; } .mdcx-brand span { font-size: 7px; letter-spacing: .22em; }
  .mdcx-header__menu {
    display: inline-flex; align-items: center; gap: 10px; order: -1;
    min-height: 44px; padding: 8px 12px; background: transparent; border: 1px solid #56704a; color: #f2f3e7;
    font: 14px var(--mdcx-sans); cursor: pointer;
  }
  .mdcx-burger { position: relative; width: 18px; height: 12px; border-block: 1.5px solid currentColor; }
  .mdcx-burger::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1.5px solid currentColor; transform: translateY(-50%); }
  .mdcx-header__logo { margin-inline: auto; }
  .mdcx-header__tools { margin-left: 0; padding-left: 0; border: 0; }
  .mdcx-cart__label { display: none; }
  .mdcx-cart { border: 0; padding: 0; }
  .mdcx-nav {
    position: absolute; left: 0; right: 0; top: 100%; margin: 0;
    background: var(--mdcx-stone); box-shadow: 0 18px 30px rgba(1, 39, 24, .18);
    display: none; padding: 10px var(--mdcx-gutter) 22px;
  }
  .mdc-nav-open .mdcx-nav { display: block; }
  .mdcx-nav__list { flex-direction: column; gap: 0; }
  .mdcx-nav__item { border-bottom: 1px solid var(--mdcx-line); }
  .mdcx-nav__item > a { display: block; padding: 16px 0; font: 26px/1.1 var(--mdcx-serif); color: var(--mdcx-green); }
  .mdcx-nav__sub { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; padding: 0 0 12px 14px; }
  .mdcx-nav__sub a { padding: 9px 0; font-size: 15px; }
  .mdcx-nav__sub a:hover { background: none; text-decoration: underline; }
}
@media (max-width: 900px) and (min-width: 761px) {
  .mdcx-hero { grid-template-columns: 44% 56%; }
  .mdcx-hero__intro { min-height: 640px; }
  .mdcx-hero__roots { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 25px 32px; }
  .mdcx-hero__roots-label { position: absolute; left: 46px; top: 38px; z-index: 2; }
  .mdcx-hero__roots-window { height: 250px; }
  .mdcx-hero__roots-card { margin: 0; }
}
@media (max-width: 760px) {
  :root { --mdcx-gutter: 20px; }
  .mdcx-eyebrow { font-size: 10px; letter-spacing: .13em; margin-bottom: 18px; }
  .mdcx-hero { grid-template-columns: 1fr; min-height: 0; }
  .mdcx-hero__intro { padding: 44px 24px 40px; }
  .mdcx-hero__title { font-size: clamp(56px, 18vw, 80px); line-height: .9; }
  .mdcx-hero__text { margin: 22px 0 24px; font-size: 16px; }
  .mdcx-hero__origin { display: none; }
  .mdcx-hero__gallery { padding: 22px 20px; border: 0; background-size: 230px; }
  .mdcx-hero__window { height: 340px; min-height: 340px; flex: none; border-width: 6px; }
  .mdcx-hero__label em { font-size: 26px; }
  .mdcx-hero__roots { display: grid; grid-template-columns: 47% 53%; padding: 22px 20px; background-size: 205px; min-height: 0; }
  .mdcx-hero__roots-label { position: absolute; top: 30px; left: 30px; z-index: 2; margin: 0; padding: 5px 7px; font-size: 9px; letter-spacing: .08em; }
  .mdcx-hero__roots-window { height: 250px; border-width: 5px; }
  .mdcx-hero__roots-card { margin: 24px 0 0 -1px; padding: 18px 15px; min-height: 0; }
  .mdcx-hero__roots-title { font-size: 30px; }
  .mdcx-collection { padding: 60px 0 55px; }
  .mdcx-collection__head { flex-direction: column; align-items: flex-start; gap: 20px; }
  .mdcx-collection__head h2 em { padding-left: .5em; }
  .mdcx-rail { gap: 20px; padding: 14px 20px 26px; scroll-padding-inline: 20px; }
  .mdcx-card, .mdcx-card:nth-child(3n) { flex-basis: 74vw; max-width: 290px; }
  .mdcx-card:nth-child(even) { margin-top: 56px; }
  .mdcx-card__image { height: 300px; }
  .mdcx-card__title { font-size: 28px; }
  .mdcx-formats { margin-top: 44px; }
  .mdcx-formats__list { grid-template-columns: 1fr; gap: 18px; }
  .mdcx-formats__list div:nth-child(even) { margin-top: 0; margin-left: 12%; }
  .mdcx-heritage { padding: 55px 0 60px; }
  .mdcx-heritage__floor { width: 115%; height: 560px; top: 38px; left: -85px; background-size: 265px; }
  .mdcx-heritage__layout { min-height: 0; padding-top: 540px; }
  .mdcx-heritage__main { top: 0; left: 2%; width: 77%; height: 400px; border-width: 6px; }
  .mdcx-heritage__toggle { left: 10px; right: 10px; bottom: 12px; font-size: 13px; padding: 10px; }
  .mdcx-heritage__small { top: 335px; left: 46%; width: 53%; height: 170px; padding: 6px; }
  .mdcx-heritage__copy { margin-left: 0; max-width: none; }
  .mdcx-heritage__copy h2 { font-size: clamp(42px, 12vw, 56px); }
  .mdcx-heritage__copy p { margin-left: 16px; }
  .mdcx-heritage__copy .mdcx-link { margin-left: 16px; }
  .mdcx-heritage__tile { width: 64px; height: 64px; right: -19px; bottom: -60px; }
  .mdcx-quote { margin: 48px auto 0; max-width: 300px; font-size: 30px; }
  .mdcx-flavours { padding: 62px 0 55px; }
  .mdcx-flavours__head { display: block; }
  .mdcx-flavours__head h2 { font-size: clamp(46px, 13vw, 57px); }
  .mdcx-flavours__head > p { margin: 22px 0 0 24px; }
  .mdcx-flavours__ring { width: 620px; height: 620px; right: -260px; top: 45px; }
  .mdcx-flavours__stage { height: auto; margin-top: 28px; display: grid; grid-template-columns: 1fr; }
  .mdcx-flavours__scene { position: relative; left: -5%; top: 0; width: 88%; height: 260px; }
  .mdcx-flavours__spot { position: relative; right: auto; top: auto; justify-self: end; width: 170px; height: 245px; margin-top: -70px; transform: rotate(3deg); }
  .mdcx-flavours__word { position: relative; right: auto; top: auto; margin-top: -40px; font-size: 60px; }
  .mdcx-flavours__caption { display: none; }
  .mdcx-flavours__detail { position: relative; width: 100%; padding: 0; margin-top: 18px; }
  .mdcx-flavours__bottom { flex-direction: column; align-items: flex-start; }
  .mdcx-cuisine { padding: 60px 0; }
  .mdcx-cuisine__heading h2 { font-size: clamp(44px, 12vw, 54px); }
  .mdcx-cuisine__heading h2 em { padding-left: .6em; }
  .mdcx-cuisine__collage { height: 400px; margin-top: 15px; }
  .mdcx-cuisine__picture { top: 25px; left: 9%; right: 0; height: 310px; clip-path: polygon(0 0, 91% 0, 91% 10%, 100% 10%, 100% 100%, 10% 100%, 10% 90%, 0 90%); }
  .mdcx-cuisine__tesserae { width: 180px; height: 280px; left: -65px; top: 100px; background-size: 200px; }
  .mdcx-cuisine__stamp { width: 105px; height: 105px; font-size: 22px; bottom: 30px; right: -5px; }
  .mdcx-cuisine__body { grid-template-columns: 1fr; }
  .mdcx-recipes__item:nth-child(n) { margin-left: 0; }
  .mdcx-recipes__item:nth-child(2) { margin-left: 8%; }
  .mdcx-recipes__item a { grid-template-columns: 36px 1fr; }
  .mdcx-recipes__meta { grid-column: 2; white-space: normal; }
  .mdcx-recipes__title { font-size: 23px; }
  .mdcx-closing { padding: 58px 0 66px; background-size: auto, 240px; }
  .mdcx-footer__top { flex-direction: column; align-items: flex-start; gap: 20px; }
  .mdcx-footer__brand { font-size: 19px; }
  .mdcx-footer__nav ul { flex-direction: column; gap: 12px; }
  .mdcx-footer__bottom { flex-direction: column; }
}
@media (max-width: 370px) {
  .mdcx-hero__title { font-size: 52px; }
  .mdcx-hero__roots-title { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .mdcx *, .mdcx *::before, .mdcx *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .mdcx-hero__frame, .mdcx-hero__frame img, .mdcx-hero__roots-window img { transform: none !important; }
  .mdcx-motion .mdcx-reveal { opacity: 1; transform: none; }
}

/* 7. Inner pages: shop, product, editorial, account ------------------------
   Archivo / DM Sans now resolve to Arial and Playfair to Maison (font faces
   in inc/mosaic.php), so labels and body text follow automatically. Titles
   lose the old uppercase 800 treatment for the high-contrast serif. */
:root { --mdc-radius-pill: 2px; --mdc-radius-card: 0px; }
/* :not(.mdcx-home *) keeps the Direction 03 templates on their own sizing and colours. */
body.mdcx :is(h1, h2, h3, .mdc-display, .mdc-title):not(.mdcx-home *) {
  font-family: var(--mdcx-serif);
  font-weight: 400;
  text-transform: none;
  letter-spacing: -0.015em;
  line-height: 1.02;
}
body.mdcx :is(h1, h2, h3, .mdc-display, .mdc-title):not(.mdcx-home *) em { font-style: italic; }
:where(body.mdcx) :where(h1, h2, h3) em { color: #58703c; }
body.mdcx :is(h4, h5, h6) { font-family: var(--mdcx-sans); font-weight: 600; text-transform: none; letter-spacing: 0; }
body.mdcx .mdc-site:not(.mdcx-home) { background: var(--mdcx-white); }
body.mdcx .mdc-eyebrow { font-family: var(--mdcx-sans); font-weight: 600; letter-spacing: .14em; }
body.mdcx .mdc-btn { font-family: var(--mdcx-sans); font-weight: 600; letter-spacing: .01em; text-transform: none; }

/* Page heroes (editorial pages rendered by page.php): green band with the weave */
body.mdcx .mdc-page-hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--mdcx-green); color: #f3f5e8;
}
body.mdcx .mdc-page-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: var(--mdcx-weave) center / 340px; opacity: .16;
  -webkit-mask-image: linear-gradient(110deg, transparent 20%, #000 95%);
  mask-image: linear-gradient(110deg, transparent 20%, #000 95%);
}
body.mdcx .mdc-page-hero .mdc-eyebrow { color: #cdd79c; }
body.mdcx .mdc-page-hero__title { color: #f9f9ee; font-size: clamp(44px, 5.4vw, 82px); }
body.mdcx .mdc-page-hero__intro { color: var(--mdcx-on-green); }
body.mdcx .mdc-page-hero__media img { border: 8px solid #f7f4e7; box-shadow: 0 14px 30px rgba(0, 0, 0, .25); }

/* Shop intro (template-parts/shop-hero.php) */
.mdcx-shop-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--mdcx-green); color: #f3f5e8; }
.mdcx-shop-hero__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center; min-height: 420px; }
.mdcx-shop-hero__weave { position: absolute; inset: 0; z-index: -1; background: var(--mdcx-weave) center / 360px; opacity: .14; -webkit-mask-image: linear-gradient(115deg, transparent 15%, #000 90%); mask-image: linear-gradient(115deg, transparent 15%, #000 90%); }
.mdcx-shop-hero__copy { padding: 64px 0; }
.mdcx-shop-hero__copy .mdcx-eyebrow { color: #cdd79c; }
body.mdcx .mdcx-shop-hero h1 { font-size: clamp(42px, 4.8vw, 72px); line-height: .98; color: #f9f9ee; max-width: 13ch; }
body.mdcx .mdcx-shop-hero h1 em { display: block; color: var(--mdcx-olive); }
.mdcx-shop-hero__copy > p { max-width: 460px; margin: 22px 0 0; font-size: 17px; line-height: 1.7; color: var(--mdcx-on-green); }
.mdcx-shop-hero__lines { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 26px; margin: 30px 0 0; padding: 22px 0 0; border-top: 1px solid #3d5a40; max-width: 560px; }
.mdcx-shop-hero__lines a { display: block; color: #f3f5e8; text-decoration: none; }
.mdcx-shop-hero__lines strong { display: block; font: 26px/1.1 var(--mdcx-serif); font-weight: 400; margin-bottom: 6px; }
.mdcx-shop-hero__lines span { display: block; font-size: 14px; line-height: 1.55; color: #c4d0b7; }
.mdcx-shop-hero__lines a:hover strong { color: var(--mdcx-olive); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.mdcx-shop-hero__media { position: relative; align-self: stretch; display: flex; align-items: center; padding: 34px 0; }
.mdcx-shop-hero__media::before { content: ''; position: absolute; top: 0; bottom: 0; left: 8%; right: calc(-1 * max(var(--mdcx-gutter), (100vw - var(--mdcx-max)) / 2)); background: var(--mdcx-diamonds) center / 260px; z-index: -1; }
.mdcx-shop-hero__media img { position: relative; width: 100%; height: 330px; object-fit: cover; object-position: 60% center; border: 8px solid #f7f4e7; box-shadow: 0 14px 30px rgba(1, 39, 24, .3); }

/* Catalogue + cards: calm surfaces, explicit names, no pattern behind products */
body.mdcx .mdc-catalog-card__heading h3 { font-size: 26px; line-height: 1.05; }
body.mdcx :is(.mdc-catalog__editorial-title, .mdc-guide__title, .mdc-trade__title) { font-size: clamp(36px, 4vw, 58px); }
body.mdcx .mdc-guide { background: var(--mdcx-stone); }
body.mdcx .mdc-trade { background-color: var(--mdcx-green); background-image: linear-gradient(90deg, rgba(1, 39, 24, .94), rgba(1, 39, 24, .88) 60%, rgba(1, 39, 24, .45)), var(--mdcx-weave); background-size: auto, 320px; color: #f3f5e8; }
body.mdcx .mdc-trade :is(.mdc-trade__title, p) { color: #f3f5e8; }

/* Product page: large untouched packshot, serif title, mosaic only at the edge */
body.mdcx .mdc-single-product h1.product_title { font-family: var(--mdcx-serif); font-weight: 400; text-transform: none; font-size: clamp(36px, 3.6vw, 54px); line-height: 1.02; letter-spacing: -0.015em; }
body.mdcx .mdc-single-product :is(.section-title, .card--editorial h3) { font-family: var(--mdcx-serif); font-weight: 400; }

@media (max-width: 900px) {
  .mdcx-shop-hero__grid { grid-template-columns: 1fr; gap: 0; min-height: 0; }
  .mdcx-shop-hero__copy { padding: 46px 0 10px; }
  .mdcx-shop-hero__media { padding: 20px 0 34px; }
  .mdcx-shop-hero__media::before { left: calc(-1 * var(--mdcx-gutter)); right: calc(-1 * var(--mdcx-gutter)); top: 50px; }
  .mdcx-shop-hero__media img { height: 230px; }
}
@media (max-width: 560px) {
  .mdcx-shop-hero__lines { grid-template-columns: 1fr; }
}
body.mdcx .mdc-guide__options { grid-template-columns: repeat(4, 1fr); }
body.mdcx .mdc-guide__option:nth-child(even) { margin-top: 28px; }
@media (max-width: 1100px) { body.mdcx .mdc-guide__options { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { body.mdcx .mdc-guide__options { grid-template-columns: 1fr; } body.mdcx .mdc-guide__option:nth-child(even) { margin-top: 0; } }
/* Shop intro runs edge to edge out of the shop shell container. */
body.mdcx.woocommerce-shop .mdc-shop-shell { padding-top: 0; background: var(--mdcx-white); }
.mdcx-shop-hero { margin-inline: calc(50% - 50vw); margin-bottom: clamp(36px, 5vw, 64px); }
body.mdcx .mdc-single-product .story h3 { font-size: 24px; line-height: 1.1; margin: 28px 0 10px; }

/* 8. Editorial templates: Notre héritage, En cuisine, recipes --------------- */
.mdcx-pagehero { position: relative; isolation: isolate; overflow: hidden; background: var(--mdcx-green); color: #f3f5e8; }
.mdcx-pagehero__weave { position: absolute; inset: 0; z-index: -1; background: var(--mdcx-weave) center / 380px; opacity: .14; -webkit-mask-image: linear-gradient(120deg, transparent 20%, #000 95%); mask-image: linear-gradient(120deg, transparent 20%, #000 95%); }
.mdcx-pagehero__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 50px; align-items: center; min-height: 560px; }
.mdcx-pagehero__copy { padding: 70px 0; }
.mdcx-pagehero__copy .mdcx-eyebrow { color: #cdd79c; }
.mdcx-pagehero h1 { font-size: clamp(46px, 5.6vw, 88px); line-height: .96; letter-spacing: -0.025em; color: #f9f9ee; }
.mdcx-pagehero h1 em { display: block; color: var(--mdcx-olive); padding-left: .4em; }
.mdcx-pagehero__copy > p:last-child { max-width: 520px; margin-top: 28px; font-size: 17px; line-height: 1.75; color: var(--mdcx-on-green); }
.mdcx-pagehero__media { position: relative; align-self: stretch; padding: 56px 0; display: flex; align-items: center; }
.mdcx-pagehero__media::before { content: ''; position: absolute; top: 0; bottom: 0; left: 14%; right: calc(-1 * max(var(--mdcx-gutter), (100vw - var(--mdcx-max)) / 2)); z-index: -1; }
.mdcx-pagehero__media--fans::before { background: var(--mdcx-fans) center / 240px; }
.mdcx-pagehero__media--diamonds::before { background: var(--mdcx-diamonds) center / 260px; }
.mdcx-pagehero__media img { width: 100%; height: 440px; object-fit: cover; border: 8px solid #f7f4e7; box-shadow: 0 16px 34px rgba(0, 0, 0, .3); }

.mdcx-story { padding: 110px 0; background: var(--mdcx-stone); overflow: hidden; }
.mdcx-story__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.mdcx-story__photos { position: relative; min-height: 560px; }
.mdcx-story__big { position: absolute; left: 0; top: 0; width: 72%; height: 500px; }
.mdcx-story__big img, .mdcx-story__small img { width: 100%; height: 100%; object-fit: cover; }
.mdcx-story__small { position: absolute; right: 0; bottom: 0; width: 46%; height: 240px; padding: 8px; background: var(--mdcx-white); box-shadow: 0 15px 35px rgba(1, 39, 24, .2); transform: rotate(-3deg); z-index: 2; }
.mdcx-story__fragment { position: absolute; left: -60px; bottom: -30px; width: 220px; height: 200px; background: var(--mdcx-field) center / 240px; clip-path: polygon(0 0, 60% 0, 60% 30%, 100% 30%, 100% 100%, 0 100%); opacity: .85; z-index: -1; }
.mdcx-story h2, .mdcx-why h2, .mdcx-invite h2, .mdcx-recipe-hub h2, .mdcx-after h2 { font-size: clamp(40px, 4.4vw, 62px); line-height: 1; }
.mdcx-story h2 em, .mdcx-invite h2 em, .mdcx-recipe-hub h2 em { display: block; color: #58703c; padding-left: .5em; }
.mdcx-story__copy p:not(.mdcx-eyebrow), .mdcx-invite__copy p:not(.mdcx-eyebrow) { margin-top: 22px; max-width: 520px; font-size: 17px; line-height: 1.8; color: var(--mdcx-muted); }
.mdcx-story__copy .mdcx-eyebrow, .mdcx-invite__copy .mdcx-eyebrow { color: #6d765e; }

.mdcx-why { position: relative; isolation: isolate; overflow: hidden; padding: 110px 0 100px; background: var(--mdcx-green-2); color: #f3f5e8; }
.mdcx-why__field { position: absolute; z-index: -1; right: -60px; top: 40px; width: 52%; height: 85%; background: var(--mdcx-weave) right top / 360px; opacity: .45; clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%, 0 70%, 10% 70%, 10% 40%, 20% 40%); }
.mdcx-why__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 30px 70px; align-items: center; }
.mdcx-why .mdcx-eyebrow { color: #b6c991; }
.mdcx-why h2 em { display: block; color: var(--mdcx-olive); padding-left: .5em; }
.mdcx-why__copy p:not(.mdcx-eyebrow) { margin-top: 22px; max-width: 500px; font-size: 17px; line-height: 1.8; color: #c4d0b7; }
.mdcx-why__picture { clip-path: polygon(0 0, 92% 0, 92% 9%, 100% 9%, 100% 100%, 9% 100%, 9% 91%, 0 91%); }
.mdcx-why__picture img { width: 100%; height: 480px; object-fit: cover; }
.mdcx-why__swatches { grid-column: 1 / -1; list-style: none; margin: 20px 0 0; padding: 26px 0 0; border-top: 1px solid #3d5a40; display: flex; flex-wrap: wrap; gap: 18px 40px; font: italic 22px var(--mdcx-serif); color: #e0e8c2; }
.mdcx-why__swatches li { display: flex; align-items: center; gap: 14px; }
.mdcx-why__swatches span { width: 54px; height: 54px; border: 3px solid #d2c6a0; }
.mdcx-why__swatches .is-weave { background: var(--mdcx-weave) center / 160px; }
.mdcx-why__swatches .is-diamonds { background: var(--mdcx-diamonds) center / 140px; }
.mdcx-why__swatches .is-fans { background: var(--mdcx-fans) center / 130px; }

.mdcx-invite { padding: 110px 0; }
.mdcx-invite__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.mdcx-invite__picture img { width: 100%; height: 520px; object-fit: cover; }
.mdcx-invite__actions, .mdcx-recipe__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; margin-top: 30px; }

.mdcx-recipe-hub { padding: 100px 0 90px; }
.mdcx-hub { list-style: none; margin: 46px 0 0; padding: 0; display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 28px; align-items: start; }
.mdcx-hub__item:nth-child(2) { margin-top: 70px; }
.mdcx-hub__item:nth-child(3) { margin-top: 30px; }
.mdcx-hub__item a { display: flex; flex-direction: column; gap: 12px; padding: 30px 26px 26px; min-height: 300px; background: var(--mdcx-stone); border-top: 4px solid var(--mdcx-green); color: var(--mdcx-green); text-decoration: none; transition: transform .25s; }
.mdcx-hub__item:nth-child(2) a { background: #eef0dc; border-color: var(--mdcx-olive); }
.mdcx-hub__item:nth-child(3) a { background: var(--mdcx-green); color: #f3f5e8; border-color: var(--mdcx-gold); }
.mdcx-hub__item a:hover { transform: translateY(-4px); }
.mdcx-hub__no { font: italic 22px var(--mdcx-serif); color: var(--mdcx-gold); }
.mdcx-hub__title { font: 31px/1.08 var(--mdcx-serif); letter-spacing: -0.01em; }
.mdcx-hub__text { font-size: 16px; line-height: 1.6; opacity: .85; }
.mdcx-hub__meta { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; opacity: .75; }
.mdcx-hub__cta { margin-top: auto; padding-top: 14px; border-top: 1px solid currentColor; font-weight: 600; font-size: 14px; }

.mdcx-after { padding: 0 0 110px; }
.mdcx-after__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: center; }
.mdcx-after__picture { clip-path: polygon(0 0, 100% 0, 100% 88%, 92% 88%, 92% 100%, 0 100%); }
.mdcx-after__picture img { width: 100%; height: 440px; object-fit: cover; }
.mdcx-after h2 em { display: block; color: #58703c; }
.mdcx-after__copy p:not(.mdcx-eyebrow) { margin: 22px 0 28px; font-size: 17px; line-height: 1.8; color: var(--mdcx-muted); }
.mdcx-after .mdcx-eyebrow { color: #6d765e; }

.mdcx-recipe__head { position: relative; isolation: isolate; padding: 54px 0 60px; background: var(--mdcx-green); color: #f3f5e8; overflow: hidden; }
.mdcx-recipe__head::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--mdcx-weave) center / 340px; opacity: .13; -webkit-mask-image: linear-gradient(120deg, transparent 30%, #000 100%); mask-image: linear-gradient(120deg, transparent 30%, #000 100%); }
.mdcx-recipe__back { margin-bottom: 34px !important; }
.mdcx-recipe__back a { color: #cdd79c; text-decoration: none; font-size: 15px; }
.mdcx-recipe__back a:hover { text-decoration: underline; }
.mdcx-recipe__head .mdcx-eyebrow { color: #cdd79c; }
.mdcx-recipe h1 { max-width: 16ch; font-size: clamp(42px, 5vw, 76px); line-height: .98; color: #f9f9ee; }
.mdcx-recipe__intro { max-width: 620px; margin-top: 24px !important; font-size: 18px; line-height: 1.7; color: var(--mdcx-on-green); }
.mdcx-recipe__meta { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.mdcx-recipe__meta li { padding: 7px 12px; border: 1px solid #56704a; font-size: 14px; color: #e0e8c2; }
.mdcx-recipe__body { display: grid; grid-template-columns: minmax(260px, .8fr) 1.6fr; gap: 70px; padding: 70px 0 110px; align-items: start; }
.mdcx-recipe__ingredients { position: sticky; top: 120px; padding: 34px 30px; background: var(--mdcx-green); color: #f3f5e8; background-image: linear-gradient(rgba(1, 39, 24, .9), rgba(1, 39, 24, .9)), var(--mdcx-fans); background-size: auto, 220px; }
.mdcx-recipe h2 { font-size: 34px; margin-bottom: 20px; }
.mdcx-recipe__ingredients ul { list-style: none; margin: 0; padding: 0; }
.mdcx-recipe__ingredients li { padding: 11px 0; border-bottom: 1px solid #3d5a40; font-size: 16px; line-height: 1.5; }
.mdcx-recipe__steps ol { list-style: none; counter-reset: step; margin: 0; padding: 0; max-width: 680px; }
.mdcx-recipe__steps ol li { counter-increment: step; position: relative; padding: 0 0 26px 64px; font-size: 18px; line-height: 1.75; }
.mdcx-recipe__steps ol li::before { content: counter(step, decimal-leading-zero); position: absolute; left: 0; top: -4px; font: italic 30px var(--mdcx-serif); color: var(--mdcx-gold); }
.mdcx-recipe__pairing { margin-top: 30px; padding: 30px 0 0; border-top: 1px solid var(--mdcx-line); max-width: 680px; }
.mdcx-recipe__pairing .mdcx-eyebrow { color: #6d765e; margin-bottom: 12px; }
.mdcx-recipe__pairing p:not(.mdcx-eyebrow) { font: italic 24px/1.4 var(--mdcx-serif); }

@media (max-width: 900px) {
  .mdcx-pagehero__grid, .mdcx-story__grid, .mdcx-why__grid, .mdcx-invite__grid, .mdcx-after__grid, .mdcx-recipe__body { grid-template-columns: 1fr; gap: 36px; }
  .mdcx-pagehero__grid { min-height: 0; }
  .mdcx-pagehero__copy { padding: 50px 0 0; }
  .mdcx-pagehero__media { padding: 26px 0 40px; }
  .mdcx-pagehero__media::before { left: calc(-1 * var(--mdcx-gutter)); right: calc(-1 * var(--mdcx-gutter)); top: 60px; }
  .mdcx-pagehero__media img { height: 300px; }
  .mdcx-story { padding: 70px 0; }
  .mdcx-story__photos { min-height: 430px; }
  .mdcx-story__big { width: 80%; height: 380px; }
  .mdcx-story__small { height: 180px; width: 52%; }
  .mdcx-why { padding: 70px 0; }
  .mdcx-why__field { width: 100%; opacity: .3; }
  .mdcx-why__picture img, .mdcx-invite__picture img, .mdcx-after__picture img { height: 320px; }
  .mdcx-invite { padding: 70px 0; }
  .mdcx-hub { grid-template-columns: 1fr; }
  .mdcx-hub__item:nth-child(n) { margin-top: 0; }
  .mdcx-hub__item:nth-child(2) { margin-left: 8%; }
  .mdcx-hub__item a { min-height: 0; }
  .mdcx-recipe-hub { padding: 64px 0; }
  .mdcx-after { padding-bottom: 70px; }
  .mdcx-recipe__ingredients { position: static; }
  .mdcx-recipe__body { padding: 44px 0 70px; }
  .mdcx-recipe__steps ol li { padding-left: 48px; font-size: 17px; }
}
body.mdcx .mdc-aromatisee-hero__eyebrow { font: 600 12px/1.4 var(--mdcx-sans); letter-spacing: .14em; text-transform: uppercase; color: #6d765e; }
body.mdcx .mdc-page-section__title { font-size: clamp(32px, 3.4vw, 50px); }

/* 9. Le Comptoir (homepage collection, Boss 2026-10-12) -------------------- */
.mdcx-counter {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 0;
  margin-top: 46px; background: var(--mdcx-stone); border: 1px solid #e3e1d5;
}
.mdcx-counter__stage {
  position: relative; isolation: isolate; display: grid; grid-template-columns: 46% 1fr; align-items: center; gap: 10px 30px;
  padding: 40px 34px 36px; background: var(--mdcx-green); color: #f3f5e8; overflow: hidden;
}
.mdcx-counter__stage::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--mdcx-weave) center / 300px; opacity: .16; }
.mdcx-counter__advice {
  position: absolute; top: 22px; left: 22px; z-index: 2; margin: 0 !important; padding: 8px 12px;
  background: var(--mdcx-olive); color: var(--mdcx-green); font: 600 11px/1 var(--mdcx-sans); letter-spacing: .12em; text-transform: uppercase;
  transform: rotate(-3deg);
}
.mdcx-counter__photo { display: block; align-self: stretch; position: relative; min-height: 380px; padding: 12px; background: var(--mdcx-diamonds) center / 170px; box-shadow: 0 16px 34px rgba(0, 0, 0, .3); }
.mdcx-counter__frame { position: absolute; inset: 12px; background: #fafaf7; overflow: hidden; }
.mdcx-counter__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transform: scale(1.32); transform-origin: center 55%; }
.mdcx-counter__stage.is-swapping .mdcx-counter__photo img { animation: mdcxDrop .55s cubic-bezier(.2, .8, .25, 1); }
@keyframes mdcxDrop { from { transform: translateY(-26px) scale(1.24); opacity: .2; } to { transform: scale(1.32); opacity: 1; } }
.mdcx-counter__info { padding-bottom: 6px; }
.mdcx-counter__group { margin: 0 0 10px !important; font: 600 11px/1.3 var(--mdcx-sans); letter-spacing: .14em; text-transform: uppercase; color: #cdd79c; }
.mdcx-counter__name { font-size: clamp(26px, 2.3vw, 34px) !important; line-height: 1.05 !important; }
.mdcx-counter__name a { color: #f9f9ee; text-decoration: none; }
.mdcx-counter__name a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.mdcx-counter__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin: 18px 0 0 !important; }
.mdcx-counter__price strong { font: 46px/1 var(--mdcx-serif); color: var(--mdcx-white); }
.mdcx-counter__price span { font-size: 14px; color: #c4d0b7; }
.mdcx-counter__saving { display: inline-block; margin: 12px 0 0 !important; padding: 6px 10px; border: 1px solid var(--mdcx-olive); color: var(--mdcx-olive); font: 600 13px/1.2 var(--mdcx-sans); }
.mdcx-counter__buy { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.mdcx-counter__buy[hidden], .mdcx-counter__contact[hidden], [data-counter-saving][hidden], [data-counter-advice][hidden] { display: none !important; }
.mdcx-counter__add { flex: 1 1 200px; }
.mdcx-counter__add:disabled { opacity: .6; cursor: progress; }
.mdcx-counter__contact { margin-top: 22px; background: transparent; border-color: #8ea06c; }
.mdcx-qty { display: inline-flex; align-items: stretch; border: 1px solid #56704a; min-height: 52px; }
.mdcx-qty button { width: 42px; background: none; border: 0; color: #f3f5e8; font-size: 20px; cursor: pointer; }
.mdcx-qty button:hover { background: #20452f; }
.mdcx-qty input { width: 44px; border: 0; background: transparent; color: #f9f9ee; text-align: center; font: 600 16px var(--mdcx-sans); -moz-appearance: textfield; }
.mdcx-qty input::-webkit-inner-spin-button, .mdcx-qty input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.mdcx-counter__added { min-height: 22px; margin: 12px 0 0 !important; font-size: 14px; color: var(--mdcx-olive); }
.mdcx-counter__added a { color: #f9f9ee; font-weight: 600; }
.mdcx-counter__stage.is-added .mdcx-counter__photo img { animation: mdcxNod .6s ease; }
@keyframes mdcxNod { 40% { transform: scale(1.32) translateY(-10px) rotate(-2deg); } }

.mdcx-counter__shelf { position: relative; display: flex; flex-direction: column; padding: 30px 26px 0; min-width: 0; }
.mdcx-counter__hint { margin: 0 0 auto !important; font: 600 11px/1.3 var(--mdcx-sans); letter-spacing: .14em; text-transform: uppercase; color: #6d765e; }
.mdcx-shelf { list-style: none; margin: 0; padding: 30px 0 0; display: flex; align-items: flex-end; gap: 4px; height: 380px; overflow-x: auto; scrollbar-width: none; }
.mdcx-shelf::-webkit-scrollbar { display: none; }
.mdcx-shelf__item { position: relative; min-width: 0; flex: 1 0 60px; height: 100%; display: flex; align-items: flex-end; }
.mdcx-shelf__item.is-group-start:not(:first-child) { margin-left: 10px; padding-left: 12px; border-left: 1px dashed #c9c6b4; }
.mdcx-shelf__group { position: absolute; top: 0; left: 0; white-space: nowrap; font: italic 18px var(--mdcx-serif); color: #58703c; }
.mdcx-shelf__item.is-group-start:not(:first-child) .mdcx-shelf__group { left: 12px; }
.mdcx-shelf__bottle { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; width: 100%; height: var(--h); color: var(--mdcx-green); text-decoration: none; cursor: pointer; padding-bottom: 6px; }
.mdcx-shelf__img { position: relative; flex: 1; width: 100%; min-height: 0; }
/* Packshots are square with wide margins: draw them taller than the slot and let the margins overlap the neighbours (multiply keeps them invisible). */
.mdcx-shelf__img img { position: absolute; left: 50%; bottom: -10%; height: 125%; width: auto; max-width: none; mix-blend-mode: multiply; transform: translateX(-50%); transform-origin: center 88%; transition: transform .25s; }
.mdcx-shelf__bottle:hover .mdcx-shelf__img img { transform: translateX(-50%) translateY(-6px); }
.mdcx-shelf__bottle[aria-pressed="true"] .mdcx-shelf__img img { transform: translateX(-50%) translateY(-10px) scale(1.06); }
.mdcx-shelf__bottle[aria-pressed="true"]::after { content: ''; position: absolute; left: 22%; right: 22%; bottom: -12px; height: 4px; background: var(--mdcx-olive); }
.mdcx-shelf__size { position: relative; z-index: 1; margin-top: 8px; font: 600 13px/1 var(--mdcx-sans); white-space: nowrap; }
.mdcx-shelf__price { position: relative; z-index: 1; margin-top: 4px; font-size: 12px; color: var(--mdcx-muted); white-space: nowrap; min-height: 14px; }
.mdcx-shelf__board { height: 30px; margin: 10px -26px 0; background: var(--mdcx-frieze) center / 120px 30px; border-top: 4px solid var(--mdcx-gold); }

.mdcx-addon { display: flex; align-items: center; gap: 22px 34px; flex-wrap: wrap; margin-top: 34px; padding: 22px 0; border-bottom: 1px solid var(--mdcx-line); }
.mdcx-addon__title { margin: 0 !important; font: 26px/1.1 var(--mdcx-serif); }
.mdcx-addon__title em { color: #58703c; }
.mdcx-addon__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; flex: 1; }
.mdcx-addon__list a { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 4px 14px 4px 4px; border: 1px solid var(--mdcx-line); border-radius: 30px; color: var(--mdcx-green); font-size: 14px; text-decoration: none; transition: border-color .2s, background .2s; }
.mdcx-addon__list a:hover { border-color: var(--c); background: color-mix(in srgb, var(--c) 18%, white); }
.mdcx-addon__cap { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: color-mix(in srgb, var(--c) 35%, white); display: grid; place-items: center; }
.mdcx-addon__cap img { width: 150%; height: 150%; max-width: none; object-fit: cover; object-position: center 18%; mix-blend-mode: multiply; }
.mdcx-collection__links { padding-top: 24px; }

@media (max-width: 1150px) {
  .mdcx-counter { grid-template-columns: 1fr; }
  .mdcx-shelf { height: 320px; }
}
@media (max-width: 760px) {
  .mdcx-counter { margin-inline: 0; width: 100%; border-inline: 0; margin-top: 30px; }
  .mdcx-counter__stage { grid-template-columns: 1fr; padding: 54px 18px 26px; gap: 22px; }
  .mdcx-counter__photo { min-height: 0; aspect-ratio: 1; padding: 8px; }
  .mdcx-counter__photo img { transform: scale(1.15); }
  .mdcx-counter__frame { inset: 8px; }
  .mdcx-counter__name { font-size: 23px !important; }
  .mdcx-counter__price strong { font-size: 36px; }
  .mdcx-counter__buy { position: sticky; bottom: 10px; }
  .mdcx-counter__shelf { padding: 22px 0 0 18px; }
  .mdcx-shelf { height: 270px; gap: 2px; padding-right: 18px; }
  .mdcx-shelf__item { flex: 0 0 66px; }
  .mdcx-shelf__board { margin: 10px 0 0 -18px; }
  .mdcx-addon { padding: 18px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .mdcx-counter__stage.is-swapping .mdcx-counter__photo img, .mdcx-counter__stage.is-added .mdcx-counter__photo img { animation: none; }
}
/* Can packshots fill their frame, bottles do not: draw the cans smaller so the shelf stays truthful. */
.mdcx-shelf__item.is-bidons { flex-basis: 96px; }
.mdcx-shelf__item.is-bidons .mdcx-shelf__img img { height: 58%; bottom: -2%; }
@media (max-width: 760px) { .mdcx-counter__photo img { transform: scale(1.08); } }

/* 10. Hero centre: product variants over one fixed backdrop (Boss 2026-10-12) */
.mdcx-hero__window { background: #2c3b26; }
.mdcx-hero__backdrop { position: absolute; inset: -6px; width: calc(100% + 12px); height: calc(100% + 12px); object-fit: cover; filter: blur(2.5px) saturate(.9) brightness(.92); transform: scale(1.03); }
.mdcx-hero__window::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 38%, rgba(255, 246, 220, .28), transparent 62%), linear-gradient(180deg, transparent 55%, rgba(1, 39, 24, .35)); pointer-events: none; }
.mdcx-hero__plinth { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 17%; background: var(--mdcx-diamonds) center / 150px; border-top: 5px solid #d5cc9c; box-shadow: 0 -10px 24px rgba(0, 0, 0, .18); }
.mdcx-hero__frame { z-index: 2; transform: translateX(var(--slide-from, 60px)); transition: opacity .7s, transform .9s cubic-bezier(.2, .75, .25, 1), visibility .7s; overflow: visible; }
.mdcx-hero__frame.is-selected { transform: none; }
.mdcx-hero__frame.is-leaving { transform: translateX(var(--slide-to, -60px)); }
.mdcx-hero__frame img.mdcx-hero__cutout { position: absolute; left: 50%; bottom: 11%; width: auto; height: 76%; max-width: 86%; object-fit: contain; transform: translateX(-50%); filter: drop-shadow(0 16px 14px rgba(0, 0, 0, .38)); transition: none; }
.mdcx-hero__frame.is-selected img.mdcx-hero__cutout { transform: translateX(-50%); }
.mdcx-hero__frame img.mdcx-hero__cutout.is-wide { height: 56%; }
.mdcx-hero__frame img.mdcx-hero__cutout.is-sachet { height: 62%; }
.mdcx-hero__frame::after { content: ''; position: absolute; left: 30%; right: 30%; bottom: 10%; height: 16px; border-radius: 50%; background: rgba(0, 0, 0, .45); filter: blur(10px); z-index: -1; }
.mdcx-hero__info[hidden] { display: none !important; }
.mdcx-hero__info.is-selected { animation: mdcxInfo .6s ease both; }
@keyframes mdcxInfo { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.mdcx-hero__label span { display: block; margin-bottom: 6px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #bbcba4; }
.mdcx-hero__label em { margin-bottom: 0; }
.mdcx-hero__desc { margin: 8px 0 0 !important; font-size: 14px; line-height: 1.5; color: #d1dcc6; }
.mdcx-hero__buy { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 12px 0 0 !important; padding-top: 10px; border-top: 1px solid #2f4c35; }
.mdcx-hero__buy strong { font: 26px/1 var(--mdcx-serif); font-weight: 400; color: #f9f9ee; }
.mdcx-hero__buy a { color: var(--mdcx-olive); font-weight: 600; font-size: 14px; text-decoration: none; }
.mdcx-hero__buy a:hover { text-decoration: underline; text-underline-offset: 4px; }
.mdcx-hero__controls { padding-right: 150px; }
@media (max-width: 760px) {
  .mdcx-hero__window { height: 360px; }
  .mdcx-hero__controls { padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .mdcx-hero__frame, .mdcx-hero__frame.is-leaving { transform: none !important; }
  .mdcx-hero__info.is-selected { animation: none; }
}

/* 11. Le Comptoir v2: cut-outs on a mosaic plinth, size chips, sachets ------ */
.mdcx-counter__photo { padding: 0; background: none; box-shadow: none; min-height: 420px; }
.mdcx-counter__plinth {
  position: absolute; left: 4%; right: 4%; bottom: 0; height: 22%;
  background: var(--mdcx-diamonds) center / 150px; border-top: 6px solid #d5cc9c;
  box-shadow: 0 -12px 30px rgba(0, 0, 0, .25);
}
.mdcx-counter__photo img { position: absolute; left: 50%; bottom: 14%; inset: auto; width: auto; height: 78%; max-width: 92%; object-fit: contain; mix-blend-mode: normal; transform: translateX(-50%); filter: drop-shadow(0 18px 16px rgba(0, 0, 0, .45)); }
.mdcx-counter__photo img { left: 50%; bottom: 14%; }
.mdcx-counter__photo img.is-wide { height: 58%; }
.mdcx-counter__photo img.is-sachet { height: 64%; }
.mdcx-counter__stage.is-swapping .mdcx-counter__photo img { animation: mdcxDrop2 .55s cubic-bezier(.2, .8, .25, 1); }
.mdcx-counter__stage.is-added .mdcx-counter__photo img { animation: mdcxNod2 .6s ease; }
@keyframes mdcxDrop2 { from { transform: translateX(-50%) translateY(-30px); opacity: .2; } to { transform: translateX(-50%); opacity: 1; } }
@keyframes mdcxNod2 { 40% { transform: translateX(-50%) translateY(-10px) rotate(-2deg); } }
.mdcx-counter__group { color: #cdd79c; letter-spacing: .06em; text-transform: none; font-size: 13px; font-weight: 400; }
.mdcx-counter__fullname { margin: 8px 0 0 !important; font-size: 13px; line-height: 1.45; color: #a9b99a; }
.mdcx-counter__sizes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.mdcx-counter__sizes[hidden] { display: none; }
.mdcx-counter__sizes button { min-height: 40px; padding: 8px 13px; background: transparent; border: 1px solid #56704a; color: #e0e8c2; font: 600 13px var(--mdcx-sans); cursor: pointer; transition: background .2s, border-color .2s; }
.mdcx-counter__sizes button:hover { border-color: var(--mdcx-olive); }
.mdcx-counter__sizes button[aria-pressed="true"] { background: #f2f3e7; border-color: #f2f3e7; color: var(--mdcx-green); }
.mdcx-counter__ask { margin-top: 20px; }
.mdcx-counter__ask[hidden] { display: none; }
.mdcx-counter__ask p { margin: 0 0 12px !important; font-size: 14px; color: #c4d0b7; }
.mdcx-counter__hint span { font-size: 16px; color: var(--mdcx-gold); margin-right: 4px; }

/* Shelf now uses transparent cut-outs: each one simply fills its slot height. */
.mdcx-shelf__img img, .mdcx-shelf__item.is-bidons .mdcx-shelf__img img { position: absolute; left: 50%; bottom: 0; height: 100%; width: auto; max-width: none; mix-blend-mode: normal; transform: translateX(-50%); transform-origin: center bottom; filter: drop-shadow(0 8px 6px rgba(1, 39, 24, .25)); }
.mdcx-shelf__bottle:hover .mdcx-shelf__img img { transform: translateX(-50%) translateY(-6px); }
.mdcx-shelf__bottle[aria-pressed="true"] .mdcx-shelf__img img { transform: translateX(-50%) translateY(-10px) scale(1.06); }
.mdcx-shelf__bottle[aria-pressed="true"] .mdcx-shelf__size { color: #58703c; }
.mdcx-shelf__item { flex: 1 0 56px; }
.mdcx-shelf__item.is-bidons { flex-basis: 100px; }
.mdcx-shelf__item.is-bidons .mdcx-shelf__img img { height: auto; width: 92%; }
.mdcx-shelf__item.is-sachets-15ml { flex-basis: 64px; }
.mdcx-shelf__price { font-size: 11px; }

/* Flavour chips show the top of the cut-out bottle in a coloured disc. */
.mdcx-addon__list a[aria-pressed="true"] { border-color: var(--c); background: color-mix(in srgb, var(--c) 22%, white); }
.mdcx-addon__cap img { width: 100%; height: 190%; object-fit: cover; object-position: center top; mix-blend-mode: normal; margin-top: 40%; }
.mdcx-addon__title em { display: inline; }
.mdcx-collection__links { display: flex; flex-wrap: wrap; gap: 14px 36px; }
@media (max-width: 760px) {
  .mdcx-counter__photo { min-height: 300px; aspect-ratio: auto; }
  .mdcx-shelf__item { flex: 0 0 60px; }
  .mdcx-shelf__item.is-bidons { flex-basis: 96px; }
}
.mdcx-counter { grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); }
.mdcx-shelf__item.is-bidons { flex-basis: 86px; }
.mdcx-shelf__item.is-group-start:not(:first-child) { margin-left: 8px; padding-left: 10px; }
.mdcx-shelf__item.is-group-start:not(:first-child) .mdcx-shelf__group { left: 10px; }
@media (max-width: 1150px) { .mdcx-counter { grid-template-columns: 1fr; } }
.mdcx-counter { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1.3fr); }
.mdcx-shelf { height: 320px; }
.mdcx-hero__buy strong { font-size: 22px; }
@media (max-width: 1150px) { .mdcx-counter { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .mdcx-shelf { height: 250px; } }
@media (max-width: 1150px) {
  .mdcx-hero__controls { padding-right: 0; }
  .mdcx-hero__dots { position: static; margin-top: 10px; }
}

/* 12. Hero fits the browser window on desktop (Boss 2026-10-12). The header
   height comes from theme.js (--mdc-header-h); 96px until it is measured. */
@media (min-width: 901px) {
  .mdcx-hero { height: calc(100svh - var(--mdc-header-h, 96px)); min-height: 600px; max-height: 920px; }
  .mdcx-hero__intro { padding-top: 40px; padding-bottom: 40px; }
  .mdcx-hero__title { font-size: clamp(56px, min(6.4vw, 11.5svh), 108px); }
  .mdcx-hero__text { margin: 22px 0; }
  .mdcx-hero__origin { margin-top: 34px; }
  .mdcx-hero__gallery { padding-top: 22px; padding-bottom: 22px; min-height: 0; }
  .mdcx-hero__caption { margin-bottom: 14px; }
  .mdcx-hero__window { min-height: 0; }
  .mdcx-hero__footer { margin-top: 14px; padding: 14px 18px 12px; }
  .mdcx-hero__label em { font-size: 26px; }
  .mdcx-hero__desc { margin-top: 4px !important; }
  .mdcx-hero__buy { margin-top: 8px !important; padding-top: 8px; }
  .mdcx-hero__controls { margin-top: 10px; }
  .mdcx-hero__controls button { width: 36px; height: 36px; }
  .mdcx-hero__dots { bottom: 14px; }
  .mdcx-hero__roots { padding-top: 30px; padding-bottom: 24px; min-height: 0; }
  .mdcx-hero__roots-label { margin-bottom: 18px; }
  .mdcx-hero__roots-window { height: auto; flex: 1 1 0; min-height: 160px; }
  .mdcx-hero__roots-card { flex: 0 0 auto; min-height: 0; margin-top: 18px; padding: 18px 16px; }
}
@media (min-width: 901px) and (max-height: 760px) {
  .mdcx-hero__origin { display: none; }
  .mdcx-hero__desc { display: none; }
}

/* 13. Small phones (Boss 2026-10-12: no sideways scroll anywhere) */
@media (max-width: 420px) {
  .mdcx-header__inner { gap: 8px; }
  .mdcx-header__menu { padding: 8px 10px; font-size: 0; gap: 0; }
  .mdcx-header__menu .mdcx-burger { margin: 0; }
  .mdcx-brand small { font-size: 12px; } .mdcx-brand strong { font-size: 22px; } .mdcx-brand span { font-size: 6px; letter-spacing: .16em; }
  .mdcx-header__tools { gap: 0; }
  .mdcx-iconbtn { min-width: 40px; }
}
/* Mobile shelf: one shelf per container family, stacked, nothing hidden off-screen. */
@media (max-width: 760px) {
  .mdcx-counter__shelf { padding: 22px 18px 0; }
  .mdcx-shelf { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 6px; height: auto; overflow: visible; padding: 0; }
  .mdcx-shelf__item, .mdcx-shelf__item.is-bidons, .mdcx-shelf__item.is-sachets-15ml { height: 190px; padding-top: 30px; border-bottom: 4px solid var(--mdcx-gold); margin-bottom: 18px; }
  .mdcx-shelf__item.is-group-start { grid-column-start: 1; }
  .mdcx-shelf__item.is-sachets-15ml.is-group-start { grid-column-start: auto; }
  .mdcx-shelf__item.is-group-start:not(:first-child) { margin-left: 0; padding-left: 0; border-left: 0; }
  .mdcx-shelf__item.is-group-start:not(:first-child) .mdcx-shelf__group { left: 0; }
  .mdcx-shelf__item.is-bidons .mdcx-shelf__img img { width: 96%; }
  .mdcx-shelf__board { margin: 0 -18px; }
}
@media (max-width: 760px) {
  .mdcx-shelf__item, .mdcx-shelf__item.is-bidons, .mdcx-shelf__item.is-sachets-15ml { height: auto; min-height: 0; align-items: flex-end; padding-top: 34px; }
  .mdcx-shelf__bottle { height: auto; }
  .mdcx-shelf__img { flex: none; height: calc(var(--hn) * 1.45px); }
  .mdcx-shelf__img img, .mdcx-shelf__item.is-bidons .mdcx-shelf__img img { height: 100%; width: auto; max-width: none; }
  .mdcx-shelf__item.is-bidons .mdcx-shelf__img { height: calc(var(--hn) * 1.05px); }
  .mdcx-addon__list { display: grid; grid-template-columns: 1fr 1fr; }
  .mdcx-addon__list a { width: 100%; }
}