/* ============================================================
   PRIMA — styles.css (folha de estilos partilhada)
   Carregada nas páginas de site (index, área pessoal, ajuda, legal).
   Os ecrãs de fluxo (comecar, login, relatorio) e os relatórios A4
   mantêm CSS próprio. O CSS específico de cada página vive no <style>
   da própria página e pode sobrepor-se a este ficheiro.
   ============================================================ */

/* ---------- tokens ---------- */
:root {
  --terra:#C4785A; --terra-lt:#F7EDE7; --terra-bd:rgba(196,120,90,.28);
  --blue:#5B9EC9; --blue-lt:#EBF4FA;
  --ink:#0F1923; --ink-60:#697A88; --ink-30:#A8B4BC; --ink-10:#E8ECEF; --ink-05:#F5F7F9;
  --green:#2E8B57; --green-lt:#E8F5EE; --done:#83B29C; --pot-alto:#A6391A;
  --amber:#9A6B2E; --amber-lt:#FBF1E1;
  --w:1160px;              /* páginas públicas (nav, footer, index) */
  --w-app:980px;           /* concha da app e wizard (caixas exteriores) */
  --w-content:760px;       /* coluna de leitura */
  --w-form:680px;          /* formulários estreitos */
  --nav-h:68px;            /* altura do header público */
  --sp-section:84px;       /* ritmo vertical entre secções */
  --r-pill:100px;          /* botões/cápsulas */
  --r-xl:22px;             /* heros e molduras grandes */
  --r-lg:18px;             /* cartões */
  --r-md:12px;             /* menus e cartões interiores */
  --r-sm:10px;             /* inputs e elementos pequenos */
  --fs-hero:2.6rem;          /* h1 dos heros das páginas públicas */
  --f-serif:'Fraunces',Georgia,serif;
  --f-sans:'Geist','Helvetica Neue',Arial,sans-serif;
}

/* ---------- base ---------- */
html { scrollbar-gutter: stable; scroll-padding-top: 96px; overflow-x: hidden; }
body { overflow-x: hidden; }
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
body { font-family:var(--f-sans); background:#fff; color:var(--ink); -webkit-font-smoothing:antialiased; display:flex; flex-direction:column; min-height:100vh; min-height:100svh; }
#site-footer { margin-top:auto; }


/* ---------- foco visível (teclado) ---------- */
a:focus-visible, button:focus-visible, [role="radio"]:focus-visible, [tabindex]:focus-visible, summary:focus-visible {
  outline:1px solid rgba(91,158,201,.45); outline-offset:1px; border-radius:4px; box-shadow:0 0 0 2px rgba(91,158,201,.08);
}

/* ---------- botões ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 20px; border-radius:var(--r-pill); font-family:inherit; font-size:.875rem; font-weight:600; cursor:pointer; text-decoration:none; transition:all .2s; border:none; white-space:nowrap; }
.btn svg { flex-shrink:0; }
.btn-ghost { background:transparent; color:var(--ink-60); border:1.5px solid var(--ink-10); }
.btn-ghost:hover { border-color:var(--ink-30); color:var(--ink); }
.btn-dark { background:var(--ink); color:#fff; box-shadow:0 2px 12px rgba(15,25,35,.2); }
.btn-dark:hover { background:#1e2f3f; transform:translateY(-1px); }
.btn-terra { background:var(--terra); color:#fff; box-shadow:0 2px 12px rgba(196,120,90,.25); }
.btn-terra:hover { background:#b3694c; transform:translateY(-1px); }

/* ---------- layout de documento legal (privacidade, termos, cookies) ---------- */
.doc-hero { border-bottom:1px solid var(--ink-10); }
.doc-hero-in { max-width:var(--w); margin:0 auto; padding:128px 48px 32px; }
.doc-eyebrow { font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--terra); margin-bottom:12px; }
.doc-hero h1 { font-family:var(--f-serif); font-size:2.4rem; font-weight:400; letter-spacing:-.02em; margin-bottom:10px; }
.doc-updated { font-size:.82rem; color:var(--ink-30); }
.draft-banner { display:flex; gap:12px; align-items:flex-start; max-width:var(--w); margin:24px auto 0; padding:0 48px; }
.draft-inner { display:flex; gap:11px; align-items:flex-start; background:var(--amber-lt); border:1px solid #EBD7B5; border-radius:var(--r-md); padding:14px 16px; width:100%; }
.draft-inner svg { flex-shrink:0; color:var(--amber); margin-top:1px; }
.draft-inner p { font-size:.84rem; color:#7A5520; line-height:1.6; }
.policy { max-width:var(--w); margin:0 auto; padding:36px 48px 24px; display:grid; grid-template-columns:240px 1fr; gap:52px; align-items:start; }
.toc { position:sticky; top:88px; }
.toc-t { font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-30); margin-bottom:14px; }
.toc ol { list-style:none; counter-reset:toc; }
.toc li { counter-increment:toc; margin-bottom:3px; }
.toc a { display:flex; gap:8px; padding:6px 10px; border-radius:var(--r-sm); font-size:.83rem; color:var(--ink-60); text-decoration:none; transition:all .15s; line-height:1.4; }
.toc a::before { content:counter(toc) "."; color:var(--ink-30); font-weight:600; }
.toc a:hover { background:var(--ink-05); color:var(--ink); }
.doc { max-width:var(--w-form); }
.doc section { scroll-margin-top:88px; padding-bottom:30px; }
.doc h2 { font-family:var(--f-serif); font-size:1.3rem; font-weight:500; margin-bottom:12px; display:flex; gap:10px; align-items:baseline; }
.doc h2 .num { font-size:.95rem; color:var(--terra); font-weight:600; font-family:var(--f-sans); }
.doc h3 { font-size:.92rem; font-weight:600; margin:16px 0 6px; }
.doc p { font-size:.93rem; color:var(--ink-60); line-height:1.75; margin-bottom:10px; }
.doc ul { margin:0 0 10px; padding-left:20px; }
.doc li { font-size:.93rem; color:var(--ink-60); line-height:1.7; margin-bottom:6px; }
.doc a { color:var(--terra); text-decoration:none; font-weight:600; }
.doc a:hover { text-decoration:underline; }
.doc .ph { color:var(--amber); background:var(--amber-lt); padding:0 5px; border-radius:4px; font-weight:500; font-size:.92em; }

@media(max-width:1024px){
  .policy { grid-template-columns:1fr; gap:24px; }
  .toc { position:static; }
  .toc ol { columns:2; gap:18px; }
}
@media(max-width:768px){
  .doc-hero-in, .draft-banner, .policy { padding-left:20px; padding-right:20px; }
  .toc ol { columns:1; }
}


/* ============ Acessibilidade (preferências do utilizador) ============ */
/* Texto maior: sobe a base; tudo em rem acompanha */
html.a11y-bigtext { font-size:118.75%; }

/* Reduzir movimento */
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after {
  animation-duration:.001ms !important; animation-iteration-count:1 !important;
  transition-duration:.001ms !important; scroll-behavior:auto !important;
}

/* Sublinhar todas as ligações de conteúdo */
html.a11y-underline a:not(.btn):not(.logo) { text-decoration:underline; text-underline-offset:2px; }

/* Alto contraste: escurece cinzas de texto e reforça limites */
html.a11y-contrast {
  --ink-60:#3A4753; --ink-30:#566472; --ink-10:#C4CDD4; --ink-05:#EAEEF1;
}
html.a11y-contrast body { color:#000; }
html.a11y-contrast .btn-ghost, html.a11y-contrast .btn-dark { border-width:1.5px; }
html.a11y-contrast a:not(.btn) { text-decoration:underline; text-underline-offset:2px; }
