/* Shared navigation, footer, and interaction rules for the marketing pages. */
body .site-header {
  position: relative;
  inset: auto;
  transform: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
  width: min(72rem, calc(100% - 2rem));
  max-width: none;
  min-height: 5rem;
  margin: 0 auto;
  padding: 0.75rem 0;
  border: 0;
}

body .site-header .home-link {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.65rem;
  color: var(--fog);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: none;
}

body .site-header .home-link img { width: 4.75rem; height: auto; }
body .site-header .home-link span { display: inline; }
body .site-header .site-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 1rem;
}

body .site-header .site-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.015em;
  text-transform: none;
  color: var(--mist);
  text-decoration: none;
}

body .site-header .site-nav a[aria-current="page"] { color: #75dff5; }
body .site-header .site-nav .nav-steam {
  padding: 0.5rem 0.9rem;
  border: 1px solid var(--cyan);
  color: var(--void);
  background: var(--cyan);
}

body .site-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  gap: 1.1rem;
  width: min(72rem, calc(100% - 2rem));
  margin: 0 auto;
  padding: 2.5rem 0;
  color: var(--muted);
  text-align: center;
}

body .site-footer > img { display: block; width: 7rem; height: auto; opacity: 1; }
body .site-footer p { margin: 0; font-size: 0.85rem; }
body .site-footer .footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.25rem;
}
body .site-footer .footer-links a { font-size: 0.9rem; text-transform: none; letter-spacing: 0; }
.social-links a { width: 2.75rem; height: 2.75rem; }

a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid #75dff5;
  outline-offset: 4px;
}
.action, .button { min-height: 2.75rem; }
.action-primary:hover, .action-primary:focus-visible,
.button-primary:hover, .button-primary:focus-visible,
body .site-header .site-nav .nav-steam:hover,
body .site-header .site-nav .nav-steam:focus-visible {
  background: #75dff5;
  color: #050814;
}
picture { display: block; }
picture img { max-width: 100%; }
.article-hero > p:not(.eyebrow) { max-width: 48rem; color: var(--mist); font-size: 1.1rem; }
.article-hero .actions { justify-content: flex-start; }
.availability { color: var(--fog); }
.press-hero, .report-hero { min-height: 0; padding: 3rem 1.25rem 10rem; }
.press-hero .hero-land, .report-hero .hero-land { height: 9rem; object-position: center bottom; }
.press-hero h1, .report-hero h1 { font-size: clamp(2.3rem, 5vw, 4rem); }
.hero .availability { display: inline-block; padding: 0.25rem 0.75rem; background: rgba(5, 8, 20, 0.75); }
.studio { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.screenshot-downloads { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; margin-top: 1.25rem; }
.support-address { margin-bottom: 0; overflow-wrap: anywhere; }
.account-note { color: var(--fog); font-size: 0.9rem; }
.contact-card a, .facts-card dd { overflow-wrap: anywhere; }

@media (max-width: 820px) {
  body .site-header { flex-direction: column; align-items: flex-start; }
  body .site-header .site-nav { justify-content: flex-start; }
}
@media (max-width: 520px) {
  body .site-header .site-nav { gap: 0.25rem 0.9rem; }
  .press-hero, .report-hero { padding-top: 2rem; padding-bottom: 9rem; }
  .hero-actions { flex-direction: column; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
