/* Global styles, fonts, and colors */

:root {
  --color-1: #775D98;
  --color-2: #AE95CF;
  --color-3: #D4C7E5;
  --white: #FFFBFC;
  --black: #24272b;
  --header-height: 64px;
}

body { font-family: sans-serif; margin: 0; color: var(--black); }

.color-1-bg { background-color: var(--color-1); }
.color-2-bg { background-color: var(--color-2); }
.color-3-bg { background-color: var(--color-3); }
.white-bg { background-color: var(--white); }
.black-bg { background-color: var(--black); }

.color-1-text { color: var(--color-1); }
.color-2-text { color: var(--color-2); }
.color-3-text { color: var(--color-3); }
.white-text { color: var(--white); }
.black-text { color: var(--black); }

.rounded-corner { 
  padding: 25px;
  border-radius: 15px; 
}

.about-section {
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(rgb(202 146 218 / 50%), rgba(0, 0, 0, 0.5)), url('../images/common/reception_horizontal.webp');
}

.doctor-image {
  width: 100%;
  height: auto;
}

.experience-container {
  display: grid;
  align-items: center;
}

.about-carousel {
  margin-top: 15px;
  margin-bottom: 15px;
  scroll-snap-align: center;
  padding-left: 100px;
  padding-right: 100px;
  height: 60vh;
}

.about-row-carousel {
  align-items: center;
  height: 100%;
}

.about-row-carousel img {
  height: 100%;
  width: 100%;
}