/* Folio landing page: layout on top of the site theme (theme.css).
   Only what is specific to this page lives here: the wordmark hero and the
   install section's spacing. Components and tokens come from the theme. */

/* ---------- hero ---------- */
.hero { min-height: 62vh; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 40px 20px; }
.hero h1 { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: clamp(64px, 12vw, 112px);
  line-height: 1; letter-spacing: -.02em; color: var(--ink); }
/* Deliberately not .eyebrow: wider tracking and the ghost grey, matching the blog's site tagline. */
.tagline { margin: 18px 0 0; font-family: var(--font-sans); font-weight: 700; font-size: 11px;
  text-transform: uppercase; letter-spacing: .06em; color: var(--fg-ghost); }

/* ---------- install section ---------- */
/* The page stylesheet owns the space after its last section. */
.install { padding-bottom: 96px; }

/* ---------- responsive ---------- */
@media (max-width: 620px) {
  .hero { min-height: auto; padding: 72px 20px 40px; }
}