/**
 * base.css — RevisaCursos
 * Reset, variáveis de design (cores/raio/tipografia), tipografia base,
 * container e utilidades de acessibilidade (skip-link, screen-reader-text).
 * Carregado primeiro; os outros arquivos de CSS dependem das variáveis daqui.
 */

:root {
  --background: 0 0% 100%;
  --foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 3.9%;
  --primary: 174 72% 33%;
  --primary-foreground: 0 0% 100%;
  --brand-dark: 200 30% 12%;
  --accent-amber: 38 92% 50%;
  --secondary: 240 4.8% 95.9%;
  --secondary-foreground: 240 5.9% 10%;
  --muted: 240 4.8% 95.9%;
  --muted-foreground: 240 3.8% 46.1%;
  --border: 240 5.9% 90%;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --container-max: 80rem;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "Inter", sans-serif;
  color: hsl(var(--foreground));
  background: hsl(var(--background));
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-display {
  font-family: "Sora", sans-serif;
}

img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; }
ul { margin: 0; padding: 0; list-style: none; }

.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.25rem;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

/* skip link (acessibilidade) */
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  background: hsl(var(--primary));
  color: #fff;
  padding: 0.75rem 1.25rem;
  z-index: 999;
}
.skip-link:focus {
  left: 1rem;
  top: 1rem;
}