@import url('https://fonts.googleapis.com/css?family=Montserrat:700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Oswald:700&display=swap');
section {
  margin-bottom: px;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: rgb(255, 252, 199);
  margin-left:58px;
  font-size: 2.0em;
}
header {
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: white;
  font-family: 'Oswald', 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  font-size: 1.2em;
  letter-spacing: 2px;
  color: rgb(87, 86, 84);
  background: #161616;
}
header nav a {
  margin-right: 24px;
}
header a {
  color: rgb(91, 91, 91);
  text-decoration: none;
}
p {
    margin-top: 30 px;
    color: white;
    font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 0.67em;
    margin-right: 100px;
    
}
body {
  background: black;
}

/* Project Card Styles */
.project-card {
  background: #111111;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  padding: 2rem;
  margin-bottom: 2rem;
  max-width: 600px;
  margin-left: 58px;
  margin-right: 0;
  transition: box-shadow 0.2s;
}
.project-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}
.project-title {
  font-size: 1.7rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  color: #e0e3fd;
}
.project-description {
  font-size: 1.1rem;
  margin-bottom: 1.2rem;
  color: #ffffff;
}
.project-links {
  display: flex;
  gap: 1.2rem;
  flex-wrap: wrap;
  align-items: flex-start;
}

.project-video {
  border-radius: 8px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.10);
  background: #000;
}
.project-link {
  text-decoration: none !important;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 100;
  padding: 0.4rem 0.6rem;
  transition: background 0.2s, color 0.2s;
}

#about {
  margin-top: 70px;
}
#contact {
  margin-left: 58px;
}
#contact a img {
  margin-top: 50px;
}
header nav a:hover {
  color: rgb(255, 252, 199);
  text-decoration: underline;
}

section:hover {
  box-shadow: 0 4px 24px rgba(255, 252, 199, 0.2);
  transition: box-shadow 0.2s;
}

p:hover {
  color: rgb(255, 252, 199);
  background: rgba(87, 86, 84, 0.2);
  transition: background 0.2s;
}

#contact a img:hover {
  transform: scale(1.15);
  transition: transform 0.2s;
}