@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');

html, body {
  padding: 0;
  margin: 0;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}

* { box-sizing: border-box; }

a, .text-link {
  color: inherit;
  text-decoration: none;
}

h1, h2, h3, h4, h5, p { margin: 0; }
p { font-size: 18px; }

.text-justify { text-align: justify !important; }
.text-blue { color: #232371; }

.container,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  --bs-gutter-x: 4rem;
}

/* Feature image boxes */
.image-featured.image-accented {
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(228.72deg, #99E3AF -75.75%, #38389B 126.91%);
  height: 270px;
  width: 100%;
}

/* Image inside any .image-featured that fills its container */
.fill-image {
  position: absolute;
  inset: 0 0 24px 0;
  width: 100%;
  height: calc(100% - 24px);
  object-fit: cover;
}

/* Gradient card for Risk Ratings section */
.card-feature {
  background: linear-gradient(214.45deg, #99E3AF -68.69%, #38389B 114.2%);
  border-radius: 16px;
  color: white;
}

.image-featured.card-image {
  border-radius: 16px;
  height: 280px;
  width: 280px;
  overflow: hidden;
}

/* Hero background image */
.cover-image {
  transition: .3s;
  object-position: 30%;
  opacity: .3;
}

/* Footer */
.site-footer {
  background: linear-gradient(220.46deg, #99E3AF -107.83%, #38389B 118.83%);
}

@media screen and (min-width: 576px) {
  .text-sm-start { text-align: left !important; }
}

@media screen and (min-width: 768px) {
  .text-md-start { text-align: left !important; }

  .image-featured.image-accented {
    width: 42%;
  }

  .image-featured.card-image {
    height: 340px;
    width: 180px;
  }
}

@media screen and (min-width: 992px) {
  .cover-image {
    object-position: 20%;
    opacity: .5;
  }

  .image-featured.card-image {
    height: 380px;
    width: 380px;
  }
}

@media screen and (min-width: 1200px) {
  .cover-image { object-position: unset; }

  .image-featured.image-accented {
    width: 500px;
  }
}

@media screen and (min-width: 1400px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    width: 1188px;
  }
}
