/* Tipografia, layout genérico e utilitários */

html {
  background: var(--paper);
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-body);
  line-height: 1.6;
  color: var(--ink);
  background: var(--paper);
  letter-spacing: -0.011em;
}

::selection {
  background: var(--accent);
  color: var(--paper);
}

/* Saltar para o conteúdo — visível só no focus */
.skip-link {
  position: absolute;
  left: var(--gutter);
  top: 0;
  z-index: 30;
  padding: var(--space-2) var(--space-4);
  background: var(--ink);
  color: var(--paper);
  transform: translateY(-120%);
}

.skip-link:focus {
  transform: translateY(var(--space-2));
}

:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}

h1, h2, h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h2 {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
}

h3 {
  font-size: var(--fs-md);
}

p {
  max-width: var(--measure);
}

p + p {
  margin-top: var(--space-4);
}

a:hover {
  color: var(--accent);
}

.wrap {
  width: min(100% - var(--gutter) * 2, var(--wrap));
  margin-inline: auto;
}

.section,
.hero,
.contact,
.site-footer {
  scroll-margin-top: var(--nav-h);
}

.section {
  padding-block: var(--space-8);
}

@media (min-width: 960px) {
  .section {
    padding-block: var(--space-9);
  }
}

/* Pills / chips genéricos — o estado activo vive em sections.css */
.chip,
.pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  border: 1px solid var(--rule);
  border-radius: 999px;
  padding: 0.4rem 0.85rem;
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1.2;
  background: transparent;
}

/* Motion só com gesto do utilizador; sem entradas automáticas */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}