/* ===========================
   Domus 3-circle preloader
 
=========================== */

.preloader .domus-loader{
  position:absolute;
  top:50%;
  left:50%;
  width:120px;
  height:110px;
  transform:translate(-50%,-50%);
  animation: domusClusterSpin 1.35s linear infinite;
  isolation:isolate;
}

/* hard-kill any leftover pseudo elements that cause "tiny dot" artifacts */
.preloader .domus-loader span::before,
.preloader .domus-loader span::after{
  content:none !important;
  display:none !important;
}

/* the 3 circles */
.preloader .domus-loader span{
  position:absolute;
  top:50%;
  left:50%;
  width:46px;
  height:46px;
  border-radius:999px;

  /* constant colors */
  opacity:.88;

  /* always centered before per-dot offsets */
  transform:translate(-50%,-50%);
  will-change: transform;
}

/* colors */
.preloader .domus-loader span:nth-child(1){ background:#A2DAE3; animation: domusDot1 1.35s cubic-bezier(.55,0,.25,1) infinite; }
.preloader .domus-loader span:nth-child(2){ background:#B3DABA; animation: domusDot2 1.35s cubic-bezier(.55,0,.25,1) infinite; }
.preloader .domus-loader span:nth-child(3){ background:#0B7897; animation: domusDot3 1.35s cubic-bezier(.55,0,.25,1) infinite; }

/* rotate the whole cluster */
@keyframes domusClusterSpin{
  0%   { transform:translate(-50%,-50%) rotate(0deg); }
  100% { transform:translate(-50%,-50%) rotate(360deg); }
}

/* Start = overlapping "Venn" layout, Mid = separate (explode), End = back */
@keyframes domusDot1{
  0%,100% { transform:translate(-50%,-50%) translate(0px,-16px) scale(1); }
  50%     { transform:translate(-50%,-50%) translate(0px,-62px) scale(.95); }
}
@keyframes domusDot2{
  0%,100% { transform:translate(-50%,-50%) translate(-16px,12px) scale(1); }
  50%     { transform:translate(-50%,-50%) translate(-62px,36px) scale(.95); }
}
@keyframes domusDot3{
  0%,100% { transform:translate(-50%,-50%) translate(16px,12px) scale(1); }
  50%     { transform:translate(-50%,-50%) translate(62px,36px) scale(.95); }
}

/* If template JS adds .loaded and tries to stop animation, keep ours alive briefly */
.preloader.loaded .domus-loader{ animation: domusClusterSpin 1.35s linear infinite; }
.preloader.loaded .domus-loader span:nth-child(1){ animation: domusDot1 1.35s cubic-bezier(.55,0,.25,1) infinite; }
.preloader.loaded .domus-loader span:nth-child(2){ animation: domusDot2 1.35s cubic-bezier(.55,0,.25,1) infinite; }
.preloader.loaded .domus-loader span:nth-child(3){ animation: domusDot3 1.35s cubic-bezier(.55,0,.25,1) infinite; }


/* =========================================
    halo / ring behind Domus loader
 
========================================= */

/* create a soft ring behind the circles */
.preloader .domus-loader::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:160px;
  height:160px;
  transform:translate(-50%,-50%) scale(.92);
  border-radius:999px;

  /* thin ring + soft glow */
  border:1px solid rgba(11, 122, 134, .22);              /* teal tint */
  box-shadow:
    0 0 22px rgba(11, 122, 134, .10),
    0 0 50px rgba(162, 214, 230, .08);                    /* light blue tint */

  opacity:0;
  z-index:-1; /* behind the circles */
  animation: domusHalo 1.35s ease-in-out infinite;
  pointer-events:none;
}

/* subtle “scan pulse” to make it feel like loading */
@keyframes domusHalo{
  0%, 20%{
    opacity:0;
    transform:translate(-50%,-50%) scale(.88);
  }
  55%{
    opacity:.95;
    transform:translate(-50%,-50%) scale(1.03);
  }
  100%{
    opacity:0;
    transform:translate(-50%,-50%) scale(1.12);
  }
}

/* keep halo alive even during .loaded fade */
.preloader.loaded .domus-loader::before{
  animation: domusHalo 1.35s ease-in-out infinite;
}