/  Custom styles for the Oscar logo font  /
.oscar-logo {
    font-family: Arial, sans-serif; /  You can change this to a specific font  /
    font-weight: 700;
}

/  Custom color for Oscar Blue: #4732d8 (approximate from image)  /
.bg-oscar-blue {
    background-color: #4732d8;
}

.text-oscar-blue {
    color: #4732d8;
}

/  Note: All Tailwind utility classes (like flex, py-16, md:grid-cols-2, etc.) 
are used directly in index.html and are handled by the Tailwind CDN.
This file is only for true custom CSS.
 /
/  Featue section  /
/  -------------------------------------  /
/  Custom color for Oscar Blue: #4732d8 (approximate from image)  /
.bg-oscar-blue {
    background-color: #4732d8;
}
.text-oscar-blue {
    color: #4732d8;
}
/  Learn more about Oscar  /

  .group:hover img {
    transform: rotate(6deg) translateY(10px);
  }

@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&family=Work+Sans:wght@400;600&display=swap');

body {
    background-color: #f9f9f9; /  A light background for the page  /
    font-family: 'Work Sans', sans-serif; /  A nice, clean font  /
}

/  We use a serif font for the main heading like in the image  /
h2 {
    font-family: 'Merriweather', serif;
}

/  Footer  /



.footer-link {
  position: relative;
  display: inline-block;
  color: #9ca3af;
  transition: all 0.2s ease;
}
.footer-link:hover {
  color: #ffffff;
  padding-right: 10px;
}
.footer-link::after {
  content: "›";
  position: absolute;
  right: -12px;
  opacity: 0;
  transition: all 0.2s ease;
}
.footer-link:hover::after {
  right: -2px;
  opacity: 1;
}