/* Webflow page_code_base styles */
:root {
  --column-count: 12;
  --grid-main: repeat(var(--column-count), minmax(0, 1fr));
  --grid-1: repeat(1, minmax(0, 1fr));
  --grid-2: repeat(2, minmax(0, 1fr));
  --grid-3: repeat(3, minmax(0, 1fr));
  --grid-4: repeat(4, minmax(0, 1fr));
  --grid-5: repeat(5, minmax(0, 1fr));
  --grid-6: repeat(6, minmax(0, 1fr));
  --grid-gap-total: calc(var(--grid-gap--main) * (var(--column-count) - 1));
  --column-width: calc((100% - var(--grid-gap-total)) / var(--column-count) + var(--grid-gap--main));
  --breakout-gutter: minmax(calc(var(--padding-horizontal--main) - var(--grid-gap--main)), 1fr);
  --breakout-remaining: calc(var(--max-width--main) - (var(--padding-horizontal--main) * 2));
  --breakout-start: [full-start] var(--breakout-gutter) [content-start];
  --breakout-end: [content-end] var(--breakout-gutter) [full-end];
  --grid-breakout-single: var(--breakout-start) minmax(0, var(--breakout-remaining)) var(--breakout-end);
  --grid-breakout: var(--breakout-start) repeat(var(--column-count), minmax(0, calc((var(--breakout-remaining) - var(--grid-gap-total)) / var(--column-count)))) var(--breakout-end);
  --font-weight--inherit: inherit;
  --font-weight--100: 100;
  --font-weight--200: 200;
  --font-weight--300: 300;
  --font-weight--400: 400;
  --font-weight--500: 500;
  --font-weight--600: 600;
  --font-weight--700: 700;
  --font-weight--800: 800;
  --font-weight--900: 900;
  --text-transform--none: none;
  --text-transform--uppercase: uppercase;
  --text-transform--capitalize: capitalize;
  --text-transform--lowercase: lowercase;
  --text-transform--inherit: inherit;
  --max-width--none: none;
  --fbj-motion-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --fbj-motion-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

body {
  font-weight: var(--text-main--font-weight);
  text-transform: var(--text-main--text-transform);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, blockquote {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}

h1, h2, h3, h4, h5, h6, p, label, blockquote {
  margin-top: 0;
  margin-bottom: 0;
}

button {
  background-color: unset;
  padding: unset;
  text-align: inherit;
  cursor: pointer;
}

img::selection { background: transparent; }

:is(h1, h2, h3, h4, h5, h6, p) a { text-decoration: underline; }

.u-rich-text > *:first-child { margin-top: 0; }
.u-rich-text > *:last-child { margin-bottom: 0; }

video { width: 100%; object-fit: cover; }
svg { display: block; }
section, header, footer { position: relative; }

/* Architectural brand texture */
.fbj-architectural-hero,
.fbj-architectural-section {
  --fbj-arch-line: color-mix(in srgb, var(--swatch--brand) 22%, transparent);
  --fbj-arch-line-soft: color-mix(in srgb, var(--theme--text) 7%, transparent);
  --fbj-arch-line-faint: color-mix(in srgb, var(--theme--text) 4%, transparent);
  isolation: isolate;
  overflow: hidden;
  overflow: clip;
}

:root[data-theme="dark"] .fbj-architectural-hero,
:root[data-theme="dark"] .fbj-architectural-section {
  --fbj-arch-line: color-mix(in srgb, var(--swatch--brand) 30%, transparent);
  --fbj-arch-line-soft: color-mix(in srgb, var(--swatch--light) 8%, transparent);
  --fbj-arch-line-faint: color-mix(in srgb, var(--swatch--light) 5%, transparent);
}

.fbj-architectural-hero > .layout_card_contain,
.fbj-architectural-hero > .u-container,
.fbj-architectural-hero > section,
.fbj-architectural-section > .u-container,
.fbj-architectural-section > .layout_card_contain,
.fbj-architectural-section > .layout_split_contain {
  position: relative;
  z-index: 1;
}

.fbj-architectural-hero::before,
.fbj-architectural-hero::after,
.fbj-architectural-section::before {
  content: "";
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.fbj-architectural-hero::before {
  inset: 0;
  background-image:
    linear-gradient(90deg, var(--fbj-arch-line-faint) 1px, transparent 1px),
    linear-gradient(0deg, var(--fbj-arch-line-faint) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 46%, var(--fbj-arch-line) 46% 46.25%, transparent 46.25%),
    linear-gradient(135deg, transparent 0 63%, var(--fbj-arch-line-soft) 63% 63.2%, transparent 63.2%);
  background-position:
    center -2rem,
    center -2rem,
    58% 10%,
    18% 28%;
  background-size:
    clamp(3.75rem, 7vw, 6rem) clamp(3.75rem, 7vw, 6rem),
    clamp(3.75rem, 7vw, 6rem) clamp(3.75rem, 7vw, 6rem),
    clamp(24rem, 46vw, 44rem) clamp(24rem, 46vw, 44rem),
    clamp(22rem, 40vw, 38rem) clamp(22rem, 40vw, 38rem);
  opacity: 0.9;
  transform: translate3d(0, 0, 0) scale(1.01);
  transform-origin: 52% 22%;
  animation: fbj-architectural-drift 28s var(--fbj-motion-ease-in-out) infinite alternate;
  will-change: transform, opacity;
  -webkit-mask-image: radial-gradient(ellipse 74% 58% at 50% 22%, #000 0 46%, transparent 78%);
  mask-image: radial-gradient(ellipse 74% 58% at 50% 22%, #000 0 46%, transparent 78%);
}

.fbj-architectural-hero::after {
  width: clamp(8rem, 22vw, 20rem);
  height: clamp(7rem, 18vw, 16rem);
  top: clamp(5rem, 10vw, 9rem);
  right: max(1.5rem, calc((100vw - var(--max-width--main)) / 2));
  border-top: 1px solid var(--fbj-arch-line);
  border-right: 1px solid var(--fbj-arch-line-soft);
  opacity: 0.76;
  transform: translate3d(0, 0, 0);
  animation: fbj-architectural-corner-drift 24s var(--fbj-motion-ease-in-out) infinite alternate;
  will-change: transform, opacity;
}

@keyframes fbj-architectural-drift {
  0% {
    opacity: 0.78;
    transform: translate3d(-0.35rem, 0.2rem, 0) scale(1.01);
  }

  100% {
    opacity: 0.94;
    transform: translate3d(0.45rem, -0.3rem, 0) scale(1.012);
  }
}

@keyframes fbj-architectural-corner-drift {
  0% {
    opacity: 0.58;
    transform: translate3d(0.25rem, -0.15rem, 0);
  }

  100% {
    opacity: 0.78;
    transform: translate3d(-0.3rem, 0.25rem, 0);
  }
}

.fbj-architectural-section::before {
  width: clamp(5rem, 13vw, 11rem);
  height: clamp(5rem, 13vw, 11rem);
  top: clamp(1.5rem, 4vw, 3rem);
  left: max(1.25rem, calc((100vw - var(--max-width--main)) / 2));
  background-image:
    linear-gradient(90deg, var(--fbj-arch-line-faint) 1px, transparent 1px),
    linear-gradient(0deg, var(--fbj-arch-line-faint) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 49%, var(--fbj-arch-line) 49% 49.35%, transparent 49.35%);
  background-size:
    1.25rem 1.25rem,
    1.25rem 1.25rem,
    100% 100%;
  opacity: 0.7;
  -webkit-mask-image: linear-gradient(135deg, #000 0 40%, transparent 72%);
  mask-image: linear-gradient(135deg, #000 0 40%, transparent 72%);
}

.fbj-architectural-section.is-map::before {
  right: max(1.25rem, calc((100vw - var(--max-width--main)) / 2));
  left: auto;
  transform: scaleX(-1);
}

@media screen and (max-width: 767px) {
  .fbj-architectural-hero::before {
    background-position:
      center 1rem,
      center 1rem,
      62% 0,
      12% 20%;
    opacity: 0.72;
    animation-duration: 34s;
    -webkit-mask-image: radial-gradient(ellipse 118% 58% at 52% 20%, #000 0 34%, transparent 74%);
    mask-image: radial-gradient(ellipse 118% 58% at 52% 20%, #000 0 34%, transparent 74%);
  }

  .fbj-architectural-hero::after {
    width: 9rem;
    height: 7rem;
    top: 5rem;
    right: 1rem;
    opacity: 0.44;
    animation-duration: 32s;
  }

  .fbj-architectural-section::before {
    width: 6.5rem;
    height: 6.5rem;
    top: 1rem;
    left: 1rem;
    opacity: 0.44;
  }

  .fbj-architectural-section.is-map::before {
    right: 1rem;
    left: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fbj-architectural-hero::before,
  .fbj-architectural-hero::after {
    animation: none;
    transform: none;
    will-change: auto;
  }
}

.u-line-clamp-1, .u-line-clamp-2, .u-line-clamp-3, .u-line-clamp-4 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.u-line-clamp-2 { -webkit-line-clamp: 2; }
.u-line-clamp-3 { -webkit-line-clamp: 3; }
.u-line-clamp-4 { -webkit-line-clamp: 4; }

.fbj-home-hero-media {
  width: 100%;
  align-self: stretch;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.fbj-home-hero-slider {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.fbj-home-hero-slider__stage {
  position: relative;
  min-height: clamp(24rem, 44vw, 34rem);
  overflow: hidden;
  border-radius: 8px;
  background: var(--swatch--light-secondary);
}

/* Bez ciemnego narzutu na wideo — wcześniejszy ::before usunięty */

.fbj-home-hero-slider__media-layer {
  position: absolute;
  inset: 0;
}

.fbj-home-hero-slider__overlay {
  position: absolute;
  z-index: 2;
  left: clamp(0.75rem, 2vw, 1.25rem);
  bottom: clamp(0.75rem, 2vw, 1.25rem);
  right: clamp(0.75rem, 2vw, 1.25rem);
  display: flex;
  justify-content: flex-start;
  pointer-events: none;
}

.fbj-home-hero-slider__overlay .fbj-home-hero-slider__availability-card,
.fbj-home-hero-slider__stage .fbj-home-hero-slider__nav,
.fbj-home-hero-slider__stage .fbj-home-hero-slider__nav-button {
  pointer-events: auto;
}

/* Webflow: .tag.absolute nadpisuje tło po .tag.green — przywróć zielony badge */
.fbj-home-hero-slider__stage .fbj-home-hero-slider__corner--tl.tag.green {
  background-color: var(--swatch--green);
  border-color: var(--swatch--green);
  color: var(--swatch--light);
}

.fbj-home-hero-slider__corner--tl {
  position: absolute;
  z-index: 3;
  top: clamp(0.75rem, 2vw, 1.25rem);
  left: clamp(0.75rem, 2vw, 1.25rem);
  max-width: min(100%, 29rem);
  width: fit-content;
  margin: 0;
}

/* Zielony badge „Nowa inwestycja …" — parity ze starym `.tag.absolute.green`:
   natywny padding (0.75rem 1rem z `.tag.absolute`), gap 0.5rem, box-shadow,
   większa ikona (~1.25rem) i bazowa typografia; żadnych własnych font-size/padding */
.fbj-home-hero-slider__badge {
  min-width: 0;
}

.fbj-home-hero-slider__badge-icon {
  width: 1.25rem;
  height: 1.25rem;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.fbj-home-hero-slider__badge-text {
  min-width: 0;
  overflow-wrap: anywhere;
  text-wrap: balance;
  line-height: 1.3;
}

/* Nav buttons — okrągłe w stylu `.card-button` z Webflow (BR kadru) */
.fbj-home-hero-slider__nav {
  position: absolute;
  z-index: 4;
  right: clamp(0.75rem, 2vw, 1.25rem);
  bottom: clamp(0.75rem, 2vw, 1.25rem);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.fbj-home-hero-slider__nav-button {
  width: var(--size--4rem);
  height: var(--size--4rem);
  flex: 0 0 auto;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50rem;
  background-color: #fff;
  color: var(--swatch--dark);
  box-shadow: 0 1px 1px #0e0e0e0a, 0 4px 4px #0000001a;
  transition:
    transform 180ms var(--fbj-motion-ease-out),
    color 180ms var(--fbj-motion-ease-out),
    box-shadow 180ms var(--fbj-motion-ease-out);
}

.fbj-home-hero-slider__nav-button svg {
  width: 1rem;
  height: 1rem;
}

.fbj-home-hero-slider__nav-button .is-next {
  transform: scaleX(-1);
}

/* Karta dostępności — parity z `.card-4` (Webflow): jasne tło, radius small,
   shadow jak `.tag.absolute`, padding 1rem, typografia dark-on-light. */
.fbj-home-hero-slider__availability-card {
  width: min(100%, 22rem);
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: var(--size--1rem);
  border: 0;
  border-radius: var(--radius--small);
  background-color: var(--theme--background);
  color: var(--theme--text);
  text-decoration: none;
  box-shadow: 0 1px 1px #0e0e0e0a, 0 4px 4px #0000001a;
  transition:
    transform 180ms var(--fbj-motion-ease-out),
    box-shadow 180ms var(--fbj-motion-ease-out);
}

.fbj-home-hero-slider__availability-label {
  font-size: 0.78rem;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--theme--text) 58%, transparent);
}

.fbj-home-hero-slider__availability-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}

.fbj-home-hero-slider__availability-digit {
  box-sizing: border-box;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 4px;
  border: 1px solid transparent;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.fbj-home-hero-slider__availability-digit.is-available {
  background-color: var(--swatch--green);
  border-color: var(--swatch--green);
  color: var(--swatch--light);
}

.fbj-home-hero-slider__availability-digit.is-zero {
  background-color: var(--swatch--red);
  border-color: var(--swatch--red);
  color: var(--swatch--light);
}

.fbj-home-hero-slider__availability-title {
  font-size: clamp(1rem, 1.35vw, 1.15rem);
  line-height: 1.15;
  font-weight: 500;
}

.fbj-home-hero-slider__availability-cta {
  margin-top: 0.25rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.2;
  color: var(--swatch--brand);
}

.fbj-home-hero-slider__availability-arrow {
  width: 0.78rem;
  height: 0.78rem;
  flex: 0 0 auto;
  transition: transform 180ms var(--fbj-motion-ease-out);
}

.fbj-home-hero-slider__progress-stack {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.45rem;
}

.fbj-home-hero-slider__progress-row {
  flex: 1 1 0;
  min-width: 0;
  display: block;
  padding: 0.2rem 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.fbj-home-hero-slider__progress-track {
  position: relative;
  display: block;
  width: 100%;
  height: 0.25rem;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--theme--text) 10%, transparent);
}

.fbj-home-hero-slider__progress-fill {
  position: absolute;
  inset: 0;
  transform: scaleX(0);
  transform-origin: left center;
  border-radius: inherit;
  background: var(--swatch--brand);
  animation: fbj-home-hero-progress linear both;
}

.fbj-home-hero-slider__progress-fill.is-static {
  animation: none;
  transform: scaleX(1);
}

.fbj-home-hero-slider__nav-button:focus-visible,
.fbj-home-hero-slider__progress-row:focus-visible,
.fbj-home-hero-slider__availability-card:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

.fbj-home-hero-slider__nav-button:active,
.fbj-home-hero-slider__progress-row:active,
.fbj-home-hero-slider__availability-card:active {
  transform: scale(0.98);
}

@keyframes fbj-home-hero-progress {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@media (hover: hover) and (pointer: fine) {
  .fbj-home-hero-slider__nav-button:hover {
    transform: scale(1.04);
    color: var(--swatch--brand);
    box-shadow: 0 1px 2px #0e0e0e14, 0 6px 12px #0000001f;
  }

  .fbj-home-hero-slider__nav-button:hover .is-next {
    transform: scaleX(-1) scale(1.04);
  }

  .fbj-home-hero-slider__availability-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 1px 2px #0e0e0e14, 0 8px 18px #0000001f;
  }

  .fbj-home-hero-slider__availability-card:hover .fbj-home-hero-slider__availability-arrow {
    transform: translateX(0.16rem);
  }
}

@media screen and (max-width: 991px) {
  .fbj-home-hero-slider__stage {
    min-height: clamp(25rem, 78vw, 33rem);
  }

  .fbj-home-hero-slider__nav-button {
    width: var(--size--3rem);
    height: var(--size--3rem);
  }
}

@media screen and (max-width: 767px) {
  .fbj-home-hero-slider__stage {
    min-height: min(76vh, 31rem);
  }

  .fbj-home-hero-slider__overlay {
    left: 0.875rem;
    right: 0.875rem;
    bottom: 0.875rem;
  }

  .fbj-home-hero-slider__corner--tl {
    max-width: calc(100% - 6.5rem);
  }

  .fbj-home-hero-slider__nav {
    right: 0.75rem;
    bottom: 0.75rem;
    gap: 0.375rem;
  }

  .fbj-home-hero-slider__availability-card {
    width: 100%;
    max-width: calc(100% - 7.5rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fbj-home-hero-slider__nav-button,
  .fbj-home-hero-slider__nav-button:hover,
  .fbj-home-hero-slider__nav-button:hover .is-next,
  .fbj-home-hero-slider__availability-card,
  .fbj-home-hero-slider__availability-card:hover,
  .fbj-home-hero-slider__availability-arrow {
    transition: none;
    transform: none;
  }

  .fbj-home-hero-slider__nav-button .is-next,
  .fbj-home-hero-slider__nav-button:hover .is-next {
    transform: scaleX(-1);
  }
}

[data-padding-top="none"] { padding-top: var(--padding-vertical--none); }
[data-padding-bottom="none"] { padding-bottom: var(--padding-vertical--none); }
[data-padding-top="small"] { padding-top: var(--padding-vertical--small); }
[data-padding-bottom="small"] { padding-bottom: var(--padding-vertical--small); }
[data-padding-top="main"] { padding-top: var(--padding-vertical--main); }
[data-padding-bottom="main"] { padding-bottom: var(--padding-vertical--main); }
[data-padding-top="large"] { padding-top: var(--padding-vertical--large); }
[data-padding-bottom="large"] { padding-bottom: var(--padding-vertical--large); }
[data-padding-top="big"] { padding-top: var(--padding-vertical--big); }
[data-padding-bottom="big"] { padding-bottom: var(--padding-vertical--big); }

/* Theme light */
:root,
[data-theme="light"],
[data-theme="dark"] [data-theme="invert"] {
  --theme--background: var(--swatch--light);
  --theme--text: var(--swatch--dark);
  --theme--border: var(--swatch--light-secondary);
  --button--background: var(--swatch--brand);
  --button--text: var(--swatch--light);
  --button--border: var(--swatch--brand);
  --button--background-hover: var(--swatch--dark);
  --button--text-hover: var(--swatch--light);
  --button--border-hover: var(--swatch--dark);
  --button-secondary--background: var(--swatch--transparent);
  --button-secondary--text: var(--swatch--dark);
  --button-secondary--border: var(--swatch--light-secondary);
  --button-secondary--background-hover: var(--swatch--brand);
  --button-secondary--text-hover: var(--swatch--light);
  --button-secondary--border-hover: var(--swatch--brand);
}

/* Theme dark */
[data-theme="dark"],
[data-theme="invert"],
[data-theme="light"] [data-theme="invert"] {
  --theme--background: var(--swatch--dark);
  --theme--text: var(--swatch--light);
  --theme--border: var(--swatch--dark-secondary);
  --button--background: var(--swatch--brand);
  --button--text: var(--swatch--light);
  --button--border: var(--swatch--brand);
  --button--background-hover: var(--swatch--light);
  --button--text-hover: var(--swatch--dark);
  --button--border-hover: var(--swatch--light);
  --button-secondary--background: var(--swatch--transparent);
  --button-secondary--text: var(--swatch--light);
  --button-secondary--border: var(--swatch--dark-secondary);
  --button-secondary--background-hover: var(--swatch--brand);
  --button-secondary--text-hover: var(--swatch--light);
  --button-secondary--border-hover: var(--swatch--brand);
}

[data-button-style="secondary"] {
  --button--background: var(--button-secondary--background);
  --button--text: var(--button-secondary--text);
  --button--border: var(--button-secondary--border);
  --button--background-hover: var(--button-secondary--background-hover);
  --button--text-hover: var(--button-secondary--text-hover);
  --button--border-hover: var(--button-secondary--border-hover);
}

/* Buttons — unify Webflow exports with production theme tokens */
.btn_main_wrap,
.btn_play_wrap {
  color: var(--button--text);
  transform: translateZ(0);
  transition:
    transform 160ms var(--fbj-motion-ease-out),
    border-color 180ms var(--fbj-motion-ease-out),
    background-color 180ms var(--fbj-motion-ease-out),
    color 180ms var(--fbj-motion-ease-out),
    box-shadow 180ms var(--fbj-motion-ease-out);
}

.btn_main_wrap {
  text-decoration: none;
}

.btn_main_icon {
  transition: transform 160ms var(--fbj-motion-ease-out);
}

.btn_main_wrap:focus-visible,
.btn_play_wrap:focus-visible,
a:focus-visible .btn_main_wrap {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

.btn_main_wrap:active,
.btn_play_wrap:active {
  transform: scale(0.98);
}

.btn_main_wrap:disabled,
.btn_main_wrap[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.62;
  transform: none;
}

@media (hover: hover) and (pointer: fine) {
  .btn_main_wrap:hover,
  .btn_play_wrap:hover {
    transform: translateY(-1px);
  }

  .btn_main_wrap:hover .btn_main_icon {
    transform: translateX(0.125rem);
  }
}

@media (hover: none), (pointer: coarse) {
  .btn_main_wrap:hover,
  .btn_play_wrap:hover {
    border-color: var(--button--border);
    background-color: var(--button--background);
    color: var(--button--text);
  }
}

:is(c, :where([data-theme]:not([data-theme="inherit"]))) {
  background-color: var(--theme--background);
  color: var(--theme--text);
}

/* Fluid sizes */
:root {
  --padding-horizontal--main: 3rem;
  --size--2rem: 2rem;
  --size--2-5rem: 2.5rem;
  --size--3rem: 3rem;
  --size--3-5rem: 3.5rem;
  --size--4rem: 4rem;
  --size--4-5rem: 4.5rem;
  --size--5rem: 5rem;
  --size--5-5rem: 5.5rem;
  --size--6rem: 6rem;
  --size--6-5rem: 6.5rem;
  --size--7rem: 7rem;
  --size--7-5rem: 7.5rem;
  --size--8rem: 8rem;
  --size--8-5rem: 8.5rem;
  --size--9rem: 9rem;
  --size--9-5rem: 9.5rem;
  --size--10rem: 10rem;
  --size--11rem: 11rem;
  --size--12rem: 12rem;
  --size--13rem: 13rem;
  --size--14rem: 14rem;
  --size--15rem: 15rem;
  --size--16rem: 16rem;
  --display--font-size: 6.92rem;
  --h1--font-size: 5.2rem;
  --h2--font-size: 3.91rem;
  --h3--font-size: 2.94rem;
  --h4--font-size: 2.21rem;
  --h5--font-size: 1.66rem;
  --h6--font-size: 1.25rem;
  --text-large--font-size: 1.51rem;
  --text-main--font-size: 1.05rem;
  --text-small--font-size: 0.875rem;
}

@media screen and (max-width: 767px) {
  :root {
    --padding-horizontal--main: 1rem;
    --size--2rem: 1.75rem;
    --size--2-5rem: 2rem;
    --size--3rem: 2.25rem;
    --size--3-5rem: 2.375rem;
    --size--4rem: 2.5rem;
    --size--4-5rem: 2.75rem;
    --size--5rem: 3rem;
    --size--5-5rem: 3.25rem;
    --size--6rem: 3.5rem;
    --size--6-5rem: 3.75rem;
    --size--7rem: 4rem;
    --size--7-5rem: 4.25rem;
    --size--8rem: 4.5rem;
    --size--8-5rem: 4.75rem;
    --size--9rem: 5rem;
    --size--9-5rem: 5.25rem;
    --size--10rem: 5.5rem;
    --size--11rem: 5.75rem;
    --size--12rem: 6rem;
    --size--13rem: 6.5rem;
    --size--14rem: 7rem;
    --size--15rem: 7.5rem;
    --size--16rem: 8rem;
    --display--font-size: 4rem;
    --h1--font-size: 3.18rem;
    --h2--font-size: 2.52rem;
    --h3--font-size: 2rem;
    --h4--font-size: 1.59rem;
    --h5--font-size: 1.26rem;
    --h6--font-size: 1rem;
    --text-large--font-size: 1.3rem;
    --text-main--font-size: 1rem;
    --text-small--font-size: 0.875rem;
  }
}

@supports (font-size: clamp(1rem, 0.5rem + 3vw, 3rem)) {
  :root {
    --padding-horizontal--main: clamp(1rem, 0.428rem + 2.86vw, 3rem);
    --size--2rem: clamp(1.75rem, 1.678rem + 0.36vw, 2rem);
    --size--2-5rem: clamp(2rem, 1.858rem + 0.71vw, 2.5rem);
    --size--3rem: clamp(2.25rem, 2.036rem + 1.07vw, 3rem);
    --size--3-5rem: clamp(2.375rem, 2.053rem + 1.61vw, 3.5rem);
    --size--4rem: clamp(2.5rem, 2.072rem + 2.14vw, 4rem);
    --size--4-5rem: clamp(2.75rem, 2.25rem + 2.5vw, 4.5rem);
    --size--5rem: clamp(3rem, 2.428rem + 2.86vw, 5rem);
    --size--5-5rem: clamp(3.25rem, 2.608rem + 3.21vw, 5.5rem);
    --size--6rem: clamp(3.5rem, 2.786rem + 3.57vw, 6rem);
    --size--6-5rem: clamp(3.75rem, 2.964rem + 3.93vw, 6.5rem);
    --size--7rem: clamp(4rem, 3.142rem + 4.29vw, 7rem);
    --size--7-5rem: clamp(4.25rem, 3.322rem + 4.64vw, 7.5rem);
    --size--8rem: clamp(4.5rem, 3.5rem + 5vw, 8rem);
    --size--8-5rem: clamp(4.75rem, 3.678rem + 5.36vw, 8.5rem);
    --size--9rem: clamp(5rem, 3.858rem + 5.71vw, 9rem);
    --size--9-5rem: clamp(5.25rem, 4.036rem + 6.07vw, 9.5rem);
    --size--10rem: clamp(5.5rem, 4.214rem + 6.43vw, 10rem);
    --size--11rem: clamp(5.75rem, 4.25rem + 7.5vw, 11rem);
    --size--12rem: clamp(6rem, 4.286rem + 8.57vw, 12rem);
    --size--13rem: clamp(6.5rem, 4.642rem + 9.29vw, 13rem);
    --size--14rem: clamp(7rem, 5rem + 10vw, 14rem);
    --size--15rem: clamp(7.5rem, 5.358rem + 10.71vw, 15rem);
    --size--16rem: clamp(8rem, 5.714rem + 11.43vw, 16rem);
    --display--font-size: clamp(4rem, 3.166rem + 4.17vw, 6.92rem);
    --h1--font-size: clamp(3.18rem, 2.602rem + 2.89vw, 5.2rem);
    --h2--font-size: clamp(2.52rem, 2.122rem + 1.99vw, 3.91rem);
    --h3--font-size: clamp(2rem, 1.732rem + 1.34vw, 2.94rem);
    --h4--font-size: clamp(1.59rem, 1.412rem + 0.89vw, 2.21rem);
    --h5--font-size: clamp(1.26rem, 1.146rem + 0.57vw, 1.66rem);
    --h6--font-size: clamp(1rem, 0.928rem + 0.36vw, 1.25rem);
    --text-large--font-size: clamp(1.3rem, 1.24rem + 0.3vw, 1.51rem);
    --text-main--font-size: clamp(1rem, 0.986rem + 0.07vw, 1.05rem);
    --text-small--font-size: clamp(0.875rem, 0.875rem + 0vw, 0.875rem);
  }
}

/* ─── Nawigacja: dropdown „Inwestycje” ─── */

/* Reset button defaults */
button.dropdown_toggle {
  font: inherit;
  color: inherit;
  width: max-content;
  max-width: 100%;
  border: none;
  background: none;
}

/* Arrow icon size */
.dropdown_arrow {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  transition: transform 180ms var(--fbj-motion-ease-out);
}

/* Fix: webflow.css sets left: -100% which hides the panel at desktop */
.dropdown_content {
  left: 0;
}

/* Open state: focus-within OR aria-expanded (click/touch); hover is gated below */
.dropdown_wrap:focus-within .dropdown_height,
.dropdown_toggle[aria-expanded="true"] + .dropdown_content .dropdown_height {
  grid-template-rows: 1fr;
}
.dropdown_wrap:focus-within .dropdown_arrow,
.dropdown_toggle[aria-expanded="true"] .dropdown_arrow {
  transform: rotate(-180deg);
}

@media (hover: hover) and (pointer: fine) {
  .dropdown_wrap:hover .dropdown_height {
    grid-template-rows: 1fr;
  }

  .dropdown_wrap:hover .dropdown_arrow {
    transform: rotate(-180deg);
  }
}

/* overflow:hidden on the outer container prevents background bleed during
   the 0fr→1fr transition (white line artifact) */
.dropdown_height {
  overflow: hidden;
  transition: grid-template-rows 220ms var(--fbj-motion-ease-out);
}

/* Dropdown list: flex column instead of grid.
   NO padding here — padding-box background bleeds through at grid 0fr even with
   overflow:hidden, causing a white line when closed. Individual links have their
   own padding. Only add list padding in the open state. */
.dropdown_list {
  display: flex;
  flex-direction: column;
  grid-template-columns: unset;
  padding: 0;
  gap: 0.125rem;
}
.dropdown_wrap:focus-within .dropdown_list,
.dropdown_toggle[aria-expanded="true"] + .dropdown_content .dropdown_list {
  padding: 0.375rem;
}

@media (hover: hover) and (pointer: fine) {
  .dropdown_wrap:hover .dropdown_list {
    padding: 0.375rem;
  }
}

/* Investment links */
.dropdown_link {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: var(--text-main--font-size);
  font-weight: 500;
  color: inherit;
  text-decoration: none;
  padding: 0.45rem 0.75rem;
  border-radius: var(--radius--small, 6px);
  transition: background-color 160ms var(--fbj-motion-ease-out), color 160ms var(--fbj-motion-ease-out);
  white-space: nowrap;
}
.dropdown_link:hover,
.dropdown_link:focus-visible {
  background: var(--swatch--light-secondary);
}
.dropdown_link:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 2px;
}
.dropdown_link .dropdown_link__icon {
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  opacity: 0.65;
}

/* “Wszystkie domy” — separator + accent */
.dropdown_item--separator {
  margin-top: 0.375rem;
  border-top: 1px solid var(--theme--border);
  padding-top: 0.375rem;
}
.dropdown_link--all {
  color: var(--swatch--brand);
  font-weight: 600;
}

/* Pin Mapbox — focus klawiatury (marker = role=”button”) */
.marker:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Nav logo — płynny rozmiar dla desktop/tablet/mobile */
.nav .logo-link-wrap {
  max-width: clamp(10.75rem, 12.5vw, 12rem);
}

/* Stopka: całe logo białe (`Logo` z `monochrome` — akcent też przez currentColor) */
.footer_5_logo_wrap {
  color: var(--swatch--light);
}

/* Mobile nav menu — Webflow JS runtime nie istnieje w Next.js;
   React toggle'uje atrybut data-nav-menu-open (natywny Webflow),
   który w webflow.css ustawia display:block!important + position:absolute + top:100%.
   Poniżej nadpisujemy style z fbj-development.webflow.css
   (position:relative, top:5rem, height:100%) żeby menu działało. */
@media screen and (max-width: 991px) {
  .nav .logo-link-wrap {
    max-width: clamp(8.75rem, 19vw, 10rem);
  }

  .w-nav-menu[data-nav-menu-open] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 200;
    height: auto;
    max-height: calc(100dvh - var(--size--6rem));
    background: var(--theme--background, #fafafb);
    border-bottom-left-radius: var(--radius--main);
    border-bottom-right-radius: var(--radius--main);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    text-align: left;
    padding: var(--padding-horizontal--main);
  }

  [data-nav-menu-open] .nav-list.mobile {
    height: auto !important;
    padding-top: var(--size--1-5rem);
    padding-bottom: var(--size--1-5rem);
  }

  /* Mobile: dropdown_height relative, full-width links */
  [data-nav-menu-open] .dropdown_link {
    white-space: normal;
    font-size: 1.05rem;
  }

  [data-nav-menu-open] .dropdown_list {
    padding: 0.25rem 0 0.25rem 0.5rem;
  }

  [data-nav-menu-open] .dropdown_item--separator {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
  }
}

@media screen and (max-width: 767px) {
  .nav .logo-link-wrap {
    max-width: clamp(7.5rem, 34vw, 8.5rem);
  }
}

@media screen and (max-width: 479px) {
  .nav .logo-link-wrap {
    max-width: clamp(7.5rem, 34vw, 8.25rem);
  }
}

/* Widoczny focus — Webflow zeruje outline na .w-nav-button:focus (2.4.7) */
.menu-button.w-nav-button:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

#theme-toggle.toggle-button-m:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

/* Toggle button */
.toggle-button-m {
  position: relative;
  display: flex;
  width: 44px;
  height: 24px;
  justify-content: flex-start;
  align-items: center;
  border-radius: var(--radius--round);
  background-color: var(--swatch--light-secondary);
  text-decoration: none;
  transition: background-color 220ms var(--fbj-motion-ease-out), transform 160ms var(--fbj-motion-ease-out);
  border: none;
}
.toggle-button-fill-m {
  position: absolute;
  width: 44px;
  height: 24px;
  border-radius: var(--radius--round);
  opacity: 0;
}
.button-toggle-m {
  position: relative;
  z-index: 2;
  display: flex;
  width: var(--size--1-25rem);
  height: var(--size--1-25rem);
  margin: 0 var(--size--0-25rem);
  justify-content: center;
  align-items: center;
  border-radius: var(--radius--round);
  background-color: var(--swatch--light);
  box-shadow: 0 1px 2px 0 hsla(220, 42.86%, 10.98%, 0.06), 0 1px 3px 0 hsla(220, 42.86%, 10.98%, 0.10);
  transition: transform 220ms var(--fbj-motion-ease-out), background-color 220ms var(--fbj-motion-ease-out);
}
.toggle-button-m.toggle-dark .button-toggle-m {
  transform: translateX(18px);
}
.toggle-button-m.toggle-dark {
  background-color: var(--swatch--brand);
}
.toggle-button-m:active {
  transform: scale(0.97);
}
.toggle-button-m .icon-light,
.toggle-button-m.toggle-dark .icon-dark {
  display: none;
}
.toggle-button-m.toggle-dark .icon-light,
.toggle-button-m .icon-dark {
  display: block;
}

/* WhyUs accordion — smooth state change without unmounting panels */
.accordion-wrapper {
  gap: 0;
}

.accordion-item-title {
  padding-bottom: var(--size--1-25rem);
  transition: border-bottom-color 180ms var(--fbj-motion-ease-out), color 180ms var(--fbj-motion-ease-out);
}

button.accordion-item-title {
  touch-action: manipulation;
}

button.accordion-item-title:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 4px;
  border-radius: var(--radius--small);
}

.accordion-item-title .u-text-h5 {
  transition: transform 180ms var(--fbj-motion-ease-out), color 180ms var(--fbj-motion-ease-out);
}

.accordion-item-content {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 240ms var(--fbj-motion-ease-in-out), opacity 180ms var(--fbj-motion-ease-out);
}

.accordion-item.is-open .accordion-item-content {
  grid-template-rows: 1fr;
  opacity: 1;
}

.accordion-item-content[aria-hidden="true"] {
  pointer-events: none;
}

.accordion-item-content-details {
  padding-top: var(--size--1rem);
  padding-bottom: var(--size--1-5rem);
  min-height: 0;
  overflow: hidden;
  transform: translateY(-0.25rem);
  transition: transform 220ms var(--fbj-motion-ease-out), border-bottom-color 180ms var(--fbj-motion-ease-out);
}

.accordion-item.is-open .accordion-item-content-details {
  transform: translateY(0);
}

.accordion-item.is-open + .accordion-item {
  padding-top: var(--size--0-75rem);
}

.accordion-item-icon {
  transition: transform 180ms var(--fbj-motion-ease-out), color 180ms var(--fbj-motion-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  .accordion-item-title:hover .u-text-h5 {
    transform: translateX(0.125rem);
  }

  .accordion-item-title:hover .accordion-item-icon {
    color: var(--swatch--brand);
  }
}

/* Nav scroll state */
[data-nav="target"].is-active,
[nav="target"].is-active {
  background-color: var(--theme--background);
  border-bottom: 1px solid var(--theme--border);
}

/* Mapbox overrides */
a.mapboxgl-ctrl-logo { display: none; }
.mapboxgl-ctrl-bottom-right { display: none; }

/* Pulsing outline */
.pulsing-outline {
  box-shadow: 0 0 0 0 rgba(210, 233, 236, 1);
  animation: pulsing-outline 2s infinite;
}
@keyframes pulsing-outline {
  0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
  70% { box-shadow: 0 0 0 10px rgba(255, 255, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

/* Card status badges */
.card_status_badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.25rem 0.75rem;
  border-radius: var(--radius--round);
  font-size: var(--text-small--font-size);
  font-weight: 600;
}
.card_status_badge.is-available {
  background-color: var(--swatch--brand);
  color: white;
}
.card_status_badge.is-reserved {
  background-color: #f59e0b;
  color: white;
}
.card_status_badge.is-sold {
  background-color: var(--swatch--dark-secondary);
  color: var(--swatch--light);
}

/* DomCard — calm, fast interaction for CMS house cards */
a.fbj-dom-card {
  --fbj-card-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  text-decoration: none;
  transform: translateZ(0);
}

a.fbj-dom-card::after {
  content: "";
  z-index: 120;
  pointer-events: none;
  border: 1px solid color-mix(in srgb, var(--swatch--light) 58%, transparent);
  border-radius: var(--radius--main);
  opacity: 0;
  transition: opacity 180ms var(--fbj-card-ease-out), border-color 180ms var(--fbj-card-ease-out);
  position: absolute;
  inset: 0;
}

a.fbj-dom-card .image_card {
  object-fit: cover;
  width: 100%;
  transition: transform 220ms var(--fbj-card-ease-out);
  will-change: transform;
}

a.fbj-dom-card .spaces-card-overlay {
  opacity: 0.96;
  transition: opacity 180ms var(--fbj-card-ease-out);
}

a.fbj-dom-card .card-button {
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.5rem) scale(0.94);
  transform-origin: center;
  transition: transform 180ms var(--fbj-card-ease-out), opacity 180ms var(--fbj-card-ease-out);
  will-change: transform, opacity;
}

a.fbj-dom-card .card-button-icon-inner-wrapper {
  transition: transform 180ms var(--fbj-card-ease-out);
}

a.fbj-dom-card:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

a.fbj-dom-card:focus-visible::after {
  opacity: 1;
  border-color: color-mix(in srgb, var(--swatch--brand) 38%, var(--swatch--light));
}

a.fbj-dom-card:focus-visible .image_card {
  transform: scale(1.018);
}

a.fbj-dom-card:focus-visible .spaces-card-overlay {
  opacity: 1;
}

a.fbj-dom-card:focus-visible .card-button {
  opacity: 1;
  transform: translateY(0) scale(1);
}

a.fbj-dom-card:focus-visible .card-button-icon-inner-wrapper {
  transform: translateY(-100%);
}

a.fbj-dom-card:active .card-button {
  transform: translateY(0) scale(0.97);
}

@media (hover: hover) and (pointer: fine) {
  a.fbj-dom-card:hover::after {
    opacity: 1;
  }

  a.fbj-dom-card:hover .image_card {
    transform: scale(1.018);
  }

  a.fbj-dom-card:hover .spaces-card-overlay {
    opacity: 1;
  }

  a.fbj-dom-card:hover .card-button {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  a.fbj-dom-card:hover .card-button-icon-inner-wrapper {
    transform: translateY(-100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  a.fbj-dom-card::after,
  a.fbj-dom-card .image_card,
  a.fbj-dom-card .spaces-card-overlay,
  a.fbj-dom-card .card-button,
  a.fbj-dom-card .card-button-icon-inner-wrapper {
    transition: none;
  }

  a.fbj-dom-card:hover .image_card,
  a.fbj-dom-card:focus-visible .image_card,
  a.fbj-dom-card:hover .card-button,
  a.fbj-dom-card:focus-visible .card-button,
  a.fbj-dom-card:hover .card-button-icon-inner-wrapper,
  a.fbj-dom-card:focus-visible .card-button-icon-inner-wrapper {
    transform: none;
  }
}

/* Kafle „Zalety inwestycji” — lekki lift (Webflow często robi to przez IX) */
.layout_card_wrap.top_padding {
  transition: transform 180ms var(--fbj-motion-ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .layout_card_wrap.top_padding:hover {
    transform: translateY(-2px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .layout_card_wrap.top_padding {
    transition: none;
  }
  .layout_card_wrap.top_padding:hover {
    transform: none;
  }
}

/* Filtry listy domów — form_main_field_input + btn_main_wrap; select mniejszy (token text-small). */
.fbj-domy-filters select.form_main_field_input {
  font-size: var(--text-small--font-size) !important;
  line-height: var(--text-small--line-height);
  letter-spacing: var(--text-small--letter-spacing);
  font-family: var(--text-small--font-family);
}
.fbj-domy-filters select.form_main_field_input:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 2px;
}
.fbj-domy-filters button.btn_main_wrap {
  color: var(--button--text);
}
.fbj-domy-filters button.btn_main_wrap:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

.fbj-domy-filters .form_main_label {
  font-size: 12px;
  color: color-mix(in srgb, var(--theme--text) 80%, transparent);
}

.fbj-domy-filters .form_main_field_wrap {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
}

.fbj-domy-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--spacing--xsmall, 0.75rem);
  margin-top: var(--spacing--main, 1.5rem);
}

.fbj-domy-pagination__pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--spacing--xsmall, 0.75rem);
}

.fbj-domy-pagination__btn.btn_main_wrap {
  min-width: 44px;
  min-height: 44px;
  color: var(--button--text);
}

.fbj-domy-pagination__page.btn_main_wrap {
  padding-left: 1rem;
  padding-right: 1rem;
}

.fbj-domy-pagination__btn[aria-current="page"] {
  border-color: var(--swatch--brand);
  background-color: var(--swatch--brand);
  color: var(--swatch--light);
}

.fbj-domy-pagination__btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.fbj-domy-pagination__btn:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 3px;
}

.fbj-domy-pagination__ellipsis {
  min-width: 1.5rem;
  color: color-mix(in srgb, var(--theme--text) 68%, transparent);
  text-align: center;
}

.fbj-domy-pagination__summary {
  display: none;
  min-width: 4.5rem;
  color: color-mix(in srgb, var(--theme--text) 72%, transparent);
  text-align: center;
}

@media screen and (max-width: 767px) {
  .fbj-domy-pagination {
    justify-content: space-between;
    gap: 0.75rem;
  }

  .fbj-domy-pagination__pages {
    display: none;
  }

  .fbj-domy-pagination__summary {
    display: block;
  }

  .fbj-domy-pagination__btn.btn_main_wrap {
    flex: 1 1 0;
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }

  .fbj-domy-pagination__btn .btn_main_text {
    white-space: nowrap;
  }
}

/* ─── Dom detail — hero stats ─── */
.fbj-dom-hero-stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: center;
}

.fbj-dom-hero-stats-grid .card_ico_wrap {
  min-width: 0;
}

@media screen and (max-width: 991px) {
  .fbj-dom-hero-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(0.75rem, 4vw, 1.5rem);
    row-gap: clamp(1rem, 4vw, 1.5rem);
  }

  .fbj-dom-hero-stats-grid .card_ico_wrap {
    flex-wrap: nowrap;
    column-gap: clamp(0.5rem, 2vw, 0.875rem);
    row-gap: 0.25rem;
  }

  .fbj-dom-hero-stats-grid .ico_card.xl {
    width: clamp(1.875rem, 6vw, 3rem);
    flex: 0 0 auto;
  }

  .fbj-dom-hero-stats-grid .u-text-small {
    min-width: 0;
    overflow-wrap: break-word;
  }
}

@media screen and (max-width: 479px) {
  .fbj-dom-hero-stats-grid {
    column-gap: 0.75rem;
  }

  .fbj-dom-hero-stats-grid .ico_card.xl {
    width: 1.75rem;
  }
}

/* ─── Sekcja mapy inwestycji — side-by-side layout ─── */

/* Reset przycisków kart — usuń domyślne style button */
button.fbj-inv-card,
button.fbj-inv-all-btn {
  appearance: none;
  -webkit-appearance: none;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
}

/* Sekcja lokalizacji inwestycji: rail kart nad mapą */
.fbj-map-section {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.fbj-map-rail-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.fbj-map-rail-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.fbj-map-all-btn.btn_main_wrap {
  min-height: 3.25rem;
  border: 1px solid var(--theme--border, rgba(13,19,36,.12));
  background: var(--theme--background);
  color: var(--theme--text);
  box-shadow: 0 1px 1px #0e0e0e0a, 0 4px 14px rgba(13, 19, 36, 0.08);
  transition:
    transform 180ms var(--fbj-motion-ease-out),
    border-color 180ms var(--fbj-motion-ease-out),
    box-shadow 180ms var(--fbj-motion-ease-out),
    background-color 180ms var(--fbj-motion-ease-out);
}

.fbj-map-all-btn.btn_main_wrap .btn_main_list {
  padding: 0.875rem 1rem;
}

.fbj-map-all-btn.btn_main_wrap:hover,
.fbj-map-all-btn.btn_main_wrap:focus-visible,
.fbj-map-all-btn.btn_main_wrap.is-active {
  border-color: var(--swatch--brand);
}

.fbj-map-all-btn.btn_main_wrap.is-active {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--swatch--brand) 16%, transparent);
}

.fbj-map-all-btn.btn_main_wrap:active {
  transform: scale(0.985);
}

.fbj-map-rail-nav {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.fbj-map-rail-nav-button {
  width: 3rem;
  height: 3rem;
  border-radius: 999px;
  border: 1px solid var(--theme--border, rgba(13,19,36,.12));
  background: var(--theme--background);
  color: var(--theme--text);
  box-shadow: 0 1px 1px #0e0e0e0a, 0 4px 14px rgba(13, 19, 36, 0.08);
  display: grid;
  place-items: center;
  padding: 0;
  cursor: pointer;
  transition:
    transform 180ms var(--fbj-motion-ease-out),
    border-color 180ms var(--fbj-motion-ease-out),
    box-shadow 180ms var(--fbj-motion-ease-out),
    color 180ms var(--fbj-motion-ease-out);
}

.fbj-map-rail-nav-button:hover,
.fbj-map-rail-nav-button:focus-visible {
  border-color: var(--swatch--brand);
  color: var(--swatch--brand);
}

.fbj-map-rail-nav-button:active {
  transform: scale(0.96);
}

.fbj-map-rail-nav-button:disabled {
  opacity: 0.38;
  cursor: default;
  box-shadow: none;
}

.fbj-map-rail-nav-button__icon {
  width: 1rem;
  height: 1rem;
}

.fbj-map-rail-nav-button__icon.is-left {
  transform: scaleX(-1);
}

.fbj-map-rail {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 0.125rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.fbj-map-rail::-webkit-scrollbar {
  display: none;
}

.fbj-map-rail-card.card-4 {
  position: relative;
  display: block;
  flex: 0 0 clamp(13rem, 19vw, 16rem);
  width: clamp(13rem, 19vw, 16rem);
  aspect-ratio: 1 / 1;
  overflow: hidden;
  isolation: isolate;
  border: 1.5px solid transparent;
  color: inherit;
  scroll-snap-align: start;
  transform: translateZ(0);
  transition:
    transform 200ms var(--fbj-motion-ease-out),
    border-color 200ms var(--fbj-motion-ease-out),
    box-shadow 200ms var(--fbj-motion-ease-out);
}

.fbj-map-rail-card.card-4:hover,
.fbj-map-rail-card.card-4:focus-visible {
  border-color: var(--swatch--brand);
}

.fbj-map-rail-card.card-4.is-active {
  border-color: var(--swatch--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--swatch--brand) 16%, transparent);
}

.fbj-map-rail-card.card-4:active {
  transform: scale(0.985);
}

.fbj-map-rail-card__img,
.fbj-map-rail-card__img-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.fbj-map-rail-card__img {
  object-fit: cover;
  object-position: center center;
  display: block;
  transform: scale(1);
  transition: transform 220ms var(--fbj-motion-ease-out);
}

.fbj-map-rail-card__img-placeholder {
  background: linear-gradient(135deg, rgba(13, 19, 36, 0.12), rgba(13, 19, 36, 0.04));
}

.fbj-map-rail-card__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(7, 15, 30, 0.02) 0%, rgba(7, 15, 30, 0.08) 42%, rgba(7, 15, 30, 0.82) 100%);
}

.fbj-map-rail-card__content {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1rem;
  color: #fff;
  text-align: left;
}

.fbj-map-rail-card__eyebrow {
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.78;
}

.fbj-map-rail-card__title {
  max-width: 13ch;
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  line-height: 1.02;
  font-weight: 500;
  text-wrap: balance;
}

/* Badge „Nowa inwestycja" w karcie railu — dziedziczy kolory z `.tag.green`
   z global webflow CSS, nadpisuje tylko pozycję (absolute w karcie). */
.fbj-map-rail-card__badge.tag {
  position: absolute;
  top: 0.875rem;
  left: 0.875rem;
  inset: 0.875rem auto auto 0.875rem;
  z-index: 3;
  box-shadow: 0 10px 24px rgba(13, 19, 36, 0.18);
}

/* Kontener mapy */
.fbj-map-wrapper {
  position: relative;
  width: 100%;
  height: clamp(34rem, 60vh, 48rem);
  border-radius: var(--radius--main, 12px);
  overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .fbj-map-all-btn.btn_main_wrap:hover,
  .fbj-map-rail-nav-button:hover,
  .fbj-map-rail-card.card-4:hover {
    transform: translateY(-1px);
  }

  .fbj-map-rail-card.card-4:hover .fbj-map-rail-card__img {
    transform: scale(1.035);
  }
}

@media (max-width: 991px) {
  .fbj-map-rail-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .fbj-map-rail {
    gap: 0.875rem;
  }

  .fbj-map-wrapper {
    height: clamp(30rem, 58vh, 40rem);
  }
}

/* Mobile: swipe rail nad mapą */
@media (max-width: 767px) {
  .fbj-map-rail-toolbar__actions {
    width: 100%;
  }

  .fbj-map-all-btn.btn_main_wrap {
    width: 100%;
  }

  .fbj-map-rail-nav {
    display: none;
  }

  .fbj-map-rail-card.card-4 {
    flex-basis: min(74vw, 16rem);
    width: min(74vw, 16rem);
  }

  .fbj-map-rail-card__content {
    padding: 0.875rem;
  }

  .fbj-map-wrapper {
    height: clamp(26rem, 65vh, 34rem);
  }
}

/* ─── Karta informacyjna nad mapą (zamiast Mapbox popup) ─── */

/* Kontener pozycjonowany nad mapą — lewy dolny róg */
.fbj-map-infocard-wrap {
  position: absolute;
  bottom: 1.25rem;
  left: 1rem;
  z-index: 5;
  width: min(calc(100% - 5rem), 17rem);
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity 200ms var(--fbj-motion-ease-out), transform 200ms var(--fbj-motion-ease-out);
}

@starting-style {
  .fbj-map-infocard-wrap {
    opacity: 0;
    transform: translateY(0.375rem) scale(0.98);
  }
}

/* Przycisk zamknięcia — absolutny względem wrap, poza linkiem */
.fbj-map-infocard__close {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  z-index: 6;
  width: 1.625rem;
  height: 1.625rem;
  border-radius: var(--radius--round, 50%);
  background: var(--theme--background);
  border: 1.5px solid var(--theme--border, rgba(13,19,36,.15));
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  transform: translateZ(0);
  transition:
    transform 140ms var(--fbj-motion-ease-out),
    background-color 160ms var(--fbj-motion-ease-out),
    border-color 160ms var(--fbj-motion-ease-out);
  padding: 0;
  font: inherit;
}
.fbj-map-infocard__close:hover {
  background: var(--theme--border, rgba(13,19,36,.08));
  border-color: var(--swatch--brand);
}
.fbj-map-infocard__close:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 2px;
}
.fbj-map-infocard__close:active {
  transform: scale(0.94);
}

/* Karta = cały link */
.fbj-map-infocard.card-4 {
  display: block !important;
  width: 100%;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 8px 28px rgba(13,19,36,.18);
  transform: translateZ(0);
  transition: transform 180ms var(--fbj-motion-ease-out), box-shadow 180ms var(--fbj-motion-ease-out);
}
.fbj-map-infocard.card-4:focus-visible {
  box-shadow: 0 12px 36px rgba(13,19,36,.24);
  transform: translateY(-2px);
}
.fbj-map-infocard.card-4:focus-visible {
  outline: 2px solid var(--swatch--brand);
  outline-offset: 2px;
}

@media (hover: hover) and (pointer: fine) {
  .fbj-map-infocard.card-4:hover {
    box-shadow: 0 12px 36px rgba(13,19,36,.24);
    transform: translateY(-2px);
  }
}

/* Zdjęcie 16:9 */
.fbj-map-infocard__img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* Sekcja tekstowa */
.fbj-map-infocard__body {
  padding: 0.75rem 0.875rem 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.fbj-map-infocard__title {
  margin: 0;
  line-height: 1.3;
}
.fbj-map-infocard__addr {
  margin: 0;
  opacity: 0.7;
}
.fbj-map-infocard__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.375rem;
  font-size: var(--text-small--font-size);
  color: var(--swatch--brand);
  font-weight: 500;
}

/* .fbj-map-wrapper musi być relative dla absolutnego pozycjonowania karty */
.fbj-map-wrapper {
  position: relative;
}

@media (prefers-reduced-motion: reduce) {
  .btn_main_wrap,
  .btn_play_wrap,
  .btn_main_icon,
  .dropdown_height,
  .dropdown_arrow,
  .dropdown_link,
  .toggle-button-m,
  .button-toggle-m,
  .accordion-item-title,
  .accordion-item-title .u-text-h5,
  .accordion-item-content,
  .accordion-item-content-details,
  .accordion-item-icon,
  .fbj-map-all-btn.btn_main_wrap,
  .fbj-map-rail-nav-button,
  .fbj-map-rail-card.card-4,
  .fbj-map-rail-card__img,
  .fbj-map-infocard-wrap,
  .fbj-map-infocard__close,
  .fbj-map-infocard.card-4 {
    transition: none;
  }

  .btn_main_wrap:hover,
  .btn_play_wrap:hover,
  .btn_main_wrap:active,
  .btn_play_wrap:active,
  .toggle-button-m:active,
  .accordion-item-title:hover .u-text-h5,
  .fbj-inv-all-btn.card-4:hover,
  .fbj-inv-all-btn.card-4:active,
  .fbj-inv-card.card-4:hover,
  .fbj-inv-card.card-4:active,
  .fbj-inv-card.card-4:hover .card-image-4,
  .fbj-inv-card.card-4:hover .card-tag,
  .fbj-map-infocard.card-4:hover,
  .fbj-map-infocard.card-4:focus-visible,
  .fbj-map-infocard__close:active {
    transform: none;
  }
}