:root {
    --kolor0: #a6a6a6;
    --kolor1: #23408e;
    --kolor2: #71bf44;
    --kolor3: #01ac50;
    --kolor4: #666666;
    --kolor5: #707070;
    --swiper-theme-color: #23408e;
    --color-txt2: #23408e;
    --w1: 1110px;
    --w2: 1280px;
}

#mapa-lokalizacja-item {
    --kmapa-1: #23408e !important;
    --kmapa-2: #ffffff !important;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
    background: transparent;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.nav-links {
    padding-top: 35px;
    padding-bottom: 5px;
    display: flex;
    justify-content: flex-start;
    gap: 10px;
}

.nav-links .page-numbers {
    padding: 0.5em 0.7em;
    line-height: 1;
    border: 1px solid var(--kolor1);
    color: var(--kolor1);
    background: #fff;
    border-radius: 0.75rem;
    font-weight: 600;
    font-size: 14px;
}

.nav-links .page-numbers.current {
    color: #fff;
    background: var(--kolor1);
}

.nav-links .page-numbers.next,
.nav-links .page-numbers.prev {
    border: none;
}

html,
body {
    font-family: Montserrat, sans-serif;
    font-size: 17px;
    line-height: 1.6;
    text-transform: none;
    color: var(--kolor4);
}

body {
    overflow-x: hidden;
}

#formularzkontakt {
    font-family: Montserrat, sans-serif;
}

#formularzkontakt form.formularz_bs .akcja .button {
    background: var(--kolor1);
    border-radius: 0.75rem;
}

.informacja-dodatkowa.inf-v2 {
    display: none;
    position: absolute;
    width: 684px;
    max-width: 90vw;
    background: #000;
    right: 40px;
    top: 140px;
    height: auto;
    color: #fff;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.5);
    border-radius: 0;
    z-index: 999;
    padding: 30px;
    overflow-y: scroll;
}

.informacja-dodatkowa.inf-v2 .zamknij {
    position: absolute;
    cursor: pointer;
    top: 20px;
    right: 20px;
    font-size: 20px;
}

.informacja-dodatkowa.inf-v2 .tytul-info {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 30px;
}

.informacja-dodatkowa.inf-v2 .txt {
    font-size: 13px;
    line-height: 1.3;
}

#loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100dvh;
    display: flex;
    background: rgba(255, 255, 255, 0.5);
    z-index: 9;
}

#loader .spinner {
    display: block;
    margin: auto;
    font-size: 30px;
    color: var(--kolor1);
}

#fullcontent .load {
    height: 100dvh;
    overflow: hidden;
}

p {
    line-height: 1.3;
    margin-bottom: 1em;
}

p:last-child {
    margin-bottom: 0;
}

.container {
    margin-left: auto;
    margin-right: auto;
}

.formpass input[type="password"] {
    border: 1px solid #000;
    padding: 0.5em 1em;
}

.formpass input[type="submit"] {
    padding: 0.5em 1em;
    background: #000;
    color: #fff;
    border-radius: 0;
}

.smb {
    margin-bottom: 100px;
}

a {
    text-decoration: none;
}

#Header a {
    text-decoration: none;
}

#hero .swiperHero {
    z-index: 3;
}

#hero .swiperHero[data-slide="0"] {
    z-index: 0;
}

#hero .swiperHero .swiper-wrapper {
    width: 100vw;
    height: calc(100% - 70px);
}

#hero .swiper-slide {
    overflow: hidden;
}

#hero .swiperThumb .swiper-slide:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.5;
    transition: 0.3s;
}

#hero .swiperThumb .swiper-slide-thumb-active:after {
    opacity: 0;
}

#hero .swiper-scrollbar {
    width: 90%;
    margin: auto;
    max-width: var(--w1);
    background: none;
    position: relative;
}

#hero .swiper-scrollbar:before {
    content: "";
    width: 100%;
    height: 1px;
    top: 2px;
    background: #fff;
    opacity: 0.6;
    position: absolute;
}

#hero .swiper-scrollbar .swiper-scrollbar-drag {
    height: 5px;
    background: #fff;
}

.buttons {
    display: flex;
    gap: 5px;
}

.btn {
    --borderradius: 0;
    --fontsize: 11px;
    border: 1px solid var(--kolor1);
    border-radius: var(--borderradius);
    padding: 0.8em 1.5em;
    color: var(--kolor1);
    background: #fff;
    font-weight: 600;
    font-size: var(--fontsize);
    cursor: pointer;
    transition: 0.3s;
    text-align: center;
}

.btn:hover {
    color: #fff;
    background: var(--kolor1);
}

.btn[data-active="1"] {
    background: var(--kolor1);
    color: #fff;
}

.btn.btn2 {
    --fontsize: 15px;
    padding: 0.5em 2em;
}

.btn.btn-galeria {
    --fontsize: 12px;
    padding: 0.5em 2em;
    text-transform: uppercase;
}

.btn.btn-galeria[data-active="-1"] {
    background: none;
    border-color: #fff;
    color: #fff;
}

.btn.btn-galeria[data-active="1"] {
    background: #fff;
    border-color: #fff;
    color: #000;
}

[data-dohidden="-1"] [data-hidden="1"] {
    display: none;
}

[data-dohidden="-1"] [data-hidden="-1"] {
    display: block;
}

[data-dohidden="-1"] .czytaj-wiecej {
    display: inline;
    text-decoration: underline;
    cursor: pointer;
    color: var(--kolor1);
}

[data-dohidden="1"] [data-hidden="1"] {
    display: block;
}

[data-dohidden="1"] [data-hidden="-1"] {
    display: none;
}

[data-dohidden="1"] span[data-hidden="1"] {
    display: inline;
}

[data-dohidden="1"] .czytaj-wiecej {
    display: none;
}

#galeria {
    padding-top: 98px;
}

#galeria .swiper-wrapper {
    margin-bottom: 30px;
    align-items: stretch;
}

/* 2-up gallery cards (image/video + caption) */
.gallery__swiper .gallery__slide {
    height: auto;
    cursor: pointer;
}

.gallery__swiper .gallery__figure {
    margin: 0;
}

.gallery__swiper .gallery__media {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f0f0f3;
}

.gallery__swiper .gallery__media img,
.gallery__swiper .gallery__media video {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.gallery__swiper .gallery__slide:hover .gallery__media img {
    transform: scale(1.04);
}

.gallery__swiper .gallery__caption {
    margin-top: 14px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--kolor1);
}

#HeaderFull .tlov .tl1 {
    fill: rgba(0, 0, 0, 0.02);
}

#HeaderFull .tlov .tl2 {
    stroke: rgba(0, 0, 0, 0.09);
}

#cechy .swiper-slide {
    width: auto;
}

#ogolne {
    text-align: left;
    position: relative;
    z-index: 1;
    font-family: "Montserrat";
    font-size: 16px;
    padding-bottom: 50px;
}

#ogolne h1 {
    font-size: 2rem;
    padding: 0.2em 0 2rem;
    line-height: 1.3em;
}

#ogolne h2 {
    line-height: normal;
    font-size: 2rem;
    line-height: 1.3em;
}

#ogolne h3 {
    font-size: 20px;
    margin: 1rem 0 0;
    line-height: 1.3em;
}

#ogolne .scLok {
    margin-bottom: 0;
    font-size: 0.8rem;
    color: #4a4a4a;
}

#ogolne .scLok span {
    display: inline-block;
    margin: auto 0.5rem;
}

#ogolne ul li,
#ogolne ol li {
    list-style-type: disc;
    margin-left: 1em;
    margin-bottom: 0.5em;
}

#ogolne ul li.blocks-gallery-item,
#ogolne ol li.blocks-gallery-item {
    margin-left: 0;
}

#ogolne ul li ul,
#ogolne ol li ul {
    margin-top: 0.5em;
}

#ogolne .polityka h3 + ol,
#ogolne .polityka h3 + ul {
    margin-left: 1em;
}

#ogolne a {
    color: rgba(0, 0, 0, 0.7);
}

#ng3dfull {
    height: calc(100vh - 135px);
}

#dane-dodatkowe-galeria .swiper-slide {
    width: auto;
}

#dane-dodatkowe-galeria .swiper-button-disabled {
    opacity: 0.5;
    cursor: auto;
}

.dynamic-swiper .play-overlay {
    opacity: 1 !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.dynamic-swiper .play-overlay.opacity-0 {
    opacity: 0 !important;
    pointer-events: none !important;
}

.dynamic-swiper .swiper-slide-active .video-player {
    transform: scale(1.02);
    z-index: 10;
}

.dynamic-swiper .swiper-slide-active video.video-player {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.dynamic-swiper .swiper-slide-active .play-overlay i {
    animation: pulse 2s infinite;
}

.dynamic-swiper[data-swip*="plany"],
.dynamic-swiper[data-swip*="plan"] {
    height: 100vh !important;
}

.dynamic-swiper[data-swip*="plany"] .swiper-slide,
.dynamic-swiper[data-swip*="plany"] .swiper-slide,
.dynamic-swiper[data-swip*="plan"] .swiper-slide,
.dynamic-swiper[data-swip*="plan"] .swiper-slide {
    padding: 2.5rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dynamic-swiper[data-swip*="plany"] img,
.dynamic-swiper[data-swip*="plan"] img {
    height: 100% !important;
    width: 100% !important;
    object-fit: contain !important;
    max-height: none !important;
    max-width: none !important;
}

.dynamic-swiper[data-swip*="plany"] .swiper-slide-active img,
.dynamic-swiper[data-swip*="plan"] .swiper-slide-active img {
    box-shadow: none !important;
}

.play-overlay {
    opacity: 1;
    transition: opacity 0.3s ease;
}

.play-overlay.opacity-0 {
    opacity: 0;
    pointer-events: none;
}

@keyframes pulse {
    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }
}

video::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-radius: 0;
    border-top-color: white;
    animation: spin 1s ease-in-out infinite;
    display: none;
}

video.loading::before {
    display: block;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@media only screen and (max-width: 48rem) {
    .smb {
        margin-bottom: 30vw;
    }

    #ng3dfull {
        height: calc(100vh - 110px);
    }

    #kontakt .items-grid-kontakt-formularz_bs {
        display: grid !important;
    }

    #kontakt .items-grid-kontakt-formularz_bs h1 {
        font-size: 7vw !important;
    }

    #kontakt .items-grid-kontakt-formularz_bs .dimg {
        position: relative !important;
        margin: 15vh auto auto !important;
        max-width: 40vw;
    }
}

.hero-information-box {
    background-color: rgba(255, 255, 255, 0.9);
    transform: translateX(100%);
    min-width: 23rem;

    .hero-information-box__title {
        color: #283583;
        font-family: Montserrat;
        font-size: 1.5rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        padding-right: 30%;
    }

    .hero-information-box__content {
        color: #1f1f1f;
        font-family: Lato;
        font-size: 0.8rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        max-width: 70%;
        margin-top: 0.2rem;
    }

    .hero-information-box__logo {
        right: 1.3rem;
        bottom: 1.2rem;
    }
}

/* Defensive clip for the multi-notification info-box slider. Clipping otherwise
   relies solely on Swiper's own `.swiper{overflow:hidden}` rule, which loads from
   the jsdelivr CDN; until that stylesheet applies (load race / FOUC) the inactive
   notification slide spills out onto the hero photo (e.g. "Dostępność biura
   sprzedaży" leaking left of the "Sezon na rabaty" box). Clip locally so the box
   always contains its slides regardless of CDN timing. The active slide's inset
   brand logo stays within the box, so it is unaffected. */
.hero-information-box .swiper {
    overflow: hidden;
}

.hero__characteristics {
    max-width: 1300px;
    margin: auto;
    margin-top: -1rem;
    padding: 0 25px;

    @media only screen and (max-width: 48rem) {
        margin-top: 2rem;
    }
}

.hero__img-container {
    @media only screen and (max-width: 48rem) {
        background-position: 49%;
    }
}

.hero__slide--video {
    position: relative;
    overflow: hidden;
}

.hero__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 70% 90%;
}

@media only screen and (min-width: 64rem) {
    .hero__video {
        object-position: center 90%;
    }
}

.hero-characteristics__swiper.is-locked .hero-characteristics__swiper-wrapper {
    justify-content: center;
}

.hero-characteristic {
    height: 92px;
    border-radius: 0;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

@media only screen and (max-width: 576px) {
    .hero-characteristic {
        height: 110px;
    }
}

.hero-characteristic__text {
    color: #283583;
    text-align: center;
    font-family: Montserrat;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    max-width: 100%;
}

.hero-characteristics__swiper {
    .hero-characteristics__swiper-pagination {
        text-align: center;
        margin-top: 16px;

        .swiper-pagination-bullet {
            margin: 0 4px;
            width: 12px;
            height: 12px;
            color: #838ab5;
        }

        .swiper-pagination-bullet-active {
            color: #283583;
        }
    }
}

.localization {
    max-width: 1080px;
    padding: 0 20px;
    margin: 5.2rem auto 2.9rem;

    @media only screen and (max-width: 48rem) {
        margin-top: 3.8rem;
    }
}

.spravia__badge {
    color: #283583;
    font-family: Montserrat;
    font-size: 0.7rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.1rem;
    text-transform: uppercase;
    border-radius: 0;
    background: #dfe1ed;
    display: inline-block;
    padding: 0.7rem 1.2rem;
    gap: 0.6rem;
    margin-bottom: 0.7rem;

    &.spravia__badge--height-holder {
        visibility: hidden;
    }
}

.localization__text {
    color: #283583;
    font-family: Montserrat;
    font-size: 2.3rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    max-width: 55rem;
}

@media screen and (max-width: 48rem) {
    .localization__text {
        font-size: 1.5rem;
    }
}

#lokalizacja-mapa {
    max-width: 1080px;
    margin: auto;
}

.basic-informations-icons {
    margin: 4.4rem auto 7rem;
    /* max-width: 71rem; */

    @media screen and (max-width: 48rem) {
        margin: 2.8rem auto 2.1rem;
    }
}

.basic-informations-icons__list {
    display: flex;
    gap: 0.9rem;
    color: #283583;
    font-family: Montserrat;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    align-items: center;
    line-height: 1rem;
    margin: 0.7rem 0 3.4rem;

    @media screen and (max-width: 48rem) {
        flex-wrap: wrap;
        gap: 0.2rem;
        font-size: 0.8rem;

        svg {
            height: 14px;
            width: 14px;
        }
    }
}

/* task 149971: multi-stage "Podstawowe informacje" (Prystora II etap). Each stage =
   a green header above its own stats row; the row reuses .basic-informations-icons__list.
   The wrapper carries the outer spacing the standalone/legacy list otherwise has. */
.basic-informations-icons__stages {
    margin: 0.7rem 0 3.4rem;

    @media screen and (max-width: 48rem) {
        margin: 0.7rem 0 2rem;
    }
}

.basic-informations-icons__stage + .basic-informations-icons__stage {
    margin-top: 1.1rem;
}

.basic-informations-icons__etap {
    display: block;
    color: #76b82a;
    font-family: Montserrat;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.1;
    margin: 0 0 0.4rem;
}

/* Inside a stage the row sits tight under its green header; the wrapper owns outer gaps. */
.basic-informations-icons__stages .basic-informations-icons__list {
    margin: 0;
}

.spravia-icons__slider-container {
    position: relative;
    display: flex;
    align-items: center;
}

.spravia-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    gap: 0.9rem;
}

.spravia-icon__text {
    max-width: 12rem;
    color: #283583;
    text-align: center;
    font-family: Lato;
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.2rem;
}

.spravia-icons__swiper-arrow-prev {
    position: absolute;
    left: -2.1rem;
    cursor: pointer;

    @media screen and (max-width: 80rem) {
        left: -1.1rem;
    }
}

.spravia-icons__swiper-arrow-next {
    position: absolute;
    right: -2.5rem;
    cursor: pointer;

    @media screen and (max-width: 80rem) {
        right: -1.5rem;
    }
}

.spravia-icons__swiper-arrow-next.swiper-button-disabled path,
.spravia-icons__swiper-arrow-prev.swiper-button-disabled path {
    fill: grey;
}

.communication {
    margin: 5.6rem auto 4.2rem;
    /* max-width: 71rem; */

    @media screen and (max-width: 48rem) {
        margin-top: 0;
    }
}

.communication-icons__slider-container {
    margin-top: 4.2rem;
}

.communication-icon__text {
    font-weight: 400;

    strong {
        font-weight: 600;
    }
}

.spravia__bigger-title {
    color: #283583;
    font-family: Montserrat;
    font-size: 52px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1;
}

@media screen and (max-width: 48rem) {
    .spravia__bigger-title {
        font-size: 1.5rem;
    }
}

.spravia-bigger-title__second-color {
    color: #76b82a;
}

.spravia__content-text {
    max-width: 32rem;
    color: #1f1f1f;
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;
}

.spravia__content-text strong {
    color: #283583;
}

.spravia__smaller-title {
    color: #283583;
    font-family: Montserrat;
    font-size: 2.1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

@media screen and (max-width: 48rem) {
    .spravia__smaller-title {
        font-size: 1.5rem;
    }
}

.color__primary {
    color: #283583;
}

.spravia-smaller-title__second-color,
.color__secondary {
    color: #76b82a;
}

.color__tertiary {
    color: #838ab5;
}

.middle-alternating-paragraph__image-container {
    position: relative;
}

.middle-alternating-paragraphs__section .middle-alternating-paragraph__image {
    width: auto;
    max-width: 100%;
    height: auto;
}

.middle-alternating-paragraph__image-container--logo-top::before {
    bottom: unset;
    right: unset;
    top: 8px;
    display: block;
    left: 8px;
    z-index: 2;
}

#zielone-otoczenie {
    /* max-width: 71rem;
    margin: 4.4rem auto 0; */

    .spravia__smaller-title {
        margin-bottom: 0.9rem;
    }

    @media screen and (max-width: 48rem) {
        margin-top: 2.5rem;

        .spravia__smaller-title {
            font-size: 1.2rem;
        }
    }
}

.wypelnij {
    gap: 1.1rem;
}

.gsap.filling-chars {
    color: #838ab5;

    .word {
        display: inline-block;
        white-space: nowrap;
    }

    .char {
        display: inline-block;
        color: inherit;
        transition: color 0.3s ease;

        &.is-filled {
            color: #283583;
        }
    }
}

/*
.relative {
  position: relative;
}
*/

.accent {
    width: min(100vw, 100vh);
    height: min(100vw, 100vh);
    position: absolute;
    top: 50%;
    z-index: -1;
    opacity: 0.05;
    user-select: none;
    pointer-events: none;

    & svg {
        display: block;
        width: 100%;
        height: 100%;
    }
}

.accent-left .accent {
    left: -35%;
}

.accent-right .accent {
    right: -35%;
}

@media (min-width: 2561px) {
    .accent-left .accent {
        left: -20%;
    }

    .accent-right .accent {
        right: -20%;
    }
}

#hero > div:first-child:after,
#kontakt:before {
    content: "";
    display: block;
    width: 100%;
    height: 20rem;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1;
    background: linear-gradient(0deg, transparent, rgba(34, 49, 128, 0.05));
}

#kontakt:before {
    height: 10rem;
    top: unset;
    bottom: 100%;
    background: linear-gradient(180deg, transparent, rgba(34, 49, 128, 0.05));
}

#kontakt {
    background-color: rgba(34, 49, 128, 0.05);
}

.spravia__button {
    display: flex;
    width: fit-content;
    margin: 1.9rem 0 1.1rem;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #ffffff;
    cursor: pointer;

    & * {
        user-select: none;
    }

    @media screen and (max-width: 48rem) {
        margin-bottom: 0.8rem;
    }

    & .spravia__button-text {
        margin-right: 0;
        padding: 0.875rem 1rem;
        background: #76b82a;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        transition: all 0.3s ease;

        & span {
            display: inline-block;
            padding-right: 0.5rem;
            transform: translateY(1px);
            transition: all 0.3s ease;
        }
    }

    & .spravia__button-icon {
        margin-left: 0;
        overflow: hidden;
        padding: 0.875rem;
        background: #76b82a;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        position: relative;
        transition: all 0.3s ease;

        & svg {
            display: block;
            width: 14px;
            height: auto;

            &.spravia__button-icon-left {
                transform: translate(calc(-3rem - 50%), -50%);
                position: absolute;
                top: 50%;
                left: 50%;
                z-index: 1;
                transition: all 0.3s ease;
            }

            &.spravia__button-icon-right {
                transform: translateX(0);
                transition: all 0.3s ease;
            }
        }
    }

    &:active,
    &:hover {
        & .spravia__button-text {
            margin-right: 0.25rem;
            background-color: #009e3d;
            border-radius: 0;

            & span {
                padding-right: 0;
            }
        }

        & .spravia__button-icon {
            margin-left: 0.25rem;
            background-color: #009e3d;
            border-radius: 0;

            & .spravia__button-icon-left {
                transform: translate(-50%, -50%);
            }

            & .spravia__button-icon-right {
                transform: translateX(3rem);
            }
        }
    }

    &:last-child {
        margin-bottom: 0;
    }

    &.spravia__button--no-arrow {
        & .spravia__button-text {
            margin-right: 0;
            border-radius: 0;

            & span {
                padding: 0;
            }
        }

        & .spravia__button-icon {
            display: none;
        }
    }

    &.spravia__button--secondary {
        & .spravia__button-text {
            background: transparent;
            border: 1px solid #283583;
            color: #838ab5;
        }

        &.is-active,
        &:hover,
        &:active {
            & .spravia__button-text {
                background: #283583;
                color: #ffffff;
            }
        }
    }
}

.flex.flex-row .spravia__button {
    margin-top: 0;
    margin-bottom: 0;
}

.map__link {
    display: block;
    color: #283583;
    text-align: right;
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration-line: underline;
    margin-top: 12px;
    cursor: pointer;

    @media screen and (max-width: 48rem) {
        text-align: center;
    }
}

form.formularz_bs .akcja .button {
    padding: 0.875rem 1.5rem;
    font-family: Montserrat, sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.05em !important;
    color: #ffffff;
    cursor: pointer;
    transition: all 0.3s ease;

    &:active,
    &:hover {
        background-color: #76b82a !important;
    }
}

.spravia__content-text-container {
    position: relative;
}

[data-show-target] {
    transition: height 0.3s ease;
}

[data-show-target]:not(.is-expanded) {
    overflow: hidden;
}

section[data-show-target]:not(.is-expanded) + section {
    margin-top: 0;
}

picture {
    display: block;
}

.spravia__subtitle {
    margin: 0;
    color: #838ab5;
    font-family: Montserrat;
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

@media screen and (max-width: 48rem) {
    .spravia__subtitle {
        font-size: 1.125rem;
    }
}

/* Home gallery — fullscreen lightbox */
body.gallery-lightbox-open {
    overflow: hidden;
}

.gallery__lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem clamp(1rem, 4vw, 4rem);
    background: rgba(18, 22, 38, 0.94);
}

.gallery__lightbox.is-open {
    display: flex;
}

.gallery__lightbox-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.gallery__lightbox-logo {
    color: #fff;
    font-weight: 700;
    font-size: 1.25rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.gallery__lightbox-tabs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.gallery__lightbox-tab {
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
    background: transparent;
    border-radius: 2px;
    padding: 0.5rem 1.1rem;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.gallery__lightbox-tab.is-active {
    background: var(--kolor1);
    color: #fff;
    border-color: var(--kolor1);
}

/* Full/zoom view: tabs get a green hover (on-page tabs keep their blue hover). */
.gallery__lightbox-tab:hover {
    background: #76b82a;
    color: #fff;
    border-color: #76b82a;
}

.gallery__lightbox-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

/* Close sits ON the photo's top-right corner (per Figma), not in the header. */
.gallery__lightbox-close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 5;
    color: var(--kolor1);
    background: rgba(255, 255, 255, 0.9);
    border: none;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 2px;
    font-size: 0.9rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.gallery__lightbox-swiper {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

.gallery__lightbox-swiper .swiper-slide {
    height: 100%;
}

.gallery__lightbox-swiper .gallery__figure {
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.gallery__lightbox-swiper .gallery__media {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.gallery__lightbox-swiper .gallery__media img,
.gallery__lightbox-swiper .gallery__media video {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: contain; /* zoom view = show the whole photo, never crop */
    display: block;
}

.gallery__lightbox-swiper .gallery__caption {
    margin-top: 0.75rem;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
    font-size: 0.8rem;
}

.gallery__lightbox-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
}

.gallery__lightbox-progress {
    position: relative;
    width: 100%;
    height: 4px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.25);
    overflow: hidden;
}

.gallery__lightbox-progress-fill {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: #fff;
    transition: width 0.3s ease;
}

.gallery__lightbox-nav {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
}

.gallery__lightbox-prev,
.gallery__lightbox-next {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 2px;
    border: none;
    background: #fff;
    color: var(--kolor1);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease;
}

.gallery__lightbox-prev.swiper-button-disabled,
.gallery__lightbox-next.swiper-button-disabled {
    opacity: 0.35;
    cursor: default;
}

.gallery__lightbox-prev .gallery__chevron,
.gallery__lightbox-next .gallery__chevron {
    width: 0.8rem;
    height: auto;
    display: block;
}

.gallery__lightbox-prev .gallery__chevron {
    transform: scaleX(-1); /* mirror the brand chevron to point left */
}

.swiper-pagination-bullet {
    cursor: pointer;
}

.break-word {
    word-break: break-word;
}

#bs {
    position: relative;

    img {
        user-select: none;
    }

    &:before {
        content: "";
        display: block;
        width: 100%;
        height: 150%;
        position: absolute;
        top: -25%;
        left: 0;
        z-index: -1;
        background: linear-gradient(
            0deg,
            transparent,
            rgba(34, 49, 128, 0.05),
            transparent
        );
    }

    & .bs-inner {
        margin-top: 54px;
        margin-bottom: 96px;
        margin-left: auto;
        margin-right: auto;

        & .bs-krotki__carousel {
            padding-left: calc(var(--spacing) * 10);

            & .swiper-slide {
                display: flex;

                & * {
                    user-select: none;
                }

                @media (max-width: 400px) {
                    flex-direction: column;
                    text-align: center;

                    & > img {
                        margin: 0 auto;
                    }
                }
            }

            &:after {
                content: "";
                display: block;
                width: 15%;
                height: 100%;
                position: absolute;
                top: 0;
                right: 0;
                z-index: 1;
                background: linear-gradient(
                    90deg,
                    transparent,
                    rgba(255, 255, 255, 0.625)
                );
                pointer-events: none;
            }
        }

        & .bs-krotki__pagination {
            text-align: center;
            margin-top: 8px;
            margin-bottom: 24px;

            & .swiper-pagination-bullet {
                margin: 0 4px;
                width: 12px;
                height: 12px;
                color: #838ab5;
            }

            & .swiper-pagination-bullet-active {
                color: #283583;
            }
        }
    }
}

.spravia__header {
    transform: translateY(0);
    transition: transform 1.3s ease;
}

.hero__swiper {
    transform: translateY(-1.3rem);
    scale: 100%;
    transition: all 1.3s ease;
    position: relative;
}

.hero-information-box {
    transform: translateX(0);
    transition: transform 1.3s ease;
}

body:not(.is-loaded) {
    /* overflow-y: hidden; */
    .spravia__header {
        transform: translateY(-100%);
    }

    .hero__swiper {
        transform: translateY(-100%);
        scale: 130%;
    }

    .hero-information-box {
        transform: translateX(100%);
    }
}

.hero__swiper-navigation {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.hero__swiper .hero__swiper-button-prev,
.hero__swiper .hero__swiper-button-next {
    margin: auto;
    left: 25px;
    bottom: 40px;
    cursor: pointer;
    top: unset;
}
.hero__swiper .hero__swiper-button-next {
    right: 25px;
    left: unset;
}

#formularzkontakt .container {
    border-radius: 0.75rem;
}

#formularzkontakt .content-form .rounded-tl-xl {
    border-radius: 0.75rem 0 0 0.75rem;
}

#formularzkontakt form.formularz_bs .inputy .input {
    border-radius: 0.75rem;
}

#formularzkontakt form.formularz_bs .inputy .input::before {
    border-radius: 0.75rem;
}

.swiper.is-locked {
    overflow: hidden;
}

.swiper.is-locked .swiper-slide {
    margin: 0 !important;
    box-sizing: border-box;
}

.swiper.is-locked .swiper-wrapper {
    gap: 19px;
}

.swiper-backface-hidden .swiper-slide {
    transform: none;
}

.scroll-icon {
    position: absolute;
}


.middle-alternating-paragraphs__section {
    padding: 0;
}

.middle-alternating-paragraphs__section .mt-24 {
    margin-top: 80px;
}

.middle-alternating-paragraphs__section ul {
    max-width: 32rem;
    color: #1f1f1f;
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;

    & > li {
        padding-left: 1.75rem;
        position: relative;

        &:before {
            content: '';
            display: block;
            width: 8px;
            height: 8px;
            position: absolute;
            top: .5rem;
            left: .5rem;
            background: #DFE1ED;
        }

        &:not(:last-child) {
            margin-bottom: .5em;
        }
    }

    &:not(:last-child) {
        margin-bottom: 1em;
    }
}
/* === "Dni Otwarte" promo banner (Odoo 150000, zaspawysoko approval test) === */
/* Solid-white banner above the hero. Navy #283583 / green #76b82a match the
   adjacent hero info-box + titles (the newer-component drift colors, not the
   :root --kolor* values). Rendered only on zaspawysoko (host-gated in the
   partial); on every other fleet site the partial outputs nothing. */

.dni-otwarte {
    /* Fixed-header height: .spravia bar (50px) + .inwestycja bar (60px) = 110px
       below xl. The banner content must clear this so the semi-transparent nav
       text never overlaps the banner text. Single source of truth — flips to
       135px at xl in the 80rem media query below, in lockstep with the bar.
       NOTE: assumes the .komunikaty marquee bar is NOT shown (it stays `hidden`
       unless ACF `komunikaty` options exist; zaspawysoko has none, per the
       approved design). If komunikaty is ever enabled here, add its height to
       --do-header (and the xl value below) or the nav would overlap the banner. */
    --do-header: 110px;
    position: relative; /* keeps the banner under the fixed header (z-9998); no stacking tricks needed */
    background: #fff;
    width: 100%;
}

.dni-otwarte__inner {
    max-width: var(--w1);
    margin: 0 auto;
    /* top = full header clearance + breathing room; sides = 25px (the --w1
       content-gutter idiom, matches .hero__characteristics directly below);
       bottom = the ONLY gap before the hero slider — tune this one knob to the
       approved mock, do NOT re-add hero top padding. */
    padding: calc(var(--do-header) + 1.25rem) 25px 1.75rem;
    display: grid;
    grid-template-columns: 3fr 1fr;
    align-items: start;
    column-gap: 1.5rem;
}

/* ---- Left column (3/4): heading -> offer -> body -> CTA, graduated ---- */
.dni-otwarte__main {
    min-width: 0;
}

.dni-otwarte__heading {
    margin: 0;
    font-family: Montserrat;
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 1.1;
    letter-spacing: -0.01em;
}

.dni-otwarte__title {
    color: #76b82a;   /* green, matching .dni-otwarte__dates — task 150137 */
}

.dni-otwarte__dates {
    color: #76b82a;
    white-space: nowrap;
}

/* Offer line — second step down, emphasised. */
.dni-otwarte__offer {
    margin: 0.5rem 0 0;
    max-width: 46rem;
    font-family: Montserrat;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.25;
    color: #283583;
}

/* Body copy — smallest step. */
.dni-otwarte__body {
    margin: 0.55rem 0 0;
    max-width: 46rem;
    font-family: Lato;
    font-weight: 400;
    font-size: 0.95rem;
    line-height: 1.4;
    color: #1f1f1f;
}

/* CTA — reuse the brand spravia_button(); just tighten its margins here. */
.dni-otwarte__cta.spravia__button {
    margin: 0.9rem 0 0;
}

/* ---- Right column (1/4): location + hours, navy, smaller ------------ */
.dni-otwarte__aside {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    color: #283583;
    font-family: Lato;
    font-size: 1.3rem;     /* desktop: larger location + hours (mobile kept at 1rem below) */
    line-height: 1.3;
}

.dni-otwarte__location {
    display: flex;
    align-items: center;   /* big pin vertically centred on the 2-line address */
    gap: 0.55em;
}

/* Location pin ≈ height of the 2-line address (incl. the line gap). The clock icon
   is gone, so the schedule is indented to line up with the address text. em units so
   the pin + indent scale together with the column font-size. */
.dni-otwarte__icon {
    color: #283583;        /* drives the inline-SVG pin fill via currentColor */
    height: 2.6em;         /* = 2 lines of the address (2 × 1.3 line-height) */
    width: auto;
    flex: 0 0 auto;
}

.dni-otwarte__hours {
    padding-left: 2.7em;   /* pin width (~2.16em) + 0.55em gap → aligns with address */
}

.dni-otwarte__location-text,
.dni-otwarte__hours-text {
    display: flex;
    flex-direction: column;
}

/* schedule (days + hours) is semibold; city stays regular weight */
.dni-otwarte__hours-text {
    font-weight: 600;
}

.dni-otwarte__hours-line {
    white-space: nowrap;
}

/* ---- Neutralize the hero's own top padding when the banner is present.
   hero.php keeps pt-[50px] xl:pt-[75px]; with the banner above it that would
   double the gap. Zero it out only on the gated front page (body.has-dni-otwarte
   is added in functions.php). NO edit to hero.php — this id+class selector beats
   the single-class Tailwind utility. */
body.has-dni-otwarte #hero {
    padding-top: 0;
}

/* ---- Shrink the hero slider by the banner's height so the banner + hero
   together keep the original single-screen fold (nothing below is pushed
   down). The banner height is responsive, so it's measured in JS and fed in
   via --do-banner-height (assets/js/main.js initHeroBannerOffset); falls back
   to 0 (full 80vh) if JS hasn't run yet. The Tailwind min-h-[520px] still
   floors it on short viewports. */
body.has-dni-otwarte .hero__slider {
    height: calc(80vh - var(--do-banner-height, 0px));
}

/* ---- xl (>=1280px): .spravia bar grows to 75px -> header is 135px ---- */
@media only screen and (min-width: 80rem) {
    .dni-otwarte {
        --do-header: 135px;
    }

    .dni-otwarte__heading {
        font-size: 2.625rem;
    }
}

/* ---- Mobile (<64rem): single column showing EVERYTHING, in this order:
   heading, offer (bold), location, hours, CTA, body (normal). The two column
   wrappers are dissolved with display:contents so their children interleave in
   one flex column, then ordered explicitly. */
@media only screen and (max-width: 64rem) {
    .dni-otwarte__inner {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .dni-otwarte__main,
    .dni-otwarte__aside {
        display: contents;
    }

    /* right-column text stays at the base size on mobile (the bump is desktop-only);
       inherited through display:contents to .__location / .__hours */
    .dni-otwarte__aside {
        font-size: 1rem;
    }

    /* heading kept big, in the desktop proportion to the text below it */
    .dni-otwarte__heading  { order: 1; font-size: 2.25rem; }
    .dni-otwarte__offer    { order: 2; }
    .dni-otwarte__location { order: 3; }
    /* schedule starts at the pin's left edge (no address indent on mobile) */
    .dni-otwarte__hours    { order: 4; padding-left: 0; }
    .dni-otwarte__cta.spravia__button { order: 5; margin: 0; }
    .dni-otwarte__body     { order: 6; }

    .dni-otwarte__dates {
        display: block;
        margin-left: 0;
    }
}

section#katalog {
    margin-bottom: 90px;
}

section#lokalizacja {
    margin-bottom: 40px;
}

section#o-osiedlu {
    margin-top: 90px;
    margin-bottom: 0;
}

.section-with-accent {
    margin-top: 63px;
}

.middle-alternating-paragraphs__section:not(.section-with-accent) .spravia__bigger-title {
    font-size: 35px;
}

.middle-alternating-paragraph {
    padding-top: 20px;
    padding-bottom: 105px;
}
