/* ─────────────────────────────────────────────────────────────
   Techwish — PDP (single product page) styles.
   Layout: breadcrumbs · hero (gallery + sticky summary) · hot-promo
   banner · spec/tabs · press reviews · bundle · related · sticky
   mobile bar.
   ───────────────────────────────────────────────────────────── */

.tw-pdp-main {
  padding: 12px 0 56px;
  /* Contain the full-bleed mosaic bands (100vw) so the scrollbar width can't
     trigger a stray horizontal scrollbar. `clip` keeps position:sticky intact. */
  overflow-x: clip;
}
.tw-pdp { display: block; }
.tw-pdp > section { margin-block: 56px; }
.tw-pdp > section:first-of-type { margin-block-start: 24px; }
/* Salient parent forces `list-style: disc` on `<ul li>` and `decimal`
   on `<ol li>` inside `.container_wrap`, which makes gallery thumbs,
   spec lists, breadcrumbs and so on render with stray bullets / numbers.
   Wipe markers globally inside the PDP so our own visual treatment
   on each list is the source of truth. */
.tw-pdp ul,
.tw-pdp ol,
.tw-pdp-breadcrumbs ol,
.tw-pdp-gallery__thumbs,
.tw-pdp-tabs__nav,
.tw-pdp-reassurance,
.tw-pdp-press__grid,
.tw-pdp-related__grid {
  list-style: none !important;
  counter-reset: none !important;
}
.tw-pdp ul > li,
.tw-pdp ol > li {
  list-style: none !important;
  background: none !important;
}
.tw-pdp ul > li::before,
.tw-pdp ol > li::before,
.tw-pdp ul > li::marker,
.tw-pdp ol > li::marker {
  content: none !important;
  display: none !important;
  font-size: 0 !important;
  color: transparent !important;
}

/* ===== BREADCRUMBS ===== */
.tw-pdp-breadcrumbs {
  margin: 8px auto 24px;
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tw-mute, #6B7470);
}
.tw-pdp-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.tw-pdp-breadcrumbs a {
  color: var(--tw-ink-2, #2A2F2C);
  text-decoration: none;
  transition: color .15s ease;
}
.tw-pdp-breadcrumbs a:hover { color: var(--tw-mint-600, #1FB37C); }
.tw-pdp-breadcrumbs__sep { color: var(--tw-mute-2, #98A09B); }
.tw-pdp-breadcrumbs [aria-current="page"] {
  color: var(--tw-ink, #0B0F0D);
  font-weight: 600;
}

/* ===== HERO ===== */
.tw-pdp-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  margin-bottom: 0 !important;          /* hot-promo banner follows tight */
}
@media (max-width: 960px) {
  .tw-pdp-hero { grid-template-columns: 1fr; gap: 28px; }
}

/* ===== GALLERY ===== */
.tw-pdp-gallery {
  display: grid;
  /* Default: one column. Two columns only when thumb strip is present. */
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.tw-pdp-gallery:has(.tw-pdp-gallery__thumbs) {
  grid-template-columns: 88px minmax(0, 1fr);
}
@media (max-width: 640px) {
  .tw-pdp-gallery,
  .tw-pdp-gallery:has(.tw-pdp-gallery__thumbs) {
    grid-template-columns: 1fr;
  }
}
/* Legacy class (still set in PHP for solo products). */
.tw-pdp-gallery--solo {
  grid-template-columns: minmax(0, 1fr) !important;
}
.tw-pdp-gallery__thumbs {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;            /* Salient sets ul padding-left: 40px */
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: 560px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--tw-mint-050, #F1FAF5) transparent;
}
.tw-pdp-gallery__thumbs > li {
  margin: 0 !important;
  padding: 0 !important;
}
@media (max-width: 640px) {
  .tw-pdp-gallery__thumbs {
    grid-auto-flow: column;
    grid-template-columns: none;
    grid-auto-columns: 78px;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: none;
    padding: 4px 2px;
  }
}
.tw-pdp-gallery__thumb {
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  border: 2px solid var(--tw-line-soft, #ECEFED) !important;
  border-radius: 12px !important;   /* Salient styles <button> as a pill/circle */
  padding: 0 !important;
  cursor: pointer;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  display: block;
  box-shadow: none !important;
  transition: border-color var(--tw-dur-fast, .15s) ease,
              transform var(--tw-dur-fast, .15s) ease;
}
.tw-pdp-gallery__thumb:hover { transform: translateY(-1px); }
.tw-pdp-gallery__thumb.is-active {
  border-color: var(--tw-mint, #2DCE92) !important;
}
.tw-pdp-gallery__thumb img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;     /* Salient applies 50% on product images */
  object-fit: contain !important;
  padding: 0;
  box-sizing: border-box !important;
  display: block;
}
.tw-pdp-gallery__stage {
  position: relative;
  background: #fff;
  border: 1px solid var(--tw-line-soft, #ECEFED);
  border-radius: 22px;
  overflow: hidden;
  aspect-ratio: 1 / 1;       /* taller stage so product photos aren't cropped */
  display: grid;
  place-items: center;
}
.tw-pdp-gallery__stage--empty {
  color: var(--tw-mute-2, #98A09B);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.tw-pdp-gallery__main {
  /* Absolutely fill the stage and letterbox — never crop. Absolute + inset:0
     means the image can't exceed the stage box even if Salient forces
     height:auto on product images. */
  position: absolute;
  inset: 0;
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: calc(100% - 32px) !important;   /* 16px letterbox gutter each side */
  max-height: calc(100% - 32px) !important;
  margin: auto !important;
  border-radius: 0 !important;      /* Salient applies 50% on product images */
  object-fit: contain !important;
  object-position: center !important;
  transition: opacity .25s ease;
}
.tw-pdp-gallery__badge {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  display: inline-flex; align-items: center;
  padding: 7px 13px;
  border-radius: 999px;
  background: var(--tw-mint, #2DCE92);
  color: #062319;
  font-size: 11.5px;
  line-height: 1;
  letter-spacing: 0.06em;
  font-weight: 700;
}

/* ===== SUMMARY (right column) ===== */
.tw-pdp-summary {
  position: sticky;
  top: calc(var(--tw-sticky-top, 76px) + 12px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 960px) { .tw-pdp-summary { position: static; } }
.tw-pdp-summary__brand {
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tw-mint-600, #1FB37C);
  font-weight: 600;
}
.tw-pdp-summary__title {
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 30px;
  font-weight: 600;
  line-height: 1.15;
  margin: 0;
  letter-spacing: -0.015em;
}
.tw-pdp-summary__lede {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--tw-ink-2, #2A2F2C);
}
.tw-pdp-summary__lede p { margin: 0 0 8px; }
.tw-pdp-summary__lede p:last-child { margin-bottom: 0; }

/* WC native bits inside summary */
.tw-pdp-summary .price {
  font-family: var(--tw-mono, monospace);
  font-size: 28px;
  font-weight: 700;
  color: var(--tw-ink, #0B0F0D);
  line-height: 1;
  margin: 4px 0;
}
.tw-pdp-summary .price del {
  font-weight: 400;
  font-size: 16px;
  color: var(--tw-mute, #6B7470);
  margin-right: 6px;
}
.tw-pdp-summary .price ins {
  text-decoration: none;
  color: var(--tw-mint-600, #1FB37C);
}
.tw-pdp-summary .price small {
  font-size: 11px;
  color: var(--tw-mute, #6B7470);
  margin-left: 8px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.tw-pdp-summary form.cart {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;             /* qty pill matches CTA height */
  padding-top: 4px;
  margin: 0 !important;
}
/* Wrap qty (− input +) in a single pill regardless of whether Salient
   injects minus/plus buttons outside the input. We rely on a flex
   container with a unified border-radius + hidden overflow so any
   stray elements still look unified. */
.tw-pdp-summary form.cart .quantity {
  display: inline-flex !important;
  align-items: center;
  border: 1px solid var(--tw-line, #DDE3E0);
  border-radius: 999px;
  background: #fff;
  overflow: hidden;
  height: 48px;                      /* match WC button computed height */
}
.tw-pdp-summary form.cart .quantity input[type="number"] {
  width: 56px !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-align: center;
  font-family: var(--tw-mono, monospace);
  font-weight: 700;
  font-size: 14px;
  outline: 0;
  background: transparent;
  -moz-appearance: textfield;
}
.tw-pdp-summary form.cart .quantity input[type="number"]::-webkit-outer-spin-button,
.tw-pdp-summary form.cart .quantity input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Salient + WC native +/- buttons: theme-agnostic targeting via several
   possible class names (`.minus`, `.plus`, `.quantity-button`, ARIA labels). */
.tw-pdp-summary form.cart .quantity .minus,
.tw-pdp-summary form.cart .quantity .plus,
.tw-pdp-summary form.cart .quantity button,
.tw-pdp-summary form.cart .quantity .quantity-button {
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  width: 36px !important;
  height: 100% !important;
  cursor: pointer;
  font-size: 18px;
  font-weight: 700;
  color: var(--tw-ink-2, #2A2F2C);
  padding: 0 !important;
  border-radius: 0 !important;
  display: grid !important;
  place-items: center;
  transition: background .12s ease, color .12s ease;
}
.tw-pdp-summary form.cart .quantity .minus:hover,
.tw-pdp-summary form.cart .quantity .plus:hover,
.tw-pdp-summary form.cart .quantity button:hover {
  background: var(--tw-mint-050, #F1FAF5) !important;
  color: var(--tw-mint-600, #1FB37C) !important;
}
/* Add-to-cart — tylko w formularzu koszyka (nie eRaty ani inne buttony w summary). */
.tw-pdp-summary form.cart button.single_add_to_cart_button,
.tw-pdp-summary form.cart .single_add_to_cart_button {
  background: var(--tw-mint, #2DCE92) !important;
  color: #fff !important;
  padding: 14px 24px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  border: 0 !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  transition: background .15s ease, transform .15s ease !important;
}
.tw-pdp-summary form.cart button.single_add_to_cart_button:hover {
  background: var(--tw-mint-600, #1FB37C) !important;
  transform: translateY(-1px);
}

/* Hide qty pill when only 1 unit can be purchased. */
.tw-pdp-summary form.cart.tw-qty-fixed {
  gap: 0;
}
.tw-pdp-summary form.cart.tw-qty-fixed .quantity {
  display: none !important;
}
.tw-pdp-summary form.cart.tw-qty-fixed button.single_add_to_cart_button {
  flex: 1 1 auto;
  width: 100%;
}
.tw-pdp-summary .product_meta {
  font-size: 12px;
  color: var(--tw-mute, #6B7470);
  margin-top: 8px;
}
.tw-pdp-summary .product_meta > span { display: block; margin-bottom: 4px; }
.tw-pdp-summary .product_meta a {
  color: var(--tw-ink-2, #2A2F2C);
  text-decoration: none;
}

/* Star rating block (WC native) */
.tw-pdp-summary .woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--tw-mute, #6B7470);
  margin: 0;
}
.tw-pdp-summary .star-rating { color: #F5B400; font-size: 14px; }

/* Reassurance strip */
/* NOTE: the reassurance component is defined ONCE, lower in this file
   (.tw-pdp-reassurance grid + __item/__text/__title/__sub). An older
   flex-column definition used to live here and collided with it, which made
   the title overlap the sub ("doubled" text). Removed. */

/* ===== HOT PROMO BANNER on PDP ===== */
.tw-pdp-hotpromo {
  margin-block-start: 32px !important;
}
.tw-pdp-hotpromo__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 18px 24px;
  border-radius: 16px;
  background: linear-gradient(135deg, #f4faf6 0%, #e6f5ed 100%);
  border: 1px solid var(--tw-mint-050, #F1FAF5);
}
.tw-pdp-hotpromo__lede {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-ink-2, #2A2F2C);
  margin: 8px 0 0;
}
.tw-pdp-hotpromo__meta {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tw-pdp-hotpromo__stock-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(11,15,13,.08);
  overflow: hidden;
}
.tw-pdp-hotpromo__stock-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--tw-mint, #2DCE92), var(--tw-mint-600, #1FB37C));
  transition: width .3s ease;
}
.tw-pdp-hotpromo__stock-label,
.tw-pdp-hotpromo__countdown {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--tw-mute, #6B7470);
}
.tw-pdp-hotpromo__countdown strong {
  font-size: 14px;
  color: var(--tw-ink, #0B0F0D);
  letter-spacing: 0.04em;
  display: block;
  margin-top: 2px;
}
@media (max-width: 720px) {
  .tw-pdp-hotpromo__inner { grid-template-columns: 1fr; }
}

/* ===== SPEC + TABS ===== */
.tw-pdp-tabs__nav {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--tw-line-soft, #ECEFED);
  overflow-x: auto;
  scrollbar-width: none;
}
.tw-pdp-tabs__nav::-webkit-scrollbar { display: none; }
.tw-pdp-tabs__tab {
  appearance: none;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 14px 18px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-weight: 600;
  font-size: 14px;
  color: var(--tw-mute, #6B7470);
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: -0.005em;
  transition: color .15s ease, border-color .15s ease;
}
.tw-pdp-tabs__tab:hover { color: var(--tw-ink, #0B0F0D); }
.tw-pdp-tabs__tab.is-active {
  color: var(--tw-ink, #0B0F0D);
  border-bottom-color: var(--tw-mint, #2DCE92);
}
.tw-pdp-tabs__panels { padding: 28px 0; }
.tw-pdp-tabs__panel { display: none; line-height: 1.6; }
.tw-pdp-tabs__panel.is-active { display: block; }

/* Spec table */
.tw-pdp-specs {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
}
.tw-pdp-specs th,
.tw-pdp-specs td {
  text-align: left;
  padding: 14px 16px;
  border-bottom: 1px solid var(--tw-line-soft, #ECEFED);
  vertical-align: top;
}
.tw-pdp-specs th {
  width: 40%;
  font-weight: 500;
  color: var(--tw-mute, #6B7470);
  font-size: 13px;
}
.tw-pdp-specs td {
  font-weight: 600;
  color: var(--tw-ink, #0B0F0D);
  font-size: 14px;
}
.tw-pdp-specs tr:last-child th,
.tw-pdp-specs tr:last-child td { border-bottom: 0; }

/* ===== PRESS REVIEWS — reuses .tw-home-review styles via .tw-pdp-press */
.tw-pdp-press__grid {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 720px) { .tw-pdp-press__grid { grid-template-columns: 1fr; } }
.tw-pdp-press__card {
  list-style: none;
  margin: 0; padding: 0;
}
.tw-pdp-press__link {
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 100%;
  padding: 20px 22px;
  border-radius: 16px;
  text-decoration: none;
  color: var(--tw-ink, #0B0F0D);
  background: #ffffff;
  border: 1px solid var(--tw-line-soft, #ECEFED);
  transition: box-shadow .15s ease, transform .15s ease;
}
.tw-pdp-press__link:hover {
  box-shadow: var(--tw-shadow-hover, 0 12px 28px rgba(11,15,13,.08));
  transform: translateY(-2px);
}
.tw-pdp-press__card.is-dark .tw-pdp-press__link {
  background: #0B0F0D;
  color: #fff;
  border-color: rgba(255,255,255,.08);
}
.tw-pdp-press__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.tw-pdp-press__logo { max-height: 26px; max-width: 120px; object-fit: contain; }
.tw-pdp-press__source {
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tw-mute, #6B7470);
  font-weight: 600;
}
.tw-pdp-press__card.is-dark .tw-pdp-press__source { color: rgba(255,255,255,.55); }
.tw-pdp-press__tag {
  font-family: var(--tw-mono, monospace);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--tw-mint-050, #F1FAF5);
  color: var(--tw-mint-600, #1FB37C);
}
.tw-pdp-press__card.is-internal .tw-pdp-press__tag {
  background: var(--tw-mint, #2DCE92);
  color: #062319;
}
.tw-pdp-press__card.is-dark:not(.is-internal) .tw-pdp-press__tag {
  background: rgba(255,255,255,.10);
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.18);
}
.tw-pdp-press__quote {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.5;
  font-weight: 500;
  color: inherit;
  letter-spacing: -0.005em;
}
.tw-pdp-press__card.is-dark .tw-pdp-press__quote { color: rgba(255,255,255,.92); }
.tw-pdp-press__rating {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--tw-mint-600, #1FB37C);
  letter-spacing: 0.04em;
}
.tw-pdp-press__card.is-dark .tw-pdp-press__rating { color: var(--tw-mint, #2DCE92); }

/* BUNDLE — defined once in the "---- Bundle (Komplet)" section lower down.
   (The old duplicate block here used obsolete markup and conflicting grid
   templates; removed to stop layout collisions.) */

/* ===== RELATED ===== */
.tw-pdp-related__grid {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 960px) { .tw-pdp-related__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .tw-pdp-related__grid { grid-template-columns: 1fr; } }

/* ===== STICKY MOBILE BAR ===== */
.tw-pdp-sticky {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 8800;
  background: #fff;
  border-top: 1px solid var(--tw-line-soft, #ECEFED);
  box-shadow: 0 -8px 28px rgba(11,15,13,.06);
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  align-items: center;
  gap: 12px;
}
.tw-pdp-sticky.is-visible {
  display: flex;
}
.tw-pdp-sticky__info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tw-pdp-sticky__name {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--tw-ink-2, #2A2F2C);
  letter-spacing: -0.005em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tw-pdp-sticky__price {
  font-family: var(--tw-mono, monospace);
  font-weight: 700;
  color: var(--tw-ink, #0B0F0D);
  font-size: 14px;
}
.tw-pdp-sticky__price del {
  font-weight: 400;
  font-size: 12px;
  color: var(--tw-mute, #6B7470);
  margin-right: 6px;
}
.tw-pdp-sticky__cta {
  flex-shrink: 0;
  padding: 12px 18px !important;
  font-size: 13px !important;
}
/* Hide on desktop, show on small screens via JS class + media query */
@media (min-width: 901px) {
  .tw-pdp-sticky { display: none !important; }
}
/* When bottom-nav is present, raise sticky bar above it */
body.has-tw-bottom-nav .tw-pdp-sticky {
  bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  padding-bottom: 10px;
}

/* ═══════════════════════════════════════════════════════════════════
   PDP redesign — CleanWave Breeze (bathroom profile) + shared sections.
   Appended block: rules here override earlier ones at equal specificity.
   ═══════════════════════════════════════════════════════════════════ */

/* ---- Top bar: breadcrumbs + stock strip ---- */
.tw-pdp-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-block: 16px 0;
}
.tw-pdp-topbar .tw-pdp-breadcrumbs { margin: 0; }
.tw-pdp-topstrip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tw-mint-600);
}
.tw-pdp-topstrip__dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--tw-mint);
  box-shadow: 0 0 0 4px var(--tw-mint-100);
}
.tw-pdp-topstrip__sep { color: var(--tw-mute-2); }
.tw-pdp-topstrip--scarcity {
  color: #B45309;
  font-weight: 600;
}
.tw-pdp-topstrip--scarcity .tw-pdp-topstrip__dot {
  background: #F59E0B;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, .22);
}

/* ---- Gallery extras: counter + 360/zoom tools ---- */
.tw-pdp-gallery__stage { position: relative; }
.tw-pdp-gallery__counter {
  position: absolute; top: 14px; right: 14px;
  font-size: 11px; color: var(--tw-mute);
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(6px);
  padding: 3px 9px; border-radius: 999px;
}
.tw-pdp-gallery__tools {
  position: absolute; left: 14px; bottom: 14px;
  display: flex; gap: 8px;
}
.tw-pdp-gallery__tool {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--tw-ink-2);
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(6px);
  padding: 5px 10px; border-radius: 999px;
  border: 1px solid transparent; cursor: pointer; font-family: var(--tw-mono);
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-gallery__tool:hover { border-color: var(--tw-mint); background: #fff; }
.tw-pdp-gallery__tool[aria-pressed="true"] { background: var(--tw-mint); color: #062319; }
.tw-pdp-gallery__tool[aria-pressed="true"] svg { color: #062319; }
.tw-pdp-gallery__tool svg { color: var(--tw-mint-600); }

/* 360 spin states */
.tw-pdp-gallery.is-spinning .tw-pdp-gallery__main { cursor: ew-resize; }
.tw-pdp-gallery.is-dragging .tw-pdp-gallery__main { cursor: grabbing; }

/* Zoom lightbox */
.tw-pdp-zoom-overlay {
  position: fixed;
  inset: 0;
  /* Above sticky header (100) and megamenu (250); same band as cart drawer. */
  z-index: var(--tw-z-modal, 10000);
  background: rgba(11,15,13,.82);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(16px, env(safe-area-inset-top, 0px)) 4vmin 132px;
  box-sizing: border-box;
  cursor: zoom-out;
  animation: tw-pdp-zoom-in .18s var(--tw-ease) both;
}
@keyframes tw-pdp-zoom-in { from { opacity: 0; } to { opacity: 1; } }
.tw-pdp-zoom-overlay__img {
  max-width: min(96vw, 1200px);
  max-height: min(calc(100vh - 200px), 78vh, 900px);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  background: #fff;
}
.tw-pdp-zoom__close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.tw-pdp-zoom__close:hover { background: rgba(255, 255, 255, 0.22); }
.tw-pdp-zoom__nav {
  position: absolute;
  top: 50%;
  z-index: 3;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.tw-pdp-zoom__nav:hover { background: rgba(255, 255, 255, 0.22); }
.tw-pdp-zoom__nav--prev { left: 16px; }
.tw-pdp-zoom__nav--next { right: 16px; }
.tw-pdp-zoom__stage {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  max-height: 100%;
}
.tw-pdp-zoom__footer {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: min(92vw, 720px);
  max-width: 100%;
  pointer-events: none;
}
.tw-pdp-zoom__footer > * {
  pointer-events: auto;
}
.tw-pdp-zoom__counter {
  margin: 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  letter-spacing: 0.14em;
  line-height: 1;
}
.tw-pdp-zoom__thumbs {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 4px;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}
.tw-pdp-zoom__thumbs::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.tw-pdp-zoom__thumb {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  overflow: hidden;
  box-sizing: border-box;
}
.tw-pdp-zoom__thumb.is-active {
  border-color: var(--tw-mint, #2DCE92);
  box-shadow: 0 0 0 1px var(--tw-mint, #2DCE92);
}
.tw-pdp-zoom__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* eRaty Santander instalment trigger (replaces the plugin's image button) */
/* Full-width eRaty instalment trigger with an illustrative split. */
.tw-pdp-buybox__eraty {
  width: 100%; margin-top: 12px;
  display: flex; align-items: center; gap: 12px;
  border: 1px solid var(--tw-line); border-radius: 14px;
  background: var(--tw-paper); cursor: pointer;
  padding: 12px 14px; font-family: var(--tw-display);
  color: var(--tw-ink); text-align: left;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-buybox__eraty:hover { border-color: var(--tw-mint); background: var(--tw-mint-050); }
.tw-pdp-buybox__eraty-icon {
  flex: none; width: 40px; height: 40px; border-radius: 10px;
  background: var(--tw-mint-050); color: var(--tw-mint-600);
  display: inline-flex; align-items: center; justify-content: center;
}
.tw-pdp-buybox__eraty-text { flex: 1; display: flex; flex-direction: column; gap: 2px; line-height: 1.2; }
.tw-pdp-buybox__eraty-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--tw-ink, #0b0f0d);
}
/* WC price markup inside the trigger — never inherit mint/white from other buybox rules. */
.tw-pdp-buybox__eraty-title .amount,
.tw-pdp-buybox__eraty-title .price,
.tw-pdp-buybox__eraty-title .woocommerce-Price-amount,
.tw-pdp-buybox__eraty-title .woocommerce-Price-amount * {
  color: var(--tw-ink, #0b0f0d) !important;
  font-weight: 700;
}
.tw-pdp-buybox__eraty-sub { font-size: 11.5px; font-weight: 400; color: var(--tw-mute); letter-spacing: 0; }
.tw-pdp-buybox__eraty-arrow {
  flex: none; width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--tw-mint); color: #062319; font-size: 14px;
}

/* ---- Summary head: brand + SKU meta ---- */
.tw-pdp-summary__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.tw-pdp-summary__meta {
  font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
  color: var(--tw-mute-2);
}
.tw-pdp-summary__meta-sep { margin: 0 4px; }

/* ---- Rating row ---- */
.tw-pdp-summary__rating {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px;
  margin-top: 10px;
}
.tw-pdp-stars { display: inline-flex; letter-spacing: 1px; color: var(--tw-line); }
.tw-pdp-stars__s { color: var(--tw-line); }
.tw-pdp-stars__s.is-full { color: #F5B400; }
.tw-pdp-stars__s.is-half {
  background: linear-gradient(90deg, #F5B400 50%, var(--tw-line) 50%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.tw-pdp-summary__rating-num { font-size: 13px; color: var(--tw-ink); }
.tw-pdp-summary__rating-meta { font-size: 13px; color: var(--tw-mute); }
.tw-pdp-summary__rating-meta--rec { color: var(--tw-mint-600); }
.tw-pdp-summary__videos {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--tw-mint-600); text-decoration: none;
  margin-left: auto;
}
.tw-pdp-summary__videos:hover { text-decoration: underline; }
.tw-pdp-summary__videos-play { font-size: 9px; }

/* ---- Feature bullets (two-column) ---- */
.tw-pdp-summary__bullets {
  list-style: none; margin: 18px 0 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px;
  font-size: 13.5px; color: var(--tw-ink-2);
}
.tw-pdp-summary__bullets li { display: flex; align-items: flex-start; gap: 8px; line-height: 1.4; }
.tw-pdp-summary__check {
  flex: none;
  width: 18px; height: 21px;        /* 21px ≈ first text line box (13.5px × 1.4) */
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--tw-mint-600); font-weight: 700; font-size: 13px;
}
@media (max-width: 540px) { .tw-pdp-summary__bullets { grid-template-columns: 1fr; } }

/* ---- Variant selector ---- */
.tw-pdp-variants { margin-top: 22px; }
.tw-pdp-variants__label {
  display: block; font-size: 11px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--tw-mute-2); margin-bottom: 8px;
}
.tw-pdp-variants__active { color: var(--tw-ink-2); }
.tw-pdp-variants__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.tw-pdp-variant {
  display: flex; flex-direction: column; gap: 2px;
  text-align: left; cursor: pointer;
  padding: 12px 14px; border-radius: 12px;
  border: 1.5px solid var(--tw-line);
  background: var(--tw-paper);
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-variant:hover { border-color: var(--tw-mute-2); }
.tw-pdp-variant.is-active { border-color: var(--tw-mint); background: var(--tw-mint-050); }
.tw-pdp-variant__name { font-weight: 600; font-size: 14px; }
.tw-pdp-variant__meta { font-size: 11px; color: var(--tw-mute-2); }
.tw-pdp-variant__price { font-size: 13.5px; color: var(--tw-ink-2); margin-top: 4px; }
@media (max-width: 540px) { .tw-pdp-variants__grid { grid-template-columns: 1fr; } }
/* Link-style cross-product variant pills (e.g. toilet with / without frame).
   Re-assert the flex column on the <a> — Salient/WC link resets can otherwise
   collapse it to inline, stacking the name on top of the price. */
a.tw-pdp-variant {
  text-decoration: none; color: inherit;
  display: flex !important; flex-direction: column; gap: 2px;
  line-height: 1.3;
}
a.tw-pdp-variant .tw-pdp-variant__name,
a.tw-pdp-variant .tw-pdp-variant__price { display: block; }
.tw-pdp-variants--links .tw-pdp-variants__grid { grid-template-columns: repeat(2, 1fr); }
.tw-pdp-variant.is-disabled {
  cursor: default;
  opacity: 0.72;
}
.tw-pdp-variants--solo .tw-pdp-variants__label { margin-bottom: 8px; }
.tw-pdp-variants--solo .tw-pdp-variants__grid { grid-template-columns: 1fr; max-width: 50%; }
@media (max-width: 540px) { .tw-pdp-variants--links .tw-pdp-variants__grid { grid-template-columns: 1fr; } }

/* ---- Buybox: price + finance + actions ---- */
.tw-pdp-buybox {
  margin-top: 22px; padding: 20px;
  border-radius: 16px; border: 1px solid var(--tw-line);
  background: var(--tw-paper-2);
}
.tw-pdp-buybox__pricerow {
  display: flex; align-items: center; gap: 10px 12px; flex-wrap: wrap;
  line-height: 1;
}
/* Sale: mint current price + savings pill (no strikethrough). */
.tw-pdp-buybox__price {
  margin: 0 !important;
  line-height: 1 !important;
  font-size: 34px; font-weight: 700; color: var(--tw-ink, #0B0F0D);
}
.tw-pdp-buybox__pricerow.is-sale .tw-pdp-buybox__price { color: var(--tw-mint-600, #1FB37C); }
.tw-pdp-buybox__price .tw-price-soon {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tw-mute-2, #98A09B);
}
.tw-pdp-buybox__price .woocommerce-Price-amount { font-weight: 700; }
.tw-pdp-buybox__save {
  font-size: 11px; line-height: 1; letter-spacing: .04em;
  color: var(--tw-mint-600); background: var(--tw-mint-100);
  padding: 6px 10px; border-radius: 999px;
}
.tw-pdp-buybox__badge {
  font-size: 10.5px; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  color: var(--tw-mint-600); background: var(--tw-mint-100);
  padding: 6px 10px; border-radius: 999px;
}
/* Omnibus "najniższa cena z 30 dni" — single muted line directly under price. */
.tw-pdp-buybox__lowest {
  margin: 6px 0 0;
  font-size: 11.5px; line-height: 1.3; color: var(--tw-mute-2);
}
.tw-pdp-buybox__lowest-label {
  text-transform: uppercase; letter-spacing: .04em; margin-right: 4px;
}
.tw-pdp-buybox__install { margin: 10px 0 0; font-size: 12px; line-height: 1.4; color: var(--tw-mute); }
/* Primary CTA — add-to-cart spans the full width; qty stepper sits inline.
   Both children share a fixed 56px height and align centred so the button
   never drops below the qty pill. */
.tw-pdp-buybox__actions { margin-top: 14px; }
/* WooCommerce stock line ("Na stanie") — hidden; scarcity shows in the top strip only. */
.tw-pdp-buybox .stock,
.tw-pdp-buybox p.stock {
  display: none !important;
}
.tw-pdp-buybox__actions > .tw-pdp-buybox__configure {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 0 12px;
}
.tw-pdp-buybox__actions form.cart {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.tw-pdp-buybox__configure {
  flex: 0 0 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 0 6px;
}
.tw-pdp-assembly-buybox + .tw-flush-config,
.tw-pdp-assembly-buybox + .tw-warranty-config,
.tw-flush-config + .tw-warranty-config {
  padding-top: 16px;
  border-top: 1px solid var(--tw-line-soft, #ecefed);
}
/* Flush-button cards inside buybox form.cart — reset GP/WC label/input bleed */
.tw-pdp-buybox form.cart .tw-flush-card {
  cursor: pointer;
}
.tw-pdp-buybox form.cart .tw-flush-card__input {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}
.tw-pdp-buybox__actions form.cart > .tw-pdp-buybox__configure,
.tw-pdp-buybox__actions form.cart .tw-pdp-buybox__configure {
  order: -1;
}
.tw-pdp-buybox__actions form.cart .tw-pdp-buybox__cta-price {
  flex: 0 0 100%;
  width: 100%;
  order: 0;
  margin: 2px 0 12px;
  padding-top: 14px;
  border-top: 1px solid var(--tw-line-soft, #ecefed);
  line-height: 1;
}
.tw-pdp-buybox__price--cta {
  display: block;
  font-size: 30px;
  font-weight: 700;
  color: var(--tw-ink, #0b0f0d);
}
.tw-pdp-buybox__actions form.cart .quantity {
  flex: 0 0 auto;
  height: 56px;
  margin: 0 !important;
  display: inline-flex; align-items: center;
}
.tw-pdp-buybox__actions form.cart.tw-qty-fixed {
  gap: 0;
}
.tw-pdp-buybox__actions form.cart.tw-qty-fixed .quantity {
  display: none !important;
}
.tw-pdp-buybox__actions form.cart button.single_add_to_cart_button,
.tw-pdp-buybox__actions form.cart .single_add_to_cart_button {
  flex: 1 1 auto; min-width: 0;
  height: 56px;
  margin: 0 !important;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--tw-mint, #2dce92) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
}
.tw-pdp-buybox__actions form.cart button.single_add_to_cart_button:hover {
  background: var(--tw-mint-600, #1fb37c) !important;
}

/* ---- Buybox: out of stock + back-in-stock alert ---- */
.tw-pdp-oos {
  width: 100%;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--tw-warn, #e8a020) 28%, var(--tw-line-soft, #ecefed));
  background: linear-gradient(180deg, #fffdf8 0%, #fff 100%);
}
.tw-pdp-oos__status {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.tw-pdp-oos__icon {
  flex: none;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: var(--tw-mint-050, #f1faf5);
  color: var(--tw-mint-600, #1fb37c);
}
.tw-pdp-oos__title {
  margin: 0 0 4px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--tw-ink, #0b0f0d);
}
.tw-pdp-oos__lede {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--tw-mute, #5c6560);
}
.tw-pdp-oos__form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tw-pdp-oos__input {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--tw-line, #d8deda);
  border-radius: 12px;
  background: #fff;
  font-size: 14px;
  color: var(--tw-ink, #0b0f0d);
  box-sizing: border-box;
}
.tw-pdp-oos__input:focus {
  outline: none;
  border-color: var(--tw-mint-500, #2bc88e);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tw-mint-500, #2bc88e) 18%, transparent);
}
.tw-pdp-oos__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--tw-mute, #5c6560);
}
.tw-pdp-oos__consent input {
  margin-top: 2px;
  flex: none;
  accent-color: var(--tw-mint-600, #1fb37c);
}
.tw-pdp-oos__consent a {
  color: var(--tw-mint-600, #1fb37c);
  text-decoration: underline;
}
.tw-pdp-oos__consent-text {
  display: block;
  min-width: 0;
}
.tw-pdp-oos__consent-more {
  display: inline;
  margin: 0 0 0 2px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-weight: 600;
  line-height: inherit;
  color: var(--tw-mint-600, #1fb37c);
  cursor: pointer;
  text-decoration: underline;
  white-space: nowrap;
  vertical-align: baseline;
  box-shadow: none;
}
.tw-pdp-oos__consent-more:hover,
.tw-pdp-oos__consent-more:focus {
  color: var(--tw-mint-700, #159966);
  background: none;
  text-decoration: underline;
  outline: none;
}
.tw-pdp-oos__consent-full {
  display: block;
  margin-top: 8px;
  font-size: 11px;
  line-height: 1.45;
  color: var(--tw-mute-2, #8a9490);
}
.tw-pdp-oos__consent-full[hidden] {
  display: none;
}
.tw-pdp-oos__consent-full a {
  display: inline-block;
  margin-top: 6px;
}
.tw-pdp-oos__submit {
  width: 100%;
  height: 52px;
  border: 0;
  border-radius: 999px;
  background: var(--tw-ink, #0b0f0d);
  color: #fff;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s ease, opacity .15s ease;
}
.tw-pdp-oos__submit:hover { background: #1a211d; }
.tw-pdp-oos__submit:disabled { opacity: .65; cursor: wait; }
.tw-pdp-oos__note {
  margin: 0;
  font-size: 10.5px;
  line-height: 1.4;
  color: var(--tw-mute-2, #8a9490);
}
.tw-pdp-oos__msg {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 12.5px;
  line-height: 1.4;
}
.tw-pdp-oos__msg.is-success {
  color: var(--tw-mint-700, #159966);
  background: var(--tw-mint-050, #f1faf5);
  border: 1px solid color-mix(in srgb, var(--tw-mint-500, #2bc88e) 25%, transparent);
}
.tw-pdp-oos__msg.is-error {
  color: #a33b2b;
  background: #fff5f3;
  border: 1px solid #f2d6d0;
}
.tw-pdp-oos-slot { width: 100%; margin-top: 12px; }

/* Secondary actions — compare + wishlist sit side by side, equal weight.
   Both are forced to the SAME fixed box (equal width, 48px tall, no stretch
   ambiguity) so the plugin's compare button and our wishlist always line up. */
.tw-pdp-buybox__secondary {
  display: flex; gap: 10px; margin-top: 12px; align-items: center;
}
.tw-pdp-buybox__secondary > .tw-btn,
.tw-pdp-buybox__secondary .tw-compare-toggle,
.tw-pdp-buybox__wish {
  flex: 1 1 0; min-width: 0;
  height: 48px !important; min-height: 48px; padding: 0 16px !important;
  margin: 0 !important; align-self: auto !important;
  border-radius: 999px;
  box-sizing: border-box;
  display: inline-flex !important; align-items: center !important; justify-content: center; gap: 8px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif); font-size: 14px; font-weight: 500;
  line-height: 1;
  /* Never let a long label overflow and overlap the neighbouring button. */
  overflow: hidden; white-space: nowrap;
}
.tw-pdp-buybox__secondary > .tw-btn .tw-calc-launcher__label,
.tw-pdp-buybox__secondary .tw-compare-toggle > span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}
.tw-pdp-buybox__secondary > .tw-btn svg { flex: none; }
.tw-pdp-buybox__wish {
  border: 1px solid var(--tw-line); background: var(--tw-paper); cursor: pointer; color: var(--tw-ink-2);
  transition: border-color var(--tw-dur-fast) var(--tw-ease), color var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-buybox__wish:hover { border-color: var(--tw-mint); color: var(--tw-mint-600); }
.tw-pdp-buybox__wish.is-active {
  color: var(--tw-mint-600); border-color: var(--tw-mint); background: var(--tw-mint-050);
}
.tw-pdp-buybox__wish.is-active svg { fill: currentColor; }

/* ---- Buybox: extended warranty picker ---- */
.tw-warranty-config {
  margin: 0;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--tw-line-soft, #ecefed);
  background: #fff;
}
.tw-warranty-config__head { margin-bottom: 12px; }
.tw-warranty-config__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 0 0 6px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--tw-mint-600, #1fb37c);
}
.tw-warranty-config__eyebrow .tw-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: currentColor; flex: none;
}
.tw-warranty-config__title {
  margin: 0 0 6px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 16px; font-weight: 700; line-height: 1.25;
  color: var(--tw-ink, #0b0f0d);
}
.tw-warranty-config__lede {
  margin: 0;
  font-size: 12.5px; line-height: 1.45; color: var(--tw-mute, #5c6560);
}
.tw-warranty-config__options {
  display: flex; flex-direction: column; gap: 8px;
}
.tw-warranty-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px 14px;
  padding: 14px 16px;
  border: 1.5px solid var(--tw-line-soft, #ecefed);
  border-radius: 12px;
  background: var(--tw-paper-2, #f4f7f5);
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.tw-warranty-card.is-recommended {
  border-color: color-mix(in srgb, var(--tw-mint-500, #2bc88e) 35%, var(--tw-line-soft));
}
.tw-warranty-card:has(.tw-warranty-card__input:checked) {
  border-color: var(--tw-mint-500, #2bc88e);
  background: var(--tw-mint-050, #f1faf5);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--tw-mint-500, #2bc88e) 25%, transparent);
}
.tw-warranty-card__input {
  position: absolute; opacity: 0; pointer-events: none;
  width: 0; height: 0;
}
.tw-warranty-card__radio {
  width: 18px; height: 18px; flex: none;
  border-radius: 50%;
  border: 2px solid var(--tw-line, #d8deda);
  background: #fff;
  position: relative;
}
.tw-warranty-card:has(.tw-warranty-card__input:checked) .tw-warranty-card__radio {
  border-color: var(--tw-mint-600, #1fb37c);
  background: var(--tw-mint-600, #1fb37c);
  box-shadow: inset 0 0 0 3px #fff;
}
.tw-warranty-card__body {
  min-width: 0;
  display: flex; flex-direction: column; gap: 3px;
}
.tw-warranty-card__title {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px;
  font-size: 13.5px; font-weight: 600; line-height: 1.3;
  color: var(--tw-ink, #0b0f0d);
}
.tw-warranty-card__badge {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 9px; font-weight: 700; letter-spacing: .05em;
  text-transform: uppercase;
  background: var(--tw-ink, #0b0f0d); color: #fff;
}
.tw-warranty-card__sub {
  font-size: 11.5px; line-height: 1.35; color: var(--tw-mute, #5c6560);
}
.tw-warranty-card__price {
  font-size: 13px; font-weight: 700; white-space: nowrap;
  color: var(--tw-ink, #0b0f0d);
}
.tw-warranty-card__price.is-muted {
  font-weight: 600; color: var(--tw-mute, #5c6560);
}

/* ---- Buybox: installation picker ---- */
.tw-pdp-assembly-buybox {
  margin: 0;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--tw-line-soft, #ecefed);
  background: #fff;
}
.tw-pdp-assembly-buybox__head { margin-bottom: 12px; }
.tw-pdp-assembly-buybox__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 0 0 6px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--tw-mint-600, #1fb37c);
}
.tw-pdp-assembly-buybox__title {
  margin: 0 0 6px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  font-size: 16px; font-weight: 700; line-height: 1.25;
}
.tw-pdp-assembly-buybox__lede {
  margin: 0;
  font-size: 12.5px; line-height: 1.45; color: var(--tw-mute, #5c6560);
}
.tw-pdp-assembly-buybox .tw-pdp-assembly__seg { margin-bottom: 12px; }
/* Segmented VAT toggle inside form.cart — reset Salient/WC button:hover bleed */
.tw-pdp-buybox form.cart .tw-pdp-assembly__seg-btn {
  background: transparent;
  color: var(--tw-mute, #5c6560);
  border: 0;
  box-shadow: none;
}
.tw-pdp-buybox form.cart .tw-pdp-assembly__seg-btn:hover {
  background: color-mix(in srgb, var(--tw-ink, #0b0f0d) 6%, transparent);
  color: var(--tw-ink, #0b0f0d);
}
.tw-pdp-buybox form.cart .tw-pdp-assembly__seg-btn.is-active,
.tw-pdp-buybox form.cart .tw-pdp-assembly__seg-btn.is-active:hover {
  background: #fff;
  color: var(--tw-ink, #0b0f0d);
  box-shadow: 0 1px 4px rgba(11, 15, 13, 0.08);
}
.tw-pdp-assembly-buybox .tw-pdp-assembly__options { gap: 8px; }
.tw-pdp-assembly-buybox .tw-pdp-assembly__option {
  padding: 14px 16px;
  border-radius: 12px;
}
.tw-pdp-assembly-buybox__note {
  margin: 10px 0 0;
  font-size: 11px;
  line-height: 1.45;
  color: var(--tw-mute-2, #8a9490);
}
.tw-pdp-assembly-buybox__more-wrap {
  margin: 12px 0 0;
  text-align: right;
}
.tw-pdp-assembly-buybox__more {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--tw-mint-600, #1fb37c);
  text-decoration: none;
}
.tw-pdp-assembly-buybox__more:hover { text-decoration: underline; }
.tw-pdp-assembly__col-faq--wide {
  grid-column: 1 / -1;
  max-width: 720px;
}

/* ---- Reassurance 2×2 (override old flat list) ---- */
.tw-pdp-reassurance {
  list-style: none; margin: 16px 0 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--tw-line-soft); border: 1px solid var(--tw-line-soft);
  border-radius: 14px; overflow: hidden;
}
.tw-pdp-reassurance__item {
  display: flex !important; align-items: flex-start; gap: 10px;
  padding: 14px 16px; background: var(--tw-paper); min-width: 0;
}
.tw-pdp-reassurance__icon { color: var(--tw-mint-600); flex: none; width: auto; }
/* Force the title/sub to STACK. Salient/WC span rules can reset this to inline,
   which makes the title overlap the sub (the "doubled" text). */
.tw-pdp-reassurance__text {
  display: flex !important; flex-direction: column !important;
  min-width: 0; line-height: 1.3;
}
.tw-pdp-reassurance__title { display: block; font-size: 13px; font-weight: 600; line-height: 1.3; }
.tw-pdp-reassurance__sub { display: block; font-size: 11.5px; color: var(--tw-mute); line-height: 1.3; }
@media (max-width: 540px) { .tw-pdp-reassurance { grid-template-columns: 1fr; } }

/* ---- Sticky sub-nav (tabs + price + CTA when pinned) ---- */
.tw-pdp-subnav {
  position: sticky;
  top: var(--tw-sticky-top, 76px);
  z-index: var(--tw-z-subnav, 99);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-block: 1px solid var(--tw-line-soft);
  margin-top: 8px;
}
@media (max-width: 900px) {
  .tw-pdp-subnav {
    margin-top: 0;
    top: var(--tw-sticky-top, 56px);
  }
}
.tw-pdp-subnav__inner {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.tw-pdp-subnav__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.tw-pdp-subnav__list::-webkit-scrollbar { display: none; }
.tw-pdp-subnav__link {
  display: inline-block; white-space: nowrap; text-decoration: none;
  font-size: 13.5px; color: var(--tw-mute);
  padding: 16px 12px; border-bottom: 2px solid transparent;
  transition: color var(--tw-dur-fast) var(--tw-ease), border-color var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-subnav__link:hover { color: var(--tw-ink); }
.tw-pdp-subnav__link.is-active { color: var(--tw-ink); border-bottom-color: var(--tw-mint); }
/* CTA hidden until the subnav is pinned (x-kom style) — then it slides in. */
.tw-pdp-subnav__cta {
  flex: none; height: 40px; padding: 0 18px; font-size: 13px;
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none;
  opacity: 0; visibility: hidden; transform: translateX(8px);
  pointer-events: none;
  transition: opacity var(--tw-dur-fast) var(--tw-ease),
              transform var(--tw-dur-fast) var(--tw-ease),
              visibility var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-subnav.is-stuck .tw-pdp-subnav__cta {
  opacity: 1; visibility: visible; transform: none; pointer-events: auto;
}
.tw-pdp-subnav__cta .price,
.tw-pdp-subnav__cta-price { font-weight: 600; }
.tw-pdp-subnav__cta-price del { display: none; }
/* A subtle shadow once pinned so it reads as a floating bar. */
.tw-pdp-subnav.is-stuck { box-shadow: 0 6px 20px -16px rgba(11,15,13,.4); }
@media (max-width: 760px) { .tw-pdp-subnav__cta { display: none; } }
.tw-pdp-subnav__sentinel { display: block; width: 100%; height: 1px; }

/* ---- Generic section scaffolding ---- */
.tw-pdp-section { scroll-margin-top: calc(var(--tw-sticky-top, 76px) + 56px); }
.tw-pdp-section__head { margin-bottom: 28px; }
.tw-pdp-section__head .tw-eyebrow { display: block; margin-bottom: 12px; }
.tw-pdp-section__head--row {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.tw-pdp-section__lede { max-width: 52ch; color: var(--tw-mute); font-size: 14px; line-height: 1.6; margin: 12px 0 0; }
.tw-pdp-section h2 em,
.tw-pdp-desc__heading em,
.tw-pdp-summary__title em { font-style: italic; color: var(--tw-mint-600); }

/* ---- Description (per-profile layouts, accordions, blended shots) ---- */
.tw-pdp-desc { display: flex; flex-direction: column; gap: 44px; }

/* Product shots — radial stage + multiply removes white JPEG box */
.tw-pdp-desc__shot {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 200px;
  padding: 20px 16px;
  border-radius: 16px;
  background: radial-gradient(ellipse 72% 68% at 50% 42%, var(--tw-paper, #fff) 0%, var(--tw-paper-2, #f4f7f5) 78%);
}
.tw-pdp-desc__shot-img {
  display: block;
  width: 100%;
  max-width: 340px;
  max-height: 300px;
  object-fit: contain;
  margin: 0 auto;
}
.tw-pdp-desc__shot-img.is-blend {
  mix-blend-mode: multiply;
  filter: contrast(1.04) saturate(1.03);
}
.tw-pdp-desc__shot-img.is-knockout {
  mix-blend-mode: multiply;
  filter: contrast(1.08) brightness(1.14) saturate(1.04);
}
.tw-pdp-desc__lead--dark .tw-pdp-desc__shot {
  background: #243029;
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.tw-pdp-desc__lead--dark .tw-pdp-desc__shot-img.is-knockout,
.tw-pdp-desc__lead--dark .tw-pdp-desc__shot-img.is-blend {
  mix-blend-mode: multiply;
  filter: contrast(1.08) brightness(1.14) saturate(1.04) drop-shadow(0 20px 44px rgba(0, 0, 0, 0.42));
}

.tw-pdp-desc__lead {
  display: grid;
  gap: 28px;
  align-items: center;
  padding: 36px 40px;
  border-radius: 20px;
  border: 1px solid var(--tw-line-soft);
}
.tw-pdp-desc__lead--split {
  grid-template-columns: minmax(0, 1.1fr);
  background: linear-gradient(135deg, var(--tw-paper-2) 0%, var(--tw-paper) 58%);
}
.tw-pdp-desc__lead--split.has-visual { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.tw-pdp-desc__lead--minimal {
  grid-template-columns: 1fr;
  padding: 28px 32px;
  background: var(--tw-paper);
}
.tw-pdp-desc__lead--dark {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
  background: linear-gradient(125deg, #1a211e 0%, #243029 100%);
  border-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}
.tw-pdp-desc__lead--dark .tw-eyebrow,
.tw-pdp-desc__lead--dark .tw-pdp-desc__para { color: rgba(255, 255, 255, 0.72); }
.tw-pdp-desc__lead--dark .tw-pdp-desc__heading { color: #fff; max-width: none; }
.tw-pdp-desc__lead--dark .tw-pdp-desc__heading em { color: var(--tw-mint); }

.tw-pdp-desc__lead-copy .tw-eyebrow { display: block; margin-bottom: 14px; }
.tw-pdp-desc__heading {
  margin: 0 0 16px;
  overflow-wrap: anywhere;
  max-width: 20ch;
}
.tw-pdp-desc__lead--minimal .tw-pdp-desc__heading { max-width: none; }
.tw-pdp-desc__para {
  color: var(--tw-ink-2);
  font-size: 15px;
  line-height: 1.65;
  margin: 0;
  max-width: 54ch;
}
.tw-pdp-desc__para + .tw-pdp-desc__para { margin-top: 12px; }
.tw-pdp-desc__lead-visual { min-width: 0; }

.tw-pdp-desc__divider {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
}
.tw-pdp-desc__divider-line { flex: 1; height: 1px; background: var(--tw-line-soft); }
.tw-pdp-desc__divider-title {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tw-mute);
  white-space: nowrap;
}

/* Accordions (native details) */
.tw-pdp-desc__acc-group { display: flex; flex-direction: column; gap: 10px; }
.tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc-group--highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc-group--highlights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.tw-pdp-desc__feat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 18px 16px;
  min-height: 120px;
  border: 1px solid var(--tw-line-soft);
  border-radius: 14px;
  background: var(--tw-paper);
}
.tw-pdp-desc__feat-card .tw-pdp-desc__chapter { margin-bottom: 2px; }
.tw-pdp-desc__feat-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--tw-ink-2);
  max-width: 36ch;
}
.tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc--feat .tw-pdp-desc__acc-summary,
.tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc--feat .tw-pdp-desc__acc-summary {
  min-height: 120px;
  position: relative;
  padding-bottom: 28px;
}
.tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc--feat .tw-pdp-desc__acc-chevron,
.tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc--feat .tw-pdp-desc__acc-chevron {
  position: absolute;
  right: 16px;
  bottom: 14px;
  margin: 0;
}
.tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc[open] .tw-pdp-desc__acc-chevron,
.tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc[open] .tw-pdp-desc__acc-chevron {
  bottom: 18px;
}
.tw-pdp-desc__acc {
  border: 1px solid var(--tw-line-soft);
  border-radius: 14px;
  background: var(--tw-paper);
  overflow: hidden;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), box-shadow var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-desc__acc[open] {
  border-color: var(--tw-mint);
  box-shadow: 0 10px 28px rgba(45, 206, 146, 0.07);
}
.tw-pdp-desc__acc-summary {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  cursor: pointer;
  list-style: none;
}
.tw-pdp-desc__acc-summary::-webkit-details-marker { display: none; }
.tw-pdp-desc__acc-summary::marker { content: ""; }
.tw-pdp-desc__chapter {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--tw-ink);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tw-pdp-desc__acc--feat .tw-pdp-desc__acc-summary { flex-direction: column; align-items: center; text-align: center; }
.tw-pdp-desc__acc-copy { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.tw-pdp-desc__acc-title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--tw-ink);
  text-transform: none;
  letter-spacing: 0;
}
.tw-pdp-desc__acc--feat .tw-pdp-desc__acc-title {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 12.5px;
}
.tw-pdp-desc__acc-teaser {
  display: block;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-mute);
}
.tw-pdp-desc__acc-badge {
  flex: none;
  font-size: 10px;
  color: var(--tw-mint-600);
  background: var(--tw-mint-100);
  padding: 4px 10px;
  border-radius: 999px;
}
.tw-pdp-desc__acc--feat .tw-pdp-desc__acc-badge { margin-top: 4px; }
.tw-pdp-desc__acc-chevron {
  flex: none;
  width: 10px;
  height: 10px;
  margin-top: 6px;
  margin-left: auto;
  border-right: 2px solid var(--tw-mute);
  border-bottom: 2px solid var(--tw-mute);
  transform: rotate(45deg);
  transition: transform var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-desc__acc[open] .tw-pdp-desc__acc-chevron {
  transform: rotate(-135deg);
  margin-top: 10px;
  border-color: var(--tw-mint-600);
}
.tw-pdp-desc__acc-panel {
  padding: 0 18px 18px 66px;
  color: var(--tw-ink-2);
  font-size: 14px;
  line-height: 1.6;
}
.tw-pdp-desc__acc--feat .tw-pdp-desc__acc-panel { padding: 0 16px 16px; text-align: center; }
.tw-pdp-desc__acc-panel p { margin: 0 0 10px; }
.tw-pdp-desc__acc-panel p:last-child { margin-bottom: 0; }

.tw-pdp-desc__acc--story .tw-pdp-desc__acc-summary { align-items: center; }
.tw-pdp-desc__acc--story .tw-pdp-desc__acc-panel {
  padding: 0 18px 20px;
  display: grid;
  gap: 20px;
}
.tw-pdp-desc__acc-panel.has-media {
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  align-items: start;
}
.tw-pdp-desc__acc-media { min-width: 0; }
.tw-pdp-desc__acc-text { min-width: 0; }

.tw-pdp-desc__highlights--chips .tw-pdp-desc__acc-group--highlights {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}
.tw-pdp-desc__highlights--chips .tw-pdp-desc__acc {
  flex: 1 1 220px;
  border-radius: 999px;
}
.tw-pdp-desc__highlights--chips .tw-pdp-desc__acc-summary {
  padding: 12px 16px;
  align-items: center;
}
.tw-pdp-desc__highlights--chips .tw-pdp-desc__chapter {
  width: 28px;
  height: 28px;
  font-size: 10px;
}
.tw-pdp-desc__highlights--chips .tw-pdp-desc__acc-panel {
  padding: 0 16px 14px;
}

.tw-pdp-desc__quote {
  margin: 0;
  padding: 28px 32px;
  border-left: 3px solid var(--tw-mint);
  border-radius: 0 16px 16px 0;
  background: var(--tw-paper-2);
}
.tw-pdp-desc__quote blockquote { margin: 0; font-size: 17px; line-height: 1.55; font-style: italic; max-width: 48ch; }
.tw-pdp-desc__quote figcaption { margin-top: 14px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--tw-mute-2); }

.tw-pdp-desc__acc-text--rich { font-size: 15px; line-height: 1.6; color: var(--tw-ink-2); }
.tw-pdp-desc__acc-text--rich > :first-child { margin-top: 0; }
.tw-pdp-desc__acc-text--rich p { margin: 0 0 12px; }
.tw-pdp-desc__acc-text--rich a { color: var(--tw-mint-600); text-decoration: underline; }
.tw-pdp-desc__acc-text--rich img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 12px 0;
}

.tw-pdp-desc__acc-bullets {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.tw-pdp-desc__acc-bullets li {
  position: relative;
  padding: 10px 12px 10px 34px;
  border-radius: 10px;
  background: var(--tw-paper-2);
  font-size: 14px;
  line-height: 1.45;
  color: var(--tw-ink-2);
}
.tw-pdp-desc__acc-bullets li::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-radius: 50%;
  background: var(--tw-mint);
}

/* Static story cards (no hidden panel → no chevron). */
.tw-pdp-desc__story-card {
  border: 1px solid var(--tw-line-soft);
  border-radius: 14px;
  background: var(--tw-paper);
  padding: 18px 20px;
}
.tw-pdp-desc__story-card-inner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.tw-pdp-desc__story-card-copy {
  flex: 1;
  min-width: 0;
}
.tw-pdp-desc__story-card .tw-pdp-desc__acc-title {
  display: block;
  font-size: 15px;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: 0;
}
.tw-pdp-desc__story-card-teaser {
  display: block;
  margin-top: 6px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--tw-mute);
}

/* Power / energy — editorial accordion stack */
.tw-pdp-desc--power .tw-pdp-desc__stories--accordion_plain { gap: 28px; }
.tw-pdp-desc--power .tw-pdp-desc__acc-group--stories { gap: 12px; }
.tw-pdp-desc--power .tw-pdp-desc__acc--story {
  border-color: #e3e8e5;
  background: linear-gradient(180deg, #fff 0%, #fafcfb 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset;
}
.tw-pdp-desc--power .tw-pdp-desc__acc--story[open] {
  border-color: var(--tw-mint);
  box-shadow: 0 14px 36px rgba(45, 206, 146, 0.1);
}
.tw-pdp-desc--power .tw-pdp-desc__chapter {
  background: linear-gradient(145deg, #243029 0%, #1a211e 100%);
  box-shadow: 0 4px 12px rgba(26, 33, 30, 0.22);
}
.tw-pdp-desc--power .tw-pdp-desc__acc--story .tw-pdp-desc__acc-summary {
  padding: 18px 20px;
  align-items: center;
}
.tw-pdp-desc--power .tw-pdp-desc__acc-title {
  font-size: 15px;
  line-height: 1.4;
}
.tw-pdp-desc--power .tw-pdp-desc__acc-teaser {
  font-size: 13px;
  color: var(--tw-mute);
}
.tw-pdp-desc--power .tw-pdp-desc__acc--story .tw-pdp-desc__acc-panel {
  padding: 4px 20px 22px 68px;
  border-top: 1px solid var(--tw-line-soft);
  margin-top: 0;
}
.tw-pdp-desc--power .tw-pdp-desc__acc-bullets li {
  background: #f2f6f4;
}
.tw-pdp-desc--power .tw-pdp-desc__acc-text p {
  font-size: 15px;
  line-height: 1.65;
  max-width: 62ch;
}

/* Profile accents */
.tw-pdp-desc--pet .tw-pdp-desc__chapter { background: #3d5a4a; }
.tw-pdp-desc--pet .tw-pdp-desc__lead--split,
.tw-pdp-desc--pet_compact .tw-pdp-desc__lead--split {
  background: linear-gradient(135deg, #f8f6f2 0%, #fff 60%);
}
.tw-pdp-desc--wellness .tw-pdp-desc__lead--split {
  background: linear-gradient(160deg, #f5f8f6 0%, #fff 50%);
}
.tw-pdp-desc--wellness .tw-pdp-mosaic__chapter > .tw-pdp-desc__chapter {
  background: #2a7a5a;
}
.tw-pdp-desc--smart_living .tw-pdp-mosaic__chapter > .tw-pdp-desc__chapter {
  background: #3a6ea8;
}
.tw-pdp-desc--smart_living .tw-pdp-mosaic__chapter-grid.has-media {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.tw-pdp-desc--smart_lifestyle .tw-pdp-desc__lead--split {
  background: linear-gradient(160deg, #f8f8fa 0%, #fff 55%);
}
.tw-pdp-desc--smart_lifestyle .tw-pdp-desc__highlights--chips .tw-pdp-desc__acc--feat {
  border-radius: 999px;
}
.tw-pdp-desc--pet .tw-pdp-mosaic__chapter > .tw-pdp-desc__chapter {
  background: #5a7a4a;
}
.tw-pdp-desc--pet .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-media,
.tw-pdp-desc--wellness .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-media,
.tw-pdp-desc--smart_living .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-media {
  order: 2;
}
.tw-pdp-desc--pet .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-copy,
.tw-pdp-desc--wellness .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-copy,
.tw-pdp-desc--smart_living .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-copy {
  order: 1;
}
.tw-pdp-desc--bathroom_compact .tw-pdp-desc__lead-visual,
.tw-pdp-desc--power_compact .tw-pdp-desc__lead-visual { display: none; }

@media (max-width: 900px) {
  .tw-pdp-desc__lead--split.has-visual,
  .tw-pdp-desc__lead--dark { grid-template-columns: 1fr; padding: 28px 22px; }
  .tw-pdp-desc__heading { max-width: none; }
  .tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc-group--highlights,
  .tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc-group--highlights { grid-template-columns: 1fr; }
  .tw-pdp-desc__acc-panel.has-media { grid-template-columns: 1fr; }
  .tw-pdp-desc__acc-panel { padding-left: 18px; }
  .tw-pdp-desc__acc--story .tw-pdp-desc__acc-summary { align-items: flex-start; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .tw-pdp-desc__highlights--accordion_grid .tw-pdp-desc__acc-group--highlights,
  .tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc-group--highlights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1100px) {
  .tw-pdp-desc__highlights--accordion_list .tw-pdp-desc__acc-group--highlights {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ---- Mosaic PDP (Jackery data + x-kom cards + Techwish editorial) ---- */
.tw-pdp-desc--mosaic {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.tw-pdp-mosaic__opening {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 48px;
  align-items: start;
  padding: 8px 0 48px;
}
/* Stacked mosaic opening: copy + image row, highlights grid below (bathroom, wellness, pet, smart_living). */
.tw-pdp-mosaic__opening--bathroom,
.tw-pdp-mosaic__opening--wellness,
.tw-pdp-mosaic__opening--pet,
.tw-pdp-mosaic__opening--smart_living {
  display: flex;
  flex-direction: column;
  gap: 36px;
  padding: 8px 0 48px;
}
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__opening-head,
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__opening-head,
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__opening-head,
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__opening-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 36px;
  align-items: center;
}
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__opening-head {
  gap: 48px;
}
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__opening-visual .tw-pdp-desc__shot,
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__opening-visual .tw-pdp-desc__shot,
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__opening-visual .tw-pdp-desc__shot,
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__opening-visual .tw-pdp-desc__shot {
  min-height: 280px;
  max-height: 420px;
}
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__opening-highlights,
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__opening-highlights,
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__opening-highlights,
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__opening-highlights {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__highlights-label,
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__highlights-label,
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__highlights-label,
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__highlights-label {
  margin: 0;
  font-size: 11px;
  font-family: var(--tw-mono, monospace);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tw-mute-2);
}
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__feat-stack,
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__feat-stack,
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__feat-stack,
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
@media (min-width: 1100px) {
  .tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-stack {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 979px) {
  .tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__opening-head,
  .tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__opening-head,
  .tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__opening-head,
  .tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__opening-head {
    grid-template-columns: 1fr;
  }
  .tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__feat-stack,
  .tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-stack {
    grid-template-columns: 1fr;
  }
}
/* Profile accents — stacked openings */
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-card {
  border-color: rgba(45, 206, 146, 0.22);
}
.tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter {
  background: #2a7a5a;
}
.tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter {
  background: #6b5a3a;
}
.tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter {
  background: #3a6ea8;
}
.tw-pdp-mosaic__copy .tw-eyebrow { display: block; margin-bottom: 14px; }
.tw-pdp-mosaic__copy .tw-pdp-desc__heading { max-width: none; margin-bottom: 18px; }
.tw-pdp-desc--mosaic .tw-pdp-mosaic__copy .tw-pdp-desc__para,
.tw-pdp-desc--mosaic .tw-pdp-mosaic__chapter-lede,
.tw-pdp-desc--mosaic .tw-pdp-mosaic__chapter-copy > p,
.tw-pdp-desc--mosaic .tw-pdp-mosaic__richtext {
  max-width: none;
}
.tw-pdp-desc--mosaic .tw-pdp-mosaic__quote blockquote,
.tw-pdp-desc--mosaic .tw-pdp-mosaic__quote-text,
.tw-pdp-desc--mosaic .tw-pdp-desc__quote blockquote {
  max-width: none;
}
.tw-pdp-desc--pet .tw-pdp-mosaic__chapter-grid.has-media,
.tw-pdp-desc--wellness .tw-pdp-mosaic__chapter-grid.has-media,
.tw-pdp-desc--smart_living .tw-pdp-mosaic__chapter-grid.has-media {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px;
}
.tw-pdp-desc--pet .tw-pdp-mosaic__opening--pet .tw-pdp-mosaic__feat-stack,
.tw-pdp-desc--wellness .tw-pdp-mosaic__opening--wellness .tw-pdp-mosaic__feat-stack,
.tw-pdp-desc--smart_living .tw-pdp-mosaic__opening--smart_living .tw-pdp-mosaic__feat-stack {
  width: 100%;
}
.tw-pdp-faq-sec .tw-pdp-faq,
.tw-pdp-faq-sec .tw-pdp-faq__list {
  width: 100%;
  max-width: none;
}
.tw-pdp-mosaic__side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.tw-pdp-mosaic__opening-visual .tw-pdp-desc__shot { min-height: 240px; }

.tw-pdp-mosaic__eyebrow {
  display: block;
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tw-mint-600);
  margin-bottom: 10px;
}
.tw-pdp-mosaic__eyebrow.is-invert { color: var(--tw-mint); }

.tw-pdp-mosaic__lead {
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--tw-ink);
  margin-bottom: 16px;
}
.tw-pdp-mosaic__lead em { font-style: italic; color: var(--tw-mint-600); }
.tw-pdp-mosaic__richtext,
.tw-pdp-mosaic__lead + .tw-pdp-mosaic__richtext {
  font-size: 15px;
  line-height: 1.65;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__richtext p { margin: 0 0 12px; }
.tw-pdp-mosaic__richtext p:last-child { margin-bottom: 0; }

.tw-pdp-mosaic__aside {
  padding: 20px 22px;
  border-radius: 16px;
  border: 1px solid var(--tw-line-soft);
  background: linear-gradient(160deg, var(--tw-paper) 0%, var(--tw-paper-2) 100%);
}
.tw-pdp-mosaic__aside-title {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
}
.tw-pdp-mosaic__aside-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  counter-reset: tw-aside;
}
.tw-pdp-mosaic__aside-list li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid var(--tw-line-soft);
  font-size: 14px;
  line-height: 1.45;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__aside-list li:first-child { border-top: 0; padding-top: 0; }
.tw-pdp-mosaic__aside-n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--tw-mint-050);
  color: var(--tw-mint-600);
  font-size: 11px;
  font-weight: 600;
  margin-top: 1px;
}
.tw-pdp-mosaic__aside-text { min-width: 0; }

/* Feature stack (x-kom / mockup v3) */
.tw-pdp-mosaic__feat-stack { display: flex; flex-direction: column; gap: 10px; }
.tw-pdp-mosaic__feat-card {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid var(--tw-line);
  background: var(--tw-paper);
  box-shadow: 0 1px 2px rgba(11, 15, 13, 0.04);
  transition: border-color var(--tw-dur-fast) var(--tw-ease), box-shadow var(--tw-dur-fast) var(--tw-ease), transform var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-mosaic__feat-card:hover {
  border-color: var(--tw-mint-300);
  box-shadow: 0 10px 28px rgba(45, 206, 146, 0.12);
  transform: translateY(-1px);
}
.tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter {
  width: 40px;
  height: 40px;
  font-size: 12.5px;
  letter-spacing: 0.02em;
  margin-top: 2px;
}
.tw-pdp-mosaic__feat-title { margin: 0; font-size: 14.5px; font-weight: 600; }
.tw-pdp-mosaic__feat-desc { margin: 4px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--tw-mute); }
.tw-pdp-mosaic__feat-badge {
  display: inline-block;
  margin-top: 8px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--tw-mint-600);
  letter-spacing: 0.04em;
  background: var(--tw-mint-050);
  max-width: 100%;
}
.tw-pdp-mosaic__opening-highlights .tw-pdp-mosaic__feat-card,
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__feat-card {
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  padding: 14px 16px;
}
.tw-pdp-mosaic__opening-highlights .tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter,
.tw-pdp-mosaic__opening--bathroom .tw-pdp-mosaic__feat-card > .tw-pdp-desc__chapter {
  width: 36px;
  height: 36px;
  font-size: 12px;
  margin-top: 0;
}
.tw-pdp-mosaic__side > .tw-pdp-mosaic__highlights-label {
  margin: 0 0 6px;
  font-size: 11px;
  font-family: var(--tw-mono, monospace);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tw-mute-2);
}

.tw-pdp-mosaic__stream { display: flex; flex-direction: column; gap: 72px; }
.tw-pdp-mosaic__stream + .tw-pdp-mosaic__chapters { margin-top: 72px; }

/* Full-bleed green/paper bands — stretch edge-to-edge of the viewport while
   the inner content stays aligned to the centered container. */
.tw-pdp-mosaic__band {
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: 64px;
  padding-inline: calc(max(0px, (100vw - var(--tw-container-max, 1320px)) / 2) + var(--tw-container-pad, 36px));
  border-radius: 0;
}
.tw-pdp-mosaic__band--paper { background: var(--tw-paper-2); }

.tw-pdp-mosaic__section-head { margin-bottom: 28px; max-width: 60ch; }
.tw-pdp-mosaic__section-title {
  margin: 0;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.tw-pdp-mosaic__section-title em { font-style: italic; color: var(--tw-mint-600); }
.tw-pdp-mosaic__section-sub { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--tw-mute); }

/* Stat callouts strip */
.tw-pdp-mosaic__callouts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border: 1px solid var(--tw-line-soft);
  border-radius: 18px;
  overflow: hidden;
  background: var(--tw-paper);
  margin: 0;
}
.tw-pdp-mosaic__callout {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 24px 22px;
  border-right: 1px solid var(--tw-line-soft);
}
.tw-pdp-mosaic__callout:last-child { border-right: 0; }
.tw-pdp-mosaic__callout-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--tw-mint-050);
  color: var(--tw-mint-600);
  line-height: 1;
}
.tw-pdp-mosaic__callout-icon svg { display: block; }
.tw-pdp-mosaic__callout-value {
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
}
.tw-pdp-mosaic__callout-value span { font-size: 0.55em; font-weight: 500; margin-left: 2px; }
.tw-pdp-mosaic__callout-label { font-size: 12.5px; color: var(--tw-mute); line-height: 1.4; }

/* Usage grid */
.tw-pdp-mosaic__uses {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.tw-pdp-mosaic__use {
  padding: 20px 16px;
  border-radius: 14px;
  background: var(--tw-paper);
  border: 1px solid var(--tw-line-soft);
  text-align: center;
}
.tw-pdp-mosaic__use-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0 auto 12px;
  border-radius: 11px;
  background: var(--tw-mint-050);
  color: var(--tw-mint-600);
}
.tw-pdp-mosaic__use-icon svg { display: block; }
.tw-pdp-mosaic__use-value {
  display: block;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-bottom: 6px;
}
.tw-pdp-mosaic__use-value span { font-size: 0.65em; font-weight: 500; }
.tw-pdp-mosaic__use-label { font-size: 12px; color: var(--tw-mute); line-height: 1.35; }

/* Real-world use cards (Jackery lifestyle + x-kom tiles) */
.tw-pdp-mosaic__realuse {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}
.tw-pdp-mosaic__realuse[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tw-pdp-mosaic__realuse[data-count="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tw-pdp-mosaic__realuse-card {
  border-radius: 16px;
  overflow: hidden;
  background: var(--tw-paper);
  border: 1px solid var(--tw-line-soft);
  display: flex;
  flex-direction: column;
}
.tw-pdp-mosaic__realuse-media {
  position: relative;
  aspect-ratio: 16 / 7;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--tw-mint-050) 0%, var(--tw-paper-2) 100%);
  border-bottom: 1px solid var(--tw-line-soft);
}
.tw-pdp-mosaic__realuse-num {
  font-family: var(--tw-mono, monospace);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--tw-mint-600);
  opacity: 0.9;
}
.tw-pdp-mosaic__realuse-body { padding: 14px 16px 16px; }
.tw-pdp-mosaic__realuse-title { margin: 0 0 6px; font-size: 14px; font-weight: 600; }
.tw-pdp-mosaic__realuse-value { margin: 0; font-size: 15px; font-weight: 600; color: var(--tw-mint-600); line-height: 1.35; }

.tw-pdp-mosaic__quote {
  margin: 0;
  padding: 24px 28px;
  border-left: 3px solid var(--tw-mint);
  border-radius: 0 16px 16px 0;
  background: var(--tw-paper-2);
}
.tw-pdp-mosaic__quote-text,
.tw-pdp-mosaic__quote blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: clamp(17px, 1.8vw, 21px);
  line-height: 1.45;
  font-weight: 500;
  font-style: normal;
  letter-spacing: -0.01em;
  max-width: 56ch;
}
.tw-pdp-mosaic__quote-text p,
.tw-pdp-mosaic__quote blockquote p { margin: 0; }
.tw-pdp-mosaic__quote figcaption { margin-top: 12px; font-size: 11px; color: var(--tw-mute-2); text-transform: uppercase; letter-spacing: 0.08em; }
.tw-pdp-mosaic__quote--inline {
  margin: 20px 0;
  padding: 18px 22px;
  border-left: 3px solid var(--tw-mint);
  border-radius: 0 12px 12px 0;
  background: var(--tw-paper-2);
}
.tw-pdp-mosaic__quote--inline blockquote {
  margin: 0;
  font-size: 16px;
  line-height: 1.45;
  font-weight: 500;
  color: var(--tw-ink);
}

.tw-pdp-mosaic__proscons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
}
.tw-pdp-mosaic__proscons-col {
  padding: 22px 24px;
  border-radius: 16px;
  border: 1px solid var(--tw-line-soft);
  background: var(--tw-paper);
}
.tw-pdp-mosaic__proscons-col.is-pros { border-left: 3px solid var(--tw-mint); }
.tw-pdp-mosaic__proscons-col.is-cons { border-left: 3px solid #c8a882; }
.tw-pdp-mosaic__proscons-title {
  margin: 0 0 14px;
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tw-mute-2);
}
.tw-pdp-mosaic__proscons-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.tw-pdp-mosaic__proscons-col li {
  padding: 11px 0;
  border-top: 1px solid var(--tw-line-soft);
  font-size: 14px;
  line-height: 1.45;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__proscons-col li:first-child { border-top: 0; padding-top: 0; }

/* Dark CTA band */
.tw-pdp-mosaic__band.tw-pdp-mosaic__band--dark {
  background: linear-gradient(135deg, #141a17 0%, #1e2823 100%);
  color: rgba(255, 255, 255, 0.88);
  border-radius: 0;
}
.tw-pdp-mosaic__band-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 28px;
  align-items: start;
}
.tw-pdp-mosaic__band-copy { max-width: 58ch; }
.tw-pdp-mosaic__band-title {
  margin: 0 0 12px;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.2;
  color: #fff;
}
.tw-pdp-mosaic__band-title em { font-style: italic; color: var(--tw-mint); }
.tw-pdp-mosaic__band-text { margin: 0 0 20px; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.7); }
.tw-pdp-mosaic__band-ctas { display: flex; flex-wrap: wrap; gap: 10px; }
.tw-pdp-mosaic__band .tw-btn.is-ghost-invert {
  background: transparent;
  color: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.35);
}
.tw-pdp-mosaic__band .tw-btn.is-ghost-invert:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.65);
  color: #fff;
}
.tw-pdp-mosaic__band-side {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
}
.tw-pdp-mosaic__band-side > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.tw-pdp-mosaic__band-side > div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.tw-pdp-mosaic__band-side dt {
  margin: 0;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}
.tw-pdp-mosaic__band-side dd { margin: 0; font-size: 14px; font-weight: 600; color: #fff; text-align: right; }

.tw-pdp-mosaic__uses--inline {
  margin: 16px 0 8px;
}
.tw-pdp-mosaic__proscons--inline {
  margin: 8px 0 0;
}

/* Story chapters (non-JPD fallback) */
.tw-pdp-mosaic__chapters { display: flex; flex-direction: column; gap: 20px; padding: 12px 0 8px; }
.tw-pdp-mosaic__chapter {
  position: relative;
  padding: 24px 26px;
  border-radius: 18px;
  border: 1px solid var(--tw-line-soft);
  border-left: 3px solid var(--tw-mint);
  background: var(--tw-paper);
}
.tw-pdp-mosaic__chapter > .tw-pdp-desc__chapter {
  position: absolute;
  top: 22px;
  left: 24px;
  z-index: 1;
  margin: 0;
}
.tw-pdp-mosaic__chapter-grid {
  display: grid;
  gap: 24px;
  margin-top: 0;
  padding-top: 42px;
}
.tw-pdp-mosaic__chapter-grid.has-media { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: start; }
.tw-pdp-mosaic__chapter.is-quote {
  background: linear-gradient(90deg, var(--tw-mint-050) 0%, var(--tw-paper) 42%);
}
.tw-pdp-mosaic__chapter.is-quote .tw-pdp-mosaic__chapter-title {
  font-size: 11px;
  font-family: var(--tw-mono, monospace);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tw-mute-2);
  margin-bottom: 12px;
}
.tw-pdp-mosaic__chapter.is-quote .tw-pdp-mosaic__chapter-copy > p {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0;
  color: var(--tw-ink-2);
}
.tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter-grid.has-media,
.tw-pdp-desc--bathroom_compact .tw-pdp-mosaic__chapter-grid.has-media {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px;
}
.tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter,
.tw-pdp-desc--bathroom_compact .tw-pdp-mosaic__chapter {
  padding: 22px 24px 24px;
}
.tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter > .tw-pdp-desc__chapter {
  display: inline-flex;
  width: 34px;
  height: 34px;
  top: 20px;
  left: 22px;
  font-size: 11px;
  background: var(--tw-mint-600);
}
.tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter-title {
  font-size: 17px;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter-media .tw-pdp-desc__shot {
  border-radius: 14px;
  min-height: 200px;
  max-height: 300px;
  overflow: hidden;
}
@media (min-width: 980px) {
  .tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-media {
    order: 2;
  }
  .tw-pdp-desc--bathroom .tw-pdp-mosaic__chapter:nth-child(even) .tw-pdp-mosaic__chapter-grid.has-media .tw-pdp-mosaic__chapter-copy {
    order: 1;
  }
}
.tw-pdp-mosaic__chapter-title { margin: 0 0 8px; font-size: 17px; font-weight: 600; line-height: 1.35; }
.tw-pdp-mosaic__chapter-lede { margin: 0 0 10px; font-size: 14px; line-height: 1.55; color: var(--tw-ink-2); }
.tw-pdp-mosaic__chapter-detail {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__chapter-detail:last-child { margin-bottom: 0; }
.tw-pdp-mosaic__chapter-points {
  list-style: disc;
  margin: 0 0 10px 1.15em;
  padding: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__chapter-points li { margin: 0 0 6px; padding: 0; }
.tw-pdp-mosaic__chapter-points li:last-child { margin-bottom: 0; }
.tw-pdp-mosaic__chapter-copy > p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__chapter-copy > p:last-child { margin-bottom: 0; }
.tw-pdp-mosaic__chapter-bullets {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 0;
  counter-reset: tw-chapter-bullet;
}
.tw-pdp-mosaic__chapter-bullets li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid var(--tw-line-soft);
  font-size: 14px;
  line-height: 1.45;
  color: var(--tw-ink-2);
}
.tw-pdp-mosaic__chapter-bullets li:first-child { border-top: 0; padding-top: 0; }
.tw-pdp-mosaic__chapter-bullets li::before {
  content: counter(tw-chapter-bullet, decimal-leading-zero);
  counter-increment: tw-chapter-bullet;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--tw-mint-050);
  color: var(--tw-mint-600);
  font-family: var(--tw-mono, monospace);
  font-size: 11px;
  font-weight: 600;
  margin-top: 1px;
  grid-column: 1;
}
.tw-pdp-mosaic__chapter-bullet-text {
  grid-column: 2;
  min-width: 0;
}

.tw-pdp-mosaic__faq {
  margin-top: 12px;
  padding-top: 4px;
}
.tw-pdp-mosaic__faq .tw-pdp-faq { max-width: 100%; }

@media (max-width: 980px) {
  .tw-pdp-mosaic__opening { grid-template-columns: 1fr; gap: 28px; }
  .tw-pdp-mosaic__callouts { grid-template-columns: 1fr; }
  .tw-pdp-mosaic__callout { border-right: 0; border-bottom: 1px solid var(--tw-line-soft); }
  .tw-pdp-mosaic__callout:last-child { border-bottom: 0; }
  .tw-pdp-mosaic__uses,
  .tw-pdp-mosaic__realuse,
  .tw-pdp-mosaic__realuse[data-count] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tw-pdp-mosaic__proscons { grid-template-columns: 1fr; }
  .tw-pdp-mosaic__chapter-grid.has-media { grid-template-columns: 1fr; }
  .tw-pdp-mosaic__band-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .tw-pdp-mosaic__uses,
  .tw-pdp-mosaic__realuse,
  .tw-pdp-mosaic__realuse[data-count] { grid-template-columns: 1fr; }
  .tw-pdp-mosaic__feat-card { grid-template-columns: 44px minmax(0, 1fr); }
}

/* ---- Hotspots ---- */
.tw-pdp-hotspots__grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.tw-pdp-hotspots__stage {
  position: relative; border-radius: 18px; overflow: hidden;
  background: var(--tw-paper-2);
  /* Show the WHOLE product image (object-fit:cover cropped tall photos like a
     toilet, and the %-based pin coordinates then no longer lined up with the
     visible crop). The image dictates the stage height. */
  display: block;
}
.tw-pdp-hotspots__img { display: block; width: 100%; height: auto; }
.tw-pdp-hotspots__pin {
  position: absolute; transform: translate(-50%, -50%);
  appearance: none; -webkit-appearance: none;
  box-sizing: border-box;
  width: 30px; height: 30px; min-width: 30px; min-height: 30px;
  max-width: 30px; max-height: 30px;
  aspect-ratio: 1 / 1;
  padding: 0 !important; margin: 0;
  border-radius: 50%; cursor: pointer;
  border: 2px solid #fff; background: var(--tw-ink); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,.25);
  line-height: 1;
}
.tw-pdp-hotspots__pin.is-active,
.tw-pdp-hotspots__pin:hover,
.tw-pdp-hotspots__pin:focus-visible { background: var(--tw-mint); color: #062319; }
.tw-pdp-hotspots__pin-n { font-family: var(--tw-mono); font-size: 12px; font-weight: 600; line-height: 1; }
.tw-pdp-hotspots__tip {
  position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%) translateY(6px);
  width: max-content; max-width: 240px; text-align: left;
  background: var(--tw-glass-900); color: #fff;
  padding: 12px 14px; border-radius: 12px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--tw-dur-fast) var(--tw-ease), transform var(--tw-dur-fast) var(--tw-ease), visibility var(--tw-dur-fast) var(--tw-ease);
  z-index: 4;
}
.tw-pdp-hotspots__pin:hover .tw-pdp-hotspots__tip,
.tw-pdp-hotspots__pin:focus-visible .tw-pdp-hotspots__tip {
  opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.tw-pdp-hotspots__tip strong { display: block; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--tw-mint); margin-bottom: 4px; }
.tw-pdp-hotspots__tip span { font-size: 12.5px; line-height: 1.4; color: rgba(255,255,255,.85); }
.tw-pdp-hotspots__caption { position: absolute; left: 16px; bottom: 14px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--tw-mute-2); }
.tw-pdp-hotspots__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.tw-pdp-hotspots__item { display: flex; gap: 14px; padding: 16px 4px; border-top: 1px solid var(--tw-line-soft); cursor: default; }
.tw-pdp-hotspots__item:first-child { border-top: 0; }
.tw-pdp-hotspots__item-n { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--tw-paper-3); color: var(--tw-ink-2); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
.tw-pdp-hotspots__item.is-active .tw-pdp-hotspots__item-n { background: var(--tw-mint); color: #062319; }
.tw-pdp-hotspots__item.is-active .tw-pdp-hotspots__item-body strong { color: var(--tw-mint-600); }
.tw-pdp-hotspots__item-body { display: flex; flex-direction: column; gap: 3px; }
.tw-pdp-hotspots__item-body strong { font-size: 14.5px; font-weight: 600; }
.tw-pdp-hotspots__item-body span { font-size: 12.5px; color: var(--tw-mute); }
@media (max-width: 900px) { .tw-pdp-hotspots__grid { grid-template-columns: 1fr; } }

/* ---- GPSR / compliance (manufacturer, responsible person, safety PDF) ---- */
.tw-pdp-compliance {
  margin-top: 40px;
  padding: 28px 0 8px;
  border-top: 1px solid var(--tw-line-soft);
  color: var(--tw-ink-2);
  scroll-margin-top: calc(var(--tw-sticky-top, 76px) + 56px);
}
.tw-pdp-compliance__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 28px 40px;
  align-items: start;
}
.tw-pdp-compliance__title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--tw-ink);
}
.tw-pdp-compliance__body {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--tw-ink-2);
}
.tw-pdp-compliance__body a {
  color: var(--tw-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.tw-pdp-compliance__body a:hover { color: var(--tw-mint-600); }
.tw-pdp-compliance__data-act {
  margin-top: 22px;
}
.tw-pdp-compliance__data-act-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--tw-mute);
}
.tw-pdp-compliance__col--downloads {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.tw-pdp-compliance__download-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.tw-pdp-compliance__icon {
  flex: none;
  color: var(--tw-mute-2);
  margin-top: 2px;
}
.tw-pdp-compliance__download {
  display: inline-block;
  font-size: 13px;
  color: var(--tw-mute);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.tw-pdp-compliance__download:hover { color: var(--tw-mint-600); }
@media (max-width: 900px) {
  .tw-pdp-compliance__grid { grid-template-columns: 1fr; gap: 24px; }
}

/* ---- Collapsible description fold (x-kom style) ---- */
.tw-pdp-desc-fold {
  margin-top: 8px;
  margin-bottom: 12px;
}
.tw-pdp-desc-fold__clip {
  position: relative;
  max-height: var(--tw-desc-fold-max, 420px);
  overflow: hidden;
  transition: max-height 0.45s var(--tw-ease, ease);
}
.tw-pdp-desc-fold.is-expanded .tw-pdp-desc-fold__clip {
  max-height: none;
  overflow: visible;
}
.tw-pdp-desc-fold.is-short .tw-pdp-desc-fold__clip {
  max-height: none;
  overflow: visible;
}
.tw-pdp-desc-fold__content {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.tw-pdp-desc-fold__content > .tw-pdp-desc {
  margin-top: 0;
}
.tw-pdp-desc-fold__fade {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 140px;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    var(--tw-paper, #fff) 78%
  );
  opacity: 1;
  transition: opacity 0.25s var(--tw-ease, ease);
}
.tw-pdp-desc-fold.is-expanded .tw-pdp-desc-fold__fade,
.tw-pdp-desc-fold.is-short .tw-pdp-desc-fold__fade {
  opacity: 0;
}
.tw-pdp-desc-fold__actions {
  display: flex;
  justify-content: center;
  margin-top: 18px;
}
.tw-pdp-desc-fold.is-short .tw-pdp-desc-fold__actions {
  display: none;
}
.tw-pdp-desc-fold__toggle {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  border-radius: 999px;
  border: 1px solid var(--tw-line);
  background: var(--tw-paper);
  color: var(--tw-ink);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), color var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-desc-fold__toggle:hover {
  border-color: var(--tw-mint);
  color: var(--tw-mint-600);
}
.tw-pdp-desc-fold__toggle-label--collapse {
  display: none;
}
.tw-pdp-desc-fold.is-expanded .tw-pdp-desc-fold__toggle-label--expand {
  display: none;
}
.tw-pdp-desc-fold.is-expanded .tw-pdp-desc-fold__toggle-label--collapse {
  display: inline;
}
.tw-pdp-desc-fold__chevron {
  width: 8px;
  height: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.25s var(--tw-ease, ease);
}
.tw-pdp-desc-fold.is-expanded .tw-pdp-desc-fold__chevron {
  transform: rotate(-135deg) translateY(2px);
}
.tw-pdp-compliance--in-fold {
  margin-top: 0;
  padding-top: 28px;
  border-top: 1px solid var(--tw-line-soft);
}
@media (prefers-reduced-motion: reduce) {
  .tw-pdp-desc-fold__clip { transition: none; }
  .tw-pdp-desc-fold__fade { transition: none; }
  .tw-pdp-desc-fold__chevron { transition: none; }
}

/* ---- Specs (grouped) ---- */
.tw-pdp-specs-sec {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tw-pdp-specs-sec__top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: end;
}
.tw-pdp-specs-sec__top.has-downloads {
  grid-template-columns: minmax(0, 1fr) minmax(0, 280px);
  gap: 20px 32px;
}
.tw-pdp-specs-sec__intro { max-width: 52ch; }
.tw-pdp-specs-sec__intro .tw-eyebrow { display: block; margin-bottom: 10px; }
.tw-pdp-specs-sec__intro .tw-h2 { margin: 0 0 10px; }
.tw-pdp-specs-sec__intro .tw-pdp-section__lede { margin: 0; }
.tw-pdp-downloads {
  margin-top: 0;
  padding: 16px 18px;
  border-radius: 14px;
  background: var(--tw-paper-2);
  align-self: end;
}
.tw-pdp-downloads__label { display: block; margin-bottom: 12px; }
.tw-pdp-downloads__items { display: flex; flex-wrap: wrap; gap: 8px; }
.tw-pdp-downloads__btn { display: inline-flex; align-items: center; font-size: 13px; text-decoration: none; color: var(--tw-ink-2); border: 1px solid var(--tw-line); border-radius: 999px; padding: 8px 16px; background: var(--tw-paper); transition: border-color var(--tw-dur-fast) var(--tw-ease); }
.tw-pdp-downloads__btn:hover { border-color: var(--tw-mint); color: var(--tw-mint-600); }
.tw-pdp-spectable__group {
  font-family: var(--tw-mono, monospace);
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--tw-mute-2); margin: 20px 0 8px; font-weight: 400;
}
.tw-pdp-spectable__group:first-child { margin-top: 0; }
.tw-pdp-spectable__table {
  width: 100%; border-collapse: collapse;
  border: 1px solid var(--tw-line-soft); border-radius: 12px; overflow: hidden;
}
.tw-pdp-spectable__table th, .tw-pdp-spectable__table td {
  text-align: left; padding: 10px 14px; vertical-align: top;
  border-bottom: 1px solid var(--tw-line-soft); font-size: 13.5px;
  line-height: 1.35;
}
/* Zebra striping for scannability. */
.tw-pdp-spectable__table tr:nth-child(odd) { background: var(--tw-paper-2, #F4F7F5); }
.tw-pdp-spectable__table tr:last-child th,
.tw-pdp-spectable__table tr:last-child td { border-bottom: 0; }
.tw-pdp-spectable__table th {
  width: 36%; font-weight: 500; font-size: 12.5px; letter-spacing: 0;
  text-transform: none; color: var(--tw-mute);
}
.tw-pdp-spectable__table td { color: var(--tw-ink); font-weight: 600; font-size: 14px; }
.tw-pdp-spectable__table tr.is-highlight td { color: var(--tw-mint-600); }
@media (max-width: 900px) {
  .tw-pdp-specs-sec__top { grid-template-columns: 1fr; align-items: start; }
  .tw-pdp-downloads { align-self: stretch; }
}

/* ---- Brand ecosystem (connectivity / app / distribution) ---- */
.tw-pdp-brand-ecosystem {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tw-brand-eco__facts {
  border: 1px solid var(--tw-line-soft);
  border-radius: 14px;
  background: var(--tw-paper);
  overflow: hidden;
}
.tw-brand-eco__table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}
.tw-brand-eco__table th,
.tw-brand-eco__table td {
  text-align: left;
  vertical-align: top;
  padding: 16px 20px;
  border: 0;
  border-bottom: 1px solid var(--tw-line-soft);
  font-size: 14px;
  line-height: 1.45;
  background: transparent;
}
.tw-brand-eco__table tr:last-child th,
.tw-brand-eco__table tr:last-child td { border-bottom: 0; }
.tw-brand-eco__table th {
  width: 30%;
  min-width: 140px;
  font-weight: 500;
  color: var(--tw-mute);
  font-size: 13px;
}
.tw-brand-eco__chips,
.tw-brand-eco__compat {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tw-brand-eco__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--tw-line-soft);
  background: var(--tw-paper-2);
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-ink);
}
.tw-brand-eco__chip-icon { display: inline-flex; color: var(--tw-ink-2); }
.tw-brand-eco__logo {
  display: block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.tw-brand-eco__logo--works {
  width: 18px;
  height: 18px;
}
.tw-brand-eco__works {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--tw-line-soft);
  background: #fff;
  font-size: 12px;
  color: var(--tw-ink);
}
.tw-brand-eco__works-prefix {
  font-size: 10px;
  text-transform: lowercase;
  color: var(--tw-mute-2);
}
.tw-brand-eco__works-icon { display: inline-flex; line-height: 0; }
.tw-brand-eco__works-label { font-weight: 600; font-size: 12px; }
.tw-brand-eco__app { display: flex; flex-direction: column; gap: 12px; }
.tw-brand-eco__app-name { margin: 0; font-weight: 600; font-size: 15px; color: var(--tw-ink); }
.tw-brand-eco__stores {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
}
.tw-brand-eco__store-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 7px 14px 7px 10px;
  border-radius: 10px;
  background: #0b0f0d;
  color: #fff !important;
  text-decoration: none !important;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: none;
  transition: opacity var(--tw-dur-fast) var(--tw-ease), transform var(--tw-dur-fast) var(--tw-ease);
}
.tw-brand-eco__store-badge:hover {
  opacity: 0.9;
  color: #fff !important;
  transform: translateY(-1px);
}
.tw-brand-eco__store-badge-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 0;
}
.tw-brand-eco__store-badge-label {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.tw-brand-eco__store-badge-eyebrow {
  font-size: 9px;
  line-height: 1.1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.88;
}
.tw-brand-eco__store-badge-title {
  font-size: 15px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.tw-brand-eco__banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 200px);
  gap: 20px 28px;
  align-items: center;
  padding: 22px 24px;
  border-radius: 14px;
  border: 1px solid var(--tw-line-soft);
  background: var(--tw-paper-2, #f4f7f5);
}
.tw-brand-eco__banner.is-text-only {
  grid-template-columns: 1fr;
  align-items: start;
}
.tw-brand-eco__banner.is-text-only .tw-brand-eco__banner-copy {
  max-width: 72ch;
}
.tw-brand-eco__banner-logo {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 56px;
}
.tw-brand-eco__banner-logo img {
  display: block;
  max-width: 100%;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
  /* Knock out solid white JPEG/PNG boxes (same idea as product shot blend). */
  mix-blend-mode: multiply;
}
.tw-brand-eco__banner-copy {
  font-size: 14px;
  line-height: 1.6;
  color: var(--tw-ink-2);
}
.tw-brand-eco__banner-copy p {
  margin: 0;
}
.tw-brand-eco__banner-copy p + p {
  margin-top: 0.75em;
}
.tw-brand-eco__banner-copy strong { color: var(--tw-ink); font-weight: 600; }
@media (max-width: 720px) {
  .tw-brand-eco__table th,
  .tw-brand-eco__table td {
    display: block;
    width: 100%;
    padding: 14px 18px;
  }
  .tw-brand-eco__table th {
    border-bottom: 0;
    padding-bottom: 6px;
    min-width: 0;
  }
  .tw-brand-eco__table td {
    padding-top: 0;
    padding-bottom: 16px;
  }
  .tw-brand-eco__table tr:last-child td { padding-bottom: 18px; }
  .tw-brand-eco__banner,
  .tw-brand-eco__banner.is-text-only {
    grid-template-columns: 1fr;
    padding: 18px;
  }
  .tw-brand-eco__stores {
    flex-direction: column;
    align-items: flex-start;
  }
  .tw-brand-eco__store-badge {
    width: 100%;
    max-width: 220px;
  }
}

/* ---- Sections on a tinted band ---- */
.tw-pdp-hotspots, .tw-pdp-reviews { position: relative; }

/* ---- YouTube / video reviews ---- */
.tw-pdp > section.tw-pdp-yt--player {
  margin-block: 56px;
}
.tw-pdp-yt--player {
  background: var(--tw-paper-2);
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(56px, 7vw, 80px);
  padding-inline: 0;
  border-radius: 0;
  box-sizing: border-box;
}
.tw-pdp-yt--player .tw-pdp-section__head {
  margin-bottom: 28px;
}
.tw-pdp-yt--player .tw-pdp-yt__player-layout {
  margin-bottom: 4px;
}
.tw-pdp-yt__count {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tw-mute);
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--tw-line-soft);
  background: var(--tw-paper);
}
.tw-pdp-yt__player-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.tw-pdp-yt__main {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.tw-pdp-yt__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  overflow: hidden;
  background: var(--tw-glass-900);
  box-shadow: 0 16px 40px rgba(11, 15, 13, 0.12);
}
.tw-pdp-yt__stage--tiktok,
.tw-pdp-yt__stage--instagram {
  aspect-ratio: 9 / 16;
  max-height: min(72vh, 720px);
  margin-inline: auto;
}
.tw-pdp-yt__poster {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 24px;
  border: 0;
  cursor: pointer;
  background: var(--tw-glass-900) center / cover no-repeat;
  color: #fff;
  text-align: center;
}
.tw-pdp-yt__poster:hover .tw-pdp-yt__poster-play { transform: scale(1.06); }
.tw-pdp-yt__poster--tiktok { background-color: #111; }
.tw-pdp-yt__poster--instagram { background-color: #833ab4; }
.tw-pdp-yt__poster-play {
  width: 68px;
  height: 68px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(4px);
  font-size: 22px;
  line-height: 1;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  transition: transform var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-yt__poster-title {
  max-width: 36ch;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55);
}
.tw-pdp-yt__stage.is-playing .tw-pdp-yt__poster { display: none; }
.tw-pdp-yt__iframe {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.tw-pdp-yt__iframe[hidden] {
  display: none !important;
}
.tw-pdp-yt__iframe--empty {
  position: relative;
  aspect-ratio: 16 / 9;
}
.tw-pdp-yt__playlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: min(72vh, 520px);
  overflow-y: auto;
}
.tw-pdp-yt__playlist-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--tw-line-soft);
  border-radius: 12px;
  background: var(--tw-paper);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-yt__playlist-item:hover,
.tw-pdp-yt__playlist-item.is-active {
  border-color: var(--tw-mint);
  background: var(--tw-mint-050);
}
.tw-pdp-yt__playlist-thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  background: var(--tw-glass-900) center / cover no-repeat;
  overflow: hidden;
}
.tw-pdp-yt__playlist-play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.28);
}
.tw-pdp-yt__playlist-platform {
  position: absolute;
  top: 6px;
  left: 6px;
  font-size: 9px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(0, 0, 0, 0.65);
  padding: 2px 6px;
  border-radius: 4px;
  z-index: 1;
}
.tw-pdp-yt__playlist-thumb--tiktok { background-color: #111; background-image: linear-gradient(145deg, #111 0%, #1a1a2e 100%); }
.tw-pdp-yt__playlist-thumb--instagram { background-color: #833ab4; background-image: linear-gradient(145deg, #833ab4 0%, #fd1d1d 50%, #fcb045 100%); }
.tw-pdp-yt__playlist-copy { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tw-pdp-yt__playlist-title { font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--tw-ink); }
.tw-pdp-yt__all { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--tw-ink-2); text-decoration: none; }
.tw-pdp-yt__all:hover { color: var(--tw-mint-600); }
.tw-pdp-yt__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.tw-pdp-yt__link { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: inherit; }
.tw-pdp-yt__thumb { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: var(--tw-glass-900); display: block; }
.tw-pdp-yt__badge { position: absolute; top: 10px; left: 10px; font-size: 9.5px; letter-spacing: .05em; color: #fff; background: #FF0033; padding: 4px 8px; border-radius: 5px; }
.tw-pdp-yt__dur { position: absolute; bottom: 10px; right: 10px; font-size: 10px; color: #fff; background: rgba(0,0,0,.7); padding: 2px 7px; border-radius: 4px; }
.tw-pdp-yt__play { position: absolute; inset: 0; margin: auto; width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 16px; backdrop-filter: blur(2px); }
.tw-pdp-yt__meta { font-size: 11px; color: var(--tw-mute-2); }
.tw-pdp-yt__title { font-size: 14.5px; font-weight: 600; line-height: 1.35; }
.tw-pdp-yt__tag { align-self: flex-start; font-size: 10px; color: var(--tw-mint-600); background: var(--tw-mint-100); padding: 3px 9px; border-radius: 999px; }
@media (max-width: 900px) {
  .tw-pdp-yt__player-layout { grid-template-columns: 1fr; }
  .tw-pdp-yt__playlist { max-height: none; }
}
@media (max-width: 760px) { .tw-pdp-yt__grid { grid-template-columns: 1fr; } }

/* ---- TikTok scroller ---- */
.tw-pdp-tt__track { list-style: none; margin: 0; padding: 4px; display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.tw-pdp-tt__track::-webkit-scrollbar { display: none; }
.tw-pdp-tt__card { flex: 0 0 168px; scroll-snap-align: start; }
.tw-pdp-tt__link { display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: inherit; }
.tw-pdp-tt__media { position: relative; aspect-ratio: 9 / 16; border-radius: 12px; background: var(--tw-glass-900); display: block; }
.tw-pdp-tt__badge { position: absolute; top: 10px; left: 10px; font-size: 10px; font-weight: 700; color: #fff; background: rgba(0,0,0,.55); padding: 3px 7px; border-radius: 5px; }
.tw-pdp-tt__views { position: absolute; top: 10px; right: 10px; font-size: 10px; color: #fff; }
.tw-pdp-tt__handle { font-size: 11px; color: var(--tw-mute-2); }
.tw-pdp-tt__caption { font-size: 13px; line-height: 1.35; }

/* ---- Reviews ---- */
.tw-pdp-reviews__grid { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 40px; align-items: start; }
.tw-pdp-reviews__score { display: flex; align-items: center; gap: 14px; }
.tw-pdp-reviews__num { font-size: 56px; font-weight: 500; line-height: 1; letter-spacing: -.02em; }
.tw-pdp-reviews__count { font-size: 12px; color: var(--tw-mute); margin: 8px 0 18px; }
.tw-pdp-reviews__hist { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.tw-pdp-reviews__hist-row { display: grid; grid-template-columns: 28px 1fr 36px; align-items: center; gap: 10px; }
.tw-pdp-reviews__hist-star { font-size: 11px; color: var(--tw-mute); }
.tw-pdp-reviews__hist-bar { height: 6px; border-radius: 999px; background: var(--tw-paper-3); overflow: hidden; }
.tw-pdp-reviews__hist-bar > span { display: block; height: 100%; background: var(--tw-mint); border-radius: 999px; }
.tw-pdp-reviews__hist-n { font-size: 11px; color: var(--tw-mute); text-align: right; }
.tw-pdp-reviews__all { width: 100%; }
.tw-pdp-reviews__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.tw-pdp-reviews__card { padding: 20px 22px; border: 1px solid var(--tw-line-soft); border-radius: 14px; background: var(--tw-paper); }
.tw-pdp-reviews__card-head { display: flex; align-items: center; gap: 12px; }
.tw-pdp-reviews__avatar { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--tw-mint-100); color: var(--tw-mint-600); font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.tw-pdp-reviews__author { display: flex; flex-direction: column; }
.tw-pdp-reviews__author strong { font-size: 14px; }
.tw-pdp-reviews__sub { font-size: 10.5px; color: var(--tw-mute-2); }
.tw-pdp-reviews__verified { color: var(--tw-mint-600); }
.tw-pdp-reviews__card-stars { margin-left: auto; font-size: 12px; }
.tw-pdp-reviews__card-title { font-size: 15px; font-weight: 600; margin: 14px 0 6px; }
.tw-pdp-reviews__card-body { font-size: 13.5px; line-height: 1.5; color: var(--tw-ink-2); margin: 0 0 12px; }
.tw-pdp-reviews__card-foot { display: flex; gap: 18px; font-size: 10.5px; color: var(--tw-mute-2); }
.tw-pdp-reviews__reply { cursor: pointer; }
@media (max-width: 860px) { .tw-pdp-reviews__grid { grid-template-columns: 1fr; gap: 28px; } }
.tw-pdp-reviews__empty {
  padding: 40px 28px; text-align: center;
  background: var(--tw-paper-2, #F4F7F5); border-radius: 16px;
}
.tw-pdp-reviews__empty-title { font-weight: 600; font-size: 16px; margin: 0 0 6px; color: var(--tw-ink); }
.tw-pdp-reviews__empty-sub { font-size: 13px; color: var(--tw-mute); margin: 0; }

/* ---- Service (montaż) + FAQ ---- */
.tw-pdp-service__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 32px; align-items: start; }
/* FAQ alone (montaż w buyboksie) — pełna szerokość, nie połowa grida. */
.tw-pdp-service__grid--faq-only {
  grid-template-columns: 1fr;
  max-width: 100%;
}
.tw-pdp-service__faq--solo { min-width: 0; }
.tw-pdp-service__card { padding: 28px; border: 1px solid var(--tw-line); border-radius: 18px; background: var(--tw-paper); }
.tw-pdp-service__card .tw-eyebrow { display: inline-flex; margin-bottom: 14px; }
.tw-pdp-service__heading { font-size: 22px; font-weight: 500; margin: 0 0 20px; }
.tw-pdp-service__steps { list-style: none; margin: 0 0 24px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tw-pdp-service__steps li { display: flex; gap: 14px; font-size: 14px; color: var(--tw-ink-2); }
.tw-pdp-service__step-n { flex: none; color: var(--tw-mint-600); font-size: 12px; }
.tw-pdp-service__lead { margin: 0 0 18px; font-size: 14px; line-height: 1.55; color: var(--tw-ink-2); }
.tw-pdp-service__vat-modes { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tw-pdp-service__vat-modes li { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--tw-ink-2); }
.tw-pdp-service__vat-modes strong { color: var(--tw-ink); font-size: 14px; }
.tw-pdp-service__assembly-table { margin: 0 0 22px; border: 1px solid var(--tw-line-soft); border-radius: 12px; overflow: hidden; font-size: 13px; }
.tw-pdp-service__assembly-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 0.8fr); gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--tw-line-soft); align-items: center; }
.tw-pdp-service__assembly-row:last-child { border-bottom: 0; }
.tw-pdp-service__assembly-row--head { background: var(--tw-paper-2); font-family: var(--tw-mono, monospace); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--tw-mute-2); }
.tw-pdp-service__assembly-label { line-height: 1.35; color: var(--tw-ink); }
.tw-pdp-service__cta { display: flex; gap: 10px; flex-wrap: wrap; }
.tw-pdp-service__cta .tw-btn { text-decoration: none; }
@media (max-width: 860px) { .tw-pdp-service__grid { grid-template-columns: 1fr; } }

/* WC Assembly Service inside Techwish buybox */
.tw-pdp-buybox .tw-pdp-assembly.wc-assembly-wrapper { margin: 0 0 16px; }
.tw-pdp-buybox .tw-pdp-assembly .wc-assembly-container { border-color: var(--tw-line-soft); border-radius: 14px; padding: 16px; }
.tw-pdp-buybox .tw-pdp-assembly .wc-mode-btn.active { background: var(--tw-mint-600, #1FB37C); border-color: var(--tw-mint-600, #1FB37C); }
.tw-pdp-buybox .tw-pdp-assembly .wc-assembly-price-tag { color: var(--tw-mint-600, #1FB37C); }
.tw-pdp-buybox .tw-pdp-assembly .wc-assembly-option input[type="radio"] { accent-color: var(--tw-mint-600, #1FB37C); }
.tw-pdp-buybox .tw-pdp-assembly .wc-assembly-more-info { color: var(--tw-mint-600, #1FB37C); }

/* ---- FAQ accordion (jasne karty jak warianty montażu) ---- */
.tw-pdp-faq__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.tw-pdp-faq__item {
  display: block;
  width: 100%;
  border: 1px solid var(--tw-line-soft, #ecefed);
  border-radius: 14px;
  background: var(--tw-paper-2, #f4f7f5);
  overflow: hidden;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease), box-shadow var(--tw-dur-fast) var(--tw-ease);
}

/* FAQ layout: oszczędzamy miejsce na desktopie, zachowujemy czytelność na mobile. */
@media (min-width: 980px) {
	.tw-pdp-faq__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 10px;
		column-gap: 18px;
	}
	.tw-pdp-faq__item { width: 100%; }
}
.tw-pdp-faq__item:has(.tw-pdp-faq__q[aria-expanded="true"]) {
  border-color: var(--tw-mint-500, #2bc88e);
  background: var(--tw-mint-050, #f1faf5);
  box-shadow: 0 0 0 1px var(--tw-mint-500, #2bc88e);
}
.tw-pdp-faq__q {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  text-align: left;
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 16px 18px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--tw-ink, #0b0f0d);
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
  box-shadow: none;
  transition: color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
/* GeneratePress / WC global button:hover can paint a dark fill — keep FAQ triggers readable. */
.tw-pdp .tw-pdp-faq__q:hover,
.tw-pdp .tw-pdp-faq__q:focus,
.tw-pdp .tw-pdp-faq__q:focus-visible,
.tw-pdp-faq__list .tw-pdp-faq__q:hover,
.tw-pdp-faq__list .tw-pdp-faq__q:focus,
.tw-pdp-faq__list .tw-pdp-faq__q:focus-visible {
  background: transparent;
  color: var(--tw-ink, #0b0f0d);
  box-shadow: none;
  border: 0;
}
.tw-pdp-faq__item:has(.tw-pdp-faq__q:hover:not([aria-expanded="true"])) {
  border-color: var(--tw-mint-300, #8ee4be);
  background: var(--tw-paper, #fff);
}
.tw-pdp-faq__q[aria-expanded="true"] {
  color: var(--tw-ink, #0b0f0d);
  background: transparent;
}
.tw-pdp-faq__icon {
  flex: none;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  font-size: 0;
  line-height: 1;
  color: var(--tw-mute-2, #98a09b);
  border-radius: 50%;
  background: var(--tw-paper, #fff);
  border: 1px solid var(--tw-line-soft, #ecefed);
  transition: color var(--tw-dur-fast) var(--tw-ease), border-color var(--tw-dur-fast) var(--tw-ease);
}
.tw-pdp-faq__icon::before {
  content: "+";
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
}
.tw-pdp-faq__q[aria-expanded="true"] .tw-pdp-faq__icon {
  color: var(--tw-mint-600, #1fb37c);
  border-color: var(--tw-mint-300, #8ee4be);
  background: var(--tw-paper, #fff);
}
.tw-pdp-faq__q[aria-expanded="true"] .tw-pdp-faq__icon::before {
  content: "×";
  font-size: 17px;
}
.tw-pdp-faq__a {
  padding: 0 18px 16px;
  border-top: 1px solid var(--tw-line-soft, #ecefed);
  background: var(--tw-paper, #fff);
}
.tw-pdp-faq__a p { margin: 0; padding-top: 12px; font-size: 14px; line-height: 1.55; color: var(--tw-ink-2, #2a2f2c); }
.tw-pdp-faq__rich {
  padding-top: 12px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink-2, #2a2f2c);
}
.tw-pdp-faq__rich p { margin: 0 0 12px; }
.tw-pdp-faq__rich p:last-child { margin-bottom: 0; }
.tw-pdp-faq__rich a { color: var(--tw-mint-600, #1fb37c); font-weight: 600; text-underline-offset: 2px; }
.tw-pdp-faq__rich a:hover { text-decoration: underline; }
.tw-assembly-faq__fine { font-size: 12px; color: var(--tw-mute-2, #98a09b); line-height: 1.5; }
.tw-assembly-faq__fine a { color: var(--tw-mint-600, #1fb37c); font-weight: 600; }
.tw-assembly-faq__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tw-assembly-faq__steps li { display: flex; gap: 12px; align-items: flex-start; }
.tw-assembly-faq__step-n {
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--tw-mint-050, #f1faf5);
  color: var(--tw-mint-600, #1fb37c);
  font-size: 12px;
  font-weight: 700;
  display: grid;
  place-items: center;
  font-family: var(--tw-mono, monospace);
}
.tw-assembly-faq__callout {
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--tw-paper-2, #f4f7f5);
  border: 1px solid var(--tw-line-soft, #ecefed);
  font-size: 13px;
}
.tw-assembly-faq__callout ul,
.tw-assembly-faq__bullets { margin: 8px 0 0; padding-left: 18px; }
.tw-assembly-faq__bullets { list-style: disc; }
.tw-assembly-faq__table-wrap {
  overflow-x: auto;
  margin: 12px 0;
  -webkit-overflow-scrolling: touch;
  border-radius: 10px;
  border: 1px solid var(--tw-line-soft, #ecefed);
}
.tw-assembly-faq__table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  font-size: 12px;
  line-height: 1.4;
}
.tw-assembly-faq__table th,
.tw-assembly-faq__table td {
  border: 1px solid var(--tw-line-soft, #ecefed);
  padding: 8px 10px;
  text-align: left;
  vertical-align: top;
}
.tw-assembly-faq__table thead th {
  background: var(--tw-paper-2, #f4f7f5);
  font-weight: 600;
  font-size: 11px;
  font-family: var(--tw-display, "Space Grotesk", sans-serif);
}
.tw-assembly-faq__table tbody th {
  font-weight: 500;
  background: #fff;
  max-width: 140px;
}

/* ---- Bundle ("Komplet") ---- */
.tw-pdp-bundle__panel { padding: 18px; border-radius: 20px; background: var(--tw-mint-050); border: 1px solid var(--tw-mint-100); }
.tw-pdp-bundle__grid { display: grid; grid-template-columns: repeat(4, 1fr) minmax(0, 0.8fr); gap: 14px; align-items: stretch; }
.tw-pdp-bundle__item { min-width: 0; }
.tw-pdp-bundle__card { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 16px; border-radius: 14px; background: var(--tw-paper); border: 1px solid transparent; text-decoration: none; color: inherit; }
.tw-pdp-bundle__card.is-base { border-color: var(--tw-mint); }
.tw-pdp-bundle__card:hover { box-shadow: var(--tw-shadow-card); }
.tw-pdp-bundle__tag { font-size: 10px; letter-spacing: .04em; color: var(--tw-mute-2); }
.tw-pdp-bundle__card.is-base .tw-pdp-bundle__tag { color: var(--tw-mint-600); }
.tw-pdp-bundle__media { aspect-ratio: 4 / 3; border-radius: 8px; background: var(--tw-paper-2); overflow: hidden; display: block; }
.tw-pdp-bundle__media img { width: 100%; height: 100%; object-fit: cover; }
.tw-pdp-bundle__name { font-size: 13px; font-weight: 600; margin-top: auto; }
.tw-pdp-bundle__price { font-size: 13px; color: var(--tw-ink-2); }
.tw-pdp-bundle__summary { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 8px 16px; }
.tw-pdp-bundle__total { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 0; }
.tw-pdp-bundle__total del { color: var(--tw-mute-2); font-size: 13px; }
.tw-pdp-bundle__total strong { font-size: 22px; }
.tw-pdp-bundle__form { margin: 4px 0 0; }
.tw-pdp-bundle__form .tw-btn { text-decoration: none; width: 100%; justify-content: center; }
@media (max-width: 980px) { .tw-pdp-bundle__grid { grid-template-columns: repeat(2, 1fr); } .tw-pdp-bundle__summary { grid-column: 1 / -1; } }
@media (max-width: 520px) { .tw-pdp-bundle__grid { grid-template-columns: 1fr; } }

/* ---- Power configurator (profile: power) ---- */
.tw-power-config {
  padding: 20px 0 0;
}
.tw-power-config__title {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 600;
  color: var(--tw-ink, #0b0f0d);
}
.tw-power-config__hint {
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--tw-mute, #6b7470);
  max-width: 62ch;
}
.tw-power-config__base {
  margin-bottom: 22px;
}
.tw-power-config__card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  padding: 14px;
  border-radius: 14px;
  background: var(--tw-paper, #fff);
  border: 1px solid var(--tw-line-soft, #ecefed);
  cursor: pointer;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), box-shadow var(--tw-dur-fast) var(--tw-ease);
}
.tw-power-config__card--base {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr) auto;
  grid-template-areas:
    "media copy check"
    "media price price";
  gap: 12px 16px;
  align-items: center;
  cursor: default;
  padding: 16px 18px;
}
.tw-power-config__card--base .tw-power-config__media { grid-area: media; }
.tw-power-config__card--base .tw-power-config__copy { grid-area: copy; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tw-power-config__card--base .tw-power-config__check { grid-area: check; align-self: start; justify-self: end; }
.tw-power-config__card--base .tw-power-config__price { grid-area: price; justify-self: end; margin-top: 0; }
.tw-power-config__carousel-outer {
  margin-inline: calc(-1 * var(--tw-container-pad, 36px));
  padding-inline: var(--tw-container-pad, 36px);
}
.tw-power-config__carousel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.tw-power-config__carousel-head .tw-mono {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tw-mute, #6b7470);
}
.tw-power-config__nav {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.tw-power-config__nav-btn {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--tw-line, #dde3e0);
  background: var(--tw-paper, #fff);
  color: var(--tw-ink, #0b0f0d);
  display: grid;
  place-items: center;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  transition: border-color var(--tw-dur-fast) var(--tw-ease), background var(--tw-dur-fast) var(--tw-ease);
}
.tw-power-config__nav-btn:hover:not(:disabled) {
  border-color: var(--tw-mint-500, #2bc88e);
  background: var(--tw-mint-050, #f1faf5);
}
.tw-power-config__nav-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.tw-power-config__track {
  list-style: none;
  margin: 0;
  padding: 4px 0 16px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(220px, 72vw);
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.tw-power-config__track::-webkit-scrollbar { display: none; }
.tw-power-config__item {
  scroll-snap-align: start;
  min-width: 0;
}
.tw-power-config__card:has(.tw-power-config__input:checked),
.tw-power-config__card.is-checked {
  border-color: var(--tw-mint-500, #2bc88e);
  box-shadow: 0 0 0 1px var(--tw-mint-500, #2bc88e);
  background: var(--tw-mint-050, #f1faf5);
}
.tw-power-config__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.tw-power-config__check {
  align-self: flex-end;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--tw-line, #dde3e0);
  background: var(--tw-paper, #fff);
  display: grid;
  place-items: center;
  font-size: 12px;
  color: transparent;
}
.tw-power-config__card:has(.tw-power-config__input:checked) .tw-power-config__check,
.tw-power-config__card.is-checked .tw-power-config__check {
  border-color: var(--tw-mint-600, #1fb37c);
  background: var(--tw-mint-600, #1fb37c);
  color: #fff;
}
.tw-power-config__media {
  display: block;
  aspect-ratio: 1;
  border-radius: 10px;
  background: var(--tw-paper-2, #f4f7f5);
  overflow: hidden;
}
.tw-power-config__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tw-power-config__name {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--tw-ink, #0b0f0d);
}
.tw-power-config__tag {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--tw-mint-600, #1fb37c);
}
.tw-power-config__price {
  font-size: 14px;
  font-weight: 700;
  color: var(--tw-ink, #0b0f0d);
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
}
.tw-power-config__price del {
  font-size: 12px;
  font-weight: 500;
  color: var(--tw-mute, #6b7470);
}
.tw-power-config__foot {
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px solid var(--tw-line-soft, #ecefed);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.tw-power-config__total {
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 14px;
}
.tw-power-config__total strong {
  font-size: 22px;
}
.tw-power-config__form .tw-btn {
  text-decoration: none;
}
@media (max-width: 640px) {
  .tw-power-config__card--base {
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-areas:
      "media copy"
      "check price";
  }
  .tw-power-config__foot { flex-direction: column; align-items: stretch; }
  .tw-power-config__form .tw-btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════
   Mobile hardening — prevent horizontal overflow and heading/price
   overlaps on small screens (Salient's h1/h2 rules otherwise leak in).
   ═══════════════════════════════════════════════════════════════════ */
/* overflow-x only on hero — clip on .tw-pdp breaks position:sticky on sub-nav */
.tw-pdp-hero { overflow-x: clip; }
.tw-pdp-hero,
.tw-pdp-summary,
.tw-pdp-buybox { min-width: 0; max-width: 100%; }
.tw-pdp-summary > *,
.tw-pdp-buybox > * { min-width: 0; }

/* Title: keep our size + let long brand names wrap, never overflow. */
.tw-pdp-summary__title {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* eRaty trigger + Omnibus line: lock the intended layout so they don't
   collapse onto one line if a parent resets flex/line-height. */
.tw-pdp-buybox__eraty { flex-wrap: nowrap; }
.tw-pdp-buybox__eraty-text { display: flex !important; flex-direction: column !important; min-width: 0; }
.tw-pdp-buybox__eraty-title,
.tw-pdp-buybox__eraty-sub { display: block; }
.tw-pdp-buybox__lowest { display: block; white-space: normal; }

@media (max-width: 600px) {
  .tw-pdp-summary__title { font-size: 26px !important; line-height: 1.15 !important; }
  .tw-pdp-buybox { padding: 16px; }
  /* price + badge wrap cleanly */
  .tw-pdp-buybox__pricerow { gap: 8px; }
  .tw-pdp-buybox .price { font-size: 26px !important; }
  /* compare + wishlist stack on narrow screens so labels never clip. In a
     column, flex:1 1 0 would collapse them to text height — force flex:none so
     the fixed 48px height is honoured. */
  .tw-pdp-buybox__secondary { flex-direction: column; align-items: stretch; }
  .tw-pdp-buybox__secondary > .tw-btn,
  .tw-pdp-buybox__secondary .tw-compare-toggle,
  .tw-pdp-buybox__wish { width: 100%; flex: none !important; height: 50px !important; }
  /* eRaty teaser: allow the example to wrap under the title */
  .tw-pdp-buybox__eraty-title { font-size: 14px; }
}