/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 10 2026 | 09:13:04 */
/* ============================================================
   MAL-BET — style strony (Kadence)
   Wklej do: Wygląd > Dostosuj > Dodatkowe CSS
   albo do pliku style.css motywu potomnego.
   Wszystkie klasy mają prefiks .mb- i są scope'owane w .mb-page,
   więc nie kolidują ze stylami Kadence.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Barlow:wght@400;500;600&display=swap');

/* ---------- tokeny ---------- */
.mb-page {
  --mb-amber: #F6B60C;
  --mb-amber-dark: #D89C05;
  --mb-graphite: #31373F;
  --mb-graphite-deep: #23282E;
  --mb-steel: #8A9199;
  --mb-concrete: #F2F3F4;
  --mb-line: #DDE0E3;
  --mb-white: #FFFFFF;

  --mb-display: 'Barlow Condensed', 'Oswald', 'Arial Narrow', sans-serif;
  --mb-body: 'Barlow', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;

  --mb-gap: clamp(48px, 7vw, 104px);
  --mb-radius: 3px;

  font-family: var(--mb-body);
  color: var(--mb-graphite);
  font-size: 17px;
  line-height: 1.62;

  /* wyjście poza kontener Kadence — pełna szerokość */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  overflow-x: clip;
}

.mb-page *,
.mb-page *::before,
.mb-page *::after { box-sizing: border-box; }

.mb-page img { max-width: 100%; height: auto; display: block; }

.mb-page :focus-visible {
  outline: 3px solid var(--mb-amber);
  outline-offset: 3px;
}

/* ---------- siatka ---------- */
.mb-page .mb-wrap {
  width: min(1180px, 100% - 40px);
  margin-inline: auto;
}
.mb-page .mb-wrap--narrow { width: min(780px, 100% - 40px); }

.mb-page .mb-section { padding-block: var(--mb-gap); background: var(--mb-white); }
.mb-page .mb-section--muted { background: var(--mb-concrete); }
.mb-page .mb-section--dark {
  background: var(--mb-graphite);
  color: #E7E9EB;
}

/* ---------- typografia ---------- */
.mb-page .mb-h2 {
  font-family: var(--mb-display);
  font-weight: 700;
  font-size: clamp(30px, 4.4vw, 50px);
  line-height: 1.04;
  letter-spacing: -0.01em;
  margin: 0 0 14px;
  color: var(--mb-graphite);
}
.mb-page .mb-h2--light { color: var(--mb-white); }

.mb-page .mb-head { max-width: 62ch; margin-bottom: clamp(28px, 4vw, 46px); }
.mb-page .mb-head__note { margin: 0; color: var(--mb-steel); font-size: 17px; }

.mb-page a { color: inherit; }
.mb-page .mb-section a:not(.mb-btn):not(.mb-spec__link) {
  color: var(--mb-graphite);
  text-decoration-color: var(--mb-amber);
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}
.mb-page .mb-section--dark a:not(.mb-btn) { color: var(--mb-white); }

/* ---------- przyciski ---------- */
.mb-page .mb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 15px 30px;
  font-family: var(--mb-display);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1;
  border: 2px solid transparent;
  border-radius: var(--mb-radius);
  text-decoration: none;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.mb-page .mb-btn--primary {
  background: var(--mb-amber);
  color: var(--mb-graphite-deep);
  border-color: var(--mb-amber);
}
.mb-page .mb-btn--primary:hover { background: var(--mb-amber-dark); border-color: var(--mb-amber-dark); }
.mb-page .mb-btn--ghost {
  background: transparent;
  color: var(--mb-white);
  border-color: rgba(255,255,255,.55);
}
.mb-page .mb-btn--ghost:hover { border-color: var(--mb-white); background: rgba(255,255,255,.1); }
.mb-page .mb-btn--full { width: 100%; }

/* ============================================================
   HERO
   ============================================================ */
.mb-page .mb-hero {
  --mb-hero-dim: .35;
  position: relative;
  min-height: min(92vh, 900px);
  display: flex;
  align-items: flex-end;
  padding: 120px 0 clamp(70px, 11vh, 140px);
  overflow: hidden;
  background: var(--mb-graphite-deep);
  isolation: isolate;
}

.mb-page .mb-hero__bg {
  position: absolute;
  inset: -12% 0 -12% 0;
  z-index: -2;
  will-change: transform;
}
.mb-page .mb-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
}
.mb-page .mb-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(35,40,46,.55) 0%, rgba(35,40,46,0) 45%),
    linear-gradient(0deg, rgba(35,40,46,.94) 8%, rgba(35,40,46,var(--mb-hero-dim)) 70%);
}

.mb-page .mb-hero__inner {
  width: min(1180px, 100% - 40px);
  margin-inline: auto;
  max-width: 1180px;
  will-change: transform, opacity;
}

.mb-page .mb-hero__kicker {
  display: inline-block;
  margin: 0 0 22px;
  padding: 7px 14px 6px;
  background: var(--mb-amber);
  color: var(--mb-graphite-deep);
  font-family: var(--mb-display);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .04em;
  border-radius: 2px;
}

.mb-page .mb-hero__title {
  margin: 0 0 20px;
  font-family: var(--mb-display);
  font-weight: 700;
  font-size: clamp(44px, 8.2vw, 108px);
  line-height: .93;
  letter-spacing: -0.015em;
  color: var(--mb-white);
  text-wrap: balance;
}

.mb-page .mb-hero__lead {
  max-width: 54ch;
  margin: 0 0 34px;
  font-size: clamp(17px, 1.6vw, 20px);
  color: #D8DBDE;
}

.mb-page .mb-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.mb-page .mb-hero__scroll {
  position: absolute;
  right: max(20px, calc(50vw - 590px));
  bottom: 34px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(255,255,255,.75);
  font-family: var(--mb-display);
  font-size: 15px;
  letter-spacing: .06em;
  text-decoration: none;
}
.mb-page .mb-hero__scroll-line {
  width: 60px;
  height: 2px;
  background: rgba(255,255,255,.3);
  position: relative;
  overflow: hidden;
}
.mb-page .mb-hero__scroll-line::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--mb-amber);
  transform: translateX(-100%);
  animation: mb-sweep 2.6s cubic-bezier(.5,0,.3,1) infinite;
}
@keyframes mb-sweep {
  0%   { transform: translateX(-100%); }
  55%  { transform: translateX(0); }
  100% { transform: translateX(100%); }
}
.mb-page .mb-hero__scroll:hover { color: var(--mb-white); }

/* ============================================================
   PASEK FAKTÓW
   ============================================================ */
.mb-page .mb-facts {
  background: var(--mb-graphite-deep);
  border-top: 4px solid var(--mb-amber);
  padding-block: clamp(28px, 4vw, 44px);
}
.mb-page .mb-facts__grid {
  width: min(1180px, 100% - 40px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,.12);
}
.mb-page .mb-fact {
  background: var(--mb-graphite-deep);
  padding: 14px clamp(14px, 2vw, 28px);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mb-page .mb-fact__value {
  font-family: var(--mb-display);
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 700;
  line-height: 1;
  color: var(--mb-amber);
}
.mb-page .mb-fact__label { color: #A7ADB3; font-size: 15px; line-height: 1.35; }

/* ============================================================
   TABELA POJEMNOŚCI
   ============================================================ */
/* zakładki kategorii */
.mb-page .mb-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 26px;
  border-bottom: 2px solid var(--mb-line);
}
.mb-page .mb-tab {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 12px 18px;
  margin-bottom: -2px;
  font-family: var(--mb-display);
  font-size: 19px;
  font-weight: 600;
  color: var(--mb-steel);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}
.mb-page .mb-tab:hover { color: var(--mb-graphite); }
.mb-page .mb-tab.is-active {
  color: var(--mb-graphite);
  border-bottom-color: var(--mb-amber);
}

/* bez JS pokazujemy wszystkie panele */
.mb-page .mb-panel[hidden] { display: block; }
.mb-page.mb-js-tabs .mb-panel[hidden] { display: none; }

.mb-page .mb-panel + .mb-panel { margin-top: 40px; }
.mb-page.mb-js-tabs .mb-panel + .mb-panel { margin-top: 0; }

.mb-page .mb-panel__intro {
  max-width: 68ch;
  margin: 0 0 22px;
  color: #5D646C;
}

/* tabela */
.mb-page .mb-spec { border-top: 2px solid var(--mb-graphite); }

.mb-page .mb-spec__row {
  display: grid;
  grid-template-columns: minmax(0, 150px) minmax(0, 130px) minmax(0, 1fr) 150px;
  align-items: center;
  gap: 18px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--mb-line);
  transition: background-color .16s ease;
}
.mb-page .mb-spec__cap em {
  display: block;
  font-family: var(--mb-body);
  font-style: normal;
  font-size: 13px;
  font-weight: 500;
  color: var(--mb-steel);
  line-height: 1.2;
}
.mb-page .mb-spec__tag {
  display: inline-block;
  margin-left: 10px;
  padding: 3px 9px;
  background: var(--mb-amber);
  color: var(--mb-graphite-deep);
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  border-radius: 2px;
  vertical-align: 2px;
}
.mb-page .mb-spec__row--head {
  padding-block: 11px;
  background: var(--mb-graphite);
  color: var(--mb-white);
  font-family: var(--mb-display);
  font-size: 16px;
  letter-spacing: .05em;
  border-bottom: none;
}
.mb-page .mb-spec__row:not(.mb-spec__row--head):hover { background: var(--mb-concrete); }

.mb-page .mb-spec__cap {
  font-family: var(--mb-display);
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
}
.mb-page .mb-spec__row--flag {
  background: #FEF7E3;
  box-shadow: inset 4px 0 0 var(--mb-amber);
}
.mb-page .mb-spec__row--flag:hover { background: #FDF1D2; }

.mb-page .mb-spec__link {
  display: inline-block;
  padding: 9px 16px;
  background: var(--mb-graphite);
  color: var(--mb-white) !important;
  font-family: var(--mb-display);
  font-size: 17px;
  text-decoration: none !important;
  border-radius: var(--mb-radius);
}
.mb-page .mb-spec__link:hover { background: var(--mb-amber); color: var(--mb-graphite-deep) !important; }

.mb-page .mb-spec__foot { margin-top: 22px; color: var(--mb-steel); }

/* ============================================================
   KONSTRUKCJA
   ============================================================ */
.mb-page .mb-build {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.mb-page .mb-build__lead { font-size: 19px; color: #C9CDD1; max-width: 46ch; }

.mb-page .mb-build__list { list-style: none; margin: 30px 0 0; padding: 0; }
.mb-page .mb-build__list li {
  padding: 16px 0 16px 20px;
  border-left: 2px solid rgba(246,182,12,.35);
  color: #B9BEC3;
  font-size: 16px;
}
.mb-page .mb-build__list li + li { margin-top: 4px; }
.mb-page .mb-build__list strong {
  display: block;
  font-family: var(--mb-display);
  font-weight: 600;
  font-size: 22px;
  color: var(--mb-white);
  margin-bottom: 3px;
}

.mb-page .mb-build__figure { margin: 0; }
.mb-page .mb-build__figure figcaption {
  margin-top: 12px;
  font-size: 14px;
  color: var(--mb-steel);
}

.mb-page .mb-cross { width: 100%; height: auto; }
.mb-page .mb-cross__soil { fill: #2A2F36; }
.mb-page .mb-cross__ground { stroke: #4A515A; stroke-width: 2; }
.mb-page .mb-cross__tank { fill: #8A9199; }
.mb-page .mb-cross__void { fill: #23282E; }
.mb-page .mb-cross__liquid { fill: rgba(246,182,12,.16); }
.mb-page .mb-cross__rebar { stroke: var(--mb-amber); stroke-width: 1.5; stroke-dasharray: 5 5; opacity: .8; }
.mb-page .mb-cross__hatch { fill: #6E757D; }
.mb-page .mb-cross__lid { fill: var(--mb-amber); }
.mb-page .mb-cross__pipe { stroke: #8A9199; stroke-width: 9; fill: none; }
.mb-page .mb-cross__label {
  fill: #9AA1A8;
  font-family: var(--mb-body);
  font-size: 13px;
}

/* ============================================================
   KROKI MONTAŻU
   ============================================================ */
.mb-page .mb-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--mb-line);
  border-top: 2px solid var(--mb-graphite);
}
.mb-page .mb-step {
  background: var(--mb-white);
  padding: 26px 24px 30px;
}
.mb-page .mb-step__no {
  display: block;
  font-family: var(--mb-display);
  font-size: 46px;
  font-weight: 700;
  line-height: 1;
  color: var(--mb-amber);
  margin-bottom: 10px;
}
.mb-page .mb-step__title {
  font-family: var(--mb-display);
  font-size: 24px;
  font-weight: 600;
  margin: 0 0 8px;
  color: var(--mb-graphite);
}
.mb-page .mb-step p { margin: 0; font-size: 16px; color: #5D646C; }

/* ============================================================
   GALERIA
   ============================================================ */
.mb-page .mb-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.mb-page .mb-gallery__item { margin: 0; position: relative; }
.mb-page .mb-gallery__item--wide { grid-column: span 2; }
.mb-page .mb-gallery__item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--mb-radius);
  background: #E3E5E7;
}
.mb-page .mb-gallery__item figcaption {
  margin-top: 8px;
  font-size: 14px;
  color: var(--mb-steel);
}

/* ============================================================
   ZASIĘG
   ============================================================ */
.mb-page .mb-reach {
  display: grid;
  grid-template-columns: 1.4fr .9fr;
  gap: clamp(30px, 5vw, 70px);
  align-items: center;
}
.mb-page .mb-reach__list {
  list-style: none;
  margin: 22px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mb-page .mb-reach__list li {
  padding: 7px 14px;
  border: 1px solid var(--mb-line);
  border-radius: 100px;
  font-size: 15px;
  color: #5D646C;
}
.mb-page .mb-reach__card {
  background: var(--mb-graphite);
  color: var(--mb-white);
  padding: 32px 28px;
  border-radius: var(--mb-radius);
  border-top: 4px solid var(--mb-amber);
}
.mb-page .mb-reach__label { margin: 0; color: #A7ADB3; font-size: 15px; }
.mb-page .mb-reach__price {
  margin: 4px 0 2px;
  font-family: var(--mb-display);
  font-size: 34px;
  font-weight: 700;
  line-height: 1.05;
  color: var(--mb-amber);
}
.mb-page .mb-reach__note { margin: 0 0 22px; color: #A7ADB3; font-size: 15px; }

/* ============================================================
   FAQ
   ============================================================ */
.mb-page .mb-faq { margin-top: 30px; border-top: 1px solid var(--mb-line); }
.mb-page .mb-faq__item { border-bottom: 1px solid var(--mb-line); }
.mb-page .mb-faq__item summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 44px 20px 0;
  position: relative;
  font-family: var(--mb-display);
  font-size: clamp(20px, 2.2vw, 25px);
  font-weight: 600;
  color: var(--mb-graphite);
}
.mb-page .mb-faq__item summary::-webkit-details-marker { display: none; }
.mb-page .mb-faq__item summary::after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  width: 15px;
  height: 2px;
  background: var(--mb-graphite);
  transition: transform .2s ease;
}
.mb-page .mb-faq__item summary::before {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  width: 15px;
  height: 2px;
  background: var(--mb-amber);
  transform: rotate(90deg);
  transition: transform .2s ease, opacity .2s ease;
}
.mb-page .mb-faq__item[open] summary::before { transform: rotate(0deg); opacity: 0; }
.mb-page .mb-faq__item p {
  margin: -4px 0 22px;
  max-width: 68ch;
  color: #5D646C;
}

/* ============================================================
   KONTAKT / FORMULARZ
   ============================================================ */
.mb-page .mb-contact {
  display: grid;
  grid-template-columns: 1fr 460px;
  gap: clamp(32px, 5vw, 70px);
  align-items: start;
}
.mb-page .mb-contact__lead { font-size: 19px; color: #C9CDD1; max-width: 46ch; }

.mb-page .mb-contact__data {
  margin: 34px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 30px;
}
.mb-page .mb-contact__data dt {
  font-family: var(--mb-display);
  font-size: 15px;
  letter-spacing: .06em;
  color: var(--mb-amber);
  margin-bottom: 3px;
}
.mb-page .mb-contact__data dd { margin: 0; color: #DDE0E3; }

.mb-page .mb-contact__legal {
  margin: 28px 0 0;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.14);
  font-size: 14px;
  color: #969CA2;
}

/* --- kontener + siatka --- */
.mb-page .mb-form {
  background: var(--mb-white);
  padding: clamp(24px, 3vw, 34px);
  border-radius: var(--mb-radius);
  text-align: left;
}
.mb-page .mb-form .wpcf7 { margin: 0; }
.mb-page .mb-form .wpcf7-form { margin: 0; }

/* siatka siedzi na własnym wrapperze .mb-form__grid — CF7 nie ma jak go rozbić.
   Fallback: gdy ktoś wklei szablon bez wrappera, siatkę bierze sam formularz. */
.mb-page .mb-form .mb-form__grid,
.mb-page form.mb-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

/* gdyby autop mimo wszystko wstawił <p> — czynimy je przezroczystymi dla siatki */
.mb-page .mb-form .mb-form__grid > p:not(.mb-form__title) { display: contents; }
.mb-page .mb-form .mb-form__grid > br,
.mb-page .mb-form .mb-form__grid p > br { display: none; }
.mb-page .mb-form .wpcf7-form > p:empty { display: none; }
.mb-page .mb-form__title {
  grid-column: 1 / -1;
  margin: 0;
  font-family: var(--mb-display);
  font-size: 27px;
  font-weight: 700;
  color: var(--mb-graphite);
}
.mb-page .mb-field {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 0;
  text-align: left;
}
.mb-page .mb-field--full { grid-column: 1 / -1; }
.mb-page .mb-field > label:first-child,
.mb-page .mb-field > span:first-child {
  display: block;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #5D646C;
  cursor: pointer;
}
.mb-page .mb-hp { display: none; }
/* CF7 owija każdą kontrolkę w <span class="wpcf7-form-control-wrap"> */
.mb-page .mb-form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* CF7 wstawia inputom atrybut size="40" — dlatego bez tego pola są wąskie */
.mb-page .mb-form input:not([type="checkbox"]):not([type="submit"]),
.mb-page .mb-form select,
.mb-page .mb-form textarea {
  width: 100% !important;
  max-width: 100% !important;
  display: block;
  padding: 12px 14px;
  font-family: var(--mb-body);
  font-size: 16px;
  color: var(--mb-graphite);
  background: var(--mb-concrete);
  border: 1px solid var(--mb-line);
  border-radius: var(--mb-radius);
  transition: border-color .15s ease, background-color .15s ease;
}
.mb-page .mb-form input:focus,
.mb-page .mb-form select:focus,
.mb-page .mb-form textarea:focus {
  background: var(--mb-white);
  border-color: var(--mb-graphite);
}
.mb-page .mb-form textarea { resize: vertical; }

/* zgoda / acceptance */
.mb-page .mb-check {
  grid-column: 1 / -1;
  font-size: 14px;
  line-height: 1.45;
  color: #5D646C;
}
.mb-page .mb-check .wpcf7-list-item { margin: 0; display: flex; gap: 10px; align-items: flex-start; }
.mb-page .mb-check input[type="checkbox"] {
  width: 18px !important;
  height: 18px;
  max-width: 18px !important;
  margin: 2px 0 0;
  padding: 0;
  flex: 0 0 auto;
  accent-color: var(--mb-amber);
}
.mb-page .mb-check label { display: flex; gap: 10px; align-items: flex-start; margin: 0; }

/* przycisk wyślij */
.mb-page .mb-form__submit { grid-column: 1 / -1; position: relative; }
.mb-page .mb-form .mb-btn,
.mb-page .mb-form input.wpcf7-submit {
  grid-column: 1 / -1;
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  background: var(--mb-amber);
  color: var(--mb-graphite-deep);
  border: 2px solid var(--mb-amber);
  border-radius: var(--mb-radius);
  padding: 15px 30px;
  font-family: var(--mb-display);
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
}
.mb-page .mb-form input.wpcf7-submit:hover {
  background: var(--mb-amber-dark);
  border-color: var(--mb-amber-dark);
}

/* --- komunikaty i walidacja CF7 --- */
.mb-page .mb-form .wpcf7-not-valid-tip {
  margin-top: 5px;
  font-size: 13px;
  color: #C0392B;
}
.mb-page .mb-form .wpcf7-not-valid {
  border-color: #C0392B !important;
  background: #FDF3F2 !important;
}
.mb-page .mb-form .wpcf7-response-output {
  grid-column: 1 / -1;
  margin: 0;
  padding: 13px 16px;
  border: 0;
  border-left: 4px solid var(--mb-steel);
  background: var(--mb-concrete);
  font-size: 15px;
  border-radius: 2px;
}
.mb-page .mb-form .wpcf7 form.sent .wpcf7-response-output {
  border-left-color: #2E7D32;
  background: #EDF6EE;
  color: #1E5620;
}
.mb-page .mb-form .wpcf7 form.invalid .wpcf7-response-output,
.mb-page .mb-form .wpcf7 form.failed .wpcf7-response-output,
.mb-page .mb-form .wpcf7 form.spam .wpcf7-response-output {
  border-left-color: #C0392B;
  background: #FDF3F2;
  color: #8E2A1F;
}
.mb-page .mb-form .wpcf7-spinner {
  position: absolute;
  right: 16px;
  top: 50%;
  margin: -12px 0 0;
}
.mb-page .mb-form .wpcf7-honeypot-container { display: none !important; }

/* ============================================================
   PASEK TELEFONU (mobile)
   ============================================================ */
.mb-page .mb-callbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  display: none;
  transform: translateY(100%);
  transition: transform .25s ease;
}
.mb-page .mb-callbar.is-visible { transform: translateY(0); }
.mb-page .mb-callbar a {
  display: block;
  padding: 15px;
  text-align: center;
  background: var(--mb-amber);
  color: var(--mb-graphite-deep) !important;
  font-family: var(--mb-display);
  font-size: 21px;
  font-weight: 700;
  text-decoration: none !important;
}

/* ============================================================
   ANIMACJE WEJŚCIA
   ============================================================ */
.mb-page .mb-anim {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .45s ease, transform .45s ease;
}
.mb-page .mb-anim.is-in { opacity: 1; transform: none; }

/* ============================================================
   RESPONSYWNOŚĆ
   ============================================================ */
@media (max-width: 1024px) {
  .mb-page .mb-build,
  .mb-page .mb-reach,
  .mb-page .mb-contact { grid-template-columns: 1fr; }
  .mb-page .mb-contact { grid-template-columns: 1fr; }
  .mb-page .mb-steps { grid-template-columns: repeat(2, 1fr); }
  .mb-page .mb-gallery { grid-template-columns: repeat(2, 1fr); }
  .mb-page .mb-gallery__item--wide { grid-column: span 2; }
  .mb-page .mb-build__figure { order: -1; }
}

@media (max-width: 860px) {
  .mb-page .mb-facts__grid { grid-template-columns: repeat(2, 1fr); }

  .mb-page .mb-spec__row {
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 2px 16px;
    padding: 16px;
  }
  .mb-page .mb-spec__row--head { display: none; }
  .mb-page .mb-spec__cap { grid-row: span 2; align-self: start; font-size: 28px; }
  .mb-page .mb-spec__row > span:nth-child(2) { font-weight: 500; }
  .mb-page .mb-spec__row > span:nth-child(3) { font-size: 15px; color: #5D646C; }
  .mb-page .mb-spec__row > span:nth-child(4) { grid-column: 1 / -1; margin-top: 12px; }
  .mb-page .mb-spec__link { display: block; text-align: center; }
  .mb-page .mb-spec__tag { margin-left: 0; }

  .mb-page .mb-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .mb-page .mb-tabs::-webkit-scrollbar { display: none; }
  .mb-page .mb-tab { flex: 0 0 auto; font-size: 17px; padding: 11px 14px; }
}

@media (max-width: 640px) {
  .mb-page { font-size: 16px; }
  .mb-page .mb-hero {
    min-height: auto;
    padding: 96px 0 64px;
  }
  .mb-page .mb-hero__scroll { display: none; }
  .mb-page .mb-hero__actions .mb-btn { flex: 1 1 100%; }
  .mb-page .mb-steps { grid-template-columns: 1fr; }
  .mb-page .mb-gallery { grid-template-columns: 1fr; }
  .mb-page .mb-gallery__item--wide { grid-column: span 1; }
  .mb-page .mb-form .mb-form__grid,
  .mb-page form.mb-form { grid-template-columns: 1fr; }
  .mb-page .mb-contact__data { grid-template-columns: 1fr; }
  .mb-page .mb-callbar { display: block; }
  .mb-page .mb-section { padding-bottom: calc(var(--mb-gap) + 10px); }
}

/* ---------- ograniczony ruch ---------- */
@media (prefers-reduced-motion: reduce) {
  .mb-page * { animation: none !important; transition: none !important; }
  .mb-page .mb-anim { opacity: 1; transform: none; }
  .mb-page .mb-hero__bg { transform: none !important; }
}

/* ============================================================
   PODSTRONA "O NAS / PRODUCENT SZAMB BETONOWYCH"
   ============================================================ */

/* --- hero podstrony --- */
.mb-page .mb-subhero {
  background: var(--mb-graphite-deep);
  color: var(--mb-white);
  padding: clamp(48px, 7vw, 92px) 0 clamp(44px, 6vw, 76px);
  border-bottom: 4px solid var(--mb-amber);
}
.mb-page .mb-crumbs {
  display: flex;
  gap: 8px;
  margin-bottom: 22px;
  font-size: 14px;
  color: #8A9199;
}
.mb-page .mb-crumbs a { color: #8A9199; text-decoration: none; }
.mb-page .mb-crumbs a:hover { color: var(--mb-amber); }

.mb-page .mb-subhero__kicker {
  margin: 0 0 14px;
  font-family: var(--mb-display);
  font-size: 16px;
  letter-spacing: .05em;
  color: var(--mb-amber);
}
.mb-page .mb-subhero__title {
  margin: 0 0 18px;
  font-family: var(--mb-display);
  font-weight: 700;
  font-size: clamp(38px, 6.4vw, 78px);
  line-height: .97;
  letter-spacing: -0.015em;
  color: var(--mb-white);
  text-wrap: balance;
}
.mb-page .mb-subhero__lead {
  max-width: 62ch;
  margin: 0 0 30px;
  font-size: clamp(17px, 1.5vw, 19px);
  color: #C9CDD1;
}
.mb-page .mb-subhero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.mb-page .mb-btn--dark {
  background: transparent;
  color: var(--mb-white);
  border-color: rgba(255,255,255,.4);
}
.mb-page .mb-btn--dark:hover { background: rgba(255,255,255,.1); border-color: var(--mb-white); }

.mb-page .mb-head__note--light { color: #A7ADB3; }

/* --- kim jesteśmy --- */
.mb-page .mb-about {
  display: grid;
  grid-template-columns: 1.55fr .9fr;
  gap: clamp(32px, 5vw, 70px);
  align-items: start;
}
.mb-page .mb-about__text p { margin: 0 0 16px; max-width: 62ch; }
.mb-page .mb-about__text p:last-child { margin-bottom: 0; }

.mb-page .mb-card-data {
  background: var(--mb-concrete);
  border-top: 4px solid var(--mb-amber);
  border-radius: var(--mb-radius);
  padding: 26px 24px;
}
.mb-page .mb-card-data__title {
  margin: 0 0 16px;
  font-family: var(--mb-display);
  font-size: 22px;
  font-weight: 600;
  color: var(--mb-graphite);
}
.mb-page .mb-card-data dl { margin: 0; display: grid; gap: 14px; }
.mb-page .mb-card-data dt {
  font-size: 13px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--mb-steel);
  margin-bottom: 2px;
}
.mb-page .mb-card-data dd { margin: 0; font-size: 16px; color: var(--mb-graphite); }

/* --- proces produkcji --- */
.mb-page .mb-prod {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(255,255,255,.14);
  border-top: 2px solid var(--mb-amber);
}
.mb-page .mb-prod__step {
  background: var(--mb-graphite);
  padding: 26px 24px 30px;
}
.mb-page .mb-prod__no {
  display: block;
  font-family: var(--mb-display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--mb-amber);
  margin-bottom: 10px;
}
.mb-page .mb-prod__step h3 {
  margin: 0 0 8px;
  font-family: var(--mb-display);
  font-size: 24px;
  font-weight: 600;
  color: var(--mb-white);
}
.mb-page .mb-prod__step p { margin: 0; font-size: 16px; color: #B9BEC3; }

/* --- porównanie --- */
.mb-page .mb-compare {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.mb-page .mb-compare__col {
  border: 1px solid var(--mb-line);
  border-top: 4px solid var(--mb-steel);
  border-radius: var(--mb-radius);
  padding: 24px 22px 26px;
}
.mb-page .mb-compare__col--best {
  border-top-color: var(--mb-amber);
  background: #FEFBF2;
}
.mb-page .mb-compare__col h3 {
  margin: 0 0 16px;
  font-family: var(--mb-display);
  font-size: 23px;
  font-weight: 600;
  line-height: 1.15;
  color: var(--mb-graphite);
}
.mb-page .mb-compare ul { list-style: none; margin: 0; padding: 0; }
.mb-page .mb-compare li {
  position: relative;
  padding: 6px 0 6px 26px;
  font-size: 15px;
  line-height: 1.45;
  color: #5D646C;
}
.mb-page .mb-compare li::before {
  position: absolute;
  left: 0;
  top: 6px;
  font-weight: 700;
  font-size: 15px;
}
.mb-page .mb-compare__yes li::before { content: "+"; color: #2E7D32; }
.mb-page .mb-compare__no li::before { content: "–"; color: #C0392B; }
.mb-page .mb-compare__no { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--mb-line); }

/* --- regiony --- */
.mb-page .mb-regions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--mb-line);
  border-top: 2px solid var(--mb-graphite);
}
.mb-page .mb-region {
  background: var(--mb-concrete);
  padding: 22px 20px 26px;
}
.mb-page .mb-region h3 {
  margin: 0 0 8px;
  font-family: var(--mb-display);
  font-size: 22px;
  font-weight: 600;
  color: var(--mb-graphite);
}
.mb-page .mb-region p { margin: 0; font-size: 15px; color: #5D646C; }
.mb-page .mb-regions__note { margin: 22px 0 0; color: var(--mb-steel); max-width: 70ch; }

/* --- gwarancja --- */
.mb-page .mb-warranty {
  display: grid;
  grid-template-columns: 1.4fr .9fr;
  gap: clamp(32px, 5vw, 70px);
  align-items: start;
}
.mb-page .mb-warranty__text p { margin: 0 0 16px; max-width: 62ch; }
.mb-page .mb-warranty__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 2px solid var(--mb-graphite);
}
.mb-page .mb-warranty__list li {
  padding: 15px 0 15px 22px;
  border-bottom: 1px solid var(--mb-line);
  border-left: 3px solid var(--mb-amber);
  font-size: 15px;
  color: #5D646C;
}
.mb-page .mb-warranty__list strong {
  display: block;
  font-family: var(--mb-display);
  font-size: 19px;
  font-weight: 600;
  color: var(--mb-graphite);
}

/* --- CTA --- */
.mb-page .mb-cta {
  display: grid;
  grid-template-columns: 1.5fr .8fr;
  gap: clamp(28px, 5vw, 60px);
  align-items: center;
}
.mb-page .mb-cta__lead { margin: 0; font-size: 18px; color: #C9CDD1; max-width: 52ch; }
.mb-page .mb-cta__actions { display: grid; gap: 12px; }

/* --- responsywność podstrony --- */
@media (max-width: 1024px) {
  .mb-page .mb-prod { grid-template-columns: repeat(2, 1fr); }
  .mb-page .mb-regions { grid-template-columns: repeat(2, 1fr); }
  .mb-page .mb-about,
  .mb-page .mb-warranty,
  .mb-page .mb-cta { grid-template-columns: 1fr; }
  .mb-page .mb-compare { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .mb-page .mb-prod { grid-template-columns: 1fr; }
  .mb-page .mb-regions { grid-template-columns: 1fr; }
  .mb-page .mb-subhero__actions .mb-btn { flex: 1 1 100%; }
}

/* ============================================================
   PODSTRONA "OFERTA"
   ============================================================ */

/* --- kotwice pod hero --- */
.mb-page .mb-chips {
  list-style: none;
  margin: 30px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mb-page .mb-chips a {
  display: inline-block;
  padding: 9px 16px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 100px;
  font-family: var(--mb-display);
  font-size: 17px;
  font-weight: 500;
  color: #D8DBDE;
  text-decoration: none !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.mb-page .mb-chips a:hover {
  background: var(--mb-amber);
  border-color: var(--mb-amber);
  color: var(--mb-graphite-deep);
}

/* --- blok kategorii --- */
.mb-page .mb-offer {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: clamp(28px, 4.5vw, 64px);
  align-items: start;
}
.mb-page .mb-offer--rev .mb-offer__media { order: 2; }

.mb-page .mb-offer__media { position: sticky; top: 24px; }
.mb-page .mb-offer__media img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: var(--mb-radius);
  background: #E3E5E7;
}

.mb-page .mb-offer__eyebrow {
  margin: 0 0 8px;
  font-family: var(--mb-display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mb-amber);
}
.mb-page .mb-offer__lead {
  font-size: 19px;
  line-height: 1.55;
  color: var(--mb-graphite);
  max-width: 62ch;
  margin: 0 0 26px;
}
.mb-page .mb-offer__h3 {
  margin: 26px 0 8px;
  font-family: var(--mb-display);
  font-size: 25px;
  font-weight: 600;
  line-height: 1.15;
  color: var(--mb-graphite);
  padding-left: 16px;
  border-left: 3px solid var(--mb-amber);
}
.mb-page .mb-offer__text p { max-width: 62ch; color: #4E555C; }

/* --- plakietki pojemności --- */
.mb-page .mb-tags {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.mb-page .mb-tags li {
  padding: 6px 13px;
  background: var(--mb-graphite);
  color: var(--mb-white);
  border-radius: 2px;
  font-family: var(--mb-display);
  font-size: 16px;
  font-weight: 500;
}
.mb-page .mb-section--muted .mb-tags li { background: var(--mb-graphite); }

.mb-page .mb-offer__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}
.mb-page .mb-btn--outline {
  background: transparent;
  color: var(--mb-graphite);
  border-color: var(--mb-graphite);
}
.mb-page .mb-btn--outline:hover { background: var(--mb-graphite); color: var(--mb-white); }

/* --- responsywność --- */
@media (max-width: 1024px) {
  .mb-page .mb-offer { grid-template-columns: 1fr; }
  .mb-page .mb-offer--rev .mb-offer__media { order: 0; }
  .mb-page .mb-offer__media { position: static; }
  .mb-page .mb-offer__media img { aspect-ratio: 16 / 9; }
}

@media (max-width: 640px) {
  .mb-page .mb-offer__cta .mb-btn { flex: 1 1 100%; }
  .mb-page .mb-offer__h3 { font-size: 22px; }
}

/* ============================================================
   PODSTRONA "KONTAKT"
   ============================================================ */

.mb-page .mb-tiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--mb-line);
  border-top: 2px solid var(--mb-graphite);
}
.mb-page .mb-tile {
  background: var(--mb-white);
  padding: 22px 22px 26px;
}
.mb-page .mb-tile__label {
  margin: 0 0 6px;
  font-family: var(--mb-display);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mb-steel);
}
.mb-page .mb-tile__value {
  margin: 0 0 10px;
  font-family: var(--mb-display);
  font-size: clamp(21px, 2vw, 26px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--mb-graphite);
}
.mb-page .mb-tile__value a {
  color: var(--mb-graphite);
  text-decoration: none !important;
  border-bottom: 3px solid var(--mb-amber);
}
.mb-page .mb-tile__value a:hover { color: var(--mb-amber-dark); }
.mb-page .mb-tile__note {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: #5D646C;
}

/* --- mapa --- */
.mb-page .mb-map {
  position: relative;
  border-radius: var(--mb-radius);
  overflow: hidden;
  background: var(--mb-concrete);
  border: 1px solid var(--mb-line);
  margin-bottom: 34px;
}
.mb-page .mb-map iframe {
  display: block;
  width: 100%;
  height: clamp(320px, 42vw, 460px);
  border: 0;
}
.mb-page .mb-map__placeholder {
  margin: 0;
  height: clamp(320px, 42vw, 460px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mb-display);
  font-size: 20px;
  color: var(--mb-steel);
}

/* --- dojazd --- */
.mb-page .mb-dojazd {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--mb-line);
  border-top: 2px solid var(--mb-graphite);
}
.mb-page .mb-dojazd article {
  background: var(--mb-white);
  padding: 20px 20px 24px;
}
.mb-page .mb-dojazd h3 {
  margin: 0 0 7px;
  font-family: var(--mb-display);
  font-size: 21px;
  font-weight: 600;
  color: var(--mb-graphite);
}
.mb-page .mb-dojazd p { margin: 0; font-size: 15px; color: #5D646C; }

@media (max-width: 1024px) {
  .mb-page .mb-tiles { grid-template-columns: repeat(2, 1fr); }
  .mb-page .mb-dojazd { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .mb-page .mb-tiles { grid-template-columns: 1fr; }
}