.faros-language-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.faros-language-select {
  min-width: 58px;
  padding: 4px 25px 4px 9px;
  color: #17351c !important;
  background-color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 5px;
  color-scheme: light;
}

.faros-language-select option {
  color: #17351c !important;
  background: #fff !important;
}

.faros-language-arrow {
  position: absolute;
  right: 7px;
  color: #2f7d3d;
  pointer-events: none;
}

.faros-motion-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.faros-motion-page {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.faros-motion-section > :not(.faros-motion-layer),
.faros-motion-page > :not(.faros-motion-layer) {
  position: relative;
  z-index: 1;
}

.faros-motion-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.faros-motion-dots,
.faros-motion-circle,
.faros-motion-triangle,
.faros-motion-route {
  position: absolute;
  display: block;
  will-change: transform;
}

.faros-motion-dots {
  width: 380px;
  height: 380px;
  opacity: 0.36;
  background-image: radial-gradient(circle, rgba(47, 125, 61, 0.58) 1.35px, transparent 1.6px);
  background-size: 14px 14px;
  -webkit-mask-image: radial-gradient(circle, #000 18%, transparent 72%);
  mask-image: radial-gradient(circle, #000 18%, transparent 72%);
  animation: farosMotionPulse 6.67s ease-in-out infinite;
}

.faros-motion-circle {
  width: 300px;
  height: 300px;
  opacity: 0.42;
  border: 1px solid rgba(47, 125, 61, 0.40);
  border-radius: 50%;
  background: rgba(47, 125, 61, 0.045);
  box-shadow: inset 0 0 0 44px rgba(47, 125, 61, 0.075);
  animation: farosMotionFloat 10.67s ease-in-out infinite;
}

.faros-motion-circle::after {
  position: absolute;
  top: 22%;
  left: 22%;
  width: 56%;
  height: 56%;
  content: "";
  border: 1px dashed rgba(47, 125, 61, 0.32);
  border-radius: 50%;
}

.faros-motion-triangle {
  width: 236px;
  height: 236px;
  opacity: 0.18;
  background: linear-gradient(145deg, rgba(47, 125, 61, 0.9), rgba(155, 176, 155, 0.25));
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  animation: farosMotionRotate 18.67s linear infinite;
}

.faros-motion-route {
  width: 480px;
  height: 240px;
  opacity: 0.34;
  border-top: 2px dashed rgba(47, 125, 61, 0.42);
  border-radius: 50%;
  animation: farosMotionDrift 12.67s ease-in-out infinite;
}

.faros-motion-lighthouse {
  position: absolute;
  right: -35px;
  bottom: -40px;
  display: block;
  width: 500px;
  max-width: none;
  opacity: 0.085;
  filter: saturate(0.9);
  transform-origin: 50% 100%;
  will-change: transform;
  animation: farosLighthouseFloat 10.67s ease-in-out infinite;
}

.faros-motion-layer--steps .faros-motion-dots {
  top: 7%;
  right: -48px;
}

.faros-motion-layer--steps .faros-motion-circle {
  bottom: 2%;
  left: -58px;
}

.faros-motion-layer--steps .faros-motion-route {
  top: 45%;
  left: 42%;
  transform: rotate(-12deg);
}

.faros-motion-layer--reviews .faros-motion-triangle {
  top: 12%;
  left: 4%;
}

.faros-motion-layer--reviews .faros-motion-dots {
  right: 3%;
  bottom: -30px;
  animation-delay: -4s;
}

.faros-motion-layer--reviews .faros-motion-circle {
  top: 38%;
  right: 16%;
  width: 184px;
  height: 184px;
  animation-delay: -7s;
}

.faros-motion-layer--faq .faros-motion-dots {
  top: 14%;
  left: -55px;
  animation-delay: -3s;
}

.faros-motion-layer--faq .faros-motion-circle {
  right: -45px;
  bottom: 12%;
  width: 370px;
  height: 370px;
  animation-delay: -5s;
}

.faros-motion-layer--faq .faros-motion-route {
  right: 24%;
  bottom: 2%;
  transform: rotate(9deg);
  animation-delay: -8s;
}

.faros-motion-layer--inner .faros-motion-dots {
  top: 18%;
  left: -115px;
  animation-delay: -2s;
}

.faros-motion-layer--inner .faros-motion-circle {
  top: 46%;
  right: -120px;
  animation-delay: -6s;
}

.faros-motion-layer--inner .faros-motion-triangle {
  top: 68%;
  left: 6%;
  animation-delay: -4s;
}

.faros-motion-layer--inner .faros-motion-route {
  top: 34%;
  right: 18%;
  animation-delay: -9s;
}

@keyframes farosMotionPulse {
  0%, 100% { transform: scale(0.94); opacity: 0.18; }
  50% { transform: scale(1.06); opacity: 0.28; }
}

@keyframes farosMotionFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(14px, -18px, 0) rotate(8deg); }
}

@keyframes farosMotionRotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes farosMotionDrift {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-8deg); }
  50% { transform: translate3d(24px, -10px, 0) rotate(-2deg); }
}

@keyframes farosLighthouseFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.8deg); }
  50% { transform: translate3d(-12px, -18px, 0) rotate(0.8deg); }
}

@media (max-width: 767px) {
  .faros-motion-layer {
    opacity: 0.80;
  }

  .faros-motion-dots {
    width: 270px;
    height: 270px;
  }

  .faros-motion-triangle,
  .faros-motion-route {
    display: none;
  }

  .faros-motion-circle {
    width: 210px;
    height: 210px;
  }

  .faros-motion-lighthouse {
    right: -65px;
    bottom: -20px;
    width: 340px;
    opacity: 0.07;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faros-motion-dots,
  .faros-motion-circle,
  .faros-motion-triangle,
  .faros-motion-route,
  .faros-motion-lighthouse {
    animation: none;
    will-change: auto;
  }
}