/* =========================================================================
   Dom i Ogród Styl — system designu
   Spokojnie, naturalnie, skandynawsko-polski dom: len, las, terakota.
   Jeden plik, jeden namespace .ds-, zero !important.
   Zdjęcia z hurtowni mają białe tła — dlatego jasny motyw i karty na papierze.
   ========================================================================= */

:root {
  --ds-linen: #F7F4EE;
  --ds-paper: #FFFFFF;
  --ds-ink: #1D2420;
  --ds-muted: #5E6761;
  --ds-line: #E2DDD2;
  --ds-moss: #EAF0E7;
  --ds-sand: #EFE6D6;
  --ds-forest: #2E4A3B;
  --ds-forest-deep: #1E3328;
  --ds-terracotta: #B8653F;
  /* Terakota do drobnego tekstu (nadtytuły 12 px): 5,5:1 na lnie, WCAG AA. */
  --ds-terracotta-text: #9A4E2A;
  --ds-sand-deep: #C9A66B;

  --ds-display: Literata, Georgia, "Times New Roman", serif;
  --ds-body: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --ds-gutter: clamp(16px, 4.5vw, 56px);
  --ds-max: 1320px;
  --ds-radius: 12px;
  --ds-radius-lg: 20px;
  --ds-shadow: 0 14px 40px rgba(30, 51, 40, .07);
  --ds-shadow-hover: 0 22px 60px rgba(30, 51, 40, .13);
  --ds-focus: 0 0 0 3px rgba(46, 74, 59, .22);
  --ds-header-h: 80px;
  /* Rząd główny + pasek kategorii — offset dla wszystkiego, co przyklejone. */
  --ds-header-total: 128px;
}

html.ds-locked { overflow: hidden; }

body.ds-theme {
  background: var(--ds-linen);
  color: var(--ds-ink);
  font-family: var(--ds-body);
  font-size: 16.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

body.ds-theme .wp-site-blocks > * { margin-block: 0; }
body.ds-theme :focus-visible { outline: 2px solid var(--ds-forest); outline-offset: 2px; }
body.ds-theme img { max-width: 100%; }

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ds-wrap,
.ds-section,
.ds-hero__inner,
.ds-closing__inner,
.ds-newsletter__inner,
.ds-footer__inner {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding-inline: var(--ds-gutter);
  box-sizing: border-box;
}

/* --------------------------------------------------------------- typo --- */

.ds-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ds-terracotta-text);
  margin: 0 0 12px;
}
.ds-eyebrow--light { color: #E7B48F; }

.ds-section__title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(28px, 3.3vw, 42px);
  line-height: 1.1;
  letter-spacing: -.02em;
  margin: 0;
  color: var(--ds-ink);
}

.ds-section__lead {
  max-width: 62ch;
  margin: 14px 0 0;
  color: var(--ds-muted);
  font-size: 16.5px;
}

.ds-link {
  color: var(--ds-forest);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(46, 74, 59, .28);
  padding-bottom: 2px;
  white-space: nowrap;
  transition: border-color .18s ease, color .18s ease;
}
.ds-link:hover { color: var(--ds-terracotta); border-bottom-color: var(--ds-terracotta); }
.ds-link--small { font-size: 14px; }

/* ------------------------------------------------------------ przyciski --- */

.ds-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 999px;
  padding: 14px 26px;
  font-family: var(--ds-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .01em;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.ds-btn:hover { transform: translateY(-1px); }
.ds-btn--small { padding: 10px 18px; font-size: 14px; }
.ds-btn--primary { background: var(--ds-forest); color: #fff; }
.ds-btn--primary:hover { background: var(--ds-forest-deep); color: #fff; }
.ds-btn--ghost { background: var(--ds-paper); color: var(--ds-ink); border-color: var(--ds-line); }
.ds-btn--ghost:hover { border-color: var(--ds-forest); color: var(--ds-forest); }
.ds-btn--light { background: #fff; color: var(--ds-forest-deep); }
.ds-btn--light:hover { background: var(--ds-sand); color: var(--ds-forest-deep); }
.ds-btn--outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); }
.ds-btn--outline-light:hover { border-color: #fff; }

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

.ds-topbar {
  background: var(--ds-forest-deep);
  color: rgba(255, 255, 255, .9);
  font-size: 12.5px;
  letter-spacing: .01em;
}

.ds-topbar__inner {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding: 7px var(--ds-gutter);
  display: flex;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
}

.ds-topbar__item { display: inline-flex; align-items: center; gap: 8px; }
.ds-topbar__item::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--ds-sand-deep);
}

.ds-header {
  position: relative;
  z-index: 60;
  background: rgba(247, 244, 238, .94);
  backdrop-filter: saturate(1.3) blur(14px);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-body);
}

.ds-header__inner {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding: 0 var(--ds-gutter);
  min-height: var(--ds-header-h);
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 36px);
}

.ds-logo { display: flex; align-items: center; flex: 0 0 auto; }
.ds-logo img { display: block; width: auto; height: 44px; }

/* Wyszukiwarka dostaje całą wolną przestrzeń — przy dziesiątkach tysięcy pozycji
   to główna droga do produktu. */
.ds-header__search { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
.ds-header__search .ds-sb { width: min(580px, 100%); }

.ds-header__actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }

.ds-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  box-sizing: border-box;
  border-radius: 999px;
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  color: var(--ds-ink);
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.ds-icon-btn:hover { border-color: var(--ds-forest); color: var(--ds-forest); }
.ds-icon-btn svg { width: 19px; height: 19px; flex: 0 0 auto; }
.ds-burger { padding: 0; width: 42px; }

.ds-cart {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  height: 42px;
  box-sizing: border-box;
  background: var(--ds-forest);
  color: #fff;
  border-radius: 999px;
  padding: 0 18px;
  font-size: 14.5px;
  font-weight: 700;
  text-decoration: none;
}
.ds-cart:hover { background: var(--ds-forest-deep); color: #fff; }
.ds-cart svg { width: 19px; height: 19px; }

.ds-cart__count {
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  box-sizing: border-box;
  border-radius: 999px;
  background: var(--ds-terracotta);
  color: #fff;
  font-size: 12px;
  line-height: 21px;
  text-align: center;
}

/* ----------------------------------------------- pasek kategorii --- */

.ds-catbar { border-top: 1px solid var(--ds-line); }

.ds-catbar__inner {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding: 0 var(--ds-gutter);
  display: flex;
  align-items: center;
  gap: 2px;
  height: 48px;
  overflow: visible;
}

.ds-catbar__link {
  padding: 8px 12px;
  border-radius: 8px;
  color: var(--ds-ink);
  text-decoration: none;
  font-size: 14.5px;
  font-weight: 500;
  white-space: nowrap;
}
.ds-catbar__link:hover { background: var(--ds-moss); color: var(--ds-forest-deep); }

.ds-mega { position: relative; }

.ds-catbar__trigger {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-right: 10px;
  padding: 9px 16px;
  border: 0;
  border-radius: 8px;
  background: var(--ds-forest);
  color: #fff;
  font-family: var(--ds-body);
  font-size: 14.5px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.ds-catbar__trigger:hover { background: var(--ds-forest-deep); }
.ds-catbar__trigger svg { width: 17px; height: 17px; }

.ds-mega__panel {
  position: absolute;
  z-index: 70;
  top: calc(100% + 6px);
  left: 0;
  width: min(1080px, calc(100vw - 2 * var(--ds-gutter)));
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-lg);
  box-shadow: var(--ds-shadow-hover);
  padding: 22px 26px 18px;
  box-sizing: border-box;
  max-height: calc(100vh - 180px);
  overflow-y: auto;
}

.ds-mega__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px 28px;
}

.ds-mega__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 7px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--ds-line);
  color: var(--ds-ink);
  text-decoration: none;
  font-weight: 700;
  font-size: 15px;
}
.ds-mega__head:hover { color: var(--ds-forest); }
.ds-mega__head em { font-style: normal; font-size: 12px; font-weight: 500; color: var(--ds-muted); }

.ds-mega__col ul { list-style: none; margin: 0; padding: 0; }
.ds-mega__col li a {
  display: block;
  padding: 4px 0;
  color: var(--ds-muted);
  text-decoration: none;
  font-size: 14px;
}
.ds-mega__col li a:hover { color: var(--ds-forest); }

.ds-mega__all {
  display: inline-block;
  margin-top: 16px;
  font-weight: 700;
  font-size: 14.5px;
  color: var(--ds-forest);
  text-decoration: none;
}
.ds-mega__all:hover { color: var(--ds-terracotta); }

.ds-burger { display: none; }

/* szuflada mobilna */
.ds-drawer {
  position: fixed;
  inset: 0;
  z-index: 70;
  background: rgba(29, 36, 32, .45);
  display: none;
}
.ds-drawer.is-open { display: block; }
.ds-drawer__panel {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(420px, 88vw);
  box-sizing: border-box;
  background: var(--ds-linen);
  padding: 22px var(--ds-gutter) 40px;
  overflow-y: auto;
}
.ds-drawer__close {
  background: none;
  border: 0;
  font-size: 28px;
  line-height: 1;
  color: var(--ds-ink);
  cursor: pointer;
  margin-bottom: 16px;
}
.ds-drawer__panel > a {
  display: block;
  padding: 14px 0;
  border-bottom: 1px solid var(--ds-line);
  color: var(--ds-ink);
  text-decoration: none;
  font-size: 17px;
}
.ds-drawer__panel > a:hover { color: var(--ds-forest); }
.ds-drawer__panel .ds-sb { margin-bottom: 18px; }

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

.ds-hero {
  position: relative;
  background:
    radial-gradient(60% 80% at 92% 10%, rgba(234, 240, 231, .9) 0%, rgba(234, 240, 231, 0) 70%),
    var(--ds-linen);
  overflow: hidden;
}

.ds-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  padding-block: clamp(40px, 6.5vw, 96px);
}

.ds-hero__title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(38px, 5.2vw, 68px);
  line-height: 1.04;
  letter-spacing: -.03em;
  margin: 0 0 20px;
  max-width: 15ch;
}
.ds-hero__title em { font-style: italic; font-weight: 400; color: var(--ds-forest); }

.ds-hero__lead {
  max-width: 50ch;
  margin: 0 0 28px;
  font-size: clamp(16.5px, 1.3vw, 18.5px);
  color: #3E4842;
}

.ds-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }

.ds-hero__search { margin: 0 0 26px; max-width: 580px; }

.ds-hero__hints {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0 0;
  padding: 0 0 0 4px;
}
.ds-hero__hints a {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .7);
  color: var(--ds-muted);
  font-size: 13.5px;
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease;
}
.ds-hero__hints a:hover { border-color: var(--ds-forest); color: var(--ds-forest); }

.ds-hero__visual { position: relative; }
.ds-hero__frame {
  aspect-ratio: 1 / 1;
  background: var(--ds-paper);
  border-radius: 28px 28px 28px 120px;
  box-shadow: var(--ds-shadow);
  overflow: hidden;
  display: grid;
  place-items: center;
}
.ds-hero__frame img { width: 100%; height: 100%; object-fit: contain; padding: 9%; box-sizing: border-box; }
.ds-hero__frame .ds-hero__mark { width: 46%; height: auto; padding: 0; opacity: .9; }

.ds-hero__mosaic {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.ds-hero__tile {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: 22px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: var(--ds-shadow);
  transition: transform .2s ease, box-shadow .2s ease;
}
.ds-hero__tile:nth-child(1) { border-radius: 22px 22px 22px 90px; }
.ds-hero__tile:nth-child(4) { border-radius: 22px 90px 22px 22px; }
.ds-hero__tile:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-hover); }
.ds-hero__tile img { width: 100%; height: 100%; object-fit: contain; padding: 14%; box-sizing: border-box; }
.ds-hero__tile span {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(247, 244, 238, .94);
  color: var(--ds-forest-deep);
  font-size: 13px;
  font-weight: 700;
}
.ds-hero__tile:nth-child(1) span { left: auto; right: 12px; }

/* --------------------------------------------------------- pasek zaufania --- */

.ds-trustbar { background: var(--ds-paper); border-block: 1px solid var(--ds-line); }
.ds-trustbar__list {
  list-style: none;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 24px;
  padding-block: 18px;
}
.ds-trustbar__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ds-ink);
}
.ds-trustbar__list svg {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 999px;
  background: var(--ds-moss);
  color: var(--ds-forest);
}

/* ------------------------------------------------------------- sekcje --- */

.ds-section { padding-block: clamp(48px, 6.5vw, 96px); }
.ds-section__head { margin-bottom: clamp(24px, 3.2vw, 44px); }
.ds-section__head--center { text-align: center; }
.ds-section__head--center .ds-section__lead { margin-inline: auto; }

/* ------------------------------------------------------------- działy --- */

.ds-dept-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.ds-dept {
  display: flex;
  flex-direction: column;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: var(--ds-ink);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ds-dept:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-hover); border-color: transparent; }
.ds-dept--wide { grid-column: span 2; }

.ds-dept__media {
  display: block;
  background: var(--ds-paper);
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-bottom: 1px solid var(--ds-line);
}
.ds-dept--tall .ds-dept__media { aspect-ratio: 4 / 3; }
.ds-dept__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 16px;
  box-sizing: border-box;
}

.ds-dept__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ds-dept__name {
  font-family: var(--ds-display);
  font-size: clamp(20px, 1.8vw, 25px);
  font-weight: 500;
  letter-spacing: -.015em;
  line-height: 1.15;
}
.ds-dept__lead { color: var(--ds-muted); font-size: 14.5px; line-height: 1.55; }
.ds-dept__meta {
  margin-top: auto;
  padding-top: 14px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--ds-line);
  font-size: 14px;
}
.ds-dept__count { color: var(--ds-muted); }
.ds-dept__go { color: var(--ds-forest); font-weight: 700; }
.ds-dept:hover .ds-dept__go { color: var(--ds-terracotta); }

/* -------------------------------------------------------------- półki --- */

.ds-shelf__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(22px, 3vw, 36px);
}

.ds-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.ds-card {
  display: flex;
  flex-direction: column;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius);
  overflow: hidden;
  text-decoration: none;
  color: var(--ds-ink);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ds-card:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-hover); border-color: transparent; }

.ds-card__media { display: block; background: var(--ds-paper); aspect-ratio: 1 / 1; overflow: hidden; }
.ds-card__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 14px;
  box-sizing: border-box;
  transition: transform .35s ease;
}
.ds-card:hover .ds-card__media img { transform: scale(1.035); }

.ds-card__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 6px 16px 18px;
  flex: 1;
}
.ds-card__title {
  font-size: 14.5px;
  line-height: 1.42;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 41px;
}
.ds-card__price {
  margin-top: auto;
  font-family: var(--ds-display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--ds-forest-deep);
}
.ds-card__price .woocommerce-Price-currencySymbol { font-size: .8em; }

/* -------------------------------------------------------------- marki --- */

.ds-brands { padding-block: clamp(40px, 5vw, 68px); }
.ds-brands__rail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
}
.ds-brands__item {
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  border-radius: 999px;
  padding: 10px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ds-ink);
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease;
}
.ds-brands__item:hover { border-color: var(--ds-forest); color: var(--ds-forest); }

/* ----------------------------------------------------------- zaufanie --- */

.ds-trust { max-width: none; background: var(--ds-moss); }
.ds-trust > * { max-width: calc(var(--ds-max) - 2 * var(--ds-gutter)); margin-inline: auto; }
.ds-trust__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.ds-trust__tile {
  background: var(--ds-paper);
  border-radius: var(--ds-radius-lg);
  padding: 26px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ds-trust__icon svg {
  width: 44px;
  height: 44px;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 14px;
  background: var(--ds-moss);
  color: var(--ds-forest);
}
.ds-trust__title {
  font-family: var(--ds-display);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.22;
  letter-spacing: -.01em;
  margin: 4px 0 0;
}
.ds-trust__text { margin: 0; color: var(--ds-muted); font-size: 14.5px; line-height: 1.6; }
.ds-trust__tile .ds-link { margin-top: auto; align-self: flex-start; white-space: normal; }

/* ------------------------------------------------------------- budżet --- */

/* (reguły .ds-budget w dalszej części pliku) */

/* --------------------------------------------------------- newsletter --- */

.ds-newsletter { background: var(--ds-forest); color: #fff; }
.ds-newsletter__inner {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: clamp(24px, 5vw, 64px);
  align-items: center;
  padding-block: clamp(44px, 6vw, 80px);
}
.ds-newsletter__title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.12;
  letter-spacing: -.02em;
  margin: 0 0 12px;
  color: #fff;
}
.ds-newsletter__lead { margin: 0; color: rgba(255, 255, 255, .78); max-width: 54ch; }
.ds-newsletter__form { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.ds-newsletter__soon { margin: 0; color: rgba(255, 255, 255, .78); font-size: 15px; }

/* ---------------------------------------------------------------- faq --- */

.ds-faq__list { max-width: 900px; }
.ds-faq__item { border-top: 1px solid var(--ds-line); }
.ds-faq__item:last-child { border-bottom: 1px solid var(--ds-line); }
.ds-faq__item summary {
  cursor: pointer;
  list-style: none;
  padding: 20px 40px 20px 0;
  position: relative;
  font-family: var(--ds-display);
  font-size: clamp(18px, 1.7vw, 21px);
  font-weight: 500;
  letter-spacing: -.01em;
}
.ds-faq__item summary::-webkit-details-marker { display: none; }
.ds-faq__item summary::after {
  content: "+";
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--ds-body);
  font-size: 24px;
  font-weight: 300;
  color: var(--ds-forest);
}
.ds-faq__item[open] summary::after { content: "–"; }
.ds-faq__item p { margin: 0 0 22px; max-width: 72ch; color: var(--ds-muted); }

/* --------------------------------------------------------- zamknięcie --- */

.ds-closing { background: var(--ds-sand); color: var(--ds-ink); }
.ds-closing__inner { padding-block: clamp(48px, 6vw, 84px); text-align: center; }
.ds-closing__title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(26px, 3.3vw, 42px);
  line-height: 1.12;
  letter-spacing: -.02em;
  margin: 0 auto 14px;
  max-width: 22ch;
}
.ds-closing__lead { margin: 0 auto 28px; max-width: 52ch; color: var(--ds-muted); }
.ds-closing__cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.ds-closing .ds-btn--light { background: var(--ds-forest); color: #fff; }
.ds-closing .ds-btn--light:hover { background: var(--ds-forest-deep); color: #fff; }

/* -------------------------------------------------------------- stopka --- */

.ds-footer { background: var(--ds-forest-deep); color: rgba(255, 255, 255, .82); font-family: var(--ds-body); }
.ds-footer__inner { padding-block: clamp(44px, 5vw, 72px) 28px; }
.ds-footer__cols {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: clamp(24px, 4vw, 56px);
}
.ds-footer__about img { display: block; width: auto; height: 40px; }
.ds-footer p { color: rgba(255, 255, 255, .72); font-size: 14.5px; margin: 14px 0 0; max-width: 42ch; }
.ds-footer__contact { display: flex; flex-direction: column; gap: 4px; }
.ds-footer__contact a { color: #fff; text-decoration: none; font-weight: 600; }
.ds-footer__contact a:hover { color: #E7B48F; }
.ds-footer__h {
  font-family: var(--ds-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #E7B48F;
  margin: 0 0 14px;
}
.ds-footer ul { list-style: none; margin: 0; padding: 0; }
.ds-footer li { margin-bottom: 9px; }
.ds-footer li a { color: rgba(255, 255, 255, .86); text-decoration: none; font-size: 14.5px; }
.ds-footer li a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ds-footer__bottom {
  margin-top: clamp(32px, 4vw, 52px);
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  display: flex;
  flex-wrap: wrap;
  gap: 14px 26px;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
}
.ds-footer__bottom p { margin: 0; font-size: 13px; max-width: 80ch; color: rgba(255, 255, 255, .6); }
.ds-footer .ds-paylogos { margin: 0; }
.ds-footer .ds-paylogo { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); color: rgba(255, 255, 255, .86); }

/* ------------------------------------------------------- strony treści --- */

.ds-page { padding-block: clamp(36px, 5vw, 72px); }
.ds-page__inner { max-width: 860px; margin-inline: auto; padding-inline: var(--ds-gutter); }
.ds-page__inner--wide { max-width: var(--ds-max); }
.ds-page .wp-block-post-title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.1;
  letter-spacing: -.02em;
  margin: 0 0 28px;
}
.ds-page .wp-block-post-content { font-size: 16.5px; line-height: 1.75; }
.ds-page .wp-block-post-content h2,
.ds-page .wp-block-post-content h3 { margin: 1.8em 0 .6em; line-height: 1.2; }
.ds-page .wp-block-post-content a { color: var(--ds-forest); }

/* ------------------------------------------------------------- mobile --- */

@media (max-width: 1180px) {
  .ds-catbar__link { padding: 8px 9px; font-size: 14px; }
  .ds-mega__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ds-icon-btn__label { display: none; }
  .ds-account { padding: 0; width: 42px; }
}

@media (max-width: 1024px) {
  .ds-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ds-cards .ds-card:nth-child(4) { display: none; }
  .ds-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-trustbar__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-hero__inner { grid-template-columns: 1fr .8fr; }
}

@media (max-width: 900px) {
  :root { --ds-header-total: 118px; }
  /* Pasek kategorii ustępuje szufladzie — na telefonie te same kategorie są
     w drzewie nad listą produktów. */
  .ds-catbar { display: none; }
  .ds-burger { display: inline-flex; }
  .ds-topbar__inner { gap: 14px; font-size: 12px; }
  .ds-topbar__item:nth-child(3) { display: none; }
  .ds-header__inner { flex-wrap: wrap; padding-block: 10px; min-height: 0; row-gap: 10px; }
  .ds-header__search { order: 3; flex: 1 0 100%; justify-content: stretch; }
  .ds-header__search .ds-sb { width: 100%; }
  .ds-header__actions { margin-inline-start: auto; }
  .ds-logo img { height: 36px; }
  .ds-dept-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-dept--wide { grid-column: span 2; }
  .ds-dept--tall .ds-dept__media { aspect-ratio: 16 / 11; }
  .ds-footer__cols { grid-template-columns: 1fr 1fr; }
  .ds-hero__inner { grid-template-columns: 1fr; }
  .ds-hero__visual { max-width: 460px; width: 100%; justify-self: center; }
  .ds-newsletter__inner { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .ds-hero__inner { padding-block: 26px 44px; }
  .ds-hero__title { max-width: none; }
  .ds-hero__visual { display: none; }
  .ds-hero__cta .ds-btn { flex: 1 1 auto; }
  .ds-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ds-cards .ds-card:nth-child(4) { display: flex; }
  .ds-card__body { padding: 4px 12px 14px; }
  .ds-shelf__head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .ds-dept-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ds-dept--wide, .ds-dept--tall { grid-column: span 1; }
  .ds-dept__media, .ds-dept--tall .ds-dept__media { aspect-ratio: 1 / 1; }
  .ds-dept__lead { display: none; }
  .ds-dept__body { padding: 14px 14px 16px; }
  .ds-dept__meta { flex-direction: column; gap: 2px; padding-top: 10px; }
  .ds-trust__grid { grid-template-columns: 1fr; }
  .ds-trustbar__list { grid-template-columns: 1fr 1fr; gap: 12px; }
  .ds-trustbar__list li { font-size: 13px; gap: 8px; }
  .ds-trustbar__list svg { width: 32px; height: 32px; padding: 7px; }
  .ds-footer__cols { grid-template-columns: 1fr; }
  /* Nagłówek musi zmieścić się w 360 px razem z przyciskiem menu:
     konto przenosimy do szuflady, koszyk zwężamy. */
  .ds-header__inner { gap: 10px; }
  .ds-logo img { height: 36px; }
  .ds-header__actions { gap: 6px; }
  .ds-header__actions .ds-account { display: none; }
  .ds-cart { padding: 0 14px; font-size: 14px; }
  .ds-cart__label { display: none; }
  .ds-topbar__item:nth-child(2) { display: none; }
}

@media (max-width: 380px) {
  .ds-logo img { height: 32px; }
  .ds-cart { padding: 0 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .ds-btn, .ds-card, .ds-dept, .ds-card__media img { transition: none; }
  .ds-btn:hover, .ds-card:hover, .ds-dept:hover { transform: none; }
}

/* =========================================================================
   KATALOG I KARTA PRODUKTU
   ========================================================================= */

.ds-breadcrumb {
  padding: 22px 0 6px;
  font-size: 13.5px;
  color: var(--ds-muted);
}
.ds-breadcrumb a { color: var(--ds-muted); text-decoration: none; }
.ds-breadcrumb a:hover { color: var(--ds-forest); }
.ds-breadcrumb__sep { padding: 0 8px; opacity: .5; }

/* --------------------------------------------------------- nagłówek --- */

.ds-catalog { padding-bottom: clamp(48px, 6vw, 88px); }

.ds-catalog__head { max-width: 760px; padding: clamp(10px, 2vw, 22px) 0 clamp(20px, 3vw, 34px); }
.ds-catalog__title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(32px, 4.4vw, 56px);
  line-height: 1.03;
  letter-spacing: -.03em;
  margin: 0 0 14px;
}
.ds-catalog__lead p { margin: 0 0 10px; color: var(--ds-muted); font-size: 17px; }
.ds-catalog__count { margin: 12px 0 0; font-size: 14px; color: var(--ds-muted); }

.ds-subcats { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: clamp(22px, 3vw, 34px); }
.ds-subcats__item {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  border-radius: 999px;
  padding: 10px 17px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ds-ink);
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease;
}
.ds-subcats__item span { color: var(--ds-muted); font-weight: 500; font-size: 13px; }
.ds-subcats__item:hover { border-color: var(--ds-forest); color: var(--ds-forest); }

/* ----------------------------------------------------------- pasek --- */

.ds-catalog__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  padding: 16px 0;
  border-top: 1px solid var(--ds-line);
  border-bottom: 1px solid var(--ds-line);
  margin-bottom: clamp(22px, 3vw, 34px);
}
.ds-catalog__toolbar .woocommerce-result-count { margin: 0; font-size: 14px; color: var(--ds-muted); }
.ds-catalog__toolbar .woocommerce-ordering { margin: 0; }
.ds-catalog__toolbar select {
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  border-radius: 999px;
  padding: 10px 38px 10px 16px;
  font-family: var(--ds-body);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ds-ink);
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%232E4A3B' stroke-width='1.6'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 11px;
}

/* --------------------------------------------------- siatka produktów --- */

.woocommerce ul.products,
.woocommerce-page ul.products {
  display: grid;
  /* `auto-fill`, a nie sztywne cztery kolumny: obok siatki stoi teraz drzewo
     kategorii, więc dostępna szerokość zależy od breakpointu i od tego, czy
     drzewo jest widoczne. */
  grid-template-columns: repeat(auto-fill, minmax(216px, 1fr));
  gap: 20px;
  margin: 0 0 clamp(30px, 4vw, 48px);
  padding: 0;
  list-style: none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; }

.woocommerce ul.products li.product {
  width: auto;
  margin: 0;
  padding: 0;
  float: none;
  display: flex;
  flex-direction: column;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-3px);
  box-shadow: var(--ds-shadow-hover);
  border-color: transparent;
}
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link {
  display: flex;
  flex-direction: column;
  flex: 1;
  text-decoration: none;
  color: var(--ds-ink);
}
.woocommerce ul.products li.product img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  padding: 16px;
  box-sizing: border-box;
  margin: 0;
  background: var(--ds-paper);
  transition: transform .35s ease;
}
.woocommerce ul.products li.product:hover img { transform: scale(1.035); }

.woocommerce ul.products li.product .ds-card__brand {
  display: block;
  padding: 4px 18px 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ds-forest);
}
.woocommerce ul.products li.product h2.ds-card__title {
  margin: 6px 0 10px;
  padding: 0 18px;
  font-family: var(--ds-body);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 42px;
}
.woocommerce ul.products li.product .price {
  margin: auto 0 0;
  padding: 0 18px;
  font-family: var(--ds-display);
  font-size: 20px;
  font-weight: 600;
  color: var(--ds-forest);
}
.woocommerce ul.products li.product .price del { color: var(--ds-muted); font-size: .7em; margin-right: 6px; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
  margin: 14px 18px 18px;
  border-radius: 999px;
  background: var(--ds-linen);
  border: 1px solid var(--ds-line);
  color: var(--ds-ink);
  font-family: var(--ds-body);
  font-size: 14px;
  font-weight: 700;
  padding: 11px 16px;
  text-align: center;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.woocommerce ul.products li.product .button:hover {
  background: var(--ds-forest);
  border-color: var(--ds-forest);
  color: #fff;
}
.woocommerce ul.products li.product .onsale {
  position: absolute;
  margin: 10px;
  border-radius: 999px;
  background: var(--ds-terracotta);
  color: #fff;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
  min-height: 0;
  min-width: 0;
  line-height: 1.2;
}

/* ------------------------------------------------------- paginacja --- */

.woocommerce nav.woocommerce-pagination { margin: 0 0 clamp(30px, 4vw, 56px); }
.woocommerce nav.woocommerce-pagination ul { border: 0; display: flex; gap: 8px; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; margin: 0; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 14px;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-paper);
  color: var(--ds-ink);
  font-weight: 600;
  font-size: 15px;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--ds-forest);
  border-color: var(--ds-forest);
  color: #fff;
}
.woocommerce nav.woocommerce-pagination ul li a:hover { border-color: var(--ds-forest); color: var(--ds-forest); background: var(--ds-paper); }

.ds-catalog__empty { padding: clamp(40px, 6vw, 80px) 0; max-width: 560px; }
.ds-catalog__empty h2 { font-family: var(--ds-display); font-weight: 500; font-size: clamp(24px, 3vw, 34px); margin: 0 0 12px; }
.ds-catalog__empty p { color: var(--ds-muted); margin: 0 0 22px; }

/* ==================================================== KARTA PRODUKTU ==== */

.ds-product-page { padding-bottom: clamp(40px, 5vw, 72px); }

.ds-product {
  display: grid;
  /* Lewa kolumna niesie galerię, opis i akordeon dostawy, więc dostaje więcej
     miejsca. Prawa jest węższa — to panel zakupu, nie druga kolumna treści. */
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: clamp(28px, 3.4vw, 56px);
  /* NIE `align-items: start` — wtedy prawa kolumna ma wysokość swojej treści,
     a przyklejony panel może się kleić tylko w obrębie rodzica i odjeżdża
     po dwustu pikselach. Kolumny muszą sięgać całego wiersza. */
  align-items: stretch;
  padding-top: 10px;
}

.ds-product__main { min-width: 0; }

.ds-product__gallery {
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-lg);
  padding: clamp(16px, 2vw, 28px);
}
.ds-gallery__main {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  background: var(--ds-paper);
  border-radius: 12px;
  overflow: hidden;
}
.ds-gallery__main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: clamp(8px, 1.5vw, 22px);
  box-sizing: border-box;
}
.ds-gallery__thumbs {
  display: grid;
  /* auto-fill zamiast stałych pięciu kolumn — przy sześciu zdjęciach
     jedno zostawało samo w drugim rzędzie. */
  grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}
.ds-gallery__thumb {
  display: block;
  width: 100%;
  padding: 6px;
  border: 1px solid var(--ds-line);
  border-radius: 10px;
  background: var(--ds-paper);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.ds-gallery__thumb img { display: block; width: 100%; height: 62px; object-fit: contain; }
.ds-gallery__thumb:hover { border-color: var(--ds-forest); }
.ds-gallery__thumb.is-active { border-color: var(--ds-forest); box-shadow: 0 0 0 1px var(--ds-forest); }

/* WooCommerce trzyma `div.summary` na `float:right; width:48%`, a jego selektor
   `.woocommerce div.product div.summary` ma wyższą specyficzność niż zwykłe
   zagnieżdżenie klas. Stąd cztery klasy po naszej stronie zamiast !important —
   bez tego prawa kolumna miała 286 px zamiast 597 px i tytuł łamał się na pięć linii. */
/* Przyklejony panel zakupu. `position: sticky` działa w obrębie swojego kontenera,
   a tym jest cała kolumna siatki — czyli przez galerię, opis, specyfikację i akordeon
   dostawy, bo one też siedzą w tej siatce. Dlatego opis został przeniesiony do lewej
   kolumny: gdyby stał pod siatką, przyklejenie kończyłoby się w połowie strony.
   `max-height` to zabezpieczenie na niskie ekrany — bez niego przy panelu wyższym
   od okna przycisk „Dodaj do koszyka" wyjeżdżałby poza kadr. */
.ds-product__panel {
  position: sticky;
  top: calc(var(--ds-header-total) + 20px);
  max-height: calc(100vh - var(--ds-header-total) - 36px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--ds-line) transparent;
  padding-right: 4px;
}
.ds-product__panel::-webkit-scrollbar { width: 6px; }
.ds-product__panel::-webkit-scrollbar-track { background: transparent; }
.ds-product__panel::-webkit-scrollbar-thumb { background: var(--ds-line); border-radius: 999px; }

.woocommerce .ds-product .ds-product__buy .summary,
.woocommerce .ds-product .ds-product__buy .summary.entry-summary {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
}
.woocommerce .ds-product .ds-product__gallery .woocommerce-product-gallery,
.woocommerce .ds-product .ds-product__gallery .woocommerce-product-gallery.images {
  float: none;
  width: 100%;
  margin: 0;
}
.ds-product__eyebrow { margin-bottom: 12px; }
.ds-product__eyebrow a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(46, 74, 59, .3); }

.ds-product .product_title {
  font-family: var(--ds-display);
  font-weight: 500;
  /* Nazwy z hurtowni mają po 60–90 znaków — duży krój zamieniał je w pięć linii. */
  font-size: clamp(24px, 2.3vw, 32px);
  line-height: 1.16;
  letter-spacing: -.015em;
  margin: 0 0 14px;
}

.ds-product .summary > .price,
.ds-product p.price {
  font-family: var(--ds-display);
  font-size: clamp(28px, 3vw, 36px);
  font-weight: 600;
  color: var(--ds-forest);
  margin: 0 0 6px;
  line-height: 1.1;
}
.ds-product p.price del { color: var(--ds-muted); font-size: .6em; font-weight: 500; }
.ds-product p.price ins { text-decoration: none; }

.ds-stock { margin: 0 0 18px; font-size: 14px; font-weight: 600; }
.ds-stock--in { color: #2F6B4F; }
.ds-stock--in::before { content: "● "; }
.ds-stock--out { color: var(--ds-terracotta); }

.ds-product__lead {
  margin: 0 0 22px;
  color: #3E4842;
  font-size: 16.5px;
  line-height: 1.65;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--ds-line);
}

/* formularz koszyka — pod nim renderują się portfele (Apple Pay / Google Pay / Link) */
.ds-product form.cart {
  display: flex;
  align-items: stretch;
  gap: 10px;
  margin: 0 0 18px;
  flex-wrap: wrap;
}
.ds-product form.cart .quantity {
  display: flex;
  flex: 0 0 64px;
  height: 54px;
  margin: 0;
}
.ds-product form.cart .quantity input.qty {
  width: 64px;
  height: 54px;
  min-height: 54px;
  box-sizing: border-box;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-paper);
  text-align: center;
  font-family: var(--ds-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--ds-ink);
}
.ds-product .single_add_to_cart_button {
  flex: 1 1 200px;
  height: 54px;
  min-height: 54px;
  border-radius: 999px;
  border: 0;
  background: var(--ds-forest);
  color: #fff;
  font-family: var(--ds-body);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .01em;
  padding: 0 26px;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}
.ds-product .single_add_to_cart_button:hover { background: var(--ds-forest-deep); transform: translateY(-1px); }
.ds-product .gapli-buy-now-button {
  flex: 1 1 100%;
  margin-left: 0;
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--ds-ink);
  background: var(--ds-ink);
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
}

.ds-product .gapli-express { margin: 0 0 20px; }
.ds-product .gapli-express__separator {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 4px 0 14px;
  color: var(--ds-muted);
  font-size: 13px;
}
.ds-product .gapli-express__separator::before,
.ds-product .gapli-express__separator::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--ds-line);
}
.ds-product .gapli-express__legal { margin: 12px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--ds-muted); }
.ds-product .gapli-express__legal a { color: var(--ds-forest); }
.ds-product .gapli-express__error { margin: 10px 0 0; font-size: 13px; color: var(--ds-terracotta); }

.ds-product__trust { list-style: none; margin: 20px 0 22px; padding: 0; }
.ds-product__trust li {
  position: relative;
  padding: 7px 0 7px 26px;
  font-size: 14.5px;
  color: var(--ds-muted);
}
.ds-product__trust li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 15px;
  width: 11px;
  height: 6px;
  border-left: 1.8px solid var(--ds-forest);
  border-bottom: 1.8px solid var(--ds-forest);
  transform: rotate(-45deg);
}

.ds-product .product_meta {
  margin: 0;
  padding-top: 18px;
  border-top: 1px solid var(--ds-line);
  font-size: 13.5px;
  color: var(--ds-muted);
}
.ds-product .product_meta > span { display: block; margin-bottom: 5px; }
.ds-product .product_meta a { color: var(--ds-muted); }

/* ------------------------------------------------ sekcje pod produktem --- */

.ds-product-section { padding-block: clamp(40px, 5vw, 72px); border-top: 1px solid var(--ds-line); }
.ds-product-section:first-of-type { border-top: 0; }

/* W lewej kolumnie sekcje nie są już pełną szerokością strony — mają mniejszy
   oddech i własne, nie stronicowe, wcięcia. */
.ds-product__main .ds-product-section {
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
  padding-block: clamp(28px, 3vw, 44px);
}
.ds-product__main .ds-prose,
.ds-product__main .ds-faq__list { max-width: none; }
.ds-product__main .ds-specs { max-width: none; }

.ds-product__buy .ds-product__trust { margin-top: 24px; }
.ds-product__buy .product_meta { margin-top: 18px; }

.ds-prose { max-width: 72ch; color: #333D37; }
.ds-prose p { margin: 0 0 16px; line-height: 1.75; }
.ds-prose ul, .ds-prose ol { margin: 0 0 18px 1.3em; }
.ds-prose li { margin: 6px 0; }
.ds-prose strong { color: var(--ds-ink); }

.ds-specs {
  width: 100%;
  max-width: 640px;
  margin: 32px 0 0;
  border-collapse: collapse;
  font-size: 15px;
}
.ds-specs th, .ds-specs td { padding: 13px 4px; border-bottom: 1px solid var(--ds-line); text-align: left; vertical-align: top; }
.ds-specs th { width: 38%; font-weight: 500; color: var(--ds-muted); }
.ds-specs td { color: var(--ds-ink); }

/* ------------------------------------------------------------ mobile --- */

@media (max-width: 980px) {
  .ds-product { grid-template-columns: 1fr; gap: 26px; }
  /* Przy jednej kolumnie przyklejanie nie ma sensu — panel zasłaniałby treść. */
  .ds-product__panel { position: static; max-height: none; overflow: visible; }
  .ds-product__main .ds-product-section { padding-block: clamp(24px, 4vw, 36px); }
}

@media (max-width: 720px) {
  .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .woocommerce ul.products li.product h2.ds-card__title { font-size: 14px; padding: 0 13px; }
  .woocommerce ul.products li.product .ds-card__brand { padding: 4px 13px 0; }
  .woocommerce ul.products li.product .price { padding: 0 13px; font-size: 18px; }
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .added_to_cart { margin: 12px 13px 14px; font-size: 13px; }
  .ds-catalog__toolbar { flex-direction: column; align-items: stretch; gap: 12px; }
  .ds-catalog__toolbar select { width: 100%; }
  .ds-product form.cart { flex-direction: column; }
  .ds-product form.cart .quantity { flex: 0 0 auto; width: 100%; height: 54px; }
  .ds-product form.cart .quantity input.qty { width: 100%; }
  .ds-product .single_add_to_cart_button,
  .ds-product .gapli-buy-now-button { flex: 0 0 54px; width: 100%; height: 54px; }
}

/* =========================================================================
   POZOSTAŁE WIDOKI (koszyk, kasa, konto, wpisy, dokumenty)
   theme.json zeruje wcięcia strony, żeby sekcje strony głównej i katalogu
   mogły iść przez całą szerokość. Widoki blokowe potrzebują ich z powrotem.
   ========================================================================= */

body.ds-theme main.wp-block-group {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding-inline: var(--ds-gutter);
  padding-block: clamp(20px, 3vw, 44px);
}

body.ds-home main.wp-block-group,
body.single-product main.wp-block-group,
body.woocommerce-shop main.wp-block-group,
body.tax-product_cat main.wp-block-group,
body.search-results main.wp-block-group {
  max-width: none;
  padding-inline: 0;
  padding-block: 0;
}

/* Koszyk i kasa — spójna typografia i przyciski z resztą sklepu. */
.woocommerce-cart .wp-block-post-title,
.woocommerce-checkout .wp-block-post-title,
.woocommerce-account .wp-block-post-title {
  font-family: var(--ds-display);
  font-weight: 500;
  font-size: clamp(32px, 4vw, 50px);
  letter-spacing: -.03em;
  margin-bottom: clamp(20px, 3vw, 36px);
}

/* Przyciski koszyka i kasy stylujemy w `checkout.css` — tam mamy na <body>
   klasę `.ds-cart-page` / `.ds-checkout-page`, więc wystarcza specyficzność
   i !important przestał być potrzebny. Zostaje klasyczny przycisk kasy,
   który potrafi wyjść poza te dwie strony (np. w mini-koszyku). */
.woocommerce-cart .checkout-button {
  border-radius: 999px;
  background: var(--ds-forest);
  font-family: var(--ds-body);
  font-weight: 700;
}

.ds-guide-note {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin: 0 0 clamp(20px, 3vw, 30px);
  padding: 20px 24px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-lg);
  background: var(--ds-moss);
}
.ds-guide-note strong { display: block; font-size: 17px; letter-spacing: -.01em; margin-bottom: 4px; }
.ds-guide-note span { color: var(--ds-muted); font-size: 15px; }
.ds-guide-note .ds-link { margin-left: auto; }
@media (max-width: 720px) {
  .ds-guide-note { padding: 18px; }
  .ds-guide-note .ds-link { margin-left: 0; }
}

@media (max-width: 720px) {
  /* Dziesięć podkategorii w kolumnie spycha produkty poza pierwszy ekran —
     na telefonie robimy z nich poziomy pasek przewijany kciukiem. */
  .ds-subcats {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    margin-inline: calc(var(--ds-gutter) * -1);
    padding-inline: var(--ds-gutter);
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .ds-subcats::-webkit-scrollbar { display: none; }
  .ds-subcats__item { flex: 0 0 auto; scroll-snap-align: start; }
  .ds-catalog__lead p { font-size: 16px; }
}

.ds-notfound { max-width: 760px; }
.ds-notfound__search { margin: 28px 0 24px; }
.ds-notfound__search input[type="search"] {
  width: 100%;
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  border-radius: 999px;
  padding: 15px 22px;
  font-family: var(--ds-body);
  font-size: 16px;
}
.ds-notfound__links { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; }
.ds-notfound__cta { display: flex; flex-wrap: wrap; gap: 12px; }

/* ------------------------------------------------------ dostawa GAPLI --- */

.ds-shipping-note {
  margin: 0 0 clamp(20px, 3vw, 30px);
  padding: 14px 20px;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-paper);
  color: var(--ds-muted);
  font-size: 14.5px;
  line-height: 1.5;
}
.ds-shipping-note strong { color: var(--ds-ink); font-weight: 700; }
.ds-shipping-note .woocommerce-Price-amount { white-space: nowrap; }

@media (max-width: 720px) {
  .ds-shipping-note { border-radius: var(--ds-radius); padding: 13px 16px; font-size: 14px; }
}

/* Podpowiedź o dostawie z gapli-shipping w kolumnie zakupu. */
.ds-product .gapli-shipping-teaser {
  margin: 0 0 18px;
  font-size: 14.5px;
  color: var(--ds-muted);
}
.ds-product .gapli-shipping-teaser strong,
.ds-product .gapli-shipping-teaser__free {
  color: var(--ds-forest);
  font-weight: 700;
}

@media (max-width: 720px) {
  /* Kwadratowy kadr plus dwa rzędy miniatur zajmowały cały pierwszy ekran —
     nazwa i cena lądowały pod zgięciem. */
  .ds-product__gallery { padding: 12px; }
  .ds-gallery__main { aspect-ratio: 4 / 3; }
  .ds-gallery__thumbs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .ds-gallery__thumbs::-webkit-scrollbar { display: none; }
  .ds-gallery__thumbs li { flex: 0 0 68px; scroll-snap-align: start; }
  .ds-gallery__thumb img { height: 52px; }
}

/* --------------------------------------------------- pasek zakupu ------- */

.ds-buybar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  background: rgba(247, 244, 238, .94);
  backdrop-filter: saturate(1.4) blur(14px);
  border-top: 1px solid var(--ds-line);
  box-shadow: 0 -12px 34px rgba(30, 51, 40, .07);
  animation: ds-buybar-in .22s ease both;
}
.ds-buybar[hidden] { display: none; }

@keyframes ds-buybar-in { from { transform: translateY(100%); } to { transform: translateY(0); } }

.ds-buybar__inner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-block: 12px;
}
.ds-buybar__img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  border: 1px solid var(--ds-line);
  border-radius: 10px;
  background: var(--ds-paper);
  padding: 4px;
  box-sizing: border-box;
  flex: 0 0 auto;
}
.ds-buybar__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; margin-right: auto; }
.ds-buybar__name {
  font-size: 15px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ds-buybar__price {
  font-family: var(--ds-display);
  font-size: 19px;
  font-weight: 600;
  color: var(--ds-forest);
}
.ds-buybar__price del { display: none; }
.ds-buybar__cta {
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  background: var(--ds-forest);
  color: #fff;
  font-family: var(--ds-body);
  font-size: 15px;
  font-weight: 700;
  padding: 15px 30px;
  cursor: pointer;
  transition: background .18s ease;
}
.ds-buybar__cta:hover { background: var(--ds-forest-deep); }

@media (max-width: 720px) {
  .ds-buybar__img { display: none; }
  .ds-buybar__inner { gap: 12px; padding-block: 10px; }
  .ds-buybar__name { font-size: 13.5px; }
  .ds-buybar__price { font-size: 17px; }
  .ds-buybar__cta { padding: 14px 20px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) { .ds-buybar { animation: none; } }

/* Pasek zakupu jest `fixed` — bez tego zasłaniałby ostatni wiersz stopki. */
body.single-product { padding-bottom: 88px; }

/* ---------------------------------------------------------- budżet ----- */

.ds-budget { background: transparent; }
.ds-budget__tile { border: 1px solid var(--ds-line); }
.ds-budget__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.ds-budget__tile {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px 26px;
  background: var(--ds-paper);
  border-radius: var(--ds-radius-lg);
  text-decoration: none;
  color: var(--ds-ink);
  transition: transform .2s ease, box-shadow .2s ease;
}
.ds-budget__tile:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-hover); }
.ds-budget__range {
  font-family: var(--ds-display);
  font-size: clamp(23px, 2.2vw, 30px);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.1;
}
.ds-budget__lead { color: var(--ds-muted); font-size: 14.5px; line-height: 1.5; flex: 1; }
.ds-budget__count {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid var(--ds-line);
  color: var(--ds-forest);
  font-size: 13.5px;
  font-weight: 700;
}

/* -------------------------------------------------- marki z licznikiem -- */

.ds-brands__item { display: inline-flex; align-items: baseline; gap: 9px; }
.ds-brands__item span {
  color: var(--ds-muted);
  font-weight: 500;
  font-size: 12.5px;
}
.ds-brands__item:hover span { color: var(--ds-forest); }

@media (max-width: 1024px) {
  .ds-budget__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .ds-logo img { height: 18px; }
  .ds-footer__brand { height: 21px; }
  .ds-hero__search { max-width: none; }
  .ds-hero__search form { padding: 5px 5px 5px 18px; }
  .ds-hero__search button { padding: 12px 18px; font-size: 14px; }
  .ds-hero__search input[type="search"] { font-size: 15px; }
  .ds-hero__hints { gap: 7px; }
  .ds-trustbar__list { justify-content: flex-start; gap: 6px 20px; font-size: 13px; }
  .ds-budget__grid { grid-template-columns: 1fr; gap: 12px; }
  .ds-budget__tile { padding: 22px 20px; }
}

@media (max-width: 380px) { .ds-logo img { height: 16px; } }

/* =========================================================================
   Wyszukiwarka z podpowiedziami (.ds-sb)
   Jedno pole obsługuje nagłówek, menu mobilne, hero i stronę 404 —
   wariant robi klasa modyfikująca, nie osobny komponent.
   ========================================================================= */

.ds-sb { position: relative; }

.ds-sb__form {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  padding: 0 6px 0 14px;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.ds-sb__form:focus-within {
  border-color: var(--ds-forest);
  box-shadow: 0 0 0 3px rgba(46, 74, 59, .10);
}

.ds-sb__icon { display: flex; color: var(--ds-muted); flex: 0 0 auto; }
.ds-sb__icon svg { width: 17px; height: 17px; }

.ds-sb__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 11px 0;
  font-family: var(--ds-body);
  font-size: 15px;
  color: var(--ds-ink);
}
.ds-sb__input:focus { outline: none; }
.ds-sb__input::placeholder { color: var(--ds-muted); }
/* Krzyżyk przeglądarki dublowałby nasz przycisk czyszczenia. */
.ds-sb__input::-webkit-search-cancel-button { display: none; }

.ds-sb__clear {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 999px;
  background: var(--ds-moss);
  color: var(--ds-forest);
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}
.ds-sb__clear:hover { background: var(--ds-forest); color: #fff; }

.ds-sb__submit {
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  background: var(--ds-forest);
  color: #fff;
  font-family: var(--ds-body);
  font-size: 15px;
  font-weight: 700;
  padding: 11px 22px;
  cursor: pointer;
}
.ds-sb__submit:hover { background: var(--ds-forest-deep); }

/* ------------------------------------------------------------- panel --- */

.ds-sb__panel {
  position: absolute;
  z-index: 80;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius);
  box-shadow: var(--ds-shadow-hover);
  padding: 8px;
  max-height: min(70vh, 560px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ds-sb__label {
  margin: 8px 10px 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ds-muted);
}

.ds-sb__cat,
.ds-sb__item,
.ds-sb__recent,
.ds-sb__all {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 10px;
  color: var(--ds-ink);
  text-decoration: none;
  font-size: 15px;
}

.ds-sb__cat:hover, .ds-sb__cat.is-active,
.ds-sb__item:hover, .ds-sb__item.is-active,
.ds-sb__recent:hover, .ds-sb__recent.is-active,
.ds-sb__all:hover, .ds-sb__all.is-active {
  background: var(--ds-moss);
  color: var(--ds-forest-deep);
}

.ds-sb__cat span { flex: 1 1 auto; }
.ds-sb__cat em {
  flex: 0 0 auto;
  font-style: normal;
  font-size: 13px;
  color: var(--ds-muted);
}

.ds-sb__thumb {
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  background: var(--ds-linen);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ds-sb__thumb img { width: 100%; height: 100%; object-fit: contain; }

.ds-sb__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ds-sb__title {
  /* Nazwy z feedu bywają bardzo długie — dwie linie i koniec. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
  font-size: 14.5px;
}
.ds-sb__price { font-size: 13px; font-weight: 700; color: var(--ds-forest); }

.ds-sb__recent::before {
  content: "";
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  background: currentColor;
  opacity: .45;
  -webkit-mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
  mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
}

.ds-sb__all {
  justify-content: center;
  margin-top: 4px;
  border-top: 1px solid var(--ds-line);
  border-radius: 0 0 10px 10px;
  font-weight: 700;
  font-size: 14px;
  color: var(--ds-forest);
}

.ds-sb__empty {
  margin: 0;
  padding: 18px 14px;
  font-size: 14.5px;
  color: var(--ds-muted);
}

.ds-sb mark { background: transparent; color: var(--ds-terracotta); font-weight: 700; }

/* ---------------------------------------------------------- warianty --- */

.ds-sb--header { width: clamp(220px, 26vw, 340px); }
.ds-sb--header .ds-sb__panel { width: min(420px, 92vw); left: auto; right: 0; }

.ds-sb--hero .ds-sb__form { padding: 4px 6px 4px 18px; box-shadow: var(--ds-shadow); }
.ds-sb--hero .ds-sb__input { padding: 15px 0; font-size: 16.5px; }
.ds-sb--drawer, .ds-sb--wide { width: 100%; }

@media (max-width: 1180px) {
  .ds-sb--header { width: clamp(180px, 22vw, 240px); }
}

/* Komunikat o rozszerzeniu wyników i podpowiedzi półek na pustym wyniku */
.ds-search-notice {
  margin: 14px 0 0;
  padding: 12px 16px;
  border-left: 3px solid var(--ds-forest);
  background: var(--ds-moss);
  border-radius: 0 10px 10px 0;
  font-size: 14.5px;
  color: var(--ds-forest-deep);
}

.ds-search-help { margin: 22px 0 8px; }
.ds-search-help__lead { margin: 0 0 12px; font-weight: 700; }
.ds-search-help__list { display: flex; flex-wrap: wrap; gap: 10px; }

.ds-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-paper);
  color: var(--ds-ink);
  text-decoration: none;
  font-size: 14.5px;
}
.ds-chip:hover { border-color: var(--ds-forest); color: var(--ds-forest); }
.ds-chip span { color: var(--ds-muted); font-size: 13px; }

/* =========================================================================
   Katalog: układ z drzewem kategorii
   ========================================================================= */

.ds-catalog__body {
  display: grid;
  grid-template-columns: 258px minmax(0, 1fr);
  gap: clamp(24px, 3vw, 44px);
  align-items: start;
}

/* `min-width: 0` jest obowiązkowe — w gridzie element ma domyślnie
   `min-width: auto` i szeroka karta produktu rozpycha kolumnę. */
.ds-catalog__main { min-width: 0; }

.ds-catalog__side {
  min-width: 0;
  position: sticky;
  top: calc(var(--ds-header-total) + 14px);
}

.ds-tree__wrap { border-radius: var(--ds-radius); }
.ds-tree__summary { display: none; }

.ds-tree__list, .ds-tree__sub { list-style: none; margin: 0; padding: 0; }

.ds-tree__link,
.ds-tree__child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  color: var(--ds-ink);
  text-decoration: none;
  font-size: 15px;
  line-height: 1.35;
  cursor: pointer;
}

.ds-tree__link { font-weight: 600; }
.ds-tree__link:hover, .ds-tree__child:hover { background: var(--ds-moss); color: var(--ds-forest-deep); }

.ds-tree__link em,
.ds-tree__child em {
  flex: 0 0 auto;
  font-style: normal;
  font-size: 12.5px;
  color: var(--ds-muted);
}

.ds-tree__link--all { border-bottom: 1px solid var(--ds-line); border-radius: 10px 10px 0 0; }

.ds-tree__item.is-current > .ds-tree__link,
.ds-tree__child.is-current {
  background: var(--ds-forest);
  color: #fff;
}
.ds-tree__item.is-current > .ds-tree__link em,
.ds-tree__child.is-current em { color: rgba(255, 255, 255, .75); }

/* Strzałka gałęzi rysowana z markera `<details>` — bez dodatkowego elementu. */
.ds-tree__branch > summary { list-style: none; position: relative; padding-right: 30px; }
.ds-tree__branch > summary::-webkit-details-marker { display: none; }
.ds-tree__branch > summary::after {
  content: "";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
  opacity: .5;
  transition: transform .18s ease;
}
.ds-tree__branch[open] > summary::after { transform: translateY(-25%) rotate(-135deg); }

.ds-tree__sub { margin: 2px 0 8px; padding-left: 12px; border-left: 1px solid var(--ds-line); }
.ds-tree__child { font-size: 14.5px; padding: 7px 12px; color: var(--ds-muted); }
.ds-tree__child:hover { color: var(--ds-forest-deep); }

@media (max-width: 900px) {
  .ds-catalog__body { grid-template-columns: 1fr; gap: 18px; }
  .ds-catalog__side { position: static; }

  .ds-tree__wrap {
    border: 1px solid var(--ds-line);
    background: var(--ds-paper);
    padding: 4px 6px;
  }
  .ds-tree__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 10px;
    font-weight: 700;
    font-size: 15px;
    cursor: pointer;
    list-style: none;
  }
  .ds-tree__summary::-webkit-details-marker { display: none; }
  .ds-tree__summary svg { width: 18px; height: 18px; transition: transform .2s ease; }
  .ds-tree__wrap[open] > .ds-tree__summary svg { transform: rotate(180deg); }
}

/* ------------------------------------------- doładowywanie produktów --- */

.ds-feed {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 8px 0 clamp(20px, 3vw, 34px);
  min-height: 28px;
}

.ds-feed__status { font-size: 14.5px; color: var(--ds-muted); }

.ds-feed__more {
  border: 1px solid var(--ds-line);
  background: var(--ds-paper);
  color: var(--ds-ink);
  border-radius: 999px;
  padding: 13px 30px;
  font-family: var(--ds-body);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.ds-feed__more:hover { border-color: var(--ds-forest); color: var(--ds-forest); }

/* Granica między zawartością działu a propozycjami z innych kategorii.
   Zajmuje cały wiersz siatki — bez tego wpadłaby w kolumnę jako wąski
   słupek między kartami i przestałaby cokolwiek rozdzielać. */
.ds-feed__break {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin: clamp(14px, 2vw, 26px) 0 clamp(6px, 1vw, 12px);
  padding: clamp(16px, 2vw, 22px) 18px;
  border-top: 1px solid var(--ds-line);
  text-align: center;
}

.ds-feed__break-title {
  font-family: var(--ds-display, var(--ds-body));
  font-size: clamp(17px, 1.6vw, 21px);
  color: var(--ds-ink);
}

.ds-feed__break-note {
  font-size: 14.5px;
  color: var(--ds-muted);
}

/* Paginacja zostaje w HTML dla robotów i dla przeglądarek bez JS; chowamy ją
   dopiero, gdy doładowywanie faktycznie wystartowało. */
.woocommerce-pagination.ds-feed-js { display: none; }

/* Karta dosypana skryptem wchodzi od razu — bez czekania na obserwatora,
   który zebrał elementy przy starcie strony i o nowych nie wie. */
.woocommerce ul.products li.product.ds-card-in { opacity: 1; transform: none; }

/* Martwy adres zdjęcia z CDN hurtowni: zamiast połamanej ikony pokazujemy
   spokojne, puste tło kadru. */
.ds-img-missing { visibility: hidden; }

/* =========================================================================
   Dom i Ogród Styl — dodatki: filtry, zakładki karty, podpowiedź dostawy
   ========================================================================= */

.ds-catalog__side {
  max-height: calc(100vh - var(--ds-header-total) - 28px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

/* ------------------------------------------------------------ filtry --- */

.ds-filters {
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius);
  padding: 14px 16px 16px;
  margin-bottom: 16px;
}
.ds-filters__summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  font-weight: 700;
  font-size: 15px;
}
.ds-filters__summary::-webkit-details-marker { display: none; }
.ds-filters__summary svg { width: 18px; height: 18px; transition: transform .18s ease; }
.ds-filters[open] .ds-filters__summary svg { transform: rotate(180deg); }
.ds-filters__summary em {
  font-style: normal;
  font-size: 11.5px;
  font-weight: 700;
  color: #fff;
  background: var(--ds-terracotta);
  border-radius: 999px;
  padding: 2px 8px;
  margin-left: 6px;
}
.ds-filters__form { margin-top: 12px; display: flex; flex-direction: column; gap: 14px; }
.ds-filters__group { border: 0; margin: 0; padding: 0; min-width: 0; }
.ds-filters__group legend { font-size: 13px; font-weight: 700; color: var(--ds-muted); margin-bottom: 8px; padding: 0; }
.ds-filters__price { display: flex; align-items: center; gap: 8px; }
.ds-filters__price label { flex: 1; min-width: 0; }
.ds-filters__price input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ds-line);
  border-radius: 10px;
  padding: 9px 10px;
  font-family: var(--ds-body);
  font-size: 15px;
  background: var(--ds-linen);
}
.ds-filters__price input:focus { outline: none; border-color: var(--ds-forest); box-shadow: var(--ds-focus); }
.ds-filters__check { display: flex; align-items: center; gap: 10px; font-size: 14.5px; cursor: pointer; }
.ds-filters__check input { width: 18px; height: 18px; accent-color: var(--ds-forest); }
.ds-filters__actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

@media (max-width: 900px) {
  .ds-catalog__side { max-height: none; overflow: visible; }
  .ds-filters { margin-bottom: 10px; }
}

/* --------------------------------------------------- zakładki karty --- */

.ds-ptabs {
  position: sticky;
  top: calc(var(--ds-header-total) + 6px);
  z-index: 5;
  margin-top: 24px;
  background: rgba(247, 244, 238, .95);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ds-line);
}
.ds-ptabs ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.ds-ptabs a {
  display: inline-block;
  padding: 13px 14px 12px;
  font-weight: 700;
  font-size: 14.5px;
  color: var(--ds-muted);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.ds-ptabs a:hover, .ds-ptabs a.is-active { color: var(--ds-forest-deep); border-bottom-color: var(--ds-terracotta); }
.ds-product__main [id="opis"], .ds-product__main [id="specyfikacja"], .ds-product__main [id="dostawa"] {
  scroll-margin-top: calc(var(--ds-header-total) + 70px);
}

/* ---------------------------------------------- podpowiedź dostawy --- */

.ds-ship-hint {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0 0;
  padding: 11px 14px;
  border-radius: 12px;
  background: var(--ds-moss);
  color: var(--ds-forest-deep);
  font-size: 14px;
  line-height: 1.45;
}
.ds-ship-hint svg { flex: 0 0 auto; width: 22px; height: 22px; color: var(--ds-forest); }

/* Lista zaufania na karcie — ikony zamiast ptaszków. */
.ds-product__trust li { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.ds-product__trust li::before { content: none; }
.ds-product__trust li svg { flex: 0 0 auto; width: 20px; height: 20px; color: var(--ds-forest); }

/* ------------------------------------------------------- moje konto --- */

.ds-page--account .woocommerce { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(20px, 4vw, 48px); align-items: start; }
.ds-page--account .woocommerce::before,
.ds-page--account .woocommerce::after { content: none; }
.ds-page--account .woocommerce-MyAccount-navigation,
.ds-page--account .woocommerce-MyAccount-content { float: none; width: auto; }
.ds-page--account .woocommerce-MyAccount-navigation ul {
  list-style: none; margin: 0; padding: 8px;
  background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius);
}
.ds-page--account .woocommerce-MyAccount-navigation a {
  display: block; padding: 10px 12px; border-radius: 9px; color: var(--ds-ink); text-decoration: none; font-weight: 600; font-size: 15px;
}
.ds-page--account .woocommerce-MyAccount-navigation a:hover { background: var(--ds-moss); }
.ds-page--account .woocommerce-MyAccount-navigation .is-active a { background: var(--ds-forest); color: #fff; }
.ds-page--account .woocommerce-MyAccount-content {
  background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg); padding: clamp(18px, 3vw, 32px);
}
.ds-page--account form .form-row input.input-text,
.ds-page--account form .form-row select {
  border: 1px solid var(--ds-line); border-radius: 10px; padding: 11px 12px; font-family: var(--ds-body); font-size: 15px; background: var(--ds-linen);
}
.ds-page--account .woocommerce-Button,
.ds-page--account button.button {
  background: var(--ds-forest); color: #fff; border: 0; border-radius: 999px; padding: 12px 22px; font-weight: 700; font-family: var(--ds-body);
}
.ds-page--account .woocommerce-Button:hover,
.ds-page--account button.button:hover { background: var(--ds-forest-deep); color: #fff; }
.ds-page--account .u-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.ds-page--account .u-columns > .u-column1,
.ds-page--account .u-columns > .u-column2 { float: none; width: auto; background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg); padding: clamp(18px, 3vw, 30px); }
.ds-page--account .woocommerce:has(> .u-columns),
.ds-page--account .woocommerce:has(> form.login) { display: block; }

@media (max-width: 820px) {
  .ds-page--account .woocommerce { grid-template-columns: 1fr; }
  .ds-page--account .u-columns { grid-template-columns: 1fr; }
}

/* Yoast rysuje okruszki jako span-y z » — wyrównujemy do wyglądu Woo. */
.ds-breadcrumb > span > span { color: var(--ds-muted); }
.ds-breadcrumb .breadcrumb_last { color: var(--ds-ink); }

/* ----------------------------------------------------- widżety GAPLI --- */

/* Szuflada koszyka i pływający przycisk (gapli-smart-cart) mają własne zmienne —
   podmieniamy paletę, nie przebijamy reguł. */
body.ds-theme {
  --gapli-sc-color: #2E4A3B;
  --gapli-sc-color-hover: #1E3328;
  --gapli-sc-success: #2E4A3B;
  --gapli-sc-danger: #B8653F;
  --gapli-sc-gray-50: #F7F4EE;
  --gapli-sc-gray-100: #EFE6D6;
  --gapli-sc-gray-200: #E2DDD2;
  --gapli-sc-gray-500: #5E6761;
  --gapli-sc-gray-700: #333D37;
  --gapli-sc-gray-900: #1D2420;
  --gapli-sc-radius: 14px;
  --gapli-sc-shadow: 0 22px 60px rgba(30, 51, 40, .16);
}
body.ds-theme .gapli-sc-drawer,
body.ds-theme .gapli-sc-floating-widget { font-family: var(--ds-body); }
body.ds-theme .gapli-sc-drawer-header { font-family: var(--ds-display); }
/* Karta produktu ma licznik w nagłówku i pasek zakupu przy dolnej krawędzi —
   pływający przycisk koszyka siadał na „Dodaj do koszyka" w panelu zakupu. */
body.ds-theme.single-product .gapli-sc-floating-widget { display: none; }

/* Nagłówek: cały blok (pasek obietnic + rząd główny + kategorie) jest przyklejony,
   ale z ujemnym `top` równym wysokości paska obietnic — pasek odjeżdża przy
   przewijaniu, a logo, szukanie i koszyk zostają. */
body.ds-theme header.wp-block-template-part {
  position: sticky;
  top: -34px;
  z-index: 60;
  background: transparent;
  backdrop-filter: none;
}
.ds-topbar__inner { height: 34px; padding-block: 0; align-items: center; flex-wrap: nowrap; overflow: hidden; box-sizing: border-box; }

.ds-footer__linkbtn {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-size: 14.5px;
  color: rgba(255, 255, 255, .86);
  cursor: pointer;
}
.ds-footer__linkbtn:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* ---------------------------------------------- zgoda na cookies --- */

/* Baner wypisuje mu-plugin SEO/GEO (GA4 + Consent Mode v2) z minimalnym
   stylem inline — tu wygląd marki, wyższą specyficznością, bez !important. */
body.ds-theme .dog-consent {
  left: 16px;
  right: auto;
  bottom: 16px;
  max-width: 440px;
  margin: 0;
  padding: 20px 20px 18px;
  background: var(--ds-paper);
  color: var(--ds-ink);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-lg);
  box-shadow: var(--ds-shadow-hover);
  font-family: var(--ds-body);
  font-size: 14px;
  line-height: 1.55;
}
body.ds-theme .dog-consent__text { margin: 0 0 14px; color: var(--ds-muted); }
body.ds-theme .dog-consent__text a { color: var(--ds-forest); font-weight: 600; }
body.ds-theme .dog-consent__actions { justify-content: flex-start; gap: 10px; }
body.ds-theme .dog-consent__btn {
  border-radius: 999px;
  padding: 10px 20px;
  font-family: var(--ds-body);
  font-size: 14px;
  font-weight: 700;
  background: var(--ds-forest);
  border: 1px solid var(--ds-forest);
  color: #fff;
}
body.ds-theme .dog-consent__btn:hover { background: var(--ds-forest-deep); border-color: var(--ds-forest-deep); }
body.ds-theme .dog-consent__btn--ghost { background: transparent; color: var(--ds-forest); border-color: var(--ds-line); }
body.ds-theme .dog-consent__btn--ghost:hover { background: var(--ds-moss); color: var(--ds-forest-deep); border-color: var(--ds-forest); }
@media (max-width: 600px) {
  body.ds-theme .dog-consent { left: 12px; right: 12px; bottom: 12px; max-width: none; }
  body.ds-theme .dog-consent__btn { flex: 1 1 auto; }
}

/* Pływający przycisk dostaje kolor z ustawień wtyczki jako styl inline na
   kontenerze (`--gapli-sc-color: #6366f1`). Zmienna deklarowana na samych
   elementach widżetu wygrywa z dziedziczoną — bez !important. */
body.ds-theme [class*="gapli-sc-"] {
  --gapli-sc-color: #2E4A3B;
  --gapli-sc-color-hover: #1E3328;
}

.ds-dept__meta { flex-wrap: wrap; row-gap: 2px; }
.ds-dept__go, .ds-dept__count { white-space: nowrap; }

/* --------------------------------------------- znaki płatności --- */

.ds-paylogos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

.ds-paylogo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-paper);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--ds-muted);
  white-space: nowrap;
}

.ds-paylogo svg { height: 16px; width: auto; }
.ds-paylogo--blik { color: #000; letter-spacing: .06em; }
.ds-paylogo--p24 { color: #4A4A4A; }


@media (max-width: 720px) {
  /* Na telefonie okruszki bez ostatniego ogniwa — pełna nazwa produktu stoi
     zaraz niżej w nagłówku, a w ścieżce zajmowała trzy linie. */
  .ds-breadcrumb { font-size: 13px; padding-top: 14px; }
  .ds-breadcrumb .breadcrumb_last { display: none; }
}

/* =========================================================================
   Poradnik (blog): lista, artykuł, bloki treści
   ========================================================================= */

.ds-blog { padding-block: clamp(24px, 4vw, 48px); }
.ds-blog__head { max-width: 820px; margin-bottom: clamp(24px, 3vw, 36px); }
.ds-blog__title { font-family: var(--ds-display); font-weight: 500; font-size: clamp(34px, 5vw, 54px); line-height: 1.08; margin: 0 0 14px; }
.ds-blog__lead { color: var(--ds-muted); font-size: 18px; margin: 0 0 20px; }
.ds-blog__head .ds-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ds-chip.is-active { background: var(--ds-forest); border-color: var(--ds-forest); color: #fff; }
.ds-blog__empty { color: var(--ds-muted); }

.ds-postgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ds-postcard { background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.ds-postcard:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-hover); }
.ds-postcard__link { display: flex; flex-direction: column; height: 100%; color: var(--ds-ink); text-decoration: none; }
.ds-postcard__media { display: block; aspect-ratio: 16 / 10; background: var(--ds-sand); overflow: hidden; }
.ds-postcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ds-postcard__body { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 22px; }
.ds-postcard__cat { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ds-terracotta-text); }
.ds-postcard__title { font-family: var(--ds-display); font-size: 22px; line-height: 1.22; }
.ds-postcard__excerpt { color: var(--ds-muted); font-size: 15px; }
.ds-postcard__meta { color: var(--ds-muted); font-size: 13px; margin-top: auto; }
.ds-pagination { margin-top: 32px; display: flex; gap: 8px; flex-wrap: wrap; }
.ds-pagination .page-numbers { padding: 8px 14px; border: 1px solid var(--ds-line); border-radius: 999px; background: var(--ds-paper); color: var(--ds-ink); text-decoration: none; }
.ds-pagination .page-numbers.current { background: var(--ds-forest); border-color: var(--ds-forest); color: #fff; }

.ds-post { padding-bottom: clamp(32px, 5vw, 64px); }
.ds-post__layout {
  max-width: var(--ds-max);
  margin-inline: auto;
  padding-inline: var(--ds-gutter);
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 740px) minmax(220px, 280px);
  gap: clamp(28px, 5vw, 72px);
  justify-content: center;
}
.ds-post__aside { position: relative; }
.ds-post__aside > * { position: sticky; top: calc(var(--ds-header-total) + 20px); }
.ds-post-head { max-width: 740px; padding-block: clamp(24px, 4vw, 44px) 8px; }
.ds-post-head__cat { display: inline-block; text-decoration: none; }
.ds-post-head__title { font-family: var(--ds-display); font-weight: 500; font-size: clamp(32px, 4.6vw, 50px); line-height: 1.1; margin: 0 0 16px; }
.ds-post-head__lead { font-size: 19px; color: var(--ds-ink); margin: 0 0 16px; }
.ds-post-head__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--ds-muted); font-size: 14px; margin: 0; }
.ds-post__thumb { margin: 22px 0 8px; border-radius: var(--ds-radius-lg); overflow: hidden; background: var(--ds-paper); }
.ds-post__thumb img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: contain; }

.ds-post__body { font-size: 17.5px; line-height: 1.75; }
.ds-post__body h2 { font-family: var(--ds-display); font-weight: 500; font-size: clamp(26px, 3vw, 32px); line-height: 1.2; margin: 1.8em 0 .6em; scroll-margin-top: calc(var(--ds-header-total) + 16px); }
.ds-post__body h3 { font-size: 20px; margin: 1.5em 0 .5em; }
.ds-post__body p, .ds-post__body ul, .ds-post__body ol { margin: 0 0 1.05em; }
.ds-post__body a { color: var(--ds-forest); text-underline-offset: 3px; }
.ds-post__body table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 15.5px; background: var(--ds-paper); border-radius: var(--ds-radius); overflow: hidden; display: block; overflow-x: auto; }
.ds-post__body th, .ds-post__body td { padding: 11px 14px; border-bottom: 1px solid var(--ds-line); text-align: left; vertical-align: top; }
.ds-post__body th { background: var(--ds-moss); color: var(--ds-forest-deep); font-weight: 700; }

.ds-post-summary { margin: 26px 0; padding: 20px 24px; background: var(--ds-moss); border-radius: var(--ds-radius-lg); border-left: 4px solid var(--ds-forest); }
.ds-post-summary__title { margin: 0 0 8px; font-weight: 800; color: var(--ds-forest-deep); }
.ds-post-summary ul { margin: 0; padding-left: 20px; }
.ds-post-summary li { margin: 4px 0; }

.ds-post-toc { padding: 18px 20px; background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg); font-size: 14.5px; }
.ds-post-toc__title { margin: 0 0 8px; font-weight: 800; }
.ds-post-toc ol { margin: 0; padding-left: 18px; }
.ds-post-toc li { margin: 6px 0; }
.ds-post-toc a { color: var(--ds-ink); text-decoration: none; }
.ds-post-toc a:hover { color: var(--ds-forest); text-decoration: underline; }

.ds-post-shelf { margin: 30px 0; padding: 22px; background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg); }
.ds-post-shelf__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.ds-post-shelf__title { margin: 0; font-family: var(--ds-display); font-size: 22px; }
.ds-post-shelf__lead { margin: 0 0 14px; color: var(--ds-muted); font-size: 15px; }
.ds-post-shelf__note { margin: 12px 0 0; color: var(--ds-muted); font-size: 12.5px; }
.ds-cards--post { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ds-cards--post .ds-card__title { font-size: 14px; }

.ds-post-faq { margin-top: 36px; }
.ds-post-faq__item { background: var(--ds-paper); border: 1px solid var(--ds-line); border-radius: var(--ds-radius); margin: 10px 0; padding: 0 18px; }
.ds-post-faq__item summary { cursor: pointer; padding: 16px 0; font-weight: 700; list-style: none; }
.ds-post-faq__item summary::-webkit-details-marker { display: none; }
.ds-post-faq__item summary::after { content: "+"; float: right; color: var(--ds-forest); font-weight: 400; font-size: 22px; line-height: 1; }
.ds-post-faq__item[open] summary::after { content: "–"; }
.ds-post-faq__answer { padding-bottom: 14px; color: var(--ds-ink); }

.ds-post-shopcats { margin-top: 32px; }
.ds-post-shopcats__title { margin: 0 0 10px; font-weight: 800; }
.ds-post-shopcats .ds-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ds-post-related { padding-block: clamp(28px, 4vw, 56px); }

@media (max-width: 1100px) {
  .ds-postgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-post__layout { grid-template-columns: minmax(0, 1fr); }
  .ds-post__aside { display: none; }
}
@media (max-width: 640px) {
  .ds-postgrid { grid-template-columns: minmax(0, 1fr); }
  .ds-cards--post { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-post__body { font-size: 17px; }
}
.ds-post__toc-inline { display: none; margin: 18px 0 6px; }
@media (max-width: 1100px) { .ds-post__toc-inline { display: block; } }