/* Custom overrides for marketing components */

html,
body {
  overflow-x: hidden;
}

body {
  margin: 0;
  font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif;
}
.bg-section-main {
  background-color: #f9fafb;
}

.bg-section-alt {
  background-color: #ffffff;
}

.border-primary {
  border-color: #c83433;
}

.bg-primary {
  background-color: #c83433;
}

.text-primary {
  color: #c83433;
}

@keyframes loop-vertically {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}

@keyframes loop-horizontally {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}

.animate-loop-vertically {
  animation: loop-vertically 20s linear infinite;
}

.animate-loop-vertically-reverse {
  animation: loop-vertically 20s linear infinite;
  animation-direction: reverse;
}

.animate-loop-horizontally {
  animation: loop-horizontally 15s linear infinite;
}

@media (pointer: coarse) {
  button,
  a {
    min-height: 1rem;
    min-width: 1rem;
  }

  .nav-toggle,
  [data-prev],
  [data-next] {
    min-height: 1rem;
    min-width: 1rem;
  }
}

.indicator-dot {
  cursor: pointer;
}