:root {
  --primary-color: #3586CE;       /* Blue from logo */
  --accent-green: #66BB6A !important;        /* Green from logo */
  --text-dark: #1C1E21;
  --background-light: #F7F9FC;
  --text-color:#7D7D7D;
}

html {
  scroll-behavior: smooth; /* Smooth scrolling */
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--background-light);
  color: var(--text-color);
}
.logo{
    height: auto;
    width: 150px;
}
.hero-section {
  height: 100vh;
  background: linear-gradient(rgba(0, 0, 0, 0.41), rgba(0, 0, 0, 0.51)),
              url('../imgs/svg/online-doctor-animate.svg') center/contain no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.head-text{
    color:var(--text-dark);
}
.navbar {
  background-color: var(--primary-color);
}
.ico-2x{
font-size: 24px;
}
.navbar-nav .nav-link {
  color: white !important;
  margin-left: 1rem;
  font-weight: 500;
}

.navbar-nav .nav-link.active {
  text-decoration: underline;
}

section h2 {
  color: var(--primary-color);
}

.btn-primary {
  background-color: var(--accent-green);
  border: none;
}
.text-green {
  color: var(--accent-green);
}
.btn-primary:hover {
  background-color: #4fae61;
}

.btn-outline-primary {
  color: var(--primary-color);
  border-color: var(--primary-color);
}

.btn-outline-primary:hover {
  background-color: var(--primary-color);
  color: white;
}
.bg-light{
    background-image: repeating-linear-gradient(284deg, transparent 0px, transparent 1px, rgb(251, 251, 251) 1px, rgb(251, 251, 251) 3px), repeating-linear-gradient(14deg, transparent 0px, transparent 1px, rgb(251, 251, 251) 1px, rgb(251, 251, 251) 3px), linear-gradient(90deg, rgb(222, 222, 222), rgb(222, 222, 222));
}

footer a:hover {
  text-decoration: underline;
}