@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap');



:root {
  --primary-bg: #EDF9FF;
  --blue-1000: #0770a8;
  --blue-800: #398DB9;
  --blue-light: #C9ECFF;
  --blue-darkmode: #9DD8F8;
  --orange-1000: #F18700;
  --orange-800: #F49F33;
  --orange-600: #F7B766;
  --orange-dark: #C87000;
  --gray-600: #52525B;
  --white: #fff;
  --space-grotesk: 'Space Grotesk', sans-serif;
  --poppins: 'Poppins', sans-serif;
  --placeholder-gray: #A0A3BD;
  --label-text:  #6E7191;
  --input-bg: #EFF0F7;
  --shadow-medium: 0px 20px 24px 0px #1111110F;
  --shadow-small: 0px 4px 25px 0px #0000001A;
}

*{
  font-family: var(--space-grotesk)
}


h5 {
  font-family: var(--poppins);
  font-size: 24px;
  letter-spacing: 0.01em;
}

h6{
  font-family: var(--poppins);
  font-size: 20px;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: 0.01em;
  color: var(--gray-600);
}

.selected-text{
  font-family: var(--poppins);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.75px;
text-align: center;
}




.subtitle-one-regular {
  font-size: 16px;
  font-weight: 400;
  color: var(--gray-600);
}

.subtitle-two-regular {
  font-size: 18px;
  font-weight: 400;
  color: var(--gray-600);
}

.bg-blue-1000 {
  color: var(--blue-1000);
}

.text-blue-1000 {
  color: var(--blue-1000);
}

.text-blue-800{
  color:var(--blue-800)
}

.text-orange-dark{
  color:var(--orange-dark);
}

.text-gray-600{
  color:var(--gray-600)
}

/* Buttons */

.big-primary-button{
  text-align: center;
  font-weight: 700;
  padding: 16px;
  height: 52px;
  background: var(--blue-1000);
  color: var(--white);
  border-radius: 16px;
}

.big-primary-button:hover{
  color: var(--white);
}

.big-text-button{
  text-align: center;
  font-weight: 700;
  padding: 16px;
  height: 52px;
  color: var(--blue-1000);
  background-color: var(--white);
}

.button-with-icon{
  text-align: center;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  background: var(--blue-1000);
}

.shadow-medium{
  box-shadow: var(--shadow-medium);
}

.shadow-small{
  box-shadow: var(--shadow-small) ;
}