/* Tokens do sistema visual — materializados do 02-design.md
   JA com as correcoes da auditoria (PLANO_MESTRE §4):
   - --c-warning escurecido para ~#8A5C00 (folga AA sobre branco com texto branco)
   - texto "Nao incluso" usa --c-neutral-600 (nao 400)
   - --c-action = #0F7A43 (NAO o verde-WhatsApp cru #25D366)
   - fontes self-hosted (sem Google Fonts CDN) */

@font-face {
  font-family: 'Fraunces';
  src: url('/assets/fonts/fraunces-variable.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-variable.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
  font-style: normal;
}

:root {
  /* Neutros */
  --c-neutral-0: #ffffff;
  --c-neutral-50: #f7f8f4;
  --c-neutral-100: #edefe8;
  --c-neutral-200: #dce0d3;
  --c-neutral-400: #9aa08c; /* SO decoracao/borda — proibido para texto de leitura */
  --c-neutral-600: #5e6450; /* texto secundario AA */
  --c-neutral-800: #33372a;
  --c-neutral-900: #1e2118;

  /* Marca */
  --c-brand: #2f5d3a;
  --c-brand-strong: #234a2c;
  --c-brand-tint: #e6efe5;

  /* Acao / CTA — NUNCA o verde-WhatsApp cru #25D366 (reprova contraste 1.4:1) */
  --c-action: #0f7a43;
  --c-action-hover: #0c6438;
  --c-action-press: #0a532f;
  --c-action-tint: #dff3e7;

  /* Semanticas — warning escurecido para ~#8A5C00 (correcao da auditoria, folga AA) */
  --c-info: #2b6cb0;
  --c-warning: #8a5c00;
  --c-danger: #b42318;
  --c-success: #0f7a43;

  /* Acento por casa. TRAVA WCAG: accent (massa/borda/simbolo) reprova AA como
     texto sobre branco (~2-2.6:1 nos verdes); TEXTO usa SEMPRE *-ink (>=4.8:1). */
  --c-casa-capim-accent: #7fa653;
  --c-casa-capim-ink: #4f6b2e;
  --c-casa-eva-accent: #a8b560;
  --c-casa-eva-ink: #5e6a1e;
  --c-casa-hortela-accent: #3fa68a;
  --c-casa-hortela-ink: #1f6b57;
  --c-casa-pitanga-accent: #b5603f; /* terracota dessaturado — entra na familia terrosa (era #c8492f, saltava do verde-mata) */
  --c-casa-pitanga-ink: #9a4527;
  --c-casa-naira-accent: #6e7da8; /* PROVISORIO — ficha pendente */
  --c-casa-naira-ink: #465478;

  /* Acento ativo (default = marca; cada pagina/card seta via [data-casa]) */
  --c-casa-accent: var(--c-brand);
  --c-casa-ink: var(--c-brand-strong);

  /* Tipografia */
  --ff-display: 'Fraunces', Georgia, serif;
  --ff-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-xs: 0.8rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.25rem;
  --fs-lg: 1.5625rem;
  --fs-xl: 1.953rem;
  --fs-2xl: 2.441rem;
  --fs-3xl: 3.052rem;
  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-normal: 1.6;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-display: 600;
  --fw-brand: 700;

  /* Spacing base-4 */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-24: 96px;

  /* Raio / sombra / borda */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px; /* chips/badges/selos — raio recorrente, token semantico */
  --shadow-card: 0 1px 2px rgba(30, 33, 24, 0.06), 0 4px 12px rgba(30, 33, 24, 0.05);
  --shadow-card-hover: 0 2px 4px rgba(30, 33, 24, 0.08), 0 10px 24px rgba(30, 33, 24, 0.1);
  --shadow-sticky: 0 -2px 12px rgba(30, 33, 24, 0.08);
  --border-hairline: 1px solid var(--c-neutral-200);

  /* Layout */
  --container-md: 720px;
  --container-lg: 960px;
  --container-xl: 1200px;
  --focus-ring: 0 0 0 2px var(--c-neutral-0), 0 0 0 4px var(--c-brand);
}

/* Mapeamento de acento por casa via data-attribute (sem JS) */
[data-casa='capim'] {
  --c-casa-accent: var(--c-casa-capim-accent);
  --c-casa-ink: var(--c-casa-capim-ink);
}
[data-casa='eva'] {
  --c-casa-accent: var(--c-casa-eva-accent);
  --c-casa-ink: var(--c-casa-eva-ink);
}
[data-casa='hortela'] {
  --c-casa-accent: var(--c-casa-hortela-accent);
  --c-casa-ink: var(--c-casa-hortela-ink);
}
[data-casa='pitanga'] {
  --c-casa-accent: var(--c-casa-pitanga-accent);
  --c-casa-ink: var(--c-casa-pitanga-ink);
}
[data-casa='naira'] {
  --c-casa-accent: var(--c-casa-naira-accent);
  --c-casa-ink: var(--c-casa-naira-ink);
}

/* Reset minimo */
*,
*::before,
*::after {
  box-sizing: border-box;
}
* {
  margin: 0;
}
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}
body {
  font-family: var(--ff-body);
  font-size: var(--fs-base);
  line-height: var(--lh-normal);
  color: var(--c-neutral-800);
  background: var(--c-neutral-0);
  -webkit-font-smoothing: antialiased;
}
img,
picture,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}
a {
  color: var(--c-action);
}
h1,
h2,
h3 {
  font-family: var(--ff-display);
  font-weight: var(--fw-display);
  color: var(--c-neutral-900);
  line-height: var(--lh-tight);
}

@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;
  }
}

/* Utilitarios estruturais minimos (design refina) */
.container {
  width: 100%;
  max-width: var(--container-xl);
  margin-inline: auto;
  padding-inline: var(--sp-4);
}
@media (min-width: 768px) {
  .container {
    padding-inline: var(--sp-6);
  }
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: var(--sp-3) var(--sp-4);
  background: var(--c-brand);
  color: var(--c-neutral-0);
  border-radius: 0 0 var(--radius-sm) 0;
}
.skip-link:focus {
  left: 0;
}

:where(a, button, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
  border-radius: var(--radius-sm);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
