/* Match the browser's usable height, not the monitor's 16:9 ratio.
   Short windows and zoomed/mobile views keep their normal scrolling. */
@media (min-width: 1101px) and (min-height: 740px) {
  .universe {
    height: 100svh;
    min-height: 0;
    max-height: none;
  }
  .intro h1 {
    font-size: min(6.65vw, 12svh);
    margin-top: clamp(24px, 3.5svh, 42px);
    margin-bottom: clamp(18px, 2.3svh, 25px);
  }
  .intro-copy { font-size: clamp(16px, 1.02vw, 2.15svh); }
  .hero-actions { margin-top: clamp(20px, 3svh, 32px); }
  .project-cards { top: 71%; }
  .project-card { height: clamp(130px, 14.5svh, 190px); min-height: 0; }
  .footer { bottom: 5.3%; }
}
.copyright {
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  font-family: var(--body);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .025em;
  text-transform: none;
  color: #eee;
}
@media (min-width: 1101px) and (max-height: 739px) {
  .footer { bottom: 6%; }
}
@media (max-width: 1100px) {
  .footer .copyright {
    position: static;
    flex-basis: 100%;
    padding-top: 15px;
    border-top: 1px solid #ffffff25;
    line-height: 1.5;
  }
}