.site-header { padding-block: var(--space-2); }
.nav { display:flex; align-items:center; gap: var(--space-4); }
.logo { display:flex; align-items:center; gap: .75rem; }
.logo::after { display:none; }
.logo__text { display:flex; flex-direction:column; line-height: var(--line-height-tight); }
.logo__name { font-weight: 700; letter-spacing: .02em; color: var(--color-text); }
.logo__tagline { font-size: var(--font-size-xs); color: var(--color-muted); max-width: 42ch; }
.nav__list { list-style:none; display:flex; gap: var(--space-3); margin:0; padding:0; }
.nav__list a { padding:.4rem .6rem; border-radius: var(--radius-s); position:relative; }
.nav__list a:focus-visible,.nav__list a:hover { background: var(--color-surface-alt); }
.nav__list a[aria-current="page"] { color: var(--color-accent); background: color-mix(in oklab, var(--color-surface-alt) 60%, transparent); }
.nav__list a[aria-current="page"]::after { content:""; position:absolute; left:.6rem; right:.6rem; bottom:.2rem; height:2px; background: linear-gradient(90deg,var(--color-accent),var(--color-accent-alt)); border-radius:1px; box-shadow: 0 0 .6rem rgba(255,122,0,.5); }

.hero { padding-block: clamp(4rem, 12vh, 8rem); background: radial-gradient(circle at 30% 30%, var(--color-surface-alt), var(--color-bg)); }
.hero__title { margin-top:0; }
.hero__lead { font-size: var(--font-size-l); max-width: 52ch; }
.hero__actions { display:flex; flex-wrap:wrap; gap: var(--space-2); margin-top: var(--space-3); }

.section { padding-block: clamp(3rem, 8vh, 5rem); }

.site-footer { padding-block: var(--space-4); font-size: var(--font-size-s); border-top:1px solid var(--color-border); margin-top: var(--space-5); }

.site-footer .footer-actions { display:flex; justify-content:flex-end; margin-top: var(--space-2); }

.site-footer .footer-brand__line { white-space: nowrap; }

.site-footer .footer-brand__tagline { font-size: var(--font-size-xs); }

.site-footer .footer-meta { color: var(--color-muted); margin-left: var(--space-2); }
.site-footer .footer-meta a { color: inherit; text-decoration: underline dotted; }
.site-footer .footer-meta a:hover, .site-footer .footer-meta a:focus-visible { color: var(--color-text); text-decoration: underline; }

@media (max-width: 57.5rem) {
  .nav { flex-wrap:wrap; justify-content:center; gap: var(--space-2); }
  .logo { width:100%; justify-content:center; }
  .logo {
    display: grid;
    grid-template-columns: 48px max-content;
    grid-template-areas:
      "mark name"
      "tag tag";
    column-gap: .75rem;
    row-gap: .1rem;
    align-items: center;
	justify-content: center;
  }
  .logo__text { display: contents; }
  .logo-svg { grid-area: mark; }
  .logo__name { grid-area: name; text-align:left; }
  .logo__tagline { grid-area: tag; display:block; max-width: none; text-align:center; }
	.nav__list { width:100%; justify-content:center; flex-wrap:nowrap; gap: var(--space-1); white-space: nowrap; }
  .nav__list { gap: .35rem; }
  .nav__list a { padding: .28rem .42rem; }
}

@media (max-width: 42rem) {
  .site-footer { text-align: center; }
  .site-footer .footer-actions { justify-content: center; }
  .site-footer .footer-meta { margin-left: 0; }
  .site-footer .footer-brand__tagline { display: block; margin-top: .2rem; }
	.hero__lead { font-size: var(--font-size-m); }
}
