/*
 * Globals
 */

@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
@font-face {
  font-family: primaryFont;
  src: url(assets/fonts/baskvl.ttf);
}
.text-grey {
  color: #A7A9AC;
}
.bg-secondary {
  background-color: #A7A9AC !important;
}
.bg-light {
  background-color: #E8E8E8 !important;
}

body {
  color: #231F20;
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1 {
  font-family: primaryFont;
  font-size: 2.125em;
}
h2 {
  font-family: primaryFont;
  font-size: 2.5em;
}
section {
  padding-top: 4em;
  padding-bottom: 4em;
  @media (min-width: 768px) {
    padding-top: 7.5em;
    padding-bottom: 7.5em;
  }
}
section h2 {
  margin-bottom: 2rem;
}
.container-75 {
  width: 90%;
  @media (min-width: 768px) {
    width: 75%;
  }
}

/*
 * Navbar
 */
.navbar {
  border-top: 2px solid #231F20;
  padding-top: 3em;
  top: 0;
  width: 100vw;
  z-index: 1000;
  transition: 0.2s;
}
.navbar-brand #logo {
  height: 80px;
  transition: 0.2s;
}
.nav-item {
  margin-left: 2em;
}
.nav-link {
  color: #231F20;
}

/*
 * Hero
 */
.lead-container {
  margin-top: 4.125em;
  margin-bottom: 2em;
  padding-top: 148px;
}
.brand-bg {
  width: 100vw;
  height: calc(100vh - 148px - 4.125em - 89.59px - 2em);
  top: calc(148px + 4.125em + 89.59px + 2em);
  left: 0;
  right: 0;
  background: url('assets/images/RTM-ComingSoon.jpg') no-repeat 50%;
  background-size: cover;
}

/*
 * Projects
 */
.grid-container {
  display: grid;
  gap: 2em;
  grid-template-columns: 1fr 1fr;
  @media (min-width: 768px) {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.grid-container .card {
  border: 0;
  position: relative;
}
.grid-container .card:hover {
  cursor: pointer;
}
.grid-container .card:hover .card-img-top {
  opacity: 0.7;
}
.grid-container .card .eye {
  opacity: 0;
}
.grid-container .card:hover .eye {
  opacity: 1;
  background: url(assets/images/eye-fill.svg) no-repeat;
  width: 50px;
  height: 50px;
  background-size: cover;
  position: absolute;
  left: calc(50% - 25px);
  top: calc(220px - 25px);
  z-index: 1;
}
.grid-container .card-body {
  padding-left: 0;
  padding-right: 0;
}
.grid-container a {
  color: #231F20;
  text-decoration: none;
}
.grid-container .card-title {
  font-size: 1.75em;
  font-family: primaryFont;
  margin-bottom: 0;
}
.grid-container .card-body p {
  margin-bottom: 0;
}
.modal-grid-container {
  display: grid;
  gap: 2em;
  @media (min-width: 768px) {
    grid-template-columns: 1fr 1fr;
  }
  @media (min-width: 1200px) {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.modal-grid-container .modal-img {
  height: 35vh;
  object-fit: contain;
  width: 100%;
  @media (min-width: 768px) {
    height: 40vh;
  }
}
.proj-thumb {
  height: 440px;
  object-fit: cover;
}

/*
 * Core Values
 */
.core-item {
  font-family: primaryFont;
  color: white;
  line-height: 1.25rem;
  text-align: center;
  font-size: 1.25em;
  width: 100%;
  padding: 0.75em;
}
@media (min-width: 768px) {
  .core-item {
    min-width: 230px;
    padding: 1.25em 2em;
  }
  .core-pills {
    width: 50%;
  }
}

/*
 * Footer
 */
 footer {
  padding-top: 4em;
  padding-bottom: 4em;
 }
 footer a {
  color: white;
 }