* {
    outline: none;
}

#main-header,
#main-header #logo,
#main-header .e-con-inner {
    transition: all .2s ease-in-out;
}

#main-header {
    width: 100% !important;
    backface-visibility: visible;
    backdrop-filter: blur(10px);
    z-index: 9999;
}

#main-header.elementor-sticky--effects {
    padding: 0 40px;
}

#main-header.elementor-sticky--effects .e-con-inner {
    padding: 10px 0;
}

#main-header #logo {
    transform-origin: 0% 50%;
}

#main-header.elementor-sticky--effects .menu-item a {
    font-size: .9rem;
}

#main-header.elementor-sticky--effects #logo {
    transform: scale(.8);
}

h1.elementor-heading-title span,
h2.elementor-heading-title span {
    color: var(--e-global-color-accent) !important;
}

.elementor-slideshow__footer {
    display: none !important;
}

#footer-cta-banner:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: auto;
    width: 52%;
    background-color: var(--e-global-color-accent);
    z-index: 0;
    opacity: 1;
    clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.subtitle h3 {
    display: flex;
    align-items: center;
    gap: 10px;
}

.subtitle h3:before {
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    background-color: var( --e-global-color-accent );
}

.elementor-button-content-wrapper {
    gap: 10px !important;
}

.elementor-button i {
    font-size: 150%;
}

.elementor-icon i {
    font-size: 120%;
}

.numbered-cards {
    counter-reset: numbered-cards;
}

.numbered-cards .elementor-widget-icon-box {
    counter-increment: numbered-cards;
    overflow: hidden;
}

.numbered-cards .elementor-widget-icon-box:before {
    content: "0" counter(numbered-cards);
    position: absolute;
    top: 0;
    right: 0;
    margin: 30px;
    z-index: 0;
    font-family: "nexa";
    font-weight: 900;
    font-size: 3.8rem;
    line-height: 1;
    opacity: .1;
}

.numbered-cards .elementor-widget-icon-box:after {
    content: "";
    position: absolute;
    top: 100%;
    right: 0;
    width: 200px;
    height: 200px;
    background-color: var(--e-global-color-accent);
    opacity: .06;
    transform: rotate(20deg) translate(10%,-50%);
}

.equipment-list, .feature-list {
    display: grid;
    list-style: none;
    padding: 0;
    margin: 0;
    font-weight: 500;
    gap: 15px;
}

.equipment-list {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.equipment-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 5px;
    background-color: rgba(17, 60, 100, .05);
}

.equipment-list li {
    white-space: nowrap;
}

.equipment-list .equipment-icon {
    width: 22px;
    opacity: .75;
}

.feature-list li {
    display: flex;
    align-items: top;
    gap: 8px;
}

.feature-list {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.feature-list li:before {
    content: "\ea5e";
    font-family: "icomoon-tabler" !important;
    font-size: 1.2rem;
}

.elementor-lightbox .elementor-swiper-button {
    position: absolute;
    z-index: 9999;
    top: 0;
    cursor: pointer;
}

/* Making checkbox and radio button invisible */
.elementor-field-type-checkbox .elementor-field-option input[type="checkbox"],
.elementor-field-type-radio .elementor-field-option input[type="radio"],
.elementor-field-type-acceptance input[type="checkbox"] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
/* For Checkbox */
.elementor-field-type-checkbox .elementor-field-option label:before,
.elementor-field-type-radio .elementor-field-option label:before,
.elementor-field-type-acceptance > div label:before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-right: 0.5em;
	vertical-align: -3px;
    border: 1px solid var(--e-global-color-text);
    border-radius: 3px;
	background-clip: content-box;
	transition: all 0.2s ease;
    cursor: pointer;
}
.elementor-field-type-radio .elementor-field-option label:before {
    border-radius: 50%;
}
.elementor-field-type-checkbox .elementor-field-option label,
.elementor-field-type-radio .elementor-field-option label,
.elementor-field-type-acceptance > div label {
	margin-right: 1em;
	position: relative;
}
.elementor-field-type-checkbox .elementor-field-option label:after,
.elementor-field-type-radio .elementor-field-option label:after,
.elementor-field-type-acceptance > div label:after {
	border-right: 2px solid #ffffff;
	border-top: 2px solid #ffffff;
	content: "";
	height: 8px;
	left: 3px;
	position: absolute;
	top: 12px;
	transform: scaleX(-1) rotate(135deg);
	transform-origin: left top;
	width: 6px;
	display: none;
}
.elementor-field-type-checkbox .elementor-field-option > input:hover + label:before,
.elementor-field-type-radio .elementor-field-option > input:hover + label:before,
.elementor-field-type-acceptance > div input:hover + label:before {
	border-color: var(--e-global-color-text);
}
.elementor-field-type-checkbox .elementor-field-option > input:checked + label:before,
.elementor-field-type-radio .elementor-field-option > input:checked + label:before,
.elementor-field-type-acceptance > div input:checked + label:before {
	border-color: var(--e-global-color-text);
	background: var(--e-global-color-text);
}
.elementor-field-type-checkbox .elementor-field-option > input:checked + label:after,
.elementor-field-type-radio .elementor-field-option > input:checked + label:after,
.elementor-field-type-acceptance > div input:checked + label:after {
	-moz-animation: check 0.8s ease 0s running;
	-webkit-animation: check 0.8s ease 0s running;
	animation: check 0.8s ease 0s running;
	display: block;
	width: 6px;
	height: 12px;
	border-color: #ffffff;
}

@media only screen and (max-width: 1024px) {
    #footer-cta-banner:before {
        top: auto;
        left: 0;
        right: auto;
        bottom: 0;
        width: 100%;
        height: 42%;
        clip-path: none;
    }
}

/* ---------- Property gallery (mobile first) ---------- */
/* The Elementor container wrapping the shortcode is a column flexbox with
   flex-wrap:wrap. A wrapping column flex with no explicit height collapses
   (here to 24px), so the tall gallery overflows and the next section overlaps
   it. Forcing nowrap on the wrapper lets it size to the gallery's height.
   !important is needed because Elementor sets flex-wrap via its own rule. */
.e-con-inner:has(.property-gallery) {
    flex-wrap: nowrap !important;
}

.property-gallery {
    position: relative;
}

.property-gallery__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    /* Let each tile take its aspect-ratio height instead of stretching to a
       zero-height row (the img is absolutely positioned, so it adds no height). */
    align-items: start;
}

.property-gallery__item {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 5px;
}

/* Bulletproof square: the pseudo-element forces real in-flow height equal to
   the tile width, independent of aspect-ratio support or the (absolute) img. */
.property-gallery__item::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.property-gallery__item img {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}

.property-gallery__item:hover img {
    transform: scale(1.04);
}

/* Big image spans the full width on mobile, 3 little ones sit below. */
.property-gallery__item--main {
    grid-column: 1 / -1;
}

/* Video main tile: the iframe fills the square; the tile isn't clickable. */
.property-gallery__item--video {
    cursor: default;
    background-color: var(--e-global-color-0190244);
}

.property-gallery__item--video:hover img {
    transform: none;
}

/* CSS-only preloader: a spinner sitting BEHIND the iframe. It can stay forever —
   once the (opaque) video renders on top it simply covers the spinner. */
.property-gallery__item--video::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 38px;
    height: 38px;
    margin: -19px 0 0 -19px;
    border: 3px solid rgba(255, 255, 255, .25);
    border-top-color: #fff;
    border-radius: 50%;
    animation: property-gallery-spin .8s linear infinite;
    z-index: 0;
}

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

/* Scale the iframe to COVER the square tile (crop the overflow) instead of
   letterboxing. --video-aspect (width/height) is set inline per video so both
   landscape and portrait videos fill the square; defaults to 16:9 if unknown.
   The tile's overflow:hidden clips the overflow; z-index keeps the loaded video
   above the spinner. */
.property-gallery__video {
    --video-aspect: 1.7778;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% * max(1, var(--video-aspect))) !important;
    height: calc(100% * max(1, 1 / var(--video-aspect)));
    max-width: none !important;
    border: 0;
    z-index: 1;
}

/* Lightbox-only images (6th onward) are never rendered in the grid. */
.property-gallery__item--hidden {
    display: none;
}

/* Mobile shows main + 3 small; hide the 4th small (5th tile). */
.property-gallery__item:nth-child(5) {
    display: none;
}

/* Count button */
.property-gallery .property-gallery__button {
    position: absolute;
    right: 16px;
    bottom: 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    margin: 0;
    padding: 10px 16px;
    background: rgba(20, 30, 50, .85);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .02em;
    line-height: 1;
    text-decoration: none;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
    backdrop-filter: blur(4px);
    transition: background .2s ease;
}

.property-gallery .property-gallery__button:hover,
.property-gallery .property-gallery__button:focus,
.property-gallery .property-gallery__button:focus-visible,
.property-gallery .property-gallery__button:active {
    background: rgba(20, 30, 50, 1);
    color: #fff;
    outline: none;
    box-shadow: none;
}

.property-gallery .property-gallery__button svg {
    width: 18px;
    height: 18px;
    flex: none;
}

/* ---------- Desktop: 1 large + 4 small (2x2) ---------- */
@media only screen and (min-width: 768px) {
    .property-gallery__grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .property-gallery__item--main {
        grid-column: 1 / 3;
        grid-row: 1 / 3;
    }

    /* Re-show the 5th tile (4th small) hidden on mobile. */
    .property-gallery__item:nth-child(5) {
        display: block;
    }
}

/* ---------- Units table (mobile first) ---------- */
.units-table {
    --ut-muted: #8a93a5;
    --ut-line: #eef1f6;
    background: #fff;
    border: 1px solid var(--e-global-color-0190244);
    border-radius: 5px;
    padding: 12px;
    color: var(--e-global-color-primary);
    font-size: 15px;
    font-weight: 600;
}

/* Header is a table-only concept; hidden on the mobile card layout. */
.units-table__head {
    display: none;
}

.units-table__row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4px 12px;
    padding: 16px;
    border: 1px solid var(--e-global-color-0190244);
    border-radius: 5px;
}

.units-table__row + .units-table__row {
    margin-top: 10px;
}

.units-table__cell--code {
    grid-column: 1;
    letter-spacing: .01em;
}

.units-table__cell--action {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
}

.units-table__cell--unit {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* The standalone floor / area cells are redundant with the meta line on mobile. */
.units-table__cell--floor,
.units-table__cell--area {
    display: none;
}

.units-table__name {
    color: var(--e-global-color-primary);
    font-weight: 600;
}

.units-table__meta {
    color: var(--ut-muted);
    font-size: 14px;
}

.units-table__cell--price {
    grid-column: 1 / -1;
    margin-top: 6px;
}

.units-table__cell--price strong {
    font-weight: inherit;
}

.units-table__period {
    color: var(--ut-muted);
    font-size: 14px;
    margin-left: 2px;
}

/* Status badges */
.units-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.units-badge::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.units-badge--for-sale {
    background: #e3f6ec;
    color: #1f9d57;
}

.units-badge--for-sale::before {
    background: #25c16a;
}

.units-badge--in-option {
    background: #e6f1fb;
    color: #2778c4;
}

.units-badge--in-option::before {
    background: #3a93e0;
}

.units-badge--sold {
    background: #eef1f5;
    color: #6b7689;
}

.units-badge--sold::before {
    background: #9aa3b2;
}

.animated {
    animation-timing-function: cubic-bezier(.66,0,.36,.99) !important;
    animation-duration: .6s !important;
}

.animated.fadeInUp {
    animation-fill-mode: forwards;
    animation-name: customFadeInUp !important;
}

.animated.fadeInDown {
    animation-fill-mode: forwards;
    animation-name: customFadeInDown !important;
}

.animated.slideInRight {
    animation-fill-mode: forwards;
    animation-name: customSlideInRight !important;
}

.animated.slideOutRight {
    animation-fill-mode: forwards;
    animation-name: customSlideOutRight !important;
}

@keyframes customFadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 40%, 0);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes customFadeInDown {
    0% {
        opacity: 0;
        transform: translate3d(0, -40%, 0);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes customSlideInRight {
    0% {
        transform: translate3d(100%, 0, 0);
    }
    100% {
        transform: none;
    }
}

@keyframes customSlideOutRight {
    0% {
        transform: none;
    }
    100% {
        transform: translate3d(100%, 0, 0);
    }
}

@media only screen and (max-width: 768px) {
    .elementor-heading-title br {
        display: none !important;
    }
}

/* ---------- Units table: desktop table layout ---------- */
@media only screen and (min-width: 768px) {
    .units-table {
        padding: 0 8px;
    }

    .units-table__head,
    .units-table__row {
        display: grid;
        grid-template-columns: 90px minmax(180px, 1fr) 110px 90px 150px 150px;
        align-items: center;
        gap: 16px;
        padding: 0 16px;
        margin: 0;
        border: 0;
        border-radius: 0;
    }

    .units-table__head {
        height: 60px;
        color: var(--ut-muted);
        font-weight: 600;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .units-table__row {
        min-height: 86px;
        border-top: 1px solid var(--ut-line);
        transition: background .15s ease;
    }

    .units-table__row:hover {
        background: #f9fbfd;
    }

    /* Re-show floor / area columns on desktop. */
    .units-table__cell--floor,
    .units-table__cell--area {
        display: block;
    }

    /* The mobile meta line duplicates the floor / area columns on desktop. */
    .units-table__meta {
        display: none;
    }

    /* Reset the mobile grid-placement so every cell flows into its own column. */
    .units-table__cell--code {
        grid-column: auto;
    }

    .units-table__cell--unit {
        grid-column: auto;
    }

    .units-table__cell--price {
        grid-column: auto;
        margin: 0;
    }

    .units-table__cell--action {
        grid-column: auto;
        grid-row: auto;
        justify-self: start;
    }
}