/**
 * Estelar Commerce — storefront design system and section styles.
 *
 * Tokens (fonts, colour schemes, spacing, widths, buttons) come from the SANDBOX theme
 * settings, so a page built here looks like the Shopify original. Sections only use the
 * tokens, never raw colours, so a scheme change repaints the whole shop.
 */

/* ------------------------------------------------------------------ tokens */

:root {
  --de-font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --de-font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --de-font-serif: 'Cormorant', 'Cormorant Garamond', Georgia, serif;
  /* SANDBOX renders the "serif" part of split titles in Montserrat Light, not an italic. */
  --de-font-accent: 'Montserrat', 'Poppins', sans-serif;

  /* SANDBOX type scale (mobile first; desktop values below) */
  --de-h1: 47px; --de-h2: 36px; --de-h3: 27px; --de-h4: 21px; --de-h5: 16px; --de-h6: 16px;
  --de-text: #121212;

  --de-heading-tracking: -0.04em;
  --de-button-tracking: 0.1em;
  --de-button-radius: 5rem;
  --de-input-radius: 0.8rem;
  --de-card-radius: 0.8rem;

  --de-page: 1440px;
  --de-fluid: 1760px;
  --de-gutter: 16px;

  --de-header-height: 4.75rem;
  /* the red of the cross in the Estelar logo (sampled from logotyp_black.png) */
  --de-brand-red: #E21F26;
}

@media (min-width: 750px) {
  :root {
    --de-gutter: 36px;
    --de-h1: 80px; --de-h2: 61px; --de-h3: 47px; --de-h4: 36px; --de-h5: 27px; --de-h6: 20.5px;
  }
}

/* Colour schemes 1–8, taken from SANDBOX (settings_data.json → color_schemes). */
.de-scheme-1 { --de-bg: #ffffff; --de-fg: #121212; --de-fg-2: #65706e; --de-heading: #111111;
  --de-btn: #111111; --de-btn-label: #ffffff; --de-btn2-label: #111111; --de-link: #111111;
  --de-border: #ebebeb; --de-tag: #5e5a59; --de-tag-label: #ffffff; --de-placeholder: #ababab; }
.de-scheme-2 { --de-bg: #bebebe; --de-fg: #ffffff; --de-fg-2: #111111; --de-heading: #ffffff;
  --de-btn: #ffffff; --de-btn-label: #111111; --de-btn2-label: #ffffff; --de-link: #ffffff;
  --de-border: #ebebeb; --de-tag: #111111; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }
.de-scheme-3 { --de-bg: #889492; --de-fg: #132d40; --de-fg-2: #ffffff; --de-heading: #132d40;
  --de-btn: #132d40; --de-btn-label: #ffffff; --de-btn2-label: #132d40; --de-link: #132d40;
  --de-border: #ebebeb; --de-tag: #132d40; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }
.de-scheme-4 { --de-bg: #d9d9d9; --de-fg: #111111; --de-fg-2: #ffffff; --de-heading: #111111;
  --de-btn: #111111; --de-btn-label: #b0b9b7; --de-btn2-label: #111111; --de-link: #111111;
  --de-border: #ebebeb; --de-tag: #111111; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }
.de-scheme-5 { --de-bg: #f4f4f4; --de-fg: #111111; --de-fg-2: #65706e; --de-heading: #111111;
  --de-btn: #111111; --de-btn-label: #f4f4f4; --de-btn2-label: #111111; --de-link: #111111;
  --de-border: #e4e4e4; --de-tag: #ffffff; --de-tag-label: #111111; --de-placeholder: #f4f4f4; }
.de-scheme-6 { --de-bg: #040404; --de-fg: #ffffff; --de-fg-2: #a9b0ae; --de-heading: #ffffff;
  --de-btn: #ffffff; --de-btn-label: #111111; --de-btn2-label: #ffffff; --de-link: #ffffff;
  --de-border: #2a2a2a; --de-tag: #111111; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }
.de-scheme-7 { --de-bg: #e47424; --de-fg: #ffffff; --de-fg-2: #ffffff; --de-heading: #ffffff;
  --de-btn: #111111; --de-btn-label: #ffffff; --de-btn2-label: #ffffff; --de-link: #111111;
  --de-border: #ebebeb; --de-tag: #111111; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }
.de-scheme-8 { --de-bg: #6c7775; --de-fg: #ffffff; --de-fg-2: #ffffff; --de-heading: #ffffff;
  --de-btn: #111111; --de-btn-label: #ffffff; --de-btn2-label: #111111; --de-link: #111111;
  --de-border: #ebebeb; --de-tag: #111111; --de-tag-label: #ffffff; --de-placeholder: #f2f3f7; }

[class*='de-scheme-'] { background: var(--de-bg); color: var(--de-fg); }

/* Our components decide their own link colour from the scheme, whatever the parent theme
 * sets for <a>; the double class keeps us ahead of classic's generic link rule. */
.de-header.de-header a,
.de-announcement.de-announcement a,
.de-drawer.de-drawer a,
.de-footer.de-footer a,
.de-grid.de-grid a.de-link {
  color: inherit;
}
/* classic's theme.css colours every link inside #header with an id selector; these sit
 * above it. They can go when the theme stops loading the parent stylesheet. */
#header .de-header a, #header .de-announcement a, #header .de-drawer a,
#footer .de-footer a, #footer .de-drawer a {
  color: inherit;
}

/* ------------------------------------------------------------- base layout */

/* Minimal reset: section pages do not load classic's Bootstrap stylesheet any more. */
*, *::before, *::after { box-sizing: border-box; }
/* Sliders and off-screen slides must never make the page scroll sideways on a phone.
 * clip (not hidden) keeps position: sticky working for the header. */
html, body { overflow-x: clip; }
body { margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #fff; }
img, video { max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
.de-layout .breadcrumb { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; }
.de-layout .breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; }
/* SANDBOX breadcrumb: 10px / 500, 1px tracking, #121212 */
.de-layout .breadcrumb li { display: inline-flex; gap: 6px; font-size: 10px; font-weight: 500; letter-spacing: 1px; line-height: 12.5px; color: #121212; }
.de-layout .breadcrumb a { color: inherit; }
.de-layout .breadcrumb li:not(:last-child)::after { content: '/'; }
.de-layout .breadcrumb a { text-decoration: none; }
.de-layout .breadcrumb a:hover { text-decoration: underline; }
.de-layout .sr-only, .de-layout .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }


.estelar-section { position: relative; }

/* Section pages run edge to edge (see theme layouts/layout-full-width.tpl): no grey page
 * background, no container padding from classic. */
#wrapper.de-wrapper { background: transparent; padding-top: 0; box-shadow: none; }
.de-content { padding: 0; }
.de-breadcrumb { padding-top: 1rem; }
.de-breadcrumb .breadcrumb { background: transparent; padding: 0; margin: 0 0 .5rem; font-size: .8125rem; }
.de-layout #main .page-header, .de-layout #main .page-footer { display: none; }

body { font-family: var(--de-font-body); font-size: 14px; line-height: 1.6; color: var(--de-text); }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--de-font-heading);
  letter-spacing: var(--de-heading-tracking);
  font-weight: 400;
  line-height: 1;
  text-transform: none;
}
.de-h1 { font-size: var(--de-h1); } .de-h2 { font-size: var(--de-h2); } .de-h3 { font-size: var(--de-h3); }
.de-h4 { font-size: var(--de-h4); } .de-h5 { font-size: var(--de-h5); } .de-h6 { font-size: var(--de-h6); }

/* Split titles: light accent line + medium main line, as in the SANDBOX hero and tiles. */
.de-serif { font-family: var(--de-font-accent); font-weight: 300; font-style: normal; letter-spacing: inherit; }
.de-split { display: flex; flex-direction: column; }
.de-split > span { display: block; }
.de-split__main { font-weight: 500; }
/* An <em> inside a heading is the italic accent ("Join the <em>family</em>"). */
/* Titles use only the Poppins + Montserrat pairing (user, 2026-09-18): an <em> word in a heading
 * becomes the Montserrat Light accent, not an italic. */
h1 em, h2 em, h3 em, h4 em { font-family: var(--de-font-accent); font-style: normal; font-weight: 300; font-size: 1em; }

/* Spacing scale used by every section (0–6): SANDBOX unit = 16px on desktop, 12px on mobile
 * (--section-spacing-unit-size), so 2 = 32px, 4 = 64px, 6 = 96px. */
:root { --de-space: 12px; }
@media (min-width: 750px) { :root { --de-space: 16px; } }
.de-sp-top-0 { padding-top: calc(var(--de-space) * 0); } .de-sp-bottom-0 { padding-bottom: calc(var(--de-space) * 0); }
.de-sp-top-1 { padding-top: calc(var(--de-space) * 1); } .de-sp-bottom-1 { padding-bottom: calc(var(--de-space) * 1); }
.de-sp-top-2 { padding-top: calc(var(--de-space) * 2); } .de-sp-bottom-2 { padding-bottom: calc(var(--de-space) * 2); }
.de-sp-top-3 { padding-top: calc(var(--de-space) * 3); } .de-sp-bottom-3 { padding-bottom: calc(var(--de-space) * 3); }
.de-sp-top-4 { padding-top: calc(var(--de-space) * 4); } .de-sp-bottom-4 { padding-bottom: calc(var(--de-space) * 4); }
.de-sp-top-5 { padding-top: calc(var(--de-space) * 5); } .de-sp-bottom-5 { padding-bottom: calc(var(--de-space) * 5); }
.de-sp-top-6 { padding-top: calc(var(--de-space) * 6); } .de-sp-bottom-6 { padding-bottom: calc(var(--de-space) * 6); }

/* Width scale */
.de-w-max-w-page { max-width: var(--de-page); margin-inline: auto; padding-inline: var(--de-gutter); }
.de-w-max-w-fluid { max-width: var(--de-fluid); margin-inline: auto; padding-inline: var(--de-gutter); }
.de-w-max-w-full { max-width: none; }

/* Breakpoint helpers, used by blocks with a "show on" setting */
/* !important on purpose: a utility must win over any component rule that sets display. */
.de-show-desktop { display: none !important; }
@media (min-width: 992px) {
  .de-show-mobile { display: none !important; }
  .de-show-desktop { display: revert !important; }
}

/* ---------------------------------------------------------------- buttons */

.de-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: 16px 24px; border-radius: 50px; border: 1px solid transparent;
  font-family: var(--de-font-body); font-size: 10px; font-weight: 500; letter-spacing: 1px;
  line-height: 1; text-transform: none; text-decoration: none; cursor: pointer;
  transition: opacity .2s ease, background .2s ease, color .2s ease;
}
.de-btn:hover { opacity: .82; text-decoration: none; }
.de-btn--filled { background: var(--de-btn); color: var(--de-btn-label); }
.de-btn--outlined { background: transparent; color: var(--de-btn2-label); border-color: currentColor; }
.de-btn--text {
  background: transparent; color: var(--de-btn2-label); padding: 4px 0; border-radius: 0;
  font-size: 12px; font-weight: 400; letter-spacing: 1.2px;
  text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 1px;
}
/* Pill button of the SANDBOX promo tiles */
.de-btn--pill {
  background: transparent; color: inherit; border: 1px solid currentColor; border-radius: 26px;
  padding: 13px 34px; font-size: 14.5px; font-weight: 500; letter-spacing: 0; line-height: 1.6;
}

.de-link { color: var(--de-link); text-decoration: none; }
.de-link:hover { text-decoration: underline; text-underline-offset: .25em; }

.de-label {
  font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--de-fg-2);
}

/* ------------------------------------------------------------ hero banner */

.de-hero { position: relative; overflow: hidden; }
.de-hero__track { display: flex; width: 100%; transition: transform .6s cubic-bezier(.4, 0, .2, 1); }
.de-hero__slide { position: relative; flex: 0 0 100%; display: flex; overflow: hidden; }
/* SANDBOX: the hero fills the screen below the announcement bar and header. */
.de-hero__slide--h-full { min-height: calc(100svh - var(--de-chrome, 120px)); }
.de-hero__slide--h-large { min-height: 75svh; }
.de-hero__slide--h-medium { min-height: 55svh; }
.de-hero__slide--h-auto { min-height: 0; }
@media (max-width: 767px) {
  .de-hero__slide--hm-full { min-height: calc(100svh - var(--de-chrome, 140px)); }
  .de-hero__slide--hm-large { min-height: 70svh; }
  .de-hero__slide--hm-medium { min-height: 50svh; }
  .de-hero__slide--hm-auto { min-height: 0; }
}
.de-hero__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.de-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--de-pos, 50% 50%); }
@media (max-width: 767px) { .de-hero__media img { object-position: var(--de-pos-m, var(--de-pos, 50% 50%)); } }
.de-hero__overlay { position: absolute; inset: 0; background: #000; }
.de-hero__inner {
  position: relative; z-index: 2; display: flex; flex-direction: column; gap: 24px;
  width: 100%; margin-inline: auto; padding: 64px 54px;
}
@media (max-width: 749px) { .de-hero__inner { padding: 48px var(--de-gutter); } }
.de-pos-start { justify-content: flex-start; } .de-pos-center { justify-content: center; } .de-pos-end { justify-content: flex-end; }
.de-align-start { align-items: flex-start; text-align: left; }
.de-align-center { align-items: center; text-align: center; }
.de-align-end { align-items: flex-end; text-align: right; }
.de-hero__subheading { margin: 0; font-size: 16px; font-weight: 300; letter-spacing: 2px; text-transform: uppercase; line-height: 1.25; }
.de-hero__title { margin: 0; font-size: 47px; line-height: 1; color: inherit; letter-spacing: -0.04em; }
@media (min-width: 990px) { .de-hero__title { font-size: 61px; } }
@media (min-width: 1440px) { .de-hero__title { font-size: 80px; } }
.de-hero__title-serif { display: block; font-family: var(--de-font-accent); font-weight: 300; font-style: normal; }
.de-hero__title-main { display: block; font-weight: 500; }
.de-hero__text { max-width: 46ch; }
.de-hero__buttons { display: flex; flex-wrap: wrap; gap: .75rem; margin: .5rem 0 0; }
.de-hero__arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 40px; height: 40px; border-radius: 50%; border: 0; cursor: pointer;
  background: #bebebe; color: #fff; font-size: 22px; line-height: 1;
}
.de-hero__arrow--prev { left: 1rem; } .de-hero__arrow--next { right: 1rem; }
.de-hero__dots { position: absolute; z-index: 3; bottom: 1.5rem; left: 0; right: 0; display: flex; gap: .5rem; justify-content: center; }
.de-hero__dot { width: 32px; height: 2px; border: 0; padding: 0; background: rgba(255, 255, 255, .45); cursor: pointer; }
.de-hero__dot.is-active { background: #fff; }

/* ------------------------------------------------------- announcement bar */

.de-announcement { font-size: 10px; letter-spacing: 1px; text-transform: uppercase; line-height: 1.25; }
.de-announcement__wrapper {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-height: 40px; padding-block: 8px 11px;
}
.de-announcement__slide { font-weight: 700; letter-spacing: 1.4px; }
.de-announcement__side { display: flex; align-items: center; gap: 1rem; flex: 0 0 auto; }
/* On a phone there is no room for three columns: the message takes its own row and the
 * links sit underneath, centred, instead of being squeezed into a narrow column. */
@media (max-width: 749px) {
  /* SANDBOX phone: 'Customer Service' on the first row, the rotating message on the second */
  .de-announcement__wrapper { flex-direction: column; align-items: stretch; gap: 12px; padding: 10px 10px 10px; min-height: 74px; }
  .de-announcement__side { justify-content: flex-start; gap: .75rem; }
  .de-announcement__side:empty { display: none; }
  .de-announcement__slide { white-space: nowrap; }
}
.de-announcement__lang { display: inline-flex; align-items: center; gap: .35rem; }
.de-announcement__slider { flex: 1 1 auto; overflow: hidden; text-align: center; }
.de-announcement__slides { display: flex; transition: transform .5s ease; }
.de-announcement__slide { flex: 0 0 100%; display: flex; align-items: center; justify-content: center; gap: .5rem; }
/* All messages next to each other instead of one at a time */
.de-announcement__slides--static { justify-content: center; gap: 2rem; }
.de-announcement__slides--static .de-announcement__slide { flex: 0 1 auto; }
/* Running text */
.de-announcement__slides--marquee { gap: 3rem; animation: de-marquee 24s linear infinite; width: max-content; }
.de-announcement__slides--marquee .de-announcement__slide { flex: 0 0 auto; }
.de-announcement__slider:hover .de-announcement__slides--marquee { animation-play-state: paused; }
@keyframes de-marquee { from { transform: none; } to { transform: translateX(-50%); } }
.de-announcement__slide p { margin: 0; }
.de-announcement__link, .de-announcement__drawer-button {
  display: inline-flex; align-items: center; gap: .4rem; background: none; border: 0; padding: 0;
  color: inherit; font: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; text-decoration: none; white-space: nowrap;
}
.de-announcement__link:hover, .de-announcement__drawer-button:hover { text-decoration: underline; text-underline-offset: .25em; }
.de-announcement__icon { width: 14px; height: 14px; flex: none; }

/* --------------------------------------------------------------- drawers */

.de-drawer { position: fixed; inset: 0; z-index: 1000; display: none; }
.de-drawer.is-open { display: block; }
.de-drawer__scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.de-drawer__panel {
  position: absolute; top: 0; bottom: 0; width: min(420px, 90vw); display: flex; flex-direction: column;
  gap: 1.25rem; padding: 1.5rem; overflow-y: auto; box-shadow: 0 0 40px rgba(0, 0, 0, .25);
  animation: de-drawer-in .25s ease;
}
.de-drawer--start .de-drawer__panel { left: 0; }
.de-drawer--end .de-drawer__panel { right: 0; }
@keyframes de-drawer-in { from { transform: translateX(var(--de-drawer-from, -100%)); } to { transform: none; } }
.de-drawer--end .de-drawer__panel { --de-drawer-from: 100%; }
.de-drawer__close {
  position: absolute; top: 1rem; right: 1rem; background: none; border: 0; cursor: pointer;
  color: inherit; font-size: 1.5rem; line-height: 1; padding: .25rem;
}
.de-drawer__close svg { width: 1.25rem; height: 1.25rem; display: block; }
.de-drawer__title { margin: 0 0 .5rem; font-size: 1.25rem; }
.de-drawer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .6rem; }
.de-drawer__list a { color: inherit; text-decoration: none; }
.de-drawer__list a:hover { text-decoration: underline; text-underline-offset: .25em; }
.de-drawer__foot { margin-top: auto; text-align: center; }
.de-drawer__foot img { max-width: 90px; height: auto; margin-inline: auto; display: block; }
.de-drawer__note { color: var(--de-fg-2); font-size: .8125rem; }

/* ---------------------------------------------------------------- header */

.de-header { position: relative; z-index: 900; border-bottom: 1px solid rgba(18, 18, 18, .1); }
.de-header--sticky { position: sticky; top: 0; transition: transform .3s ease, box-shadow .2s ease; }
.de-header--sticky.is-scrolled { box-shadow: 0 6px 24px rgba(0, 0, 0, .06); }
.de-header--sticky.is-hidden { transform: translateY(-100%); }
/* Transparent header sits on top of the first section until the page scrolls. */
.de-header--transparent:not(.is-scrolled) { position: absolute; inset: 0 0 auto; background: transparent; border-bottom-color: transparent; }
.de-header--transparent.de-header--sticky.is-scrolled { position: sticky; }
.de-header__inner { display: flex; align-items: stretch; gap: 0; min-height: 80px; }
.de-header__inner > * { align-self: center; }
/* SANDBOX: 1px lines the full header height, 10% ink — 48px after the logo, 37px before the flag */
.de-header__divider { display: none; align-self: stretch !important; width: 1px; background: rgba(18, 18, 18, .1); flex: none; }
@media (min-width: 992px) {
  .de-header__divider { display: block; }
  .de-header__divider--logo { margin: 0 24px 0 48px; }
  .de-header__divider--actions { margin: 0 29px 0 24px; }
}
.de-header--logo-centered .de-header__divider { display: none; }
.de-header__nav-wrap { min-width: 0; }
.de-header__logo { display: inline-flex; align-items: center; text-decoration: none; color: inherit; flex: none; }
.de-header__logo img { display: block; height: auto; }
.de-header__logo-text { font-family: var(--de-font-heading); font-size: 1.25rem; letter-spacing: -.02em; }
.de-header__nav { display: none; }
.de-header__actions { display: flex; align-items: center; gap: .35rem; margin-left: auto; flex: 0 0 auto; }
.de-header__action {
  display: inline-flex; align-items: center; gap: .4rem; padding: .5rem; border: 0; background: none;
  color: inherit; cursor: pointer; text-decoration: none; font: inherit; position: relative;
}
.de-header__action svg { width: 24px; height: 24px; }
.de-header__actions { gap: 16px; }
.de-header__action { padding: 4px; }
/* Language switch: the flag, then a small list */
.de-lang { position: relative; }
.de-lang__button { padding: 4px 8px; }
.de-flag { width: 19px; height: 14px; display: block; }
.de-header__action .de-flag { width: 19px; height: 14px; }
.de-lang__menu { position: absolute; right: 0; top: calc(100% + 12px); z-index: 30; list-style: none; margin: 0; padding: 8px 0; min-width: 170px; background: #fff; border: 1px solid rgba(18, 18, 18, .1); box-shadow: 0 12px 32px rgba(0, 0, 0, .08); }
.de-lang__menu a { display: flex; align-items: center; gap: 10px; padding: 8px 16px; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; color: #121212; }
.de-lang__menu a:hover, .de-lang__menu a[aria-current] { background: #f4f4f4; }
.de-header__count {
  position: absolute; top: .1rem; right: 0; min-width: 1.05rem; height: 1.05rem; padding: 0 .25rem;
  border-radius: 1rem; background: var(--de-btn); color: var(--de-btn-label);
  font-size: .625rem; line-height: 1.05rem; text-align: center;
}
.de-header__burger { display: inline-flex; }

/* Layout variants — one header, three arrangements */
.de-header--nav-left .de-header__inner { justify-content: flex-start; }
.de-header--nav-centered .de-header__nav-wrap { flex: 1 1 auto; display: flex; justify-content: center; }
.de-header--logo-centered .de-header__logo { position: absolute; left: 50%; transform: translateX(-50%); }
.de-header--logo-centered .de-header__inner { position: relative; }

@media (min-width: 992px) {
  .de-header__nav { display: flex; align-items: center; gap: 1.5rem; }
  .de-header__burger { display: none; }
}

/* The menu shrinks before the logo or the icons do, and never pushes them off screen. */
.de-nav { list-style: none; display: flex; align-items: center; justify-content: center;
  gap: clamp(.75rem, 1.4vw, 1.5rem); margin: 0; padding: 0; flex-wrap: wrap; min-width: 0; }
@media (min-width: 992px) and (max-width: 1280px) {
  .de-nav { gap: 18px; }
}
.de-nav__item { position: relative; }
.de-nav__link {
  display: inline-flex; align-items: center; gap: 6px; padding: 6.25px 0; color: inherit;
  text-decoration: none; font-size: 12px; font-weight: 600; letter-spacing: 1.4px;
  text-transform: uppercase; line-height: 15px; white-space: nowrap;
}
.de-nav__link:hover { text-decoration: underline; text-underline-offset: 6px; }
.de-nav__item--has-children > .de-nav__link::after {
  content: ''; width: 5px; height: 5px; border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor; transform: translateY(-2px) rotate(45deg);
}

/* A highlighted extra link sits in the menu row, so it stays smaller than a page button. */
.de-nav .de-btn { padding: .5rem 1.1rem; font-size: .75rem; }

/* Mega menu */
.de-mega {
  position: absolute; left: 50%; transform: translateX(-50%); top: 100%; z-index: 20;
  min-width: min(920px, 90vw); padding: 2rem; border: 1px solid var(--de-border);
  display: none; gap: 2rem; box-shadow: 0 24px 48px rgba(0, 0, 0, .12);
}
.de-nav__item:hover > .de-mega, .de-nav__item.is-open > .de-mega { display: flex; }
.de-mega__columns { display: grid; grid-template-columns: repeat(var(--de-mega-cols, 4), minmax(0, 1fr)); gap: 1.5rem 2rem; flex: 1 1 auto; }
/* Simple drop-down: same markup, narrow single column, aligned to its menu item. */
.de-mega--list { left: 0; transform: none; min-width: 240px; padding: 1rem 1.25rem; }
.de-mega--list .de-mega__columns { grid-template-columns: 1fr; gap: .5rem; }
.de-mega--list .de-mega__cards { display: none; }
.de-mega__col { display: flex; flex-direction: column; gap: .5rem; }
.de-mega__col-title { font-size: 12px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; text-decoration: none; margin-bottom: 4px; }
.de-mega__link { color: inherit; text-decoration: none; font-size: 14px; line-height: 1.6; }
.de-mega__link:hover { text-decoration: underline; text-underline-offset: .25em; }
.de-mega__cards { display: flex; gap: 1rem; flex: 0 0 auto; }
.de-card-link {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  width: 200px; border-radius: var(--de-card-radius); overflow: hidden; text-decoration: none;
  color: inherit; padding: 1rem;
}
.de-card-link img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.de-card-link__text { position: relative; z-index: 1; }
.de-card-link__title { display: block; font-size: 16px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.2; }
.de-card-link__subtitle { display: block; font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase; opacity: .85; margin-bottom: 4px; }

/* Mobile navigation drawer */
.de-mobile-nav { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.de-mobile-nav > li { border-bottom: 1px solid var(--de-border); }
.de-mobile-nav a { display: block; padding: .85rem 0; color: inherit; text-decoration: none; }
.de-mobile-nav__toggle { background: none; border: 0; color: inherit; cursor: pointer; padding: .5rem; font-size: 1.1rem; }
.de-mobile-nav__row { display: flex; align-items: center; justify-content: space-between; }
.de-mobile-nav__children { list-style: none; margin: 0 0 .5rem; padding: 0 0 0 1rem; display: none; }
.de-mobile-nav__children.is-open { display: block; }

/* Search panel */
.de-search { display: flex; gap: .5rem; }
.de-search input[type='search'] {
  flex: 1 1 auto; padding: .75rem 1rem; border: 1px solid var(--de-border); border-radius: var(--de-input-radius);
  background: transparent; color: inherit; font: inherit;
}

/* ---------------------------------------------------------------- footer */

/* Footer grid: the section sets --de-footer-cols, each block --de-span. Phones: one column
 * (SANDBOX stacks the blocks; the bottom row keeps copyright and payment icons stacked too). */
.de-footer__grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
.de-footer__block { grid-column: 1 / -1; }
@media (min-width: 750px) {
  .de-footer__grid { grid-template-columns: repeat(var(--de-footer-cols, 6), minmax(0, 1fr)); }
  .de-footer__block { grid-column: span var(--de-span, 1); }
}
@media (max-width: 749px) {
  .de-footer__grid { gap: 0; }
  .de-footer__block { padding-bottom: 32px; }
  .de-footer__block:has(> .de-footer__fold) { padding-bottom: 0; }
  .de-footer__block:last-child { padding-bottom: 0; }
  .de-footer--bottom .de-footer__block { padding-bottom: 0; }
}
.de-footer--border-top { border-top: 1px solid var(--de-border); }
.de-footer__block { display: flex; flex-direction: column; gap: .75rem; }
.de-footer__block h2, .de-footer__block h3 { margin: 0 0 8px; font-family: var(--de-font-body); font-size: 10px; font-weight: 400; letter-spacing: 1.6px; text-transform: uppercase; line-height: 2.3; opacity: .75; }
.de-footer__grid { gap: 32px; }
.de-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.de-footer__list a { color: inherit; text-decoration: none; font-size: 14px; line-height: 22.4px; }
.de-footer__list a:hover { opacity: 1; text-decoration: underline; text-underline-offset: .25em; }
.de-footer__text { font-size: 14px; line-height: 1.6; }
.de-footer__text p { margin: 0; }
.de-footer__social { display: flex; gap: .75rem; }
.de-footer__social a { color: inherit; }
.de-footer__social svg { width: 1.25rem; height: 1.25rem; }
.de-footer__payments { display: flex; flex-wrap: wrap; gap: .5rem; }
.de-footer__payments img, .de-footer__payments svg { height: 1.5rem; width: auto; }
.de-pos-v-start { justify-content: flex-start; } .de-pos-v-center { justify-content: center; } .de-pos-v-end { justify-content: flex-end; }
.de-text-start { text-align: left; } .de-text-center { text-align: center; } .de-text-end { text-align: right; }
.de-footer__brand img { max-width: 100%; height: auto; }

/* ------------------------------------------------------------ product grid */

.de-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(var(--de-cols-mobile, 2), minmax(0, 1fr)); }
@media (min-width: 992px) { .de-grid { grid-template-columns: repeat(var(--de-cols, 4), minmax(0, 1fr)); } }
/* SANDBOX collection__grid (measured 1440px, ACNE + CALM): 12px between columns, 36px between rows */
@media (min-width: 750px) { .de-grid { gap: 36px 12px; } }
.de-grid__utilities { display: flex; align-items: center; gap: 1rem; justify-content: space-between; padding-block: 1rem; }
.de-grid__count { color: var(--de-fg-2); font-size: .875rem; }
.de-grid__card { display: flex; flex-direction: column; justify-content: center; gap: .75rem; padding: 1.5rem; border-radius: var(--de-card-radius); overflow: hidden; position: relative; }
.de-grid__card .de-card__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.de-grid__card .de-card__content { position: relative; z-index: 1; display: flex; flex-direction: column; gap: .6rem; }
.de-grid__pagination { display: flex; justify-content: center; padding-block: 2rem; }

/* ------------------------------------------------------------ product info */


/* ------------------------------------------------------- editor preview only */

.estelar-editing .estelar-section.is-hovered { outline: 1px dashed rgba(47, 128, 237, .6); outline-offset: -1px; }
.estelar-editing .estelar-section--disabled { opacity: .45; }
.estelar-editing .estelar-section--disabled::after {
  content: 'hidden'; position: absolute; top: 8px; right: 8px; background: #1f2933; color: #fff;
  font-size: 11px; padding: 2px 6px; border-radius: 4px; letter-spacing: .04em;
}
.estelar-editor-overlay {
  position: absolute; pointer-events: none; display: none; z-index: 9998;
  outline: 2px solid #2f80ed; outline-offset: -2px; border-radius: 2px;
  box-shadow: 0 0 0 9999px rgba(47, 128, 237, .04);
}

/* ---------------------------------------------------------- category cards */

.de-cats__heading { margin: 0 0 1.5rem; font-size: clamp(1.4rem, 2.4vw, 2rem); }
.de-cats__grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(var(--de-cols-mobile, 2), minmax(0, 1fr)); }
@media (min-width: 992px) { .de-cats__grid { grid-template-columns: repeat(var(--de-cols, 4), minmax(0, 1fr)); } }
.de-cat-card { display: block; text-decoration: none; color: inherit; position: relative; }
.de-cat-card__media { display: block; overflow: hidden; border-radius: var(--de-card-radius); background: var(--de-placeholder); }
.de-cat-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.de-cat-card:hover .de-cat-card__media img { transform: scale(1.04); }
.de-cat-card__text { display: flex; align-items: baseline; gap: .5rem; padding-top: .75rem; }
.de-cat-card__name { font-size: .9375rem; letter-spacing: .01em; }
.de-cat-card__count { color: var(--de-fg-2); font-size: .8125rem; }
.de-cat-card--over .de-cat-card__text {
  position: absolute; inset: auto 0 0 0; padding: 1rem; color: #fff; justify-content: center;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .55) 100%);
  border-radius: 0 0 var(--de-card-radius) var(--de-card-radius);
}
.de-cat-card__media--empty { background: linear-gradient(180deg, #f2f2f2 0%, #e4e4e4 100%); }
.de-cat-card--over .de-cat-card__media--empty + .de-cat-card__text { background: none; color: var(--de-fg); }

/* --------------------------------------------------------- shared: heads, rte */

.de-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.de-section-head__title { margin: 0; font-size: var(--de-h4); padding-block: 7.2px; }
.de-section-head__actions { display: flex; align-items: center; gap: .5rem; }
.de-rte { line-height: 1.6; }
.de-rte p { margin: 0 0 .75rem; }
.de-rte p:last-child { margin-bottom: 0; }
.de-measure-narrow { max-width: 48ch; margin-inline: auto; }
.de-measure-medium { max-width: 72ch; margin-inline: auto; }
.de-measure-wide { max-width: 110ch; margin-inline: auto; }
.de-text-start.de-measure-narrow, .de-text-start.de-measure-medium, .de-text-start.de-measure-wide { margin-inline: 0; }
.de-title-small { font-size: var(--de-h5); }
.de-title-medium { font-size: var(--de-h4); }
.de-title-large { font-size: var(--de-h3); }
.de-richtext-section__title { margin: 0 0 16px; letter-spacing: normal; }
.de-richtext-section .de-rte { color: rgba(18, 18, 18, .7); }
.de-scheme-6 .de-richtext-section .de-rte, .de-richtext-section.de-scheme-6 .de-rte { color: rgba(255, 255, 255, .75); }
.de-richtext-section__button { margin-top: 1.25rem; }
/* SANDBOX main-page SEO block keeps 36px under its text (main-page__foot padding-bottom 3.6rem) */
.de-richtext-section__inner { padding-bottom: 36px; }
.de-editor-empty { padding: 2rem; text-align: center; color: #65706e; border: 1px dashed #c9cfd6; margin: 1rem; }

/* SANDBOX slider arrows: plain thin chevrons, no circle */
.de-arrow {
  width: 32px; height: 32px; border: 0; background: transparent; padding: 0;
  color: #121212; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.de-arrow:disabled { opacity: .25; cursor: default; }
.de-arrow__icon { width: 1.1rem; height: 1.1rem; }
.de-arrow__icon--prev { transform: rotate(180deg); }

/* ------------------------------------------------------------------ slider */
/* Native scroll-snap: swipes on touch, scrolls with arrows, no library. */

.de-slider { --de-slide-gap: 12px; position: relative; }
.de-slider__track {
  display: flex; gap: var(--de-slide-gap); overflow-x: auto; scroll-snap-type: x mandatory;
  scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.de-slider__track::-webkit-scrollbar { display: none; }
.de-slider__slide {
  flex: 0 0 calc((100% - (var(--de-per-view-mobile, 1) - 1) * var(--de-slide-gap)) / var(--de-per-view-mobile, 1));
  scroll-snap-align: start; min-width: 0;
}
@media (min-width: 768px) {
  .de-slider__slide { flex-basis: calc((100% - (var(--de-per-view, 4) - 1) * var(--de-slide-gap)) / var(--de-per-view, 4)); }
}
/* Run to the right screen edge, like SANDBOX's "slideshow overflow" */
.de-slider--overflow .de-slider__track { margin-right: calc(-1 * var(--de-gutter)); padding-right: var(--de-gutter); }
.de-slider__dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1.5rem; }
.de-slider__dot { width: .5rem; height: .5rem; border-radius: 50%; border: 0; padding: 0; background: currentColor; opacity: .3; cursor: pointer; }
.de-slider__dot.is-active { opacity: 1; }
.de-slider__slide .product-miniature { margin: 0; width: 100%; }

/* ------------------------------------------------------------- dual tiles */
/* Exact rebuild of the SANDBOX custom promo tile (sections/dual-tiles-custom.liquid). */

.de-dual__heading { margin: 0 0 24px; }
.de-dual__grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.de-dual--stacked .de-dual__grid { gap: 0; }
@media (min-width: 750px) {
  /* SANDBOX: 6-column grid with 16px gaps (measured 1440px: half tile 668.3px) */
  .de-dual__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
  .de-dual--stacked .de-dual__grid { gap: 0; }
  .de-dual__tile { grid-column: span 6; }
  .de-dual--half .de-dual__tile--a, .de-dual--half .de-dual__tile--b { grid-column: span 3; }
  .de-dual--large .de-dual__tile--a { grid-column: span 4; } .de-dual--large .de-dual__tile--b { grid-column: span 2; }
  .de-dual--small .de-dual__tile--a { grid-column: span 2; } .de-dual--small .de-dual__tile--b { grid-column: span 4; }
  .de-dual__tile--full { grid-column: 1 / -1; }
}
@media (max-width: 749px) {
  .de-dual--reverse-mobile .de-dual__tile--a { order: 2; }
}
/* Corners: rounded outer corners inside page width, square when the section runs full width. */
.de-dual__tile { border-radius: 8px; overflow: hidden; }
.de-dual--stacked .de-dual__tile--a { border-radius: 8px 0 0 8px; }
.de-dual--stacked .de-dual__tile--b { border-radius: 0 8px 8px 0; }
.de-w-max-w-full .de-dual__tile, .de-dual .de-w-max-w-full .de-dual__tile { border-radius: 0; }

.de-cdpt {
  position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  text-align: left; gap: 32px; box-sizing: border-box; height: 100%;
  background-color: #ffffff; border: 1px solid #ebebeb; color: #111111;
}
.de-cdpt--light { background-color: #f8f9fa; border-color: #ebebeb; }
.de-cdpt--dark { background-color: #1a1d20; border-color: #1a1d20; color: #ffffff; }
.de-cdpt--box { padding: 64px; border: 0; }
/* dual tiles: SANDBOX .section-dual-tiles__content row gap 36px between text and button (measured 1440px) */
@media (min-width: 750px) { .de-dual__tile.de-cdpt--box { gap: 36px; } }
.de-cdpt--plain { padding: 48px 40px; border: 0; gap: 20px; }
.de-cdpt-split .de-cdpt { padding: 56px 48px; min-height: 480px; border: 0; border-radius: 0; }
.de-cdpt__body { max-width: 100%; }
.de-cdpt__eyebrow {
  display: block; margin: 0 0 14px; font-family: var(--de-font-body); font-size: 13px; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; color: #65706e;
}
.de-cdpt--dark .de-cdpt__eyebrow { color: #9099a1; }
.de-cdpt__title { margin: 0 0 20px; padding: 0; display: block; letter-spacing: -1.88px; }
.de-cdpt__title-serif {
  display: block; margin-bottom: 2px; font-family: var(--de-font-accent); font-weight: 300; font-size: 30px;
  line-height: 1.25; color: #111111; overflow-wrap: break-word; hyphens: auto;
}
.de-cdpt__title-main {
  display: block; font-family: var(--de-font-body); font-weight: 500; font-size: 28px;
  line-height: 1.25; color: #111111; overflow-wrap: break-word; hyphens: auto;
}
.de-cdpt--plain .de-cdpt__title { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.de-cdpt--plain .de-cdpt__title-main { font-weight: 600; }
.de-cdpt--dark .de-cdpt__title-serif, .de-cdpt--dark .de-cdpt__title-main { color: #ffffff; }
.de-cdpt__desc { font-family: var(--de-font-body); font-size: 16px; line-height: 1.6; color: #4a5056; max-width: 46ch; overflow-wrap: break-word; }
.de-cdpt__desc p { margin: 0 0 10px; }
.de-cdpt__desc p:last-child { margin-bottom: 0; }
.de-cdpt__desc ul, .de-cdpt__desc ol { margin: 10px 0; padding-inline-start: 1.3em; }
.de-cdpt__desc li { margin-bottom: 6px; }
.de-cdpt--dark .de-cdpt__desc { color: #c2c7cc; }
.de-cdpt .de-cdpt__btn-pill {
  display: inline-block; padding: 13px 34px; border: 1px solid #111111; border-radius: 26px;
  font-family: var(--de-font-body); font-size: 14.5px; font-weight: 500; line-height: 1.6; color: #111111;
  text-decoration: none; transition: all .2s ease;
}
.de-cdpt .de-cdpt__btn-pill:hover { background-color: #111111; color: #ffffff; }
.de-cdpt .de-cdpt__btn-underline {
  display: inline-block; font-family: var(--de-font-body); font-size: 15px; font-weight: 500; color: #ffffff;
  text-decoration: underline; text-underline-offset: 6px; transition: opacity .2s ease;
}
.de-cdpt .de-cdpt__btn-underline:hover { opacity: .8; }

.de-cdpt-split {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; min-height: 480px;
  border-radius: 8px; overflow: hidden;
}
.de-cdpt-split--large { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.de-cdpt-split--small { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.de-cdpt-split--img-right { direction: rtl; }
.de-cdpt-split--img-right > * { direction: ltr; }
.de-cdpt-split__media { position: relative; overflow: hidden; background: #ffffff; }
.de-cdpt-split__media img { width: 100%; height: 100%; object-fit: contain; display: block; }

@media (max-width: 749px) {
  .de-cdpt--box, .de-cdpt-split .de-cdpt { padding: 40px 28px; min-height: 340px; }
  .de-cdpt__title-serif { font-size: 24px; }
  .de-cdpt__title-main { font-size: 22px; }
  .de-cdpt-split { grid-template-columns: 1fr; gap: 0; }
  .de-cdpt-split__media { min-height: 260px; }
  .de-cdpt--plain { padding: 32px 20px; }
}

/* Media tile (the native SANDBOX tile) */
.de-media-tile { position: relative; overflow: hidden; aspect-ratio: var(--de-ratio-mobile, 1/1); }
@media (min-width: 750px) { .de-media-tile { aspect-ratio: var(--de-ratio, 1/1); } }
.de-media-tile picture, .de-media-tile__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.de-media-tile__link { position: absolute; inset: 0; z-index: 2; }

/* Promo-style split titles used by other sections (before/after) */
.de-promo__title { margin: 0; display: flex; flex-direction: column; }
.de-promo__title .de-serif { display: block; }
.de-promo__title > span:not(.de-serif) { display: block; font-weight: 500; }

/* ---------------------------------------------------------- before / after */

.de-compare-section__grid { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 992px) {
  .de-compare-section--start .de-compare-section__grid { grid-template-columns: 2fr 3fr; }
  .de-compare-section--end .de-compare-section__grid { grid-template-columns: 3fr 2fr; }
  .de-compare-section--end .de-compare-section__text { order: 2; }
}
.de-compare-section__text { display: flex; flex-direction: column; gap: 20px; }
.de-compare-section__heading { margin: 0; line-height: 1; font-family: var(--de-font-accent); font-weight: 300; color: #111111; }
.de-compare-section__heading .de-serif { display: inline; }
.de-compare-section__heading-main { font-family: var(--de-font-body); font-weight: 500; }
.de-compare-section__text .de-rte { font-size: 14px; }
.de-compare { position: relative; overflow: hidden; border-radius: var(--de-card-radius); user-select: none; --de-pos: 50%; }
.de-compare__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.de-compare__before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--de-pos)) 0 0); }
.de-compare__handle { position: absolute; top: 0; bottom: 0; left: var(--de-pos); width: 2px; background: #fff; transform: translateX(-1px); pointer-events: none; }
.de-compare__knob {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2.75rem; height: 2.75rem;
  border-radius: 50%; background: #fff; color: #111; display: flex; align-items: center; justify-content: center;
  font-size: .9rem; letter-spacing: .1em; box-shadow: 0 4px 16px rgba(0, 0, 0, .2);
}
.de-compare__range { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; margin: 0; }
.de-compare__label {
  position: absolute; bottom: 16px; padding: 6px 12px; border-radius: 4px; font-size: 12px; font-weight: 400;
  letter-spacing: normal; text-transform: uppercase; background: #ffffff; color: #121212; pointer-events: none;
}
.de-compare__label--before { left: 1rem; } .de-compare__label--after { right: 1rem; }

/* ----------------------------------------------------------- testimonials */

/* SANDBOX: subline and heading centred, 48px down to the quotes, quotes inset 36px each side */
.de-testimonials .de-testimonials__head { margin-bottom: 48px; text-align: center; }
.de-testimonials .de-slider { padding-inline: 36px; }
@media (max-width: 749px) { .de-testimonials .de-slider { padding-inline: 0; } }
.de-testimonials__head .de-label { margin: 0 0 .5rem; }
.de-quote { margin: 0; padding: 0; }
.de-quote__text { margin: 0; font-size: 14px; line-height: 1.6; border: 0; padding: 0; }
.de-quote__text p { margin: 0; }
.de-quote__text br:last-child { display: none; }
/* SANDBOX: the name comes first, then the quote */
.de-quote { display: flex; flex-direction: column; }
.de-quote__author { order: -1; margin: 0 0 16px; font-size: 16px; font-style: normal; letter-spacing: 0; text-transform: none; }
.de-quote__role { color: var(--de-fg-2); text-transform: none; letter-spacing: 0; }
.de-quote__stars { display: flex; gap: .2rem; justify-content: center; margin-bottom: 1rem; }
.de-quote__star { width: 1rem; height: 1rem; fill: currentColor; }

/* ---------------------------------------------------------- social media row */

.de-social__card { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .75rem; text-align: center; padding: 2rem; }
.de-social__heading { margin: 0; font-size: var(--de-h3); line-height: 1; }
.de-social__item { position: relative; overflow: hidden; }
.de-social__item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.de-social__item:hover img { transform: scale(1.04); }

/* ------------------------------------------------------------ product card */
/* The SANDBOX card: 3:4 media on #f4f4f4 with 8px corners, hover photo, size buttons over
 * the image on hover, small-caps title and price, text left-aligned. */

.de-card { display: flex; flex-direction: column; gap: 16px; padding-bottom: 16px; text-align: left; margin: 0; border-bottom: 1px solid rgba(0, 0, 0, .18); }
.de-card__media-wrap { position: relative; aspect-ratio: 3 / 4; border-radius: 8px; overflow: hidden; background: #f4f4f4; }
.de-card__media { position: absolute; inset: 0; display: block; }
.de-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .45s ease, transform .8s ease; }
/* The photos were flattened to white JPGs; multiply lets the #f4f4f4 panel show through the
 * white exactly like the transparent PNGs on SANDBOX, and keeps the floor shadow in the photo. */
.de-card__img { mix-blend-mode: multiply; }
.de-card__img--none { background: #f4f4f4; }
.de-card__img--hover { opacity: 0; }
.de-card:hover .de-card__img--hover { opacity: 1; }
.de-card:hover .de-card__media:not(.de-card__media--hover) .de-card__img { transform: scale(1.03); }
.de-card__badges { position: absolute; top: 12px; left: 12px; z-index: 2; list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; }
.de-card__badge { background: #ab0000; color: #fff; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; padding: 5px 8px; border-radius: 4px; line-height: 1; }
.de-card__sizes {
  position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2; display: flex; flex-wrap: wrap;
  gap: 6px; justify-content: center; opacity: 0; transform: translateY(8px); transition: opacity .25s ease, transform .25s ease;
}
.de-card:hover .de-card__sizes, .de-card:focus-within .de-card__sizes { opacity: 1; transform: none; }
.de-card__size {
  display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 8px 14px;
  border: 0; border-radius: 50px; background: #111; color: #fff; cursor: pointer; text-decoration: none;
  font-size: 10px; letter-spacing: 1px; text-transform: uppercase; line-height: 1.2; text-align: center;
}
.de-card .de-card__size:hover { background: #fff; color: #111; }
.de-card__size.is-added { background: #fff; color: #111; }
.de-card__content { display: flex; flex-direction: column; gap: 8px; }
.de-card__title { margin: 0; font-family: var(--de-font-body); font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; line-height: 1.25; }
.de-card__title a { color: inherit; text-decoration: none; }
.de-card__title a:hover { text-decoration: underline; text-underline-offset: 3px; }
.de-card__price { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; line-height: 1.25; }
.de-card__price-old { text-decoration: line-through; opacity: .5; margin-right: 6px; }
.de-card__pro { margin: 0; font-size: 12px; color: #65706e; }
.de-card__size-count { margin: 0; font-size: 12px; color: rgba(17, 17, 17, .5); }
/* Touch screens have no hover: the size buttons stay hidden and the size count shows instead. */
@media (min-width: 750px) and (hover: hover) { .de-card__size-count { display: none; } }
@media (hover: none) { .de-card__sizes { display: none; } }

/* SANDBOX copyright row: 12px, 70% white, slight tracking */
.de-footer__grid .de-footer__block:only-child .de-footer__text,
.de-footer--bottom .de-footer__text { font-size: 12px; letter-spacing: .04em; color: rgba(255, 255, 255, .7); }
/* Testimonials subline: 12px uppercase +2px, full white */
.de-testimonials__sub { margin: 0 0 28px; font-size: 12px; font-weight: 400; letter-spacing: 2px; text-transform: uppercase; }

/* ------------------------------------------------ SANDBOX layout measurements
 * Measured on SANDBOX (theme 205155533139) at the same window size, 2026-09-18. */

/* Popular products: 37px heading → cards; the card text block reserves 58px like SANDBOX's
 * (title, price and the size line) so every card row keeps the same height. */
.de-featured .de-section-head { margin-bottom: 37px; }
.de-card__content { min-height: 58px; }

/* Before / after: narrow text column, big image, 64px apart, both top-aligned. */
@media (min-width: 992px) {
  .de-compare-section--start .de-compare-section__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 7fr); gap: 64px; align-items: start; }
  .de-compare-section--end .de-compare-section__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 3fr); gap: 64px; align-items: start; }
}
.de-compare-section__text { gap: 24px; }

/* Testimonials: 266px cards on a 12px gap (3.3 visible), no dots, 88px under the cards. */
.de-testimonials .de-slider { padding-bottom: 88px; }
/* each quote: 36px padding inside, name 19px above the quote, all cards as tall as the tallest */
.de-testimonials .de-quote { padding: 36px; }
.de-testimonials .de-quote__author { margin-bottom: 19px; }
.de-testimonials .de-slider__dots { display: none; }
.de-testimonials .de-testimonials__head { padding-top: 12px; }
@media (max-width: 749px) { .de-testimonials .de-slider { padding-bottom: 48px; } .de-testimonials .de-quote { padding: 24px; } }

/* Copyright row: 35px above, 19px below the 12px line. */
.de-footer--bottom.de-footer { padding-top: 35px; padding-bottom: 19px; }

/* ------------------------------------------------ SANDBOX phone layout (390px) */
@media (max-width: 749px) {
  .de-header__inner { min-height: 68px; }
  /* product cards: text indented 12px under the image */
  .de-card__content { padding-inline: 12px; }
  /* testimonials: 36px inside each card, as on desktop */
  .de-testimonials .de-quote { padding: 36px; }
  /* social row: heading above, photos one at a time full width, 'Follow us' centred below */
  .de-social .de-social__card { display: none; }
  .de-social__mobile-head { display: block; margin: 0 0 24px; padding-inline: var(--de-gutter); text-align: center; }
  .de-social__mobile-button { display: block; margin: 24px 0 0; text-align: center; }
  /* footer: link lists fold out */
  .de-footer__fold { border-top: 1px solid rgba(255, 255, 255, .15); }
  .de-footer__fold summary { display: flex; align-items: center; justify-content: space-between; min-height: 72px; cursor: pointer; list-style: none; }
  .de-footer__fold summary::-webkit-details-marker { display: none; }
  .de-footer__fold summary::after { content: '+'; font-size: 18px; line-height: 1; }
  .de-footer__fold[open] summary::after { content: '–'; }
  .de-footer__fold summary h2 { margin: 0; }
  .de-footer__fold .de-footer__list { padding-bottom: 24px; gap: 12px; }
}
@media (min-width: 750px) {
  .de-social__mobile-head, .de-social__mobile-button { display: none; }
  .de-footer__fold summary { list-style: none; pointer-events: none; }
  .de-footer__fold summary::-webkit-details-marker { display: none; }
}

/* Media tile with 'auto' shape: the photo keeps its own proportions instead of a fixed box. */
@media (max-width: 749px) {
  .de-media-tile--auto-mobile { aspect-ratio: auto; }
  .de-media-tile--auto-mobile picture, .de-media-tile--auto-mobile .de-media-tile__media { position: static; height: auto; }
}
@media (min-width: 750px) {
  .de-media-tile--auto { aspect-ratio: auto; }
  .de-media-tile--auto picture, .de-media-tile--auto .de-media-tile__media { position: static; height: auto; }
}

/* ------------------------------------------------------ custom promo card (grid)
 * The user's own SANDBOX component, values unchanged from assets/component-promo-card.css.
 * The grid cell around it is neutral: the card carries its own colours and padding. */
.de-grid__card.de-grid__card--promo_card { padding: 0; background: none; border-radius: 0; display: block; overflow: visible; }
.cd-promo {
  position: relative; display: flex; flex-direction: column; justify-content: space-between;
  padding: 36px 32px; border-radius: 4px; height: 100%; min-height: 400px; box-sizing: border-box;
  background-color: #F8F9FA; border: 1px solid #EBEBEB; color: #111111; overflow: hidden;
}
.cd-promo.cd-promo--dark { background-color: #1A1D20; border-color: #1A1D20; color: #FFFFFF; }
.cd-promo.cd-promo--has-image { border-color: transparent; }
.cd-promo-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.cd-promo-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
@media (hover: hover) { .cd-promo--has-image:hover .cd-promo-media img { transform: scale(1.05); } }
.cd-promo-overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.4) 45%, rgba(0,0,0,.08) 72%, rgba(0,0,0,0) 100%);
}
.cd-promo--has-image.cd-promo--light .cd-promo-overlay {
  background: linear-gradient(to top, rgba(255,255,255,.9) 0%, rgba(255,255,255,.6) 45%, rgba(255,255,255,.18) 72%, rgba(255,255,255,0) 100%);
}
.cd-promo--has-image .cd-promo-top, .cd-promo--has-image .cd-promo-bottom, .cd-promo--has-image .cd-promo-badge { position: relative; z-index: 2; }
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-eyebrow { color: #E5E7EA; }
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-title-serif,
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-title-main { color: #FFFFFF; }
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-desc { color: #E5E7EA; }
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-btn-underline { color: #FFFFFF; }
.cd-promo--has-image.cd-promo--light .cd-promo-eyebrow { color: #4A5056; }
.cd-promo--has-image.cd-promo--light .cd-promo-title-serif,
.cd-promo--has-image.cd-promo--light .cd-promo-title-main { color: #111111; }
.cd-promo--has-image.cd-promo--light .cd-promo-desc { color: #4A5056; }
.cd-promo--has-image.cd-promo--light .cd-promo-badge { background-color: #111111; color: #FFFFFF; }
.cd-promo-badge {
  display: inline-block; align-self: flex-start; padding: 6px 14px; margin-bottom: 16px; border-radius: 20px;
  font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .03em;
  background-color: #111111; color: #FFFFFF;
}
.cd-promo--dark .cd-promo-badge, .cd-promo--has-image:not(.cd-promo--light) .cd-promo-badge { background-color: #FFFFFF; color: #111111; }
.cd-promo-top { display: flex; flex-direction: column; }
.cd-promo-eyebrow {
  display: block; font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: #65706E; margin: 0 0 10px; text-wrap: pretty;
}
.cd-promo--dark .cd-promo-eyebrow { color: #9099A1; }
.cd-promo-title { margin: 0 0 16px; padding: 0; display: block; letter-spacing: normal; }
.cd-promo-title-serif { display: block; font-family: 'Montserrat', sans-serif; font-style: normal; font-weight: 300; font-size: 28px; line-height: 1.25; color: #111111; margin-bottom: 2px; text-wrap: pretty; }
.cd-promo-title-main { display: block; font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 24px; line-height: 1.25; color: #111111; text-wrap: pretty; }
.cd-promo--dark .cd-promo-title-serif, .cd-promo--dark .cd-promo-title-main { color: #FFFFFF; }
.cd-promo-desc { font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 400; line-height: 1.6; margin: 0; color: #4A5056; text-wrap: pretty; }
.cd-promo--dark .cd-promo-desc { color: #C2C7CC; }
.cd-promo-bottom { margin-top: 28px; }
.cd-promo .cd-promo-btn-pill {
  display: inline-block; padding: 10px 28px; border: 1px solid #111111; border-radius: 24px;
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; color: #111111; text-decoration: none; transition: all .2s ease;
}
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-btn-pill { border-color: #FFFFFF; color: #FFFFFF; }
.cd-promo .cd-promo-btn-pill:hover { background-color: #111111; color: #FFFFFF; }
.cd-promo--has-image:not(.cd-promo--light) .cd-promo-btn-pill:hover { background-color: #FFFFFF; color: #111111; }
.cd-promo .cd-promo-btn-underline {
  display: inline-block; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 500; color: #FFFFFF;
  text-decoration: underline; text-underline-offset: 6px; transition: opacity .2s ease;
}
.cd-promo .cd-promo-btn-underline:hover { opacity: .8; }
/* Phones: always the full row, never squeezed next to a product (SANDBOX behaviour). */
@media (max-width: 749px) {
  .de-grid__card.de-grid__card--promo_card { grid-column: 1 / -1 !important; }
  .cd-promo { min-height: 340px; padding: 32px 26px; }
  .cd-promo-title-serif { font-size: 22px; }
  .cd-promo-title-main { font-size: 19px; }
  .cd-promo-eyebrow { font-size: 11px; }
}

/* ---------------------------------------------- the custom pattern, shared
 * One visual language for section heads, taken from the SANDBOX custom promo card:
 * eyebrow 12/600 uppercase +.08em · Montserrat Light line 28 (22) · Poppins main 24/500 (19) ·
 * text 14/400 · pill button 13.5/500 (light) · underline button 14/500 (dark). */
.de-eyebrow { display: block; margin: 0 0 10px; font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #65706E; }
.de-scheme-6 .de-eyebrow { color: #9099A1; }
.de-pair { margin: 0; padding: 0; letter-spacing: normal; line-height: 1.25; }
.de-pair__serif { display: block; font-family: 'Montserrat', sans-serif; font-weight: 300; font-size: 28px; margin-bottom: 2px; }
.de-pair__main { display: block; font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 24px; }
.de-pair--inline { font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 24px; }
.de-pair--inline em { font-family: 'Montserrat', sans-serif; font-weight: 300; font-style: normal; font-size: 28px; }
.de-pill { display: inline-flex; align-items: center; gap: 8px; padding: 10px 28px; border: 1px solid #111111; border-radius: 24px; font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; color: #111111; text-decoration: none; transition: all .2s ease; }
.de-pill:hover { background: #111111; color: #FFFFFF; }
.de-social .cd-promo-btn-underline { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; text-decoration: underline; text-underline-offset: 6px; color: inherit; }
@media (max-width: 749px) {
  .de-eyebrow { font-size: 11px; }
  .de-pair__serif, .de-pair--inline em { font-size: 22px; }
  .de-pair__main, .de-pair--inline { font-size: 19px; }
}
/* testimonials head keeps its centred place; the quotes are the 14px text of the pattern */
.de-testimonials .de-testimonials__head .de-eyebrow { margin-bottom: 10px; }

/* ------------------------------------------------------------------ quick view
 * PrestaShop's quick view (Bootstrap modal markup, opened by the theme script) styled in the
 * custom pattern. The minimal modal rules replace classic's stylesheet on section pages. */
.de-card__qv {
  position: absolute; left: 50%; bottom: 12px; z-index: 3; transform: translate(-50%, 8px); opacity: 0;
  padding: 10px 22px; border: 0; border-radius: 24px; background: #FFFFFF; color: #111111; cursor: pointer;
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; white-space: nowrap;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .08); transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.de-card:hover .de-card__qv, .de-card:focus-within .de-card__qv { opacity: 1; transform: translate(-50%, 0); }
.de-card__qv:hover { background: #111111; color: #FFFFFF; }
@media (hover: none) { .de-card__qv { display: none; } }

.modal { position: fixed; inset: 0; z-index: 1050; display: none; overflow-x: hidden; overflow-y: auto; outline: 0; }
.modal-open { overflow: hidden; }
.fade { opacity: 0; transition: opacity .2s linear; }
.fade.in, .fade.show { opacity: 1; }
.modal.fade .modal-dialog { transform: translateY(16px); transition: transform .25s ease-out; }
.modal.in .modal-dialog, .modal.show .modal-dialog { transform: none; }
.modal-backdrop { position: fixed; inset: 0; z-index: 1040; background: #000; }
.modal-backdrop.fade { opacity: 0; }
.modal-backdrop.in, .modal-backdrop.show { opacity: .45; }
.modal-dialog { position: relative; width: auto; max-width: 960px; margin: 24px auto; padding: 0 16px; }
.modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 48px); }
.modal-content { position: relative; width: 100%; background: #FFFFFF; border-radius: 8px; overflow: hidden; }

.de-qv__close { position: absolute; top: 14px; right: 14px; z-index: 2; background: none; border: 0; padding: 6px; cursor: pointer; color: #111111; opacity: 1; }
.de-qv__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; padding: 40px; }
@media (max-width: 749px) { .de-qv__body { grid-template-columns: 1fr; gap: 24px; padding: 48px 20px 28px; } }
.de-qv__cover { aspect-ratio: 3 / 4; border-radius: 8px; overflow: hidden; background: #f4f4f4; }
.de-qv__cover img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; display: block; }
.de-qv__thumbs { list-style: none; margin: 12px 0 0; padding: 0; display: flex; gap: 8px; overflow-x: auto; }
.de-qv__thumbs li { flex: 0 0 64px; }
.de-qv__thumbs img { width: 64px; height: 80px; object-fit: cover; border-radius: 6px; background: #f4f4f4; mix-blend-mode: multiply; cursor: pointer; border: 1px solid transparent; }
.de-qv__thumbs img.selected { border-color: #111111; }
.de-qv__info { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.de-qv__info .de-eyebrow { margin: 0; }
.de-qv__title { margin: 0; font-family: 'Poppins', sans-serif; font-size: 24px; font-weight: 500; line-height: 1.25; letter-spacing: normal; color: #111111; }
.de-qv__desc { font-size: 14px; line-height: 1.6; color: #4A5056; }
.de-qv__desc p { margin: 0 0 10px; }
.de-qv__more { font-size: 14px; font-weight: 500; color: #111111; text-decoration: underline; text-underline-offset: 6px; }

/* price block (classic product-prices.tpl) — quick view and product page */
.de-qv .product-prices, .de-product .product-prices { display: flex; flex-direction: column; gap: 4px; }
.de-qv .current-price, .de-product .current-price { display: flex; align-items: baseline; gap: 10px; }
.de-qv .current-price-value, .de-product .current-price-value { font-size: 18px; font-weight: 500; color: #111111; }
.de-qv .regular-price, .de-product .regular-price { font-size: 14px; color: #65706E; text-decoration: line-through; }
.de-qv .discount, .de-product .discount { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #AB0000; }
.de-qv .tax-shipping-delivery-label, .de-product .tax-shipping-delivery-label { font-size: 12px; color: #65706E; }
.de-qv .product-price, .de-product .product-price, .de-qv .product-discount, .de-product .product-discount { margin: 0; }

/* sizes (classic product-variants.tpl): label as eyebrow, options as outlined pills */
.product-variants-item { margin: 0 0 16px; }
.product-variants-item .control-label { display: block; margin: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #65706E; }
.product-variants-item ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.product-variants-item .input-container { float: none; position: relative; }
.product-variants-item .input-radio { position: absolute; opacity: 0; inset: 0; cursor: pointer; margin: 0; }
.product-variants-item .radio-label {
  display: inline-block; padding: 10px 16px; border: 1px solid rgba(17, 17, 17, .15); border-radius: 24px;
  font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: #111111; background: #FFFFFF; cursor: pointer;
}
.product-variants-item .input-radio:checked + .radio-label { border-color: #111111; }
.product-variants-item select.form-control {
  width: 100%; padding: 12px 40px 12px 16px; border: 1px solid rgba(17, 17, 17, .15); border-radius: 24px; background: #FFFFFF;
  font-size: 13px; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}

/* quantity + add to cart */
.de-atc { display: flex; flex-direction: column; gap: 10px; }
.de-atc__row { display: flex; align-items: stretch; gap: 10px; flex-wrap: wrap; }
.de-qty { display: inline-flex; align-items: center; border: 1px solid rgba(17, 17, 17, .15); border-radius: 24px; overflow: hidden; }
.de-qty__btn { width: 40px; height: 46px; border: 0; background: transparent; cursor: pointer; font-size: 18px; color: #111111; }
.de-qty__input { width: 44px; height: 46px; border: 0; text-align: center; font-size: 14px; -moz-appearance: textfield; background: transparent; }
.de-qty__input::-webkit-outer-spin-button, .de-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.de-atc .add { flex: 1 1 auto; }
.de-atc__button {
  width: 100%; height: 48px; padding: 0 28px; border: 1px solid #111111; border-radius: 24px; background: #111111; color: #FFFFFF;
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; cursor: pointer; transition: all .2s ease;
}
.de-atc__button:hover { background: #FFFFFF; color: #111111; }
.de-atc__button:disabled { opacity: .35; cursor: not-allowed; }
.de-atc__availability { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: #65706E; }
.de-atc__dot { width: 7px; height: 7px; border-radius: 50%; background: #2E7D32; }
.de-atc__dot--unavailable { background: #AB0000; }
.de-atc__dot--last_remaining_items { background: #E0A100; }
.product-minimal-quantity:empty { display: none; }
.de-qv__extra:empty { display: none; }

/* ---------------------------------- PrestaShop widgets on Estelar pages
 * classic's stylesheet is not loaded here, so its widgets get our pattern. */

/* Section pages do not load the theme stylesheet with the Material Icons font: never show its empty glyph
   boxes there. Only on those pages (same list as SECTION_PAGES in estelarsections.php) — account, cart and
   checkout load the font and need the icons (e.g. the tick of the registration check boxes). */
:is(#index, #product, #category, #cms, #search, #best-sales, #new-products, #prices-drop, #manufacturer).de-layout .material-icons { display: none !important; }

/* Quantity: classic's script wraps the field in TouchSpin with its own up/down arrows — we
 * already have − / +, so the wrapper disappears and its arrows are hidden. */
.de-qty .bootstrap-touchspin { display: contents; }
.de-qty .input-group-btn-vertical, .de-qty .bootstrap-touchspin-prefix, .de-qty .bootstrap-touchspin-postfix { display: none !important; }
.de-qty .de-qty__input, .de-qty input.form-control { height: 46px; }

/* "Notify me when available" (ps_emailalerts) in the custom pattern */
.js-mailalert { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; }
.js-mailalert input[type=email] {
  flex: 1 1 200px; min-width: 0; height: 46px; padding: 0 16px; border: 1px solid rgba(17, 17, 17, .15);
  border-radius: 24px; font-size: 14px; background: #FFFFFF; color: #111111;
}
.js-mailalert .btn, .js-mailalert button {
  height: 46px; padding: 0 22px; border: 1px solid #111111; border-radius: 24px; background: transparent;
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; color: #111111; cursor: pointer; transition: all .2s ease;
}
.js-mailalert .btn:hover, .js-mailalert button:hover { background: #111111; color: #FFFFFF; }
.js-mailalert .alert, .js-mailalert-alerts { width: 100%; font-size: 12px; color: #65706E; }

/* Sort by (classic sort-orders.tpl, Bootstrap dropdown): closed until clicked */
.products-sort-order { position: relative; display: inline-block; }
.products-sort-order .select-title {
  display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 16px; border: 1px solid rgba(17, 17, 17, .15);
  border-radius: 24px; background: #FFFFFF; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: #111111;
  text-decoration: none; cursor: pointer;
}
.products-sort-order .select-title::after {
  content: ''; width: 6px; height: 6px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-2px) rotate(45deg);
}
.dropdown-menu { display: none; }
.products-sort-order .dropdown-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 220px; padding: 8px 0;
  background: #FFFFFF; border: 1px solid rgba(17, 17, 17, .1); box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
}
.open > .dropdown-menu, .show > .dropdown-menu, .dropdown-menu.show { display: block; }
.products-sort-order .dropdown-menu a {
  display: block; padding: 8px 16px; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: #111111; text-decoration: none;
}
.products-sort-order .dropdown-menu a:hover, .products-sort-order .dropdown-menu a.current { background: #f4f4f4; }
.sort-by-row { display: flex; align-items: center; gap: 12px; }
.sort-by { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: #65706E; white-space: nowrap; }

/* ------------------------------------------------------- menu (SANDBOX header)
 * Measured on SANDBOX 1440px: red #AB0000 underline growing from the left on hover (2px here,
 * a little stronger as asked); mega panel full width under the header, white, 32/36px padding,
 * 1px #EBEBEB top line, no shadow; column titles 16/600; links 14/400 uppercase -0.04em, 37px
 * apart; cards 3:4, 8px corners, centred text (14px subtitle, 36px title); menus without a
 * third level open as a small list. */
.de-header__inner { position: static; }
.de-header .de-w-max-w-fluid, .de-header .de-w-max-w-page { position: static; }
.de-nav__item { position: static; }
.de-nav__link { position: relative; }
.de-nav__link::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--de-brand-red);
  transform: scaleX(0); transform-origin: right center; opacity: .3;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .3s ease;
}
.de-nav__item:hover > .de-nav__link::before, .de-nav__link:focus-visible::before, .de-nav__item.is-open > .de-nav__link::before {
  transform: scaleX(1); transform-origin: left center; opacity: 1;
}
.de-nav__link:hover { text-decoration: none; }
/* Each item fills the full header height, so the pointer never leaves it on the way down to the panel. */
@media (min-width: 992px) {
  .de-header__nav-wrap { display: flex; align-self: stretch; }
  .de-header__nav, .de-nav { align-items: stretch; align-self: stretch; }
  .de-nav__item { display: flex; align-items: center; }
}

.de-mega {
  position: absolute; left: 0; right: 0; top: 100%; transform: none; min-width: 0; z-index: 20;
  display: none; gap: 24px; align-items: flex-start;
  padding: 32px var(--de-gutter); background: #FFFFFF; border: 0; border-top: 1px solid #EBEBEB; box-shadow: none;
}
.de-nav__item:hover > .de-mega, .de-nav__item.is-open > .de-mega { display: flex; }
/* left half: 234px columns, 344px apart; right half: the cards share the space (2 → 326px, 3 → 210px) */
.de-mega__columns { display: grid; grid-template-columns: repeat(auto-fill, 234px); gap: 24px 110px; flex: 1 1 50%; align-content: start; }
.de-mega__col { display: flex; flex-direction: column; gap: 8px; }
.de-mega__col-title {
  margin: 0 0 8px; font-size: 16px; font-weight: 600; letter-spacing: .02em; text-transform: none; line-height: 20px; color: #121212; text-decoration: none;
}
.de-mega__link {
  display: inline-block; font-size: 14px; font-weight: 400; letter-spacing: -0.04em; text-transform: uppercase; line-height: 21px;
  padding-block: 4px; color: #121212; text-decoration: none; background: linear-gradient(#121212, #121212) 0 100% / 0 1px no-repeat;
  transition: background-size .3s ease; align-self: flex-start;
}
.de-mega__link:hover { background-size: 100% 1px; text-decoration: none; }
.de-mega__cards { display: flex; gap: 23px; margin-left: auto; flex: 0 0 calc(50% - 36px); }
.de-mega__cards .de-card-link { flex: 1 1 0; width: auto; }
.de-header .de-card-link.de-card-link {
  aspect-ratio: 3 / 4 !important; border-radius: 8px; padding: 24px; justify-content: center;
  align-items: center; text-align: center; color: var(--de-fg); background: var(--de-bg);
}
.de-header .de-card-link.de-pos-end { justify-content: flex-end; }
.de-header .de-card-link.de-pos-start { justify-content: flex-start; }
.de-card-link.de-pos-end { justify-content: flex-end; }
.de-card-link__subtitle { font-size: 14px; font-weight: 400; letter-spacing: normal; text-transform: none; opacity: 1; margin-bottom: 4px; }
.de-card-link__title { font-size: 36px; font-weight: 400; letter-spacing: -0.04em; line-height: 1; }

/* small drop-down list (Mesotherapy, Peels): under its own item, 4px corners */
.de-nav__item--has-children:has(> .de-mega--list) { position: relative; }
.de-mega.de-mega--list {
  left: -16px; right: auto; min-width: 196px; padding: 20px 0; border: 0; border-top: 1px solid #EBEBEB; border-radius: 0 0 4px 4px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .08); display: none;
}
/* Professional: the list with its card beside it (SANDBOX dropdown-with-card, 386px) */
.de-nav__item:hover > .de-mega--with-card, .de-nav__item.is-open > .de-mega--with-card { display: flex; gap: 0; padding: 0; width: 386px; left: auto; right: -16px; }
.de-mega--with-card .de-mega__columns { flex: 0 0 196px; padding: 20px 0; }
.de-mega.de-mega--with-card .de-mega__cards { display: flex; flex: 1 1 auto; margin: 0; padding: 12px; }
.de-mega--with-card .de-card-link__title { font-size: 21px; }
.de-nav__item:hover > .de-mega--list, .de-nav__item.is-open > .de-mega--list { display: block; }
.de-mega--list .de-mega__columns { display: flex; flex-direction: column; gap: 4px; }
/* list links: normal case 14px, roomy rows, soft highlight on hover (SANDBOX) */
/* same hover as the mega links: the thin line grows under the text (no grey box) */
.de-mega--list .de-mega__link { display: block; align-self: flex-start; margin: 0 8px; padding: 14px 8px; border-radius: 0; text-transform: none; letter-spacing: normal;
  background: linear-gradient(#121212, #121212) 0 100% / 0 1px no-repeat; background-origin: content-box; background-clip: content-box; }
.de-mega--list .de-mega__link:hover { background-size: 100% 1px; }
.de-mega--list .de-mega__col { gap: 0; }
.de-mega--list .de-mega__cards { display: none; }
/* mega panel halves: links in the left half, cards in the right half (starts at the middle) */
.de-mega:not(.de-mega--list) { gap: 0; }
.de-mega:not(.de-mega--list) .de-mega__columns { flex: 0 0 50%; }
.de-mega:not(.de-mega--list) .de-mega__cards { flex: 0 0 50%; margin-left: 0; }
/* card colours come from their own scheme (beats classic's #header link rule) */
#header .de-header .de-card-link, .de-header .de-card-link.de-card-link { color: var(--de-fg); }
/* Professional: list and card side by side, 386px */
.de-nav__item:hover > .de-mega.de-mega--with-card, .de-nav__item.is-open > .de-mega.de-mega--with-card { display: flex; align-items: stretch; }
.de-mega.de-mega--with-card .de-mega__cards { flex: 1 1 auto; max-width: 190px; }
/* card left, list right (the user's choice, 2026-09-18) */
.de-mega.de-mega--with-card .de-mega__cards { order: -1; }
/* cards shown on desktop only stay flex boxes (the show-desktop helper would make them inline) */
@media (min-width: 992px) { .de-header .de-card-link.de-show-desktop { display: flex !important; } }

/* Professional size: SANDBOX login button in the price slot (the former lock app's style) */
.de-locked-price { margin: 0 0 16px; }
a.de-locked {
  display: inline-block; align-self: flex-start; width: auto; max-width: 100%; padding: 8px 16px; border-radius: 8px; background: linear-gradient(135deg, #11998E 0%, #38EF7D 100%);
  color: #FFFFFF; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 700; line-height: normal; text-decoration: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1); transition: transform .3s, box-shadow .3s; cursor: pointer;
}
a.de-locked:hover, a.de-locked:focus-visible { color: #FFFFFF; text-decoration: none; transform: translateY(-3px); box-shadow: 0 4px 6px rgba(0, 0, 0, .2); }
.de-locked--note { margin: 0; font-size: 14px; color: var(--de-fg, #121212); }

/* PrestaShop's share buttons (ps_sharebuttons) in quick view and on the product page:
 * "Share" in the compact eyebrow style, round outline icons that fill on hover. */
.social-sharing { display: flex; align-items: center; gap: 16px; margin: 20px 0 0; }
.social-sharing > span { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #121212; }
.social-sharing ul { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.social-sharing li { margin: 0; padding: 0; background: none !important; }
.social-sharing li a {
  position: relative; display: block; width: 36px; height: 36px; border: 1px solid rgba(0, 0, 0, .18); border-radius: 50%;
  font-size: 0; color: transparent; overflow: hidden; transition: background-color .2s ease, border-color .2s ease;
}
.social-sharing li a::before {
  content: ''; position: absolute; inset: 9px; background: #121212; transition: background-color .2s ease;
  -webkit-mask: var(--de-share-icon) center / contain no-repeat; mask: var(--de-share-icon) center / contain no-repeat;
}
.social-sharing li a:hover { background: #121212; border-color: #121212; }
.social-sharing li a:hover::before { background: #FFFFFF; }
.social-sharing .facebook a { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 22v-8h2.7l.4-3.2h-3.1V8.8c0-.9.3-1.5 1.6-1.5h1.7V4.4c-.3 0-1.3-.1-2.4-.1-2.4 0-4 1.5-4 4.1v2.4H7.6V14h2.8v8z'/%3E%3C/svg%3E"); }
.social-sharing .twitter a { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.8 3h3.1l-6.8 7.7L22 21h-6.2l-4.9-6.4L5.3 21H2.2l7.2-8.3L1.8 3h6.4l4.4 5.8zm-1.1 16.2h1.7L7.4 4.7H5.6z'/%3E%3C/svg%3E"); }
.social-sharing .pinterest a { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-3.6 19.3c-.1-.8-.2-2 0-2.9l1.2-5s-.3-.6-.3-1.5c0-1.4.8-2.5 1.8-2.5.9 0 1.3.6 1.3 1.4 0 .9-.5 2.2-.8 3.4-.2 1 .5 1.9 1.6 1.9 1.9 0 3.3-2 3.3-4.9 0-2.6-1.9-4.3-4.5-4.3-3 0-4.8 2.3-4.8 4.6 0 .9.4 1.9.8 2.4.1.1.1.2.1.3l-.3 1.2c0 .2-.2.3-.4.2-1.3-.6-2.2-2.6-2.2-4.2 0-3.4 2.5-6.6 7.2-6.6 3.8 0 6.7 2.7 6.7 6.3 0 3.7-2.4 6.8-5.6 6.8-1.1 0-2.2-.6-2.5-1.3l-.7 2.6c-.2 1-.9 2.2-1.4 2.9A10 10 0 1 0 12 2z'/%3E%3C/svg%3E"); }
.de-product__extra:empty { display: none; }

/* ------------------------------------------------------------------ product page
 * Built from the quick view (same pieces, same type), at page scale. Columns as SANDBOX:
 * gallery ~60 %, info ~40 %, 32px apart; the info column stays in view while scrolling. */
.de-pdp__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
@media (min-width: 990px) {
  .de-pdp__grid { grid-template-columns: minmax(0, 1.53fr) minmax(0, 1fr); gap: 32px; }
  .de-pdp__info.is-sticky { position: sticky; top: calc(var(--de-chrome, 0px) + 24px); }
}
.de-pdp__cover { aspect-ratio: 4 / 5; border-radius: 8px; overflow: hidden; background: #f4f4f4; }
.de-pdp__cover img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; display: block; }
.de-pdp__cover-empty { display: block; width: 100%; height: 100%; }
.de-pdp__thumbs { list-style: none; margin: 12px 0 0; padding: 0; display: flex; gap: 8px; overflow-x: auto; }
.de-pdp__thumbs li { flex: 0 0 80px; }
.de-pdp__thumbs img { width: 80px; height: 100px; object-fit: cover; border-radius: 6px; background: #f4f4f4; mix-blend-mode: multiply; cursor: pointer; border: 1px solid transparent; display: block; }
.de-pdp__thumbs img.selected { border-color: #111111; }

.de-pdp__info { min-width: 0; }
.de-pdp form#add-to-cart-or-refresh { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.de-pdp__head { display: flex; flex-direction: column; gap: 8px; }
.de-pdp__head .de-eyebrow { margin: 0; }
.de-pdp__title { margin: 0; font-family: 'Poppins', sans-serif; font-size: 24px; font-weight: 500; line-height: 1.25; letter-spacing: normal; color: #111111; }
.de-pdp__subtitle { margin: 7px 0 0; font-family: 'Poppins', sans-serif; font-size: 17px; font-weight: 400; line-height: 1.35; letter-spacing: normal; color: #3D4349; }
.de-pdp__desc-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.de-pdp__desc { font-size: 14px; line-height: 1.6; color: #4A5056; }
.de-pdp__desc p { margin: 0 0 10px; }
.de-pdp__desc p:last-child { margin-bottom: 0; }
.de-pdp__desc.is-clamped:not(.is-open) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--de-lines, 3); line-clamp: var(--de-lines, 3); overflow: hidden; }
.de-pdp__more { padding: 0; border: 0; background: none; cursor: pointer; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 500; color: #111111; text-decoration: underline; text-underline-offset: 6px; }
.de-pdp__variants .product-variants-item:last-child { margin-bottom: 0; }
.de-pdp__buy { display: flex; flex-direction: column; gap: 4px; }

/* the six toggles — SANDBOX accordion: 24px rows, 1px #EBEBEB line, 16px titles, +/− icon */
.de-pdp__buy + .de-acc, .de-pdp__buy + .de-pdp__text { margin-top: 8px; }
.de-acc { padding: 24px 0; border-bottom: 1px solid #EBEBEB; }
.de-acc__title {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 2px 0; cursor: pointer; list-style: none;
  font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 400; line-height: 16px; letter-spacing: -0.04em; color: #111111;
}
.de-acc__title::-webkit-details-marker { display: none; }
.de-acc__icon { flex: none; }
.de-acc__plus { transform-origin: center; transform-box: fill-box; transition: transform .25s ease; }
.de-acc[open] .de-acc__plus { transform: scaleY(0); }
.de-acc__body { padding-top: 16px; font-size: 14px; line-height: 22.4px; color: #121212; }
.de-acc__body p, .de-acc__body ul, .de-acc__body ol { margin: 0 0 14px; }
.de-acc__body ul, .de-acc__body ol { padding-left: 40px; }
.de-acc__body > :last-child, .de-acc__body > :last-child > :last-child { margin-bottom: 0; }
.de-pdp__text { font-size: 14px; line-height: 22.4px; color: #121212; }

/* Wishlist (blockwishlist) heart next to Add to cart: its icon font is not loaded here, so the
 * heart is drawn with a mask; filled once the product is on a list (is-added, set by storefront.js). */
.wishlist-button-add.wishlist-button-product {
  position: relative; flex: none; width: 48px; height: 48px; margin: 0; padding: 0; border: 1px solid rgba(17, 17, 17, .15);
  border-radius: 50%; background: #FFFFFF; box-shadow: none; cursor: pointer; transition: border-color .2s ease;
  --de-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10.1A4.2 4.2 0 0 1 12 7.6a4.2 4.2 0 0 1 7.5 2.3C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}
.wishlist-button-add.wishlist-button-product::before {
  content: ''; position: absolute; inset: 13px; background: #111111;
  -webkit-mask: var(--de-heart) center / contain no-repeat; mask: var(--de-heart) center / contain no-repeat;
}
.wishlist-button-add.wishlist-button-product.is-added {
  --de-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='black' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10.1A4.2 4.2 0 0 1 12 7.6a4.2 4.2 0 0 1 7.5 2.3C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}
.wishlist-button-add.wishlist-button-product.is-added::before { background: var(--de-brand-red); }
.wishlist-button-add.wishlist-button-product:hover { border-color: #111111; }
.wishlist-button-add.wishlist-button-product .material-icons { display: none !important; }

/* Header geometry = SANDBOX (measured at 1036 / 1280): logo line 48px after the logo; the menu
 * area reaches 24px past the logo line and 21px past the icon line (links run close to both
 * lines); 45px from the icon line to the flag; 24px icons 16px apart; 16px between menu items
 * up to 1280px. */
@media (min-width: 992px) {
  .de-header__divider--logo { margin: 0 0 0 48px; }
  .de-header__divider--actions { margin: 0 45px 0 0; }
  .de-header--nav-centered .de-header__nav-wrap { margin: 0 -21px 0 -24px; }
  .de-header__actions { gap: 16px; }
  .de-header__action, .de-lang__button { padding: 0; }
  .de-header__count { top: -6px; right: -9px; }
}
@media (min-width: 992px) and (max-width: 1280px) {
  .de-nav { gap: 16px; }
}
/* Never two rows: where a language's labels do not fit (storefront.js measures), the tracking
 * tightens in two steps; if it still does not fit, the menu moves into the burger drawer. */
.de-nav--tight .de-nav { gap: 12px; }
.de-nav--tight .de-nav__link { letter-spacing: .7px; }
/* tightest step: 11px, and the small chevrons go (about 55px) so the gaps can stay 12px */
.de-nav--tighter .de-nav__item--has-children > .de-nav__link::after { display: none; }
.de-nav--tighter .de-nav__link { font-size: 11px; letter-spacing: .4px; }
@media (min-width: 992px) {
  /* when tight, the lines move in to 24px from logo and flag and the menu stays 12px inside them */
  .de-nav--tight .de-header__divider--logo { margin-left: 24px; }
  .de-nav--tight .de-header__divider--actions { margin-right: 24px; }
  .de-header--nav-centered.de-nav--tight .de-header__nav-wrap { margin: 0 12px; }
}
@media (min-width: 992px) {
  .de-header--collapsed .de-header__nav-wrap, .de-header--collapsed .de-header__divider { display: none; }
  .de-header--collapsed .de-header__burger { display: inline-flex; margin-right: 16px; }
  .de-header--collapsed .de-header__actions { margin-left: auto; }
}

/* Pagination (SANDBOX): centred row, 14px numbers in round items 40px apart, arrow icons;
 * better than SANDBOX: the current page gets a thin ring, other pages a soft hover. */
.de-pager__list { display: flex; justify-content: center; align-items: center; gap: 8px; list-style: none; margin: 0; padding: 0; }
.de-pager__item {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid transparent; font-size: 14px; font-weight: 400; line-height: 1; color: #121212; text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease;
}
a.de-pager__item:hover { background: #F4F4F4; text-decoration: none; color: #121212; }
.de-pager__item.is-current { border-color: #121212; }
.de-pager__spacer { width: 24px; }
.de-pager__arrow.is-disabled { opacity: .3; pointer-events: none; }

/* quick view: the info column already spaces its rows (16px), so the share row needs no extra margin */
.de-qv .js-product-additional-info .social-sharing { margin-top: 0; }

/* Share icons top right, beside brand + title (quick view and product page), to save a row.
 * The info columns become a two-column grid; everything else spans the full width.
 * The "Share" word stays for screen readers only. */
.de-qv__info { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 16px; align-content: start; }
.de-qv__info > *, .de-qv__info > .js-product-additional-info > * { grid-column: 1 / -1; }
.de-qv__info > .de-eyebrow { grid-column: 1; grid-row: 1; }
.de-qv__info > .de-qv__title { grid-column: 1; grid-row: 2; }
.de-qv__info > .js-product-additional-info { display: contents; }
.de-qv__info > .js-product-additional-info > .social-sharing { grid-column: 2; grid-row: 2; align-self: center; margin: 0; } /* level with the title, clear of the close button */

.de-pdp form#add-to-cart-or-refresh { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 16px; }
.de-pdp form#add-to-cart-or-refresh > *, .de-pdp__buy > *, .de-pdp__buy > .js-product-additional-info > * { grid-column: 1 / -1; }
.de-pdp form#add-to-cart-or-refresh > .de-pdp__head { grid-column: 1; grid-row: 1; }
.de-pdp__buy, .de-pdp__buy > .js-product-additional-info { display: contents; }
.de-pdp__buy > .js-product-additional-info > .social-sharing { grid-column: 2; grid-row: 1; align-self: center; margin: 0; }

.de-qv .social-sharing > span, .de-pdp .social-sharing > span {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* Share (theme override of ps_sharebuttons): one icon; phones open the share sheet, computers a
 * panel with WhatsApp, copy link, Facebook, X, Pinterest. Buttons look exactly like the link icons. */
.social-sharing li { position: relative; }
.social-sharing li > button {
  position: relative; display: block; width: 36px; height: 36px; margin: 0; padding: 0; border: 1px solid rgba(0, 0, 0, .18);
  border-radius: 50%; background: none; cursor: pointer; transition: background-color .2s ease, border-color .2s ease;
}
.social-sharing li > button::before {
  content: ''; position: absolute; inset: 9px; background: #121212; transition: background-color .2s ease;
  -webkit-mask: var(--de-share-icon) center / contain no-repeat; mask: var(--de-share-icon) center / contain no-repeat;
}
.social-sharing li > button:hover { background: #121212; border-color: #121212; }
.social-sharing li > button:hover::before { background: #FFFFFF; }
.social-sharing .whatsapp a { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a9.9 9.9 0 0 0-8.5 15l-1.4 5 5.2-1.4A10 10 0 1 0 12 2zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3.1.8.8-3-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.2-.4.2-.4.7-1.3a.5.5 0 0 0 0-.5l-.8-1.8c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 2.9 2.9 0 0 0-.9 2.1 5 5 0 0 0 1.1 2.7 11.4 11.4 0 0 0 4.4 3.9c1.6.7 2.3.8 3.1.6a2.6 2.6 0 0 0 1.7-1.2 2.1 2.1 0 0 0 .2-1.2c-.1-.1-.3-.2-.6-.3z'/%3E%3C/svg%3E"); }
.social-sharing .de-share-copy button { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M10 14a4 4 0 0 0 5.7 0l3.5-3.5a4 4 0 0 0-5.7-5.7l-1 1'/%3E%3Cpath d='M14 10a4 4 0 0 0-5.7 0l-3.5 3.5a4 4 0 0 0 5.7 5.7l1-1'/%3E%3C/svg%3E"); }
.social-sharing .de-share-copy button.is-copied { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); border-color: #121212; }
.social-sharing .de-share__toggle { --de-share-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M7.5 7.5 12 3l4.5 4.5'/%3E%3Cpath d='M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7'/%3E%3C/svg%3E"); }
.de-share-copy__note {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 5; padding: 4px 8px; border-radius: 4px; background: #121212; color: #FFFFFF;
  font-size: 11px; line-height: 1.3; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
.de-share-copy__note:not(:empty) { opacity: 1; }
/* one share icon beside the title; on computers it opens a small panel with the options */
.social-sharing { position: relative; }
.de-share__toggle {
  position: relative; display: block; width: 36px; height: 36px; margin: 0; padding: 0; border: 1px solid rgba(0, 0, 0, .18);
  border-radius: 50%; background: none; cursor: pointer; transition: background-color .2s ease, border-color .2s ease;
}
.de-share__toggle::before {
  content: ''; position: absolute; inset: 9px; background: #121212; transition: background-color .2s ease;
  -webkit-mask: var(--de-share-icon) center / contain no-repeat; mask: var(--de-share-icon) center / contain no-repeat;
}
.de-share__toggle:hover, .is-open > .de-share__toggle { background: #121212; border-color: #121212; }
.de-share__toggle:hover::before, .is-open > .de-share__toggle::before { background: #FFFFFF; }
.social-sharing .de-share__menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 40; display: none; gap: 6px; margin: 0; padding: 8px;
  list-style: none; background: #FFFFFF; border: 1px solid #EBEBEB; border-radius: 8px; box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
}
.social-sharing.is-open .de-share__menu { display: flex; }

/* quantity, add to cart and the wishlist heart stay on one row (longer ES/PT button labels) */
.de-atc__row { flex-wrap: nowrap; }
.de-atc .add { min-width: 0; }
.de-atc__button { padding: 0 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* SANDBOX product page: both columns stick 97px from the top (header 80 + 17), so the photo stays
 * beside the text while toggles open — the taller column scrolls, the shorter one stays pinned. */
@media (min-width: 990px) {
  .de-pdp__gallery, .de-pdp__info.is-sticky { position: sticky; top: 97px; }
}
/* SANDBOX "Read more": Poppins 10px uppercase, 1px tracking, no underline, 10px plus (minus when open) */
.de-pdp__more {
  display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 400; line-height: 1; letter-spacing: 1px;
  text-transform: uppercase; text-decoration: none; color: #121212;
}
.de-pdp__more::after {
  content: ''; width: 10px; height: 10px; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M12 4v16M4 12h16'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M12 4v16M4 12h16'/%3E%3C/svg%3E") center / contain no-repeat;
}
.de-pdp__more.is-open::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M4 12h16'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M4 12h16'/%3E%3C/svg%3E");
}

/* Sticky header as on SANDBOX (always visible at the top, 80px): the wrappers around it were only as
 * tall as the header, so it could never stick. Taking them out of the layout lets the header stick
 * against the whole page; the announcement bar above still scrolls away. */
#header, .estelar-section--header { display: contents; }
.de-header--sticky { z-index: 60; }

/* Sticky add-to-cart bar = SANDBOX product__sticky-cart: fixed under the header, white, 1px #EBEBEB
 * line, 18px 36px padding; 44px thumbnail box (2px #EBEBEB, 8px corners); name 14/700 −0.04em;
 * price · size 14/400 with a 4px separator; black pill button 10px / 1px tracking with cart icon.
 * Slides from behind the header (.45s, SANDBOX easing). */
.de-stickybar {
  position: fixed; left: 0; right: 0; top: var(--de-header-h, 81px); z-index: 50; background: #FFFFFF;
  border-bottom: 1px solid #EBEBEB; padding: 18px var(--de-gutter); transform: none;
  transition: transform .45s cubic-bezier(.68, 0, .35, 1), visibility .45s;
}
.de-stickybar.is-hidden { transform: translateY(-100%) translateY(calc(-1 * var(--de-header-h, 81px))); visibility: hidden; }
.de-stickybar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.de-stickybar__info { display: flex; align-items: center; gap: 16px; min-width: 0; }
.de-stickybar__media { flex: none; width: 44px; height: 44px; border: 2px solid #EBEBEB; border-radius: 8px; background: #FFFFFF; overflow: hidden; }
.de-stickybar__media img { width: 40px; height: 40px; object-fit: contain; display: block; }
.de-stickybar__text { display: flex; flex-direction: column; min-width: 0; }
.de-stickybar__title { font-size: 14px; font-weight: 700; letter-spacing: -0.04em; line-height: 18px; color: #121212; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.de-stickybar__meta { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 22px; color: #121212; white-space: nowrap; }
.de-stickybar__meta a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.de-stickybar__sep { width: 4px; height: 4px; background: #EBEBEB; flex: none; }
.de-stickybar__btn {
  flex: none; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 24px; border: 1px solid #111111;
  border-radius: 50px; background: #111111; color: #FFFFFF; font-family: 'Poppins', sans-serif; font-size: 10px; font-weight: 400;
  letter-spacing: 1px; cursor: pointer; transition: color .4s, background-color .4s, border-color .4s, opacity .3s;
}
.de-stickybar__btn:hover { background: #FFFFFF; color: #111111; }
.de-stickybar__btn:disabled { opacity: .35; cursor: not-allowed; background: #111111; color: #FFFFFF; }
@media (max-width: 749px) {
  .de-stickybar { padding: 12px var(--de-gutter); }
  .de-stickybar__meta { font-size: 12px; }
  .de-stickybar__btn { padding: 0 16px; }
}

/* "Read more" underline = SANDBOX button--text: 1px line under the full button at rest, shrinks to
 * 30 % (centred) on hover, .4s; 6px padding above and below. */
.de-pdp__more { position: relative; padding: 6px 0; }
.de-pdp__more::before {
  content: ''; position: absolute; left: 50%; bottom: 0; width: 100%; height: 1px; background: #121212;
  transform: translateX(-50%); transition: width .4s, background-color .4s;
}
.de-pdp__more:hover::before { width: 30%; }

/* ------------------------------------------------ Intro bar + text (SANDBOX hero-intro-custom) */
.de-hic__bar-row { display: flex; justify-content: center; width: 100%; }
.de-hic__bar-row--start { justify-content: flex-start; }
.de-hic__bar-row--end { justify-content: flex-end; }
.de-hic__bar {
  display: inline-block; margin: 18px 0; padding: 18px 32px; border-radius: 4px; box-sizing: border-box;
  font-family: 'Poppins', sans-serif; font-size: clamp(14px, 1.8vw, 18px); font-weight: 700; letter-spacing: .01em; line-height: 1.4;
}
.de-hic__bar-row--stretch .de-hic__bar { flex: 1 1 auto; text-align: center; }
.de-hic__bar--custom { display: block; max-width: 100%; text-align: center; }
.de-hic__bar--outlined { border: 1px solid #EBEBEB; }
.de-hic__sub { width: 100%; margin-top: 22px; font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 500; line-height: 1.6; }
.de-hic__sub p { margin: 0 0 12px; }
.de-hic__sub p:last-child { margin-bottom: 0; }
.de-hic__sub ul, .de-hic__sub ol { margin: 12px 0; padding-inline-start: 1.4em; }
.de-hic__sub.de-text-center ul, .de-hic__sub.de-text-center ol { display: inline-block; text-align: start; }
.de-hic__sub li { margin-bottom: 6px; }
.de-hic__sub strong { font-weight: 700; }
.de-hic__sub a { color: inherit; text-decoration: underline; }

/* ------------------------------------------------ Promo cards (grid) (SANDBOX promo-grid) */
.de-promo-grid { display: grid; grid-template-columns: repeat(var(--de-promo-cols, 2), minmax(0, 1fr)); gap: 24px; }
.de-promo-grid__item { grid-column: span 1; }
.de-promo-grid__item--full { grid-column: 1 / -1; }
.de-promo-grid__item--full .cd-promo { min-height: 320px; }
.de-promo-grid__item .cd-promo { height: 100%; }
.de-promo-grid__heading { margin: 0 0 24px; }
/* SANDBOX promo-grid heading_size (measured 1440px): h5 27, h4 36, h3 47 — Poppins 400, lh 1, −0.04em, 36px below */
.de-promo-grid__heading--h5, .de-promo-grid__heading--h4, .de-promo-grid__heading--h3 { margin-bottom: 36px; font-family: 'Poppins', sans-serif; font-weight: 400; line-height: 1; letter-spacing: -0.04em; }
.de-promo-grid__heading--h5 { font-size: 27px; } .de-promo-grid__heading--h4 { font-size: 36px; } .de-promo-grid__heading--h3 { font-size: 47px; }
@media (max-width: 749px) { .de-promo-grid__heading--h4 { font-size: 27px; } .de-promo-grid__heading--h3 { font-size: 32px; } .de-promo-grid__heading--h5, .de-promo-grid__heading--h4, .de-promo-grid__heading--h3 { margin-bottom: 24px; } }
/* as SANDBOX renders it: the paragraphs take the card's text colour, 14px apart */
.cd-promo-desc--rich, .cd-promo--dark .cd-promo-desc--rich { color: inherit; }
.cd-promo-desc--rich p { margin: 14px 0; }
.cd-promo-desc--rich ul, .cd-promo-desc--rich ol { margin: 10px 0; padding-inline-start: 1.2em; }
.cd-promo-desc--rich li { margin-bottom: 6px; }
@media (max-width: 749px) {
  .de-promo-grid { grid-template-columns: 1fr; }
  .de-promo-grid__item, .de-promo-grid__item--full { grid-column: span 1; }
}

/* ------------------------------------------------ Promo accordion (SANDBOX promo-accordion)
 * Values from sections/promo-accordion.liquid; titles at the theme's h6 size (20.5px, phones 16px). */
.de-cpa { font-family: 'Poppins', sans-serif; color: var(--cpa-ink); }
/* SANDBOX promo-accordion heading = h5 (measured 1440px: Poppins 400 27px, lh 1, −0.04em) */
.de-cpa__heading { margin: 0 0 32px; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; }
@media (max-width: 749px) { .de-cpa__heading { font-size: 21px; } }
.de-cpa__item { border-top: 1px solid var(--cpa-line); scroll-margin-top: 100px; }
.de-cpa__item:last-child { border-bottom: 1px solid var(--cpa-line); }
.de-cpa__head {
  display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 0; padding: 24px 28px;
  border: 0; background: var(--cpa-header-bg); color: var(--cpa-ink); font: inherit; text-align: left; cursor: pointer;
  user-select: none; transition: background-color .25s ease, color .25s ease;
}
.de-cpa__head[aria-expanded="true"] { background: var(--cpa-accent); color: var(--cpa-accent-text); }
.de-cpa__head-title {
  display: flex; align-items: baseline; flex-wrap: wrap; row-gap: 2px; column-gap: 4px; margin: 0; color: #65706E;
  font-size: 20.5px; line-height: 1; letter-spacing: -0.04em; transition: color .25s ease;
}
.de-cpa__head[aria-expanded="true"] .de-cpa__head-title { color: inherit; }
.de-cpa__serif { font-family: 'Montserrat', sans-serif; font-weight: 300; }
.de-cpa__main { font-weight: 500; }
.de-cpa__head-title.is-reverse .de-cpa__serif { order: 2; }
.de-cpa__head-title.is-reverse .de-cpa__main { order: 1; }
.de-cpa__icon { width: 24px; font-size: 22px; font-weight: 300; line-height: 1; text-align: center; transition: transform .3s ease; }
.de-cpa__head[aria-expanded="true"] .de-cpa__icon { transform: rotate(45deg); }
.de-cpa__body { height: 0; overflow: hidden; transition: height .4s cubic-bezier(.4, 0, .2, 1); }

.de-cpa__split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 480px; overflow: hidden; background: #FFFFFF; }
.de-cpa__split--light { background-color: #F8F9FA; }
.de-cpa__split--dark { background-color: #1A1D20; }
.de-cpa__split--large { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.de-cpa__split--small { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.de-cpa__split.is-img-right { direction: rtl; }
.de-cpa__split.is-img-right > * { direction: ltr; }
.de-cpa__media { position: relative; overflow: hidden; height: 100%; }
.de-cpa__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.de-cpa__media.is-contain { height: auto; max-height: 100%; width: 100%; aspect-ratio: 1; margin: auto; padding: 12%; }
.de-cpa__media.is-contain img { object-fit: contain; }
.de-cpa__box {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 32px; min-height: 480px;
  padding: 56px 48px; background: #FFFFFF; color: #111111; text-align: left;
}
.de-cpa__box--light { background-color: #F8F9FA; }
.de-cpa__box--dark { background-color: #1A1D20; color: #FFFFFF; }
.de-cpa__eyebrow, .de-cpa__plain-eyebrow {
  display: block; width: 100%; margin: 0 0 14px; font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: #65706E;
}
.de-cpa__box--dark .de-cpa__eyebrow, .de-cpa__plain--dark .de-cpa__plain-eyebrow { color: #9099A1; }
.de-cpa__title { display: flex; flex-direction: column; margin: 0 0 20px; padding: 0; font-size: 20.5px; font-weight: 400; letter-spacing: -0.04em; color: inherit; }
.de-cpa__title-serif { display: block; margin-bottom: 4px; font-family: 'Montserrat', sans-serif; font-weight: 300; line-height: 1.2; color: #111111; overflow-wrap: break-word; }
.de-cpa__title-main { display: block; font-family: 'Poppins', sans-serif; font-weight: 500; line-height: 1.2; color: #111111; overflow-wrap: break-word; }
.de-cpa__title.is-reverse .de-cpa__title-serif { order: 2; margin: 4px 0 0; }
.de-cpa__title.is-reverse .de-cpa__title-main { order: 1; }
.de-cpa__box--dark .de-cpa__title-serif, .de-cpa__box--dark .de-cpa__title-main { color: #FFFFFF; }
.de-cpa__desc { max-width: 60ch; font-size: 16px; line-height: 1.6; color: #4A5056; overflow-wrap: break-word; }
.de-cpa__desc p { margin: 0 0 14px; }
.de-cpa__desc ul { margin: 0 0 14px; padding-left: 20px; list-style: disc; }
.de-cpa__desc li { margin: 0 0 8px; }
.de-cpa__desc > :last-child, .de-cpa__desc li:last-child { margin-bottom: 0; }
.de-cpa__desc strong { color: #111111; }
.de-cpa__box--dark .de-cpa__desc strong, .de-cpa__plain--dark .de-cpa__desc strong { color: #FFFFFF; }
.de-cpa__btn-pill {
  display: inline-block; padding: 13px 34px; border: 1px solid #111111; border-radius: 26px; font-size: 14.5px; font-weight: 500;
  color: #111111; text-decoration: none; transition: all .2s ease;
}
.de-cpa__btn-pill:hover { background-color: #111111; color: #FFFFFF; }
.de-cpa__btn-underline { display: inline-block; font-size: 15px; font-weight: 500; color: #FFFFFF; text-decoration: underline; text-underline-offset: 6px; transition: opacity .2s ease; }
.de-cpa__btn-underline:hover { opacity: .8; }

.de-cpa__plain { padding: 48px 40px; background: #FFFFFF; color: #111111; }
.de-cpa__plain--light { background-color: #F8F9FA; }
.de-cpa__plain--dark { background-color: #1A1D20; color: #FFFFFF; }
.de-cpa__plain-title { display: flex; align-items: baseline; flex-wrap: wrap; row-gap: 4px; column-gap: 6px; margin: 0 0 20px; font-size: 20.5px; font-weight: 400; letter-spacing: -0.04em; }
.de-cpa__plain-main { font-family: 'Poppins', sans-serif; font-weight: 600; color: #111111; }
.de-cpa__plain-title.is-reverse .de-cpa__title-serif { order: 2; }
.de-cpa__plain--dark .de-cpa__title-serif, .de-cpa__plain--dark .de-cpa__plain-main { color: #FFFFFF; }
.de-cpa__desc--plain li { margin: 0 0 10px; }
.de-cpa__plain--dark .de-cpa__desc { color: #C2C7CC; }
.de-cpa__plain-btn { display: inline-block; margin-top: 20px; font-size: 14.5px; font-weight: 500; color: inherit; text-decoration: underline; text-underline-offset: 5px; }

@media (max-width: 749px) {
  .de-cpa__head { padding: 18px 20px; }
  .de-cpa__head-title, .de-cpa__title, .de-cpa__plain-title { font-size: 16px; }
  .de-cpa__plain { padding: 32px 20px; }
  .de-cpa__box { padding: 40px 28px; min-height: 320px; }
  .de-cpa__split { grid-template-columns: 1fr !important; }
  .de-cpa__media { min-height: 260px; }
}

/* Product gallery with several photos (SANDBOX main-product, thumbnails left): a 115px thumbnail
 * column, 16px gap, the main photo beside it (4:5). One photo = the photo alone, full width. */
@media (min-width: 750px) {
  .de-pdp--thumbs-left .de-pdp__gallery.has-thumbs { display: grid; grid-template-columns: 115px minmax(0, 1fr); gap: 16px; align-items: start; }
  .de-pdp--thumbs-left .has-thumbs .de-pdp__thumbs { order: -1; flex-direction: column; gap: 16px; margin: 0; overflow: visible; }
  .de-pdp--thumbs-left .has-thumbs .de-pdp__thumbs li { flex: none; }
  .de-pdp--thumbs-left .has-thumbs .de-pdp__thumbs img { width: 115px; height: 144px; }
}
/* exact SANDBOX spacing: the bar keeps 18px above and below (beats the generic last-paragraph rule) */
.de-hic .de-hic__bar { margin: 18px 0; }
/* exact SANDBOX look of the formatted promo text: paragraphs 14px above and below without
 * collapsing (28px apart), plus the 28px SANDBOX leaves after them */
.cd-promo-desc--rich { display: flex; flex-direction: column; }
.cd-promo-desc--rich p { margin: 14px 0; }
.cd-promo-desc--rich::after { content: ''; display: block; height: 28px; }
/* product page, as SANDBOX: breadcrumb 47px under the header, the photo 16px under the breadcrumb */
body#product .de-breadcrumb { padding-top: 46px; }
body#product .de-breadcrumb .breadcrumb { margin-bottom: 0; }

/* Promo accordion, less empty space (user 2026-09-18): the panel is as tall as its text needs
 * (no 480px minimum), text box 40px 48px; a "contain" logo sits in its square third, 10 % padding. */
.de-cpa__split, .de-cpa__box { min-height: 0; }
.de-cpa__box { padding: 40px 48px; }
.de-cpa__media.is-contain { padding: 10%; }
/* Every toggle alike (user 2026-09-18, SANDBOX HydraBlast "Why Professionals Choose" = correct):
 * the text starts at the top, always the same 56px under the toggle bar — never centred in a box
 * that the logo makes taller (that left a gap above short texts). */
.de-cpa__box { justify-content: flex-start; padding: 56px 48px 48px; }
@media (max-width: 749px) { .de-cpa__box { padding: 40px 28px 32px; } }

/* ------------------------------------------------ Page banner (SANDBOX page-banner, collection pages)
 * H1 in the h5 size (Poppins 400 27px, −0.04em, 5.4px above/below); text 18px below: grey lead line
 * (h6 20.5px, line-height 1), paragraphs 14px apart (14px/22.4 #111), last one flush. */
.de-page-banner__title { margin: 0; padding: 5.4px 0; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #111111; }
.de-page-banner__text { margin-top: 18px; font-size: 14px; line-height: 22.4px; color: #111111; }
.de-page-banner__text h6, .de-page-banner__text h5, .de-page-banner__text h4 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 20.5px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #65706E; }
.de-page-banner__text p { margin: 14px 0; }
.de-page-banner__text > :first-child { margin-top: 0; }
.de-page-banner__text > :last-child { margin-bottom: 0; }
.de-page-banner__text strong { font-weight: 700; }
/* page intro (SANDBOX main-page "info" block): measured 1440px — title 27/400 lh 27, 24px gap, text 14/22.4 at 70 %, 36px under */
.de-page-banner--page { padding-bottom: 36px; }
.de-page-banner--page .de-page-banner__title { padding: 0; line-height: 27px; }
.de-page-banner--page .de-page-banner__text { margin-top: 24px; color: rgba(17, 17, 17, 0.7); }
.de-page-banner--page .de-page-banner__text > p:last-child { margin-bottom: 14px; }
.de-page-banner--page .de-page-banner__text > h6:last-child, .de-page-banner--page .de-page-banner__text > h5:last-child { margin-bottom: 24px; }
.de-page-banner--page .de-page-banner__text h6, .de-page-banner--page .de-page-banner__text h5, .de-page-banner--page .de-page-banner__text h4 { margin-bottom: 24px; }

@media (max-width: 749px) {
  .de-page-banner__title { font-size: 21px; }
  .de-page-banner__text h6, .de-page-banner__text h5, .de-page-banner__text h4 { font-size: 16px; }
}

/* Rich text, style "Collection SEO text" = SANDBOX seo-content on collection pages: title in the h5
 * size with 5.4px above/below and 24px under it (−0.04em), text #111 14/22.4, no extra space after. */
.de-richtext-section--seo .de-richtext-section__inner { padding-bottom: 0; }
.de-richtext-section--seo .de-richtext-section__title { margin: 0 0 24px; padding: 5.4px 0; line-height: 1; letter-spacing: -0.04em; }
.de-richtext-section--seo .de-rte { color: #111111; }
.de-richtext-section--seo .de-rte em { font-family: 'Poppins', sans-serif; font-style: italic; }
/* collection pages as SANDBOX: no visible breadcrumb, the page banner starts right under the header
 * (the breadcrumb's structured data stays in the page for search engines) */
body#category .de-breadcrumb { display: none; }

/* ------------------------------------------------ Grid card (SANDBOX promo-card-grid = custom_promo_card)
 * values from main-collection.liquid: text + button centred as one block (24px gap), 40px 36px,
 * 4px corners, 1px #EBEBEB; Montserrat 300 28 / Poppins 500 24 (phones 22 / 19), text 14/1.55. */
.cdpg {
  position: relative; display: flex; flex-direction: column; justify-content: center; gap: 24px; padding: 40px 36px;
  border-radius: 4px; height: 100%; min-height: 100%; box-sizing: border-box; background-color: #FFFFFF;
  border: 1px solid #EBEBEB; color: #111111; overflow: hidden;
}
.cdpg.cdpg--light { background-color: #F8F9FA; border-color: #EBEBEB; }
.cdpg.cdpg--dark { background-color: #1A1D20; border-color: #1A1D20; color: #FFFFFF; }
.cdpg.cdpg--has-image { border-color: transparent; justify-content: flex-end; }
.cdpg-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.cdpg-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
@media (hover: hover) { .cdpg--has-image:hover .cdpg-media img { transform: scale(1.05); } }
.cdpg-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.4) 45%, rgba(0,0,0,.08) 72%, rgba(0,0,0,0) 100%); }
.cdpg--has-image.cdpg--light .cdpg-overlay { background: linear-gradient(to top, rgba(255,255,255,.9) 0%, rgba(255,255,255,.6) 45%, rgba(255,255,255,.18) 72%, rgba(255,255,255,0) 100%); }
.cdpg-content { position: relative; z-index: 2; }
.cdpg--has-image:not(.cdpg--light) .cdpg-eyebrow, .cdpg--has-image:not(.cdpg--light) .cdpg-desc { color: #E5E7EA; }
.cdpg--has-image:not(.cdpg--light) .cdpg-title-serif, .cdpg--has-image:not(.cdpg--light) .cdpg-title-main { color: #FFFFFF; }
.cdpg--has-image.cdpg--light .cdpg-eyebrow, .cdpg--has-image.cdpg--light .cdpg-desc { color: #4A5056; }
.cdpg-eyebrow { display: block; margin: 0 0 12px; font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #65706E; overflow-wrap: break-word; }
.cdpg.cdpg--dark .cdpg-eyebrow { color: #9099A1; }
.cdpg-title { margin: 0 0 14px; padding: 0; display: block; }
.cdpg-title-serif { display: block; margin-bottom: 2px; font-family: 'Montserrat', sans-serif; font-weight: 300; font-size: 28px; line-height: 1.2; color: #111111; overflow-wrap: break-word; hyphens: auto; }
.cdpg-title-main { display: block; font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 24px; line-height: 1.2; color: #111111; overflow-wrap: break-word; hyphens: auto; }
.cdpg.cdpg--dark .cdpg-title-serif, .cdpg.cdpg--dark .cdpg-title-main { color: #FFFFFF; }
.cdpg-desc { margin: 0; font-family: 'Poppins', sans-serif; font-size: 14px; line-height: 1.55; color: #4A5056; overflow-wrap: break-word; }
.cdpg.cdpg--dark .cdpg-desc { color: #C2C7CC; }
.cdpg-bottom { position: relative; z-index: 2; margin-top: 0; }
.cdpg-btn-pill { display: inline-block; padding: 10px 26px; border: 1px solid #111111; border-radius: 22px; font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 500; color: #111111; text-decoration: none; transition: all .2s ease; }
.cdpg--has-image:not(.cdpg--light) .cdpg-btn-pill { border-color: #FFFFFF; color: #FFFFFF; }
.cdpg-btn-pill:hover { background-color: #111111; color: #FFFFFF; text-decoration: none; }
.cdpg--has-image:not(.cdpg--light) .cdpg-btn-pill:hover { background-color: #FFFFFF; color: #111111; }
.cdpg-btn-underline { display: inline-block; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 500; color: #FFFFFF; text-decoration: underline; text-underline-offset: 5px; transition: opacity .2s ease; }
.cdpg-btn-underline:hover { opacity: .8; color: #FFFFFF; }
@media (max-width: 749px) {
  .cdpg { padding: 28px 24px; }
  .cdpg-title-serif { font-size: 22px; }
  .cdpg-title-main { font-size: 19px; }
}

/* ------------------------------------------------ custom card standard (every card type)
 * "Show the Poppins line first", image fit "contain", badge on every card, rich text in grid cards */
.cd-promo-title.is-reverse, .cdpg-title.is-reverse, .de-cdpt__title.is-reverse { display: flex; flex-direction: column; }
.cd-promo-title.is-reverse .cd-promo-title-serif, .cdpg-title.is-reverse .cdpg-title-serif, .de-cdpt__title.is-reverse .de-cdpt__title-serif { order: 2; margin: 2px 0 0; }
.cd-promo-media.is-contain img, .cdpg-media.is-contain img, .de-cdpt-split__media.is-contain img { object-fit: contain; padding: 10%; box-sizing: border-box; }
.cdpg .cd-promo-badge, .de-cdpt .cd-promo-badge, .de-cpa__box .cd-promo-badge, .de-cpa__plain .cd-promo-badge { display: inline-block; margin-bottom: 16px; }
.cdpg--dark .cd-promo-badge, .de-cdpt--dark .cd-promo-badge, .de-cpa__box--dark .cd-promo-badge, .de-cpa__plain--dark .cd-promo-badge { background-color: #FFFFFF; color: #111111; }
.cdpg-desc--rich p { margin: 0 0 10px; }
.cdpg-desc--rich > :last-child { margin-bottom: 0; }
.cdpg-desc--rich ul, .cdpg-desc--rich ol { margin: 10px 0; padding-inline-start: 1.2em; }
/* the forced underline / pill buttons on light and dark cards read correctly in either colour */
.cd-promo:not(.cd-promo--dark):not(.cd-promo--has-image) .cd-promo-btn-underline, .cdpg:not(.cdpg--dark):not(.cdpg--has-image) .cdpg-btn-underline { color: #111111; }
.cd-promo--dark .cd-promo-btn-pill, .cdpg--dark .cdpg-btn-pill { border-color: #FFFFFF; color: #FFFFFF; }

/* continuous marquee (social row, SANDBOX swiper loop speed 8s linear): no snapping, no manual scroll */
.de-slider--marquee .de-slider__track { overflow: hidden; scroll-snap-type: none; scroll-behavior: auto; }
.de-slider--marquee .de-slider__slide { will-change: transform; }

/* ------------------------------------------------------------------ multitile (SANDBOX multitile) */
/* measured 1440px: 6 columns, gap 12px (compact 0), tiles flex column gap 6px, radius 8px,
   padding 16px × inner spacing, h5 27/1.25 −0.04em, text 14/22.4 #121212, p 14px margins */
.de-multitile__heading { margin: 0 0 32px; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-multitile__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.de-multitile--compact .de-multitile__grid { gap: 0; }
.de-multitile__tile {
  position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0;
  padding: calc(16px * var(--de-mt-pad, 2)); border-radius: 8px; overflow: hidden;
  background: var(--de-bg, transparent); color: var(--de-fg, #121212);
  font-family: 'Poppins', sans-serif; font-size: 14px; line-height: 22.4px;
}
.de-multitile__tile:not([class*='de-scheme-']) { background: transparent; }
.de-multitile__media { position: relative; overflow: hidden; border-radius: 8px; }
.de-multitile__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.de-multitile__tile--background .de-multitile__media { position: absolute; inset: 0; border-radius: 0; }
.de-multitile__tile--top .de-multitile__content { margin-top: 16px; }
.de-multitile__content { position: relative; z-index: 1; flex: 1 1 auto; display: flex; flex-direction: column; gap: 24px; }
.de-multitile__content--v-start { justify-content: flex-start; }
.de-multitile__content--v-center { justify-content: center; }
.de-multitile__content--v-end { justify-content: flex-end; }
.de-multitile__content--start { align-items: flex-start; text-align: left; }
.de-multitile__content--center { align-items: center; text-align: center; }
.de-multitile__content--end { align-items: flex-end; text-align: right; }
.de-multitile__title { margin: 0; font-family: 'Poppins', sans-serif; font-weight: 400; line-height: 1.25; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-multitile__title--h3 { font-size: 36px; }
.de-multitile__title--h4 { font-size: 31.5px; }
.de-multitile__title--h5 { font-size: 27px; }
.de-multitile__title--h6 { font-size: 20.5px; }
.de-multitile__text p { margin: 14px 0; }
.de-multitile__text h5, .de-multitile__text h6 { margin: 14px 0 0; font-family: 'Poppins', sans-serif; font-weight: 400; line-height: 1.25; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-multitile__text h5 { font-size: 27px; }
.de-multitile__text h6 { font-size: 20.5px; color: #65706e; }
.de-multitile__text ul { margin: 14px 0; padding-inline-start: 1.3em; }
.de-multitile__text strong { font-weight: 700; }
@media (min-width: 750px) {
  .de-multitile__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .de-multitile__tile { grid-column: span var(--de-mt-col, 3); grid-row: span var(--de-mt-row, 1); }
}
@media (max-width: 749px) {
  .de-multitile__title--h5 { font-size: 16px; line-height: 1.2; }
  .de-multitile__title--h3 { font-size: 27px; } .de-multitile__title--h4 { font-size: 24px; }
  .de-multitile__content--m-start { align-items: flex-start; text-align: left; }
  .de-multitile__content--m-center { align-items: center; text-align: center; }
  .de-multitile__content--m-end { align-items: flex-end; text-align: right; }
  .de-multitile--reverse-mobile .de-multitile__tile:first-child { order: 2; }
  /* an image-only background tile keeps a square on phones instead of collapsing to its padding */
  /* phones (SANDBOX): 12px per inner-spacing step; an image-only tile shows the whole photo in its own proportions */
  .de-multitile__tile { padding: calc(12px * var(--de-mt-pad, 2)); }
  .de-multitile__tile--background.de-multitile__tile--no-text .de-multitile__media { position: static; border-radius: 8px; }
  .de-multitile__tile--background.de-multitile__tile--no-text .de-multitile__media img { height: auto; }
  .de-multitile__tile--no-text .de-multitile__content { display: none; }
}

/* dual-tiles text tile (SANDBOX dual-tiles "tile" with text, measured on About us at 1440px) */
.de-text-tile { display: flex; padding: calc(16px * var(--de-tt-pad, 4)); border-radius: 8px; background: var(--de-bg, #ffffff); color: var(--de-fg, #121212); font-family: 'Poppins', sans-serif; font-size: 14px; line-height: 22.4px; }
.de-text-tile__content { display: flex; flex-direction: column; gap: 36px; width: 100%; }
.de-text-tile__content--v-start { justify-content: flex-start; }
.de-text-tile__content--v-center { justify-content: center; }
.de-text-tile__content--v-end { justify-content: flex-end; }
.de-text-tile__content--start { align-items: flex-start; text-align: left; }
.de-text-tile__content--center { align-items: center; text-align: center; }
.de-text-tile__content--end { align-items: flex-end; text-align: right; }
.de-text-tile__title { margin: 0; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-text-tile__text p { margin: 14px 0; }
.de-text-tile__text > :first-child { margin-top: 0; }
.de-text-tile__text > :last-child { margin-bottom: 0; }
.de-text-tile__text h5 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-text-tile__text h6 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 20.5px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #65706e; }
.de-text-tile__text strong { font-weight: 700; }
@media (max-width: 749px) {
  .de-text-tile { padding: calc(12px * var(--de-tt-pad, 4)); }
  /* phones (SANDBOX, measured 375px): heading and h5 16/19.2, the h6 lead line 28/33.6 */
  .de-text-tile__title, .de-text-tile__text h5 { font-size: 16px; line-height: 1.2; }
  .de-text-tile__text h6 { font-size: 28px; line-height: 1.2; }
  .de-text-tile__content--m-start { align-items: flex-start; text-align: left; }
  .de-text-tile__content--m-center { align-items: center; text-align: center; }
  .de-text-tile__content--m-end { align-items: flex-end; text-align: right; }
}

/* testimonials "quote beside an image" (SANDBOX horizontal-w-media, Become Partner, measured 1440px) */
.de-tmedia { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.de-tmedia__media { border-radius: 8px; overflow: hidden; }
.de-tmedia__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.de-tmedia__content { padding: 64px 0; }
.de-tmedia__inner { max-width: 437px; margin-inline: auto; }
.de-tmedia__stars { display: flex; justify-content: center; gap: 6px; margin-bottom: 16px; }
.de-tmedia__stars svg, .de-tmedia__rating svg { width: 14px; height: 14px; }
.de-tmedia__heading { margin: 0 0 48px; padding: 9.4px 0; text-align: center; font-family: 'Poppins', sans-serif; font-size: 47px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: var(--de-heading, #111111); }
.de-tmedia__card { margin: 0; padding: 72px; border-radius: 8px; background: #ffffff; color: #121212; }
.de-tmedia__author { display: block; font-style: normal; font-size: 16px; line-height: 25.6px; }
.de-tmedia__rating { display: flex; gap: 4px; margin-top: 4px; }
.de-tmedia__quote { margin: 0; font-size: 14px; line-height: 22.4px; letter-spacing: 0.28px; }
.de-tmedia__quote p { margin: 16px 0 0; }
@media (min-width: 750px) {
  .de-tmedia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .de-tmedia--img-end .de-tmedia__media { order: 2; }
}
@media (max-width: 749px) {
  .de-tmedia__content { padding: 0; }
  .de-tmedia__heading { font-size: 30px; margin-bottom: 32px; }
  .de-tmedia__card { padding: 36px 24px; }
}

/* ------------------------------------------------ contact / application form (SANDBOX form-contact) */
/* measured 1440px: 6 columns, row gap 32px, column gap 16px; labels 16.8px/500 uppercase +1px, 8px
   above the input; inputs 48px, border #EBEBEB, radius 8, 12px; options 12px uppercase +2px, 24px apart */
.de-cform__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px 16px; max-width: 1100px; margin-inline: auto; }
.de-cform__cell { min-width: 0; padding: 12px 0; }
@media (min-width: 750px) {
  .de-cform__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .de-cform__cell--full { grid-column: 1 / -1; }
}
.de-cform__field { margin: 0; padding: 0; border: 0; min-width: 0; }
.de-cform__label { display: block; margin: 0 0 8px; padding: 0; font-family: 'Poppins', sans-serif; font-size: 16.8px; font-weight: 500; line-height: 21px; letter-spacing: 1px; text-transform: uppercase; color: var(--de-fg, #121212); }
.de-cform__label span { color: #b3261e; }
.de-cform__input {
  display: block; width: 100%; height: 48px; padding: 0 16px; box-sizing: border-box;
  border: 1px solid #ebebeb; border-radius: 8px; background: transparent;
  font-family: 'Poppins', sans-serif; font-size: 12px; line-height: 18px; color: #111111;
}
.de-cform__input--area { height: auto; min-height: 123px; padding: 16px; resize: vertical; }
.de-cform__input:focus { outline: 2px solid #111111; outline-offset: 0; border-color: #111111; }
.de-cform__input:user-invalid, .de-cform__choices.is-invalid .de-cform__options { outline: 1px solid #b3261e; outline-offset: 4px; border-radius: 8px; }
.de-cform__options { display: flex; flex-wrap: wrap; gap: 24px; }
.de-cform__choices .de-cform__label { font-size: 14.4px; line-height: 18px; }
.de-cform__choices--normal .de-cform__label, .de-cform__choices--normal .de-cform__option { text-transform: none; }
.de-cform__option { display: inline-flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 15px; letter-spacing: 2px; text-transform: uppercase; color: #111111; cursor: pointer; }
.de-cform__option input { flex: 0 0 18px; width: 18px; height: 18px; margin: 0; accent-color: #121212; }
.de-cform__option a { color: inherit; text-decoration: underline; }
.de-cform__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.de-cform__notice { margin: 0 0 32px; padding: 16px 20px; border-radius: 8px; font-size: 14px; line-height: 22.4px; }
.de-cform__notice--ok { background: #eef6ee; color: #1e4620; }
.de-cform__notice--error { background: #fbeaea; color: #8a1c1c; }
.de-cform__notice p { margin: 0 0 8px; }
.de-cform__notice p:last-child { margin-bottom: 0; }
.de-cform__notice a { color: inherit; text-decoration: underline; }
/* note under a field, e.g. the password rule */
.de-cform__hint { display: block; margin-top: 8px; font-size: 13px; line-height: 20px; letter-spacing: 0; text-transform: none; color: #6b6b6b; }
/* multitile text keeps SANDBOX's paragraph margins (first and last p 14px, measured) */
.de-multitile__text.de-rte > :first-child { margin-top: 14px; }
.de-multitile__text.de-rte > :last-child { margin-bottom: 14px; }
/* section-built CMS pages (Professional, About us …): no breadcrumb, like SANDBOX pages */
body#cms:has(.estelar-page--page) .de-breadcrumb { display: none; }
/* page banner "hero" (SANDBOX page-banner, FAQ; measured 1440px): block 33svh incl. 16px below, content
   centred in 676px (36px gutters), title h4 36/36 with 7.2px padding, text 14/22.4 18px below */
.de-page-banner--hero { display: flex; align-items: center; min-height: 33svh; box-sizing: border-box; padding-top: 0; }
.de-page-banner--hero > div { width: 100%; max-width: 676px; margin-inline: auto; padding-inline: 36px; box-sizing: border-box; }
.de-page-banner--hero .de-page-banner__content { text-align: center; }
.de-page-banner--hero .de-page-banner__title { padding: 7.2px 0; font-size: 36px; line-height: 1; color: inherit; }
.de-page-banner--hero .de-page-banner__text { margin-top: 18px; color: inherit; }
@media (max-width: 749px) { .de-page-banner--hero { min-height: 50svh; } .de-page-banner--hero .de-page-banner__title { font-size: 27px; } }
/* hero-intro subheading lead line (SANDBOX .hic-sub h6, measured 1440px: 20.5/20.5 #65706E −0.04em, no margins) */
.de-hic__sub h6, .de-hic__sub h5 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 20.5px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #65706e; }
@media (max-width: 749px) { .de-hic__sub h6, .de-hic__sub h5 { font-size: 16px; } }
/* SANDBOX form: button row 20px lower, and 24px more below the form than the spacing setting (measured 1440px) */
.de-cform__cell--actions { margin-top: 20px; }
@media (min-width: 750px) { .de-cform.de-sp-bottom-6 { padding-bottom: calc(var(--de-space) * 6 + 24px); } }
/* promo-grid cards (SANDBOX promo-grid, measured Become Partner 1440px): title −1.88px letter-spacing,
   lists with 14px margins and no gap between items */
.de-promo-grid .cd-promo-title { letter-spacing: -1.88px; }
.de-promo-grid .cd-promo-desc ul, .de-promo-grid .cd-promo-desc ol { margin: 14px 0; padding-inline-start: 40px; }
.de-promo-grid .cd-promo-desc li { margin-bottom: 0; }
/* testimonials beside an image: SANDBOX keeps 40px under the card for the slider controls */
@media (min-width: 750px) { .de-tmedia__inner { padding-bottom: 40px; } }

/* ------------------------------------------------ series guide (SANDBOX calm-full-page, CALM collection) */
/* the grid after the guide starts 56px lower (SANDBOX inline margin) */
.de-sg-after { margin-top: 56px; }
.de-sg { font-family: 'Poppins', sans-serif; color: var(--sg-ink, #111111); }
.de-sg * { box-sizing: border-box; }
.de-sg__part { border-top: 1px solid var(--sg-line, #e2e2e2); background: #ffffff; scroll-margin-top: 100px; }
.de-sg__part:last-child { border-bottom: 1px solid var(--sg-line, #e2e2e2); }
.de-sg__bar { background: var(--sg-bar, #f4f4f4); }
.de-sg__head { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1200px; margin: 0 auto; padding: 24px 28px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.de-sg__head-left, .de-sg__nhead-left { display: flex; flex-direction: column; gap: 6px; }
.de-sg__title-row { display: flex; align-items: baseline; gap: 14px; }
.de-sg__num { font-family: 'IBM Plex Mono', monospace; font-size: 15px; font-weight: 600; line-height: 24px; letter-spacing: .05em; color: var(--sg-accent, #0d6e92); }
.de-sg__title, .de-sg__ntitle { display: flex; align-items: baseline; gap: 10px; margin: 0; font-size: 20.5px; line-height: 1; letter-spacing: -0.01em; }
.de-sg__serif { font-family: 'Montserrat', sans-serif; font-weight: 300; }
.de-sg__main { font-family: 'Poppins', sans-serif; font-weight: 600; }
.de-sg__eyebrow { display: block; font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: #65706e; }
.de-sg__icon { width: 26px; font-size: 24px; font-weight: 300; line-height: 38.4px; text-align: center; color: #333333; transition: transform .3s ease; }
.de-sg__head[aria-expanded='true'] .de-sg__icon, .de-sg__nhead[aria-expanded='true'] .de-sg__nicon { transform: rotate(45deg); }
.de-sg__body, .de-sg__nbody { overflow: hidden; transition: height .4s ease; }
.de-sg__nbody { transition-duration: .3s; }
.de-sg__content { max-width: 960px; margin: 0; padding: 32px 28px 44px 90px; text-align: left; }
.de-sg__legend { display: flex; gap: 20px; margin: 0 0 18px; font-family: 'IBM Plex Mono', monospace; font-size: 16px; font-weight: 600; line-height: 25.6px; }
.de-sg__l-pro::before { content: '●'; margin-right: 5px; color: var(--sg-accent, #0d6e92); }
.de-sg__l-daily::before { content: '○'; margin-right: 5px; color: var(--sg-accent2, #1ca3d6); }
.de-sg__scroll { overflow-x: auto; padding-bottom: 8px; width: 100%; }
.de-sg__matrix { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 14.5px; line-height: 23.2px; }
.de-sg__matrix thead th { padding: 0 12px 12px 0; border-bottom: 1px solid var(--sg-ink, #111111); text-align: left; font-family: 'IBM Plex Mono', monospace; font-size: 13px; font-weight: 600; line-height: 20.8px; letter-spacing: .07em; text-transform: uppercase; }
.de-sg__matrix tbody td { padding: 13px 12px 13px 0; border-bottom: 1px solid #f0f0f0; vertical-align: top; line-height: 1.4; }
.de-sg__matrix tbody tr:hover td { background: var(--sg-hover, #eaf7fc); }
.de-sg__name { font-weight: 500; }
.de-sg__name a { color: var(--sg-ink, #111111); text-decoration: none; border-bottom: 1px solid var(--sg-line, #e2e2e2); }
.de-sg__name a:hover { border-color: var(--sg-accent2, #1ca3d6); color: var(--sg-accent, #0d6e92); }
.de-sg__role { font-family: 'IBM Plex Mono', monospace; font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.de-sg__role--pro { color: var(--sg-accent, #0d6e92); }
.de-sg__role--pro::before { content: '● '; }
.de-sg__role--daily { color: var(--sg-accent2, #1ca3d6); }
.de-sg__role--daily::before { content: '○ '; }
.de-sg__actives { font-family: 'IBM Plex Mono', monospace; font-size: 13.5px; line-height: 1.6; color: #3a4245; }
.de-sg__use { font-size: 14.5px; opacity: .9; }
.de-sg__nested { border-top: 1px solid var(--sg-line, #e2e2e2); }
.de-sg__item { border-bottom: 1px solid var(--sg-line, #e2e2e2); scroll-margin-top: 120px; }
.de-sg__nhead { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 18px 4px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.de-sg__nhead-left { gap: 4px; padding-right: 16px; }
.de-sg__nicon { width: 22px; font-size: 20px; font-weight: 300; text-align: center; color: #333333; transition: transform .3s ease; }
.de-sg__ncontent { padding: 6px 4px 28px; }
.de-sg__answer { max-width: 820px; margin: 0; font-size: 16px; line-height: 1.6; color: #65706e; }
.de-sg__answer p { margin: 16px 0; }
.de-sg__timeline { max-width: 820px; margin-left: 6px; border-left: 1px solid var(--sg-line, #e2e2e2); text-align: left; }
.de-sg__step { position: relative; padding: 0 0 24px 26px; }
.de-sg__step:last-child { padding-bottom: 0; }
.de-sg__step::before { content: ''; position: absolute; left: -4.5px; top: 3px; width: 8px; height: 8px; border-radius: 50%; background: #ffffff; border: 1.5px solid var(--sg-accent2, #1ca3d6); }
.de-sg__step-num { display: block; margin-bottom: 3px; font-family: 'IBM Plex Mono', monospace; font-size: 14px; font-weight: 600; color: var(--sg-accent, #0d6e92); }
.de-sg__step h4 { margin: 0 0 4px; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 300; }
.de-sg__step p { margin: 0; font-size: 16px; line-height: 1.6; color: #65706e; }
.de-sg__step p b, .de-sg__step p strong { color: var(--sg-ink, #111111); font-weight: 600; }
.de-sg__home { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; }
.de-sg__home-col { padding: 0 20px 0 0; border-right: 1px solid #f0f0f0; }
.de-sg__home-col:last-child { border-right: 0; }
.de-sg__home-col h5 { margin: 0 0 12px; font-family: 'IBM Plex Mono', monospace; font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--sg-accent, #0d6e92); }
.de-sg__home-col p { margin: 14px 0; font-size: 14px; line-height: 22.4px; }
.de-sg__weekly { display: flex; align-items: baseline; gap: 6px; margin: 0 0 8px; }
.de-sg__weekly-num { font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 300; color: var(--sg-accent, #0d6e92); }
.de-sg__weekly-unit { font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 600; text-transform: uppercase; color: #65706e; }
@media (max-width: 749px) {
  .de-sg__head { padding-left: 16px; padding-right: 16px; }
  .de-sg__content { padding-left: 16px; padding-right: 16px; }
  .de-sg__home-col { border-right: 0; border-bottom: 1px solid #f0f0f0; padding: 0 0 14px; margin-bottom: 14px; }
}

/* ------------------------------------------------ text CMS pages (legal: privacy, cookies, terms, legal notice) */
/* SANDBOX pages/privacy-policy (measured 1440px): wide container with 36px gutters, text 32px under the header,
   no separate title bar when the text has its own H1, body 14/22.4 at 70 %, paragraphs 14px apart */
body#cms .de-breadcrumb { display: none; }
body#cms #main:not(:has(.estelar-page--page)) { max-width: var(--de-fluid); margin-inline: auto; padding: 32px var(--de-gutter) 50px; box-sizing: border-box; }
body#cms #main:has(.page-content > h1) .page-header { display: none; }
body#cms #main .page-header h1 { margin: 0 0 24px; font-family: 'Poppins', sans-serif; font-size: 27px; font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #111111; }
body#cms .page-content.page-cms { padding: 0; font-family: 'Poppins', sans-serif; font-size: 14px; line-height: 22.4px; color: rgba(18, 18, 18, 0.7); }
body#cms .page-content.page-cms p { margin: 14px 0; }
body#cms .page-content.page-cms ul { margin: 14px 0; }
body#cms .page-content.page-cms a { color: #111111; text-decoration: underline; text-underline-offset: .2em; }
body#cms .page-content.page-cms strong { color: #111111; }
body#cms .page-content.page-cms h1, body#cms .page-content.page-cms h2, body#cms .page-content.page-cms h3,
body#cms .page-content.page-cms h4 { font-family: 'Poppins', sans-serif; line-height: 1.25; color: #111111; }
body#cms .page-content.page-cms h3 { margin: 18px 0 8px; font-size: 14px; font-weight: 600; }