/* Domira Addon: the little the theme's styles.css does not already cover. */

/* Scrolling strips (partners, property names in the banners): pure CSS, no script. */
.wrap-infiniteslide {
  overflow: hidden;
}
.wrap-infiniteslide .infiniteslide {
  width: max-content;
  animation: domira-marquee 40s linear infinite;
}
.wrap-infiniteslide:hover .infiniteslide {
  animation-play-state: paused;
}
.wrap-infiniteslide .infiniteslide.gap_12 > .marquee-item {
  margin-right: 12px;
}
.wrap-infiniteslide.partner .infiniteslide > .marquee-item {
  flex: none;
}
@keyframes domira-marquee {
  to {
    transform: translateX(-50%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .wrap-infiniteslide .infiniteslide {
    animation: none;
    overflow-x: auto;
  }
}

/* Property-type list: the photo follows the hovered type. */
.tabs-hover-wrap .categories-item {
  display: block;
}

/* Property tabs: filtered-out cards are hidden. */
.tf-grid-layout > [hidden] {
  display: none;
}
.tf-filters .btn-fillter {
  cursor: pointer;
}

/* Hero: the status tabs are radio buttons. */
.flat-tab .nav-tab-form .nav-link-item {
  position: relative;
  cursor: pointer;
}
.flat-tab .nav-tab-form input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Video banners: the player fills the banner once started. */
.banner-box .domira-embed {
  position: absolute;
  inset: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
}
.banner-box .popup-youtube {
  cursor: pointer;
}
.banner-box .list .item {
  text-decoration: none;
}

/* Photo banner: the photo stays put while the page scrolls (not on phones). */
.banner .domira-parallax {
  background-position: center;
  background-size: cover;
}
@media (min-width: 992px) {
  .banner .domira-parallax {
    background-attachment: fixed;
  }
}

/* Contact: social icons are large, the spam trap stays hidden. */
.domira-contact .wg-social a {
  font-size: 40px;
}
.domira-contact .domira-hp {
  position: absolute;
  left: -9999px;
}
.domira-contact .domira-notice {
  margin-bottom: 16px;
}

/* Featured property: thumbnails are buttons. */
.domira-showcase .sw-single {
  width: 100%;
}
.domira-showcase .sw-single .image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1058 / 792;
  object-fit: cover;
}
.domira-showcase__thumbs {
  display: flex;
  gap: 12px;
}
.domira-showcase__thumbs .image {
  flex: none;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  overflow: hidden;
  opacity: 0.85;
}
.domira-showcase__thumbs .image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.domira-showcase__thumbs .image.is-active,
.domira-showcase__thumbs .image:hover {
  opacity: 1;
  border-color: #fff;
}

/* Agents. */
.domira-agents .agent-item .img-style img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Slider of cards (agents, posts): the design's Swiper rebuilt with scroll-snap, dots and mouse drag. */
.domira-carousel__track {
  --n: var(--n0);
  --gap: var(--g0);
  position: relative;
  display: flex;
  gap: var(--gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
@media (min-width: 576px) {
  .domira-carousel__track {
    --n: var(--n1);
  }
}
@media (min-width: 768px) {
  .domira-carousel__track {
    --n: var(--n2);
    --gap: var(--g1);
  }
}
@media (min-width: 992px) {
  .domira-carousel__track {
    --n: var(--n3);
    --gap: var(--g2);
  }
}
.domira-carousel__track::-webkit-scrollbar {
  display: none;
}
.domira-carousel__track > * {
  flex: 0 0 calc((100% - (var(--n) - 1) * var(--gap)) / var(--n));
  min-width: 0;
  scroll-snap-align: start;
}
.domira-carousel__track.is-dragging {
  scroll-snap-type: none;
  cursor: grabbing;
  user-select: none;
}
.domira-carousel__track.is-dragging a {
  pointer-events: none;
}
.domira-carousel__dots:empty {
  display: none;
}
.domira-carousel__dots .domira-dot {
  position: relative;
  width: 18px;
  height: 18px;
  margin: 0 4px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
.domira-carousel__dots .domira-dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--Text-secondary, #8a8a8a);
  transform: translate(-50%, -50%);
}
.domira-carousel__dots .domira-dot.is-active {
  border-color: var(--Text-primary, #101010);
}

/* Hero with the photo on the right: the title stays above the photo where they overlap. */
.page-title.style-2 .content {
  position: relative;
  z-index: 1;
}

.domira-agency-tag{display:inline-flex;align-items:center;gap:6px;font-size:13px;line-height:1.3;color:var(--Text, #6b7280);margin-bottom:4px}
.domira-agency-tag img{width:20px;height:20px;border-radius:4px;object-fit:cover}

/* Overlay-card grid: the design's photos are square in the row of three and wide in the pairs, so both rows have the same height. */
.domira-ratio-square .card-house .img-style img {
  aspect-ratio: 1 / 1;
  height: auto;
}
.domira-ratio-wide .card-house .img-style img {
  aspect-ratio: 23 / 15;
  height: auto;
}

/* Hero photo is the page's largest paint: reveal it with a pure-CSS wipe that starts at first paint,
   instead of the theme's hidden state that waits for main.js (which delayed LCP by ~1.7s). */
.tf-animate-1.domira-lcp {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  animation: domira-wipe 1s cubic-bezier(0.63, 0.25, 0.25, 1) both;
}
@keyframes domira-wipe {
  from { clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce) {
  .tf-animate-1.domira-lcp { animation: none; }
}