.mono-promotions-page {
  --promotions-graphite: #58595b;
  --promotions-yellow: #ffdd00;
  --promotions-light: #c7c8ca;
  --promotions-text: #26272a;
  background: #fff;
  color: var(--promotions-graphite);
}

.mono-promotions-page .site-header.mono-header {
  position: relative;
  inset: auto;
  background: var(--promotions-graphite);
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.mono-promotions-page .header-row {
  min-height: 104px;
}

.promotions-story {
  padding: 26px 0 34px;
  background: #fff;
}

.promotions-story-grid {
  display: grid;
  grid-template-columns: minmax(0, .96fr) minmax(340px, 1.04fr);
  gap: clamp(34px, 6vw, 82px);
  align-items: center;
}

.promotions-story-copy {
  max-width: 650px;
}

.promotions-story-copy h1,
.promotions-heading h2 {
  margin: 0;
  color: var(--promotions-text);
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-weight: 500;
  line-height: 1.16;
  letter-spacing: -.035em;
}

.promotions-story-copy h1 {
  font-size: clamp(1.9rem, 3.1vw, 3.15rem);
}

.promotions-story-copy > p:not(.mono-section-label) {
  margin: 15px 0 0;
  color: var(--promotions-graphite);
  font-size: .94rem;
  line-height: 1.78;
}

.promotions-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 24px;
  padding: 0 22px;
  border: 1px solid var(--promotions-yellow);
  border-radius: 999px;
  background: var(--promotions-yellow);
  color: #202124;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .22s ease, box-shadow .22s ease;
}

.promotions-download:hover,
.promotions-download:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 14px 26px rgba(88,89,91,.16);
}

.promotions-story-art {
  min-height: 330px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 26px;
  overflow: hidden;
  border-radius: 30px;
  background: var(--promotions-graphite);
}

.promotions-story-art img {
  display: block;
  width: min(96%, 660px);
  max-height: 285px;
  object-fit: contain;
}

.promotions-gallery-section {
  padding: 56px 0 88px;
  background: rgba(199,200,202,.16);
  border-top: 1px solid rgba(88,89,91,.08);
}

.promotions-heading {
  margin-bottom: 30px;
}

.promotions-heading h2 {
  font-size: clamp(1.55rem, 2.6vw, 2.45rem);
}

.promotions-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.promotions-card {
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid rgba(199,200,202,.58);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(88,89,91,.04);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.promotions-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .36s ease;
}

.promotions-card:hover,
.promotions-card:focus-visible {
  transform: translateY(-7px);
  border-color: var(--promotions-light);
  box-shadow: 0 20px 38px rgba(88,89,91,.13);
}

.promotions-card:hover img,
.promotions-card:focus-visible img {
  transform: scale(1.025);
}

@media (max-width: 1040px) {
  .promotions-story-grid {
    grid-template-columns: 1fr;
  }
  .promotions-story-art {
    min-height: 270px;
  }
  .promotions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .mono-promotions-page .header-row {
    min-height: 96px;
  }
  .promotions-story {
    padding: 34px 0 28px;
  }
  .promotions-story-copy h1 {
    font-size: clamp(1.55rem, 7vw, 2.2rem);
  }
  .promotions-story-copy > p:not(.mono-section-label) {
    font-size: .91rem;
    line-height: 1.7;
  }
  .promotions-story-art {
    min-height: 210px;
    padding: 18px;
    border-radius: 24px;
  }
  .promotions-story-art img {
    width: min(95%, 460px);
    max-height: 180px;
  }
  .promotions-gallery-section {
    padding: 42px 0 64px;
  }
  .promotions-heading h2 {
    font-size: clamp(1.35rem, 6vw, 1.8rem);
  }
  .promotions-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .promotions-card {
    border-radius: 24px;
  }
}


/* Dynamiczne galerie Promocje i Nowości. */
.promotions-gallery-section {
  padding: 48px 0 64px;
}
.promotions-news-section {
  padding-top: 54px;
  background: #fff;
  border-top: 0;
}
.promotions-grid.promotions-grid-compact {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}
.promotions-grid-compact .promotions-card {
  aspect-ratio: 1 / 1;
  border-radius: 22px;
}
.promotions-grid-compact .promotions-card img {
  object-fit: contain;
  padding: 6px;
  background: #fff;
}
.promotions-empty {
  margin: 0;
  padding: 24px;
  border-radius: 22px;
  background: rgba(199,200,202,.18);
  color: var(--promotions-graphite);
  font-size: .9rem;
}
@media (max-width: 1180px) {
  .promotions-grid.promotions-grid-compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  .promotions-grid.promotions-grid-compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .promotions-gallery-section,
  .promotions-news-section {
    padding: 38px 0 52px;
  }
  .promotions-grid.promotions-grid-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .promotions-grid-compact .promotions-card {
    border-radius: 18px;
  }
}


/* Korekta 2026-07-12: większe grafiki — cztery w rzędzie. */
.promotions-grid.promotions-grid-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
@media (max-width: 900px) {
  .promotions-grid.promotions-grid-compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .promotions-grid.promotions-grid-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Dwa stałe kafelki uzupełniają 18 zmiennych promocji do równego układu 5 × 4. */
.promotions-static-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(18px, 2.2vw, 28px);
  text-decoration: none;
  isolation: isolate;
}

.promotions-static-card::after {
  content: "";
  position: absolute;
  right: -18%;
  bottom: -25%;
  width: 72%;
  aspect-ratio: 1;
  border: 1px solid currentColor;
  border-radius: 50%;
  opacity: .12;
  z-index: -1;
}

.promotions-static-symbol {
  align-self: flex-end;
  font-size: clamp(3.5rem, 6vw, 6.2rem);
  font-weight: 300;
  line-height: .8;
  letter-spacing: -.08em;
}

.promotions-static-copy {
  display: grid;
  gap: 8px;
}

.promotions-static-copy small {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.promotions-static-copy strong {
  max-width: 220px;
  font-size: clamp(1rem, 1.7vw, 1.35rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.025em;
}

.promotions-static-copy > span {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.promotions-static-card-yellow {
  border-color: #ffdd00;
  background: #ffdd00;
  color: #202124;
}

.promotions-static-card-dark {
  border-color: #202124;
  background: #202124;
  color: #fff;
}

.promotions-static-card:hover,
.promotions-static-card:focus-visible {
  border-color: currentColor;
}

/* Nowa szeroka grafika promocyjna. */
.promotions-story-art img {
  width: min(100%, 720px);
  max-height: 300px;
}


/* Korekta 2026-07-17: grafika górna bez dodatkowej ramki, z zaokrąglonymi rogami. */
.promotions-story-art { min-height: 0 !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.promotions-story-art img { display: block; width: 100% !important; max-width: 100% !important; height: auto; max-height: none !important; border-radius: 28px; object-fit: cover; }
@media (max-width: 760px) { .promotions-story-art img { border-radius: 24px; } }

/* Korekta 2026-07-17: stały kafelek Rabaty w kolorze grafitowym. */
.promotions-static-card-dark { border-color: #58595b; background: #58595b; color: #fff; }


/* Korekta 2026-07-17: kwadratowe kafelki, bez otwierania grafik i bez animacji. */
.mono-promotions-page .promotions-grid .promotions-card,
.mono-promotions-page .promotions-grid-compact .promotions-card,
.mono-promotions-page .promotions-static-card,
.mono-promotions-page .promotions-image-card {
  border-radius: 0 !important;
}

.mono-promotions-page .promotions-image-card {
  cursor: default;
}

.mono-promotions-page .promotions-card,
.mono-promotions-page .promotions-card:hover,
.mono-promotions-page .promotions-card:focus-visible {
  transform: none !important;
  box-shadow: 0 10px 24px rgba(88,89,91,.04);
}

.mono-promotions-page .promotions-card img,
.mono-promotions-page .promotions-card:hover img,
.mono-promotions-page .promotions-card:focus-visible img {
  transform: none !important;
}

/* Spójność typografii z podstroną „Materiały budowlane”. */
.mono-promotions-page .header-row { min-height:96px; }
.mono-promotions-page main,
.mono-promotions-page main button,
.mono-promotions-page main input,
.mono-promotions-page main textarea,
.mono-promotions-page main select {
  font-family:"Open Sans", Arial, sans-serif;
}
.mono-promotions-page .mono-section-label {
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 15px;
  color:var(--promotions-graphite);
  font-family:"Open Sans", Arial, sans-serif;
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.15em;
  line-height:1.25;
  text-transform:uppercase;
}
.mono-promotions-page .mono-section-label::before {
  content:"";
  width:28px;
  height:3px;
  flex:0 0 auto;
  background:var(--promotions-yellow);
}
.promotions-story-copy h1 {
  font-size:clamp(2.55rem, 4.35vw, 4.5rem);
  font-weight:400;
  line-height:1.02;
  letter-spacing:-.055em;
}
.promotions-story-copy > p:not(.mono-section-label) {
  max-width:620px;
  margin-top:22px;
  font-size:.97rem;
  line-height:1.72;
}
.promotions-heading h2 {
  font-size:clamp(2rem, 3.2vw, 3.15rem);
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.045em;
}
@media (max-width:760px) {
  .mono-promotions-page .header-row { min-height:96px; }
  .promotions-story-copy h1 { font-size:clamp(2.15rem, 10.8vw, 3rem); line-height:1.05; }
  .promotions-story-copy > p:not(.mono-section-label) { margin-top:18px; font-size:.95rem; line-height:1.67; }
  .promotions-heading h2 { font-size:clamp(1.65rem, 8.2vw, 2.2rem); }
}