/* RBC PART 1 REVIEW — approved changes and previews, DEV only. */

/* #42: Six readable brief cards, with ivory and restrained burgundy. */
body.rbc-seo-pudelka-magnetyczne #wycena .brief-item {
  padding: clamp(22px, 2.5vw, 30px);
  border-color: #dfcdb8;
  border-top: 3px solid #74161b;
  background: #f2e8d9;
}
body.rbc-seo-pudelka-magnetyczne #wycena .brief-item h3 {
  margin: 0 0 12px;
  color: #74161b;
  font-size: clamp(22px, 2vw, 26px);
  line-height: 1.25;
}
body.rbc-seo-pudelka-magnetyczne #wycena .brief-item p {
  margin: 0;
  color: #514b45;
  font-size: 17px;
  line-height: 1.65;
}

/* #43: Beige-gold CTA above the footer, magnetic category only. */
body.rbc-seo-pudelka-magnetyczne .final-cta {
  color: #203542;
  background: linear-gradient(125deg, #f3e8d5, #e6d3ac);
}
body.rbc-seo-pudelka-magnetyczne .final-cta::before {
  border-color: rgba(116, 22, 27, .18);
}
body.rbc-seo-pudelka-magnetyczne .final-cta p {
  color: #514b45;
  opacity: 1;
}
body.rbc-seo-pudelka-magnetyczne .final-cta .cta-panel {
  color: #203542;
  background: transparent;
  box-shadow: none;
  border-color: transparent;
}
body.rbc-seo-pudelka-magnetyczne .final-cta .cta-panel h2 {
  color: #203542;
}
body.rbc-seo-pudelka-magnetyczne .final-cta a.button.button-light {
  color: #fff;
  background: #74161b;
  border-color: #74161b;
}
body.rbc-seo-pudelka-magnetyczne .final-cta a.button.button-outline-light {
  color: #74161b;
  background: transparent;
  border-color: #74161b;
}
body.rbc-seo-pudelka-magnetyczne .final-cta a.button.button-light:hover {
  background: #571014;
}
body.rbc-seo-pudelka-magnetyczne .final-cta a.button.button-outline-light:hover {
  color: #571014;
  background: #f8f2e6;
  border-color: #571014;
}

/* #7: Shared burgundy footer preview on DEV, not production. */
body.rbc-unified-shell .rbc-footer {
  background: #57171c;
}
body.rbc-unified-shell .rbc-footer p,
body.rbc-unified-shell .rbc-footer-bottom {
  color: #ede0d8;
}

/* #22: Full-bleed photos at their own ratio, without padding or cropping. */
.rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-product-media {
  flex: 0 0 auto;
  aspect-ratio: auto;
  padding: 0;
}
.rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-product-media img,
.rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-product-card:hover .rbc-product-media img {
  position: static;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  padding: 0;
  object-fit: contain;
  object-position: center;
  transform: none;
}
body.rbc-seo-pudelka-magnetyczne .hero-media img,
body.rbc-seo-pudelka-magnetyczne .split-media img,
body.rbc-seo-pudelka-magnetyczne .gallery-card img {
  object-fit: contain;
  object-position: center;
}

/* #21: Three supplied backgrounds in the actual page, ready for a decision. */
.rbc-part1-preview { background: #fbf8f4; }
.rbc-part1-preview__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.rbc-part1-preview__card { min-width: 0; margin: 0; padding: 0; overflow: hidden; border: 1px solid #dfcdb8; background: #fff; }
.rbc-part1-preview__media { position: relative; overflow: hidden; aspect-ratio: 5 / 4; background: #74161b; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-preview__media img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; padding: 0; object-fit: cover; object-position: 50% 50%; filter: none; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-preview__card:first-child img { object-position: 40% 50%; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-preview__card:last-child img { object-position: 50% 60%; }
.rbc-part1-preview__card figcaption { margin: 0; padding: 12px 14px; color: #74161b; font-size: 16px; font-weight: 700; line-height: 1.4; }
@media (max-width: 1000px) { .rbc-part1-preview__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .rbc-part1-preview__grid { grid-template-columns: minmax(0, 1fr); } }

/* #23: Wider hero; trim empty background only, keeping both boxes in view. */
body.rbc-seo-pudelka-magnetyczne .rbc-part1-hero { max-width: 613px; width: 100%; margin-inline: auto; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-hero img { width: 100%; height: auto; aspect-ratio: 6 / 5; object-fit: cover; object-position: 50% 60%; filter: none; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-hero .hero-badge { position: static; margin-top: 14px; color: #514b45; background: #f2e8d9; backdrop-filter: none; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-hero .hero-badge strong { color: #74161b; }

/* #40: Compact anatomy panel: complete diagram left, readable labels right. */
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy { padding-block: 28px; background: #fbf8f4; }
.rbc-part1-anatomy__grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); grid-template-areas: "figure intro" "figure parts"; gap: 16px 28px; align-items: center; max-width: none; width: 100%; margin-inline: 0; padding: 22px; border: 1px solid #e8dbcb; border-radius: 16px; background: #fff; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy .section-head { grid-area: intro; margin: 0; text-align: left; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy .section-head .eyebrow { margin-bottom: 7px; font-size: 11px; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy .section-head h2 { margin-bottom: 10px; font-size: clamp(26px, 2.5vw, 32px); line-height: 1.15; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy .section-head p:not(.eyebrow) { margin-bottom: 0; font-size: 14px; line-height: 1.5; }
.rbc-part1-anatomy__figure { grid-area: figure; margin: 0; min-width: 0; max-width: 500px; width: 100%; justify-self: center; }
body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy__figure img { display: block; width: 100%; height: auto; max-height: none; aspect-ratio: 3 / 2; object-fit: contain; padding: 0; filter: none; border-radius: 16px; }
.rbc-part1-anatomy__figure figcaption { margin-top: 4px; color: #655d54; font-size: 12px; line-height: 1.5; }
.rbc-part1-anatomy__figure figcaption a { display: inline-flex; align-items: center; min-height: 44px; margin-left: 8px; color: #74161b; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.rbc-part1-anatomy__figure figcaption a:focus-visible { outline: 2px solid #74161b; outline-offset: 4px; }
.rbc-part1-anatomy__parts { grid-area: parts; display: grid; gap: 8px; min-width: 0; margin: 0; }
.rbc-part1-anatomy__parts > div { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 10px; }
.rbc-part1-anatomy__parts dt { color: #74161b; font-size: 14px; font-weight: 700; line-height: 1.5; }
.rbc-part1-anatomy__parts dd { margin: 0; color: #514b45; font-size: 14px; line-height: 1.5; }
@media (max-width: 760px) {
  body.rbc-seo-pudelka-magnetyczne .rbc-part1-anatomy { padding-block: 20px; }
  .rbc-part1-anatomy__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "figure" "parts"; gap: 16px; padding: 16px; }
  .rbc-part1-anatomy__figure { max-width: 320px; }
  .rbc-part1-anatomy__parts > div { grid-template-columns: 110px minmax(0, 1fr); }
}

/* #25: Approved stronger ivory background; catalogue dimensions stay unchanged. */
.rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-explorer-controls { background: #f0e3d1; border-color: #d7c2a8; }
@media (max-width: 680px) {
  .rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-dimension-bubbles { flex-wrap: wrap; overflow-x: visible; margin-inline: 0; padding: 0; gap: 8px; }
  .rbc-product-explorer[data-category="pudelka-magnetyczne"] .rbc-dimension-bubbles > button { max-width: 100%; min-height: 44px; padding: 9px 12px; font-size: 14px; }
}

/* Wooden jewellery boxes: one equal, uncropped 4:3 studio frame. */
.rbc-product-explorer[data-category="drewniane-pudelka-na-bizuterie"] .rbc-product-media {
  aspect-ratio: 4 / 3;
  background: #f9f3eb;
}
.rbc-product-explorer[data-category="drewniane-pudelka-na-bizuterie"] .rbc-product-media img,
.rbc-product-explorer[data-category="drewniane-pudelka-na-bizuterie"] .rbc-product-card:hover .rbc-product-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: none;
}
