.example-project {
  width: var(--page);
  margin: 0 auto;
  padding: 0 0 150px;
  display: grid;
  grid-template-columns: .45fr 2.2fr;
  gap: 7vw;
}
.example-project > span {
  padding-top: 12px;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .16em;
}
.example-project h2 {
  margin: 0;
  font-size: clamp(48px, 6vw, 92px);
  line-height: .94;
  font-weight: 500;
  letter-spacing: -.065em;
}
.example-project h2 em { font-family: "Prata", serif; font-weight: 400; }
.example-project p { max-width: 610px; margin: 38px 0 32px; font-size: 13px; line-height: 1.8; color: rgba(8,7,6,.62); }
.example-project-disabled {
  width: max-content;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  gap: 22px;
  border: 1px solid var(--line);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .13em;
  opacity: .58;
  cursor: not-allowed;
}
.example-project-disabled b { font-size: 14px; font-weight: 400; }

.project-footer-details { grid-template-columns: .55fr 1.35fr 1fr; align-items: start; }
.project-footer-owner { display: grid; gap: 7px; max-width: 570px; }
.project-footer-owner strong { font-size: 10px; }
.project-footer-owner span { font-size: 8px; line-height: 1.65; opacity: .55; }
.project-footer-owner a { width: max-content; font-size: 9px; opacity: .72; }
.project-footer-owner a:hover { text-decoration: underline; opacity: 1; }
.project-footer-links { display: grid; justify-items: end; gap: 8px; font-size: 8px; line-height: 1.5; text-align: right; opacity: .62; }
.project-footer-links a:hover { text-decoration: underline; opacity: 1; }

@media (max-width: 980px) {
  .example-project { grid-template-columns: .45fr 1fr; }
  .project-footer-details { grid-template-columns: 1fr 1.4fr; }
  .project-footer-links { grid-column: 2; justify-items: start; text-align: left; }
}

@media (max-width: 760px) {
  .example-project { padding: 0 0 96px; grid-template-columns: 1fr; gap: 34px; }
  .example-project h2 { font-size: 49px; }
  .example-project p { margin-top: 28px; font-size: 12px; }
  .example-project-disabled { width: 100%; justify-content: space-between; }
  .project-footer-details { grid-template-columns: 1fr; gap: 34px; }
  .project-footer-links { grid-column: auto; justify-items: start; }
}