/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-top: 3rem;
  padding-bottom: 3rem;
  padding-left: auto;   /* Added for left side space */
  padding-right: auto;  /* Added for right side space */
  color: rgb(var(--bs-tertiary-color-rgb));
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px; /* Match your navbar height */
  margin-right: 19rem;
  margin-left: 19rem; 
}

.navbar {
  height: 80px;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

.carousel {
  width: 100vw;              /* Full viewport width */
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;        /* Break out of container */
  margin-right: -50vw;
  overflow: hidden;
}

.carousel-item {
  height: 30rem;             /* Set desired carousel height */
}

.carousel-item img {
  width: 100vw;              /* Full viewport width */
  height: 30rem;             /* Match carousel-item height */
  object-fit: cover;         /* Ensures image covers the area */
  opacity: 0.9;              /* Adjust value from 0 (transparent) to 1 (opaque) */
}

.carousel-caption p.impactful-text {
  font-size: 1.8rem; /* Adjust size as needed */
  font-weight: 500; /* Optional: make it a bit bolder */
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 1); /* Adds a soft dark shadow */
}

.carousel-caption {
  font-size: 2.5rem; /* Adjust size as needed */
  font-weight: 640; /* Optional: make it a bit bolder */
  color: #ffffff !important;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 1); /* Adds a soft dark shadow */
}

.carousel-indicators button {
  background-color: white !important;
}

/* MARKETING CONTENT
-------------------------------------------------- */

.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
}

/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: 0.75rem;
  margin-left: 0.75rem;
}
  .marketing {
  color: #ffffff !important;
}
/* rtl:end:ignore */

.circle-img {
  border-radius: 6%;
}

/* Featurettes
------------------------- */

.featurette-divider {
  margin: 2rem 0; /* Space out the Bootstrap <hr> more */
}