/* ═══════════════════════════════════════════════════════════════════════
   BASE: reset, acessibilidade, resiliencia e scaffolding estrutural.

   Aqui NAO entra estetica. Nada de cor decorativa, textura, moldura ou
   tratamento tipografico: isso e decisao de projeto e vive em
   sections.css (ou na peca instalada da library/).

   Se voce esta prestes a escrever algo aqui que so faz sentido para ESTE
   cliente, o lugar errado e este arquivo.
   ═══════════════════════════════════════════════════════════════════════ */

*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

html{ scroll-behavior:smooth; }
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-stopped{ overflow:hidden; }

body{
  margin:0;
  background:var(--bg-0);
  color:var(--ink-0);
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}

img, picture, video, canvas, svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
button, input, select, textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:400; line-height:1.05; margin:0; text-wrap:balance; }
p{ margin:0; text-wrap:pretty; }

/* ── Acessibilidade ─────────────────────────────────────────────────── */
:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }

.skip{
  position:absolute; left:var(--gx); top:-4rem; z-index:calc(var(--z-overlay) + 10);
  padding:.75em 1.2em; background:var(--ink-0); color:var(--bg-0);
  transition:top .2s;
}
.skip:focus{ top:1rem; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ── Resiliencia: nada pode ficar invisivel para sempre ─────────────── */
/* Sem JS, todo conteudo marcado para animar aparece normalmente. */
.no-js [data-fade], .no-js [data-words], .no-js [data-wipe]{
  opacity:1 !important; transform:none !important; clip-path:none !important;
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  [data-fade], [data-words], [data-wipe]{
    opacity:1 !important; transform:none !important; clip-path:none !important;
  }
}

/* ── Scaffolding estrutural (sem estetica) ──────────────────────────── */
.sec{ padding:var(--gy) var(--gx); }
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; }

/* Area de toque minima de 44px em qualquer alvo interativo (WCAG 2.5.5).
   A aparencia do botao e decisao de projeto: definir em sections.css. */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  min-height:44px; padding:.9em 1.6em; border:0; border-radius:var(--radius);
  cursor:pointer; text-align:center;
}

/* ── Formularios: estrutura e estados de validacao ──────────────────── */
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field label{ font-size:.9rem; color:var(--ink-1); }
.field input, .field select, .field textarea{
  min-height:44px; padding:.7em .9em; border:1px solid var(--rule);
  border-radius:var(--radius); background:var(--bg-0);
}
.field[data-invalid="true"] input,
.field[data-invalid="true"] textarea{ border-color:var(--err); }
.field__err{ font-size:.85rem; color:var(--err); }
.form__ok{ color:var(--ok); }

/* ── Consentimento LGPD (infraestrutura obrigatoria, nao estetica) ────
   Aparece apenas quando a pagina coleta dados. Ver src/lib/consent.js. */
.cc{
  position:fixed; inset:auto 0 0 0; z-index:var(--z-overlay);
  display:none; gap:1rem; flex-wrap:wrap; align-items:center;
  padding:1rem var(--gx); background:var(--bg-1); color:var(--ink-0);
  border-top:1px solid var(--rule);
}
.cc[data-open="true"]{ display:flex; }
.cc__txt{ flex:1 1 22rem; font-size:.92rem; }
.cc__acts{ display:flex; gap:.6rem; flex-wrap:wrap; }
.cc__btn{ min-height:44px; padding:.6em 1.1em; border:1px solid var(--rule-2); background:transparent; cursor:pointer; border-radius:var(--radius); }
.cc__btn--primary{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.cc__prefs{ display:none; flex:1 1 100%; gap:1rem; flex-wrap:wrap; padding-top:.8rem; border-top:1px solid var(--rule); }
.cc[data-prefs="true"] .cc__prefs{ display:flex; }
.cc__opt{ display:flex; align-items:center; gap:.5rem; font-size:.9rem; }