/* =========================================
   LUNAR — GLOBALNE DEKORACJE
========================================= */

.lunar-decor {
    position: fixed;
    inset: 0;

    width: 100%;
    height: 100vh;

    pointer-events: none;

    z-index: 1;
    overflow: hidden;

    opacity: 0;
    transition: opacity 0.08s linear;
}


/* GLOBUS */

.lunar-decor-globe {
    position: absolute;

    width: 180px;
    height: 180px;

    top: 105px;
    right: 65px;

    fill: none;
    stroke: #c8ae82;
    stroke-width: 0.8;

    opacity: 0.17;
}


/* OKRĘGI */

.lunar-decor-rings {
    position: absolute;

    width: 125px;
    height: 125px;

    left: 70px;
    bottom: 55px;

    fill: none;
    stroke: #c8ae82;
    stroke-width: 0.7;

    opacity: 0.10;
}


/* LINIE */

.lunar-decor-line {
    position: absolute;

    fill: none;
    stroke: #c8ae82;
    stroke-width: 0.6;

    opacity: 0.07;
}

.lunar-line-left {
    width: 270px;
    height: 500px;

    left: -100px;
    bottom: -170px;
}

.lunar-line-right {
    width: 260px;
    height: 500px;

    right: -90px;
    top: 270px;
}


/* GWIAZDY */

.lunar-star {
    position: absolute;

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #ead8b5;

    opacity: 0.55;

    box-shadow:
        0 0 7px rgba(234, 216, 181, 0.55);
}

.star-1 {
    top: 29%;
    left: 9%;
}

.star-2 {
    top: 43%;
    right: 22%;

    width: 2px;
    height: 2px;

    opacity: 0.35;
}

.star-3 {
    top: 66%;
    right: 12%;
}

.star-4 {
    top: 55%;
    left: 20%;

    width: 2px;
    height: 2px;

    opacity: 0.35;
}

.star-5 {
    top: 78%;
    left: 38%;

    width: 3px;
    height: 3px;

    opacity: 0.4;
}

.star-6 {
    top: 20%;
    right: 41%;

    width: 2px;
    height: 2px;

    opacity: 0.3;
}


/* TREŚĆ NAD DEKORACJAMI */

.elementor-location-single,
.elementor-page,
main,
.site-content {
    position: relative;
    z-index: 2;
}


/* TABLET */

@media (max-width: 1024px) {

    .lunar-decor-globe {
        width: 120px;
        height: 120px;

        right: 25px;
        top: 130px;
    }

    .lunar-decor-rings {
        width: 100px;
        height: 100px;

        left: 25px;
    }
}


/* TELEFON */

@media (max-width: 767px) {

    .lunar-decor-globe {
        width: 90px;
        height: 90px;

        right: -15px;
        top: 140px;

        opacity: 0.12;
    }

    .lunar-decor-rings {
        width: 75px;
        height: 75px;

        left: -20px;
        bottom: 80px;

        opacity: 0.07;
    }

    .lunar-decor-line {
        opacity: 0.04;
    }

    .lunar-star {
        opacity: 0.3;
    }
}