/*!
 * O sistema visual do site, num ficheiro só.
 *
 * Estava inteiro dentro do <style> da página comercial, e assim que houve mais
 * do que uma página isso deixou de ser sustentável: duas cópias dos mesmos
 * tokens divergem sempre, e a que diverge é a que ninguém está a olhar.
 *
 * Neutros quentes (nunca cinzento-azul), acento âmbar, verde de sinal. Todos os
 * pares texto/fundo daqui passam 4,5:1 nas duas luzes — está medido por
 * verificacao/paginas.mjs, não é uma intenção.
 */

:root {
  --ground: #F6F1E6;
  --surface: #FFFCF6;
  --surface-2: #EDE6D6;
  --ink: #191510;
  --ink-2: #46403A;
  --ink-3: #6A6154;
  --rule: #DDD3C0;
  --rule-strong: #B5A88F;

  --brand: #8A5806;
  --brand-lit: #E09A32;
  --brand-wash: #F6E7CB;
  --brand-fg: #191510;   --signal-fg: #FFFFFF;

  --signal: #17663A;
  --signal-lit: #4FA96A;
  --signal-wash: #DDEEDF;

  --info: #1A5C88;
  --info-lit: #3E8FC4;
  --info-wash: #DCEAF4;

  --danger: #A32E16;
  --danger-lit: #D2634A;
  --danger-wash: #F6E0D9;

  --sans: system-ui, -apple-system, "Segoe UI", "Avenir Next", sans-serif;
  --serif: Georgia, Charter, "Iowan Old Style", Palatino, serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, "Cascadia Mono", Consolas, monospace;

  --measure: 66ch;
  --shell: 1120px;
  --pad: clamp(1.15rem, 4vw, 2.5rem);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #14110D; --surface: #1E1A15; --surface-2: #292319;
    --ink: #F2EDE0; --ink-2: #C4B9A5; --ink-3: #9A8F7C;
    --rule: #352E24; --rule-strong: #4E4436;
    --brand: #F0A63C; --brand-lit: #F0A63C; --brand-wash: #2E2312;
    --brand-fg: #14110D; --signal-fg: #14110D;
    --signal: #7FD08A; --signal-lit: #7FD08A; --signal-wash: #16281B;
    --info: #6BB6E8; --info-lit: #6BB6E8; --info-wash: #12222E;
    --danger: #E8836A; --danger-lit: #E8836A; --danger-wash: #2C1710;
  }
}

:root[data-theme="dark"] {
  --ground: #14110D; --surface: #1E1A15; --surface-2: #292319;
  --ink: #F2EDE0; --ink-2: #C4B9A5; --ink-3: #9A8F7C;
  --rule: #352E24; --rule-strong: #4E4436;
  --brand: #F0A63C; --brand-lit: #F0A63C; --brand-wash: #2E2312;
  --brand-fg: #14110D; --signal-fg: #14110D;
  --signal: #7FD08A; --signal-lit: #7FD08A; --signal-wash: #16281B;
  --info: #6BB6E8; --info-lit: #6BB6E8; --info-wash: #12222E;
  --danger: #E8836A; --danger-lit: #E8836A; --danger-wash: #2C1710;
}

:root[data-theme="light"] {
  --ground: #F6F1E6; --surface: #FFFCF6; --surface-2: #EDE6D6;
  --ink: #191510; --ink-2: #46403A; --ink-3: #6A6154;
  --rule: #DDD3C0; --rule-strong: #B5A88F;
  --brand: #8A5806; --brand-lit: #E09A32; --brand-wash: #F6E7CB;
  --brand-fg: #191510; --signal-fg: #FFFFFF;
  --signal: #17663A; --signal-lit: #4FA96A; --signal-wash: #DDEEDF;
  --info: #1A5C88; --info-lit: #3E8FC4; --info-wash: #DCEAF4;
  --danger: #A32E16; --danger-lit: #D2634A; --danger-wash: #F6E0D9;
}

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

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, svg { display: block; max-width: 100%; }

.shell { max-width: var(--shell); margin: 0 auto; padding-inline: var(--pad); }
.col { max-width: var(--measure); }

/* ---------- barra de controlos ---------- */

.controlos {
  position: sticky; top: 0; z-index: 190;
  display: flex; align-items: center; justify-content: flex-end; gap: .5rem;
  padding: .45rem var(--pad);
  background: var(--ground);
  border-bottom: 1px solid var(--rule);
}
.idiomas { display: flex; gap: 2px; }
.idiomas button, .themer {
  font-family: var(--sans); font-size: .74rem; font-weight: 600; letter-spacing: .04em;
  background: transparent; color: var(--ink-3);
  border: 1px solid transparent; border-radius: 3px;
  padding: .28rem .5rem; cursor: pointer; line-height: 1;
}
.idiomas button:hover, .themer:hover { color: var(--ink); background: var(--surface-2); }
.idiomas button[aria-pressed="true"] { color: var(--brand-fg); background: var(--brand-lit); border-color: var(--brand-lit); }
.themer { display: flex; align-items: center; gap: .35rem; }
.themer svg { width: 15px; height: 15px; }
.themer .ic-lua { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .themer .ic-sol { display: none; }
  :root:not([data-theme="light"]) .themer .ic-lua { display: block; }
}
:root[data-theme="dark"] .themer .ic-sol { display: none; }
:root[data-theme="dark"] .themer .ic-lua { display: block; }
:root[data-theme="light"] .themer .ic-sol { display: block; }
:root[data-theme="light"] .themer .ic-lua { display: none; }

/* ---------- tipografia ---------- */

.eyebrow {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--brand); margin: 0 0 .9rem;
}
h1 {
  font-size: clamp(2.1rem, 6vw, 3.6rem);
  line-height: 1.06; letter-spacing: -.022em; margin: 0 0 1.1rem;
  max-width: 20ch; text-wrap: balance;
}
h2 {
  font-size: clamp(1.5rem, 3.4vw, 2.1rem);
  line-height: 1.18; letter-spacing: -.018em; margin: 0 0 .8rem;
  max-width: 26ch; text-wrap: balance;
}
h3 {
  font-family: var(--sans); font-size: 1.06rem; font-weight: 700;
  line-height: 1.3; letter-spacing: -.01em; margin: 0 0 .4rem;
}
p { margin: 0 0 1.05rem; color: var(--ink-2); }
p.lead { font-size: clamp(1.08rem, 2.1vw, 1.32rem); line-height: 1.5; color: var(--ink); max-width: 56ch; }
strong, b { color: var(--ink); font-weight: 700; }
a { color: var(--brand); }
code, .mono { font-family: var(--mono); font-size: .88em; }

section { padding-block: clamp(2.6rem, 6vw, 4.4rem); border-top: 1px solid var(--rule); scroll-margin-top: 4.5rem; }
section:first-of-type { border-top: 0; }

.rotulo {
  font-family: var(--mono); font-size: .7rem; letter-spacing: .13em;
  text-transform: uppercase; color: var(--ink-3); margin: 0 0 .7rem;
}
.frase {
  font-family: var(--sans); font-weight: 700; font-size: clamp(1rem, 2.2vw, 1.2rem);
  color: var(--ink); border-left: 3px solid var(--brand-lit);
  padding-left: .9rem; margin: 1.6rem 0 0; max-width: 48ch; line-height: 1.4;
}

/* ---------- conversão ---------- */

.accao { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.8rem; align-items: center; }
.cta {
  font-family: var(--sans); font-size: 1rem; font-weight: 700; text-decoration: none;
  padding: .85rem 1.35rem; border-radius: 4px; line-height: 1.2;
  border: 1px solid var(--brand-lit); background: var(--brand-lit); color: var(--brand-fg);
}
.cta:hover { filter: brightness(1.06); }
.cta.segundo { background: transparent; color: var(--ink); border-color: var(--rule-strong); }
.cta.segundo:hover { border-color: var(--ink-3); filter: none; }
.garantias { font-family: var(--sans); font-size: .82rem; color: var(--ink-3); margin: .9rem 0 0; max-width: 62ch; }

/* Cada secção da landing tem uma porta para o detalhe: é assim que a página
   comercial se mantém curta sem esconder nada de quem quer o fundo. */
.detalhe {
  display: inline-block; font-family: var(--sans); font-size: .88rem; font-weight: 700;
  text-decoration: none; color: var(--brand); margin-top: .4rem;
}
.detalhe:hover { text-decoration: underline; }

/* ---------- blocos ---------- */

.caixas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin-top: 1.8rem; }
.caixa {
  background: var(--surface); border: 1px solid var(--rule); border-radius: 5px;
  padding: 1.1rem 1.2rem; font-family: var(--sans); font-size: .9rem; line-height: 1.5;
}
.caixa p { font-family: var(--sans); font-size: .9rem; margin: 0; color: var(--ink-2); }
.caixa p + p { margin-top: .6rem; }
.caixa h3 { margin-bottom: .35rem; }

.destaque {
  background: var(--surface); border: 1px solid var(--rule-strong); border-radius: 6px;
  padding: clamp(1.2rem, 3vw, 1.9rem); margin-top: 1.8rem;
}
.destaque p:last-child { margin-bottom: 0; }

.aviso {
  font-family: var(--sans); font-size: .84rem; line-height: 1.5;
  color: var(--ink-2); background: var(--surface-2);
  border-left: 3px solid var(--rule-strong); border-radius: 0 4px 4px 0;
  padding: .7rem .95rem; margin: 1.4rem 0 0; max-width: 68ch;
}
.aviso b { color: var(--ink); }

.regra {
  font-family: var(--sans); font-size: 1rem; font-weight: 700; line-height: 1.45;
  color: var(--ink); background: var(--brand-wash);
  border: 1px solid var(--brand-lit); border-radius: 5px;
  padding: .9rem 1.1rem; margin: 1.6rem 0 0; max-width: 62ch;
}

/* ---------- tabela ---------- */

.tabela-caixa { overflow-x: auto; margin-top: 1.8rem; border: 1px solid var(--rule); border-radius: 5px; }
table { border-collapse: collapse; width: 100%; min-width: 560px; background: var(--surface); }
th, td {
  font-family: var(--sans); font-size: .88rem; line-height: 1.45;
  text-align: left; padding: .6rem .9rem; border-bottom: 1px solid var(--rule); vertical-align: top;
}
thead th {
  font-size: .68rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-3); background: var(--surface-2); font-weight: 700;
}
tbody tr:last-child td { border-bottom: 0; }
td.hoje { color: var(--ink-3); }
td.amanha { color: var(--ink); font-weight: 600; }

/* ---------- listas numeradas ---------- */

.degraus { list-style: none; margin: 1.6rem 0 0; padding: 0; counter-reset: d; }
.degraus li {
  position: relative; padding: .85rem 0 .85rem 3.4rem;
  border-bottom: 1px solid var(--rule); font-family: var(--sans); font-size: .93rem; line-height: 1.5;
  color: var(--ink-2);
}
.degraus li:last-child { border-bottom: 0; }
.degraus li::before {
  counter-increment: d; content: counter(d);
  position: absolute; left: 0; top: .8rem;
  width: 2.1rem; height: 2.1rem; border-radius: 50%;
  background: var(--surface-2); color: var(--ink-2); border: 1px solid var(--rule-strong);
  display: grid; place-items: center; font-weight: 700; font-size: .85rem;
}
.degraus.dezero { counter-reset: d -1; }
.degraus b { color: var(--ink); }

/* ---------- figuras ---------- */

figure { margin: 1.8rem 0 0; }
figure.larga { overflow-x: auto; -webkit-overflow-scrolling: touch; }
figure.larga svg { min-width: 760px; }
figcaption { font-family: var(--sans); font-size: .82rem; color: var(--ink-3); margin-top: .7rem; max-width: 64ch; }
.arraste { display: none; }
@media (max-width: 860px) { .arraste { display: inline; } }

/* ---------- painel de comando: escuro nas duas luzes, de propósito ---------- */

.comando {
  --c-fundo: #14110D; --c-carta: #1E1A15; --c-carta-2: #211C15; --c-linha: #3A3227;
  --c-texto: #F2EDE0; --c-texto-2: #C4B9A5; --c-texto-3: #9A8F7C;
  --c-acento: #F0A63C; --c-verde: #7FD08A; --c-vermelho: #E8836A;
  background: var(--c-fundo); color: var(--c-texto);
  border: 1px solid var(--c-linha); border-radius: 8px;
  padding: clamp(1.4rem, 4vw, 3rem);
  margin-block: clamp(2.6rem, 6vw, 4.4rem);
  border-top: 1px solid var(--c-linha);
  font-family: var(--sans);
}
.comando .rotulo { color: var(--c-acento); }
.comando h2, .comando h3 { color: var(--c-texto); }
.comando h2 { font-family: var(--serif); }
.comando p { color: var(--c-texto-2); font-family: var(--sans); font-size: .96rem; }
.comando .lead { color: var(--c-texto); font-family: var(--sans); }
.comando strong, .comando b { color: var(--c-texto); }
.comando figcaption { color: var(--c-texto-3); }
.comando a { color: var(--c-acento); }

.comandos { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2rem; }
.comandos .parar { grid-column: 1 / -1; }
@media (max-width: 760px) { .comandos { grid-template-columns: 1fr; } }

.cmd { background: var(--c-carta); border: 1px solid var(--c-linha); border-radius: 6px; padding: 1.1rem 1.2rem; min-width: 0; }
.cmd.acento { border-color: var(--c-acento); background: var(--c-carta-2); }
.cmd.parar { border-color: var(--c-vermelho); }
.cmd .quando {
  font-family: var(--mono); font-size: .64rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--c-texto-3); display: block; margin-bottom: .5rem;
}
.cmd.acento .quando { color: var(--c-acento); }
.cmd.parar .quando { color: var(--c-vermelho); }
.cmd h3 { font-size: 1.02rem; margin-bottom: .45rem; }
.cmd p { margin-bottom: 0; font-size: .9rem; line-height: 1.5; }
.cmd p + p { margin-top: .7rem; }

.mostradores { display: grid; gap: .45rem; margin-top: .9rem; }
.mostrador { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; border-top: 1px solid var(--c-linha); padding-top: .45rem; }
.mostrador .rot { font-size: .82rem; color: var(--c-texto-3); }
.mostrador .val { font-family: var(--mono); font-size: .86rem; font-weight: 700; color: var(--c-acento); text-align: right; }

.ordem {
  margin-top: .9rem; border: 1px solid var(--c-linha); border-radius: 5px;
  background: #100D0A; padding: .8rem .9rem;
  font-family: var(--mono); font-size: .78rem; line-height: 1.6;
}
.ordem .dita { color: var(--c-texto); display: block; margin-bottom: .6rem; }
.ordem .campo { display: block; color: var(--c-texto-3); }
.ordem .campo b { color: var(--c-verde); font-weight: 700; }
.ordem .preco { display: block; margin-top: .6rem; color: var(--c-acento); }

.lista-inegociavel { list-style: none; margin: .9rem 0 0; padding: 0; }
.lista-inegociavel li {
  font-size: .86rem; color: var(--c-texto-2); line-height: 1.45;
  padding: .4rem 0 .4rem 1.2rem; border-top: 1px solid var(--c-linha); position: relative;
}
.lista-inegociavel li::before { content: "▪"; position: absolute; left: 0; color: var(--c-acento); }

.comando .degraus li { color: var(--c-texto-2); border-bottom-color: var(--c-linha); }
.comando .degraus b { color: var(--c-texto); }
.comando .degraus li::before { background: var(--c-carta); color: var(--c-texto-2); border-color: var(--c-linha); }
.comando .destaque { background: var(--c-carta); border-color: var(--c-linha); }
.comando .destaque p { color: var(--c-texto-2); }

/* ---------- fim de página ---------- */

.final { background: var(--surface); border-top: 1px solid var(--rule); }
.rodape { font-family: var(--sans); font-size: .8rem; color: var(--ink-3); padding-block: 1.6rem 2.6rem; border-top: 1px solid var(--rule); }

.mapa { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; margin-top: 1.6rem; }
.mapa a {
  display: block; text-decoration: none; color: var(--ink);
  background: var(--surface); border: 1px solid var(--rule); border-radius: 5px; padding: .95rem 1.05rem;
}
.mapa a:hover { border-color: var(--rule-strong); }
.mapa .t { font-family: var(--sans); font-weight: 700; font-size: .96rem; display: block; }
.mapa .d { font-family: var(--sans); font-size: .84rem; color: var(--ink-3); display: block; margin-top: .2rem; line-height: 1.45; }

@media print { .controlos, .pn-migalhas { display: none; } section { break-inside: avoid; } }