/* Finalistas S.A. · página de captura
   Identidade: Ignição com o claro à frente (marca/identidade.md no projeto). */

:root {
  --papel: #F7F4EF;
  --areia: #E6DCCB;
  --areia-escura: #D8CDBB;
  --carvao: #14110F;
  --carvao-2: #241F1B;
  --creme: #F5EFE6;
  --laranja: #F5821F;
  --laranja-texto: #A64E0C;
  --cinza: #4A433D;
  --cinza-claro: #B9AC97;

  --titulo: "Barlow Condensed", "Arial Narrow", sans-serif;
  --serifa: "Instrument Serif", Georgia, serif;
  --corpo: "Archivo", "Helvetica Neue", sans-serif;

  --margem: clamp(16px, 5vw, 88px);
  --largura: 1320px;
  --sombra-cromo: 0 1px 0 rgba(20, 17, 15, .06), 0 14px 28px -12px rgba(20, 17, 15, .35);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--papel);
  color: var(--carvao);
  font-family: var(--corpo);
  font-size: 17px;
  line-height: 1.55;
  overflow-x: clip;
}
html { overflow-x: clip; }
/* grão de papel */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 50;
  opacity: .22;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .08 0 0 0 0 .06 0 0 0 0 .05 0 0 0 .5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

a { color: var(--laranja-texto); }
a:hover { color: var(--carvao); }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
:focus-visible { outline: 3px solid var(--laranja); outline-offset: 3px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saltar { position: absolute; left: -999px; top: 8px; background: var(--carvao); color: var(--creme); padding: 10px 14px; z-index: 100; }
.saltar:focus { left: 8px; }
.sub { color: var(--laranja-texto); font-weight: 600; }

/* ---------- peças comuns ---------- */
.sobrelinha {
  font-family: var(--titulo);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .22em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ponto { width: 10px; height: 10px; border-radius: 50%; background: var(--laranja); flex-shrink: 0; }
.sobrelinha--escuro { color: var(--creme); }

.titulo-secao {
  font-family: var(--titulo);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(44px, 6.4vw, 92px);
  line-height: .9;
  letter-spacing: -.005em;
}
.titulo-secao em {
  display: block;
  font-family: var(--serifa);
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  font-size: .62em;
  line-height: 1.05;
  letter-spacing: 0;
  color: var(--laranja-texto);
  margin-top: .2em;
}
.titulo-secao--claro em { color: var(--laranja); }

.botao {
  --inclina: -2deg;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 26px;
  background: var(--laranja);
  color: var(--carvao);
  font-family: var(--titulo);
  font-weight: 800;
  font-size: 22px;
  letter-spacing: .05em;
  text-transform: uppercase;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  transform: rotate(var(--inclina));
  box-shadow: 4px 4px 0 var(--carvao);
  transition: transform .18s ease, box-shadow .18s ease;
}
.botao:hover { color: var(--carvao); transform: rotate(0deg) translate(-2px, -2px); box-shadow: 6px 6px 0 var(--carvao); }
.botao:active { transform: rotate(0deg) translate(2px, 2px); box-shadow: 1px 1px 0 var(--carvao); }
.botao--pequeno { min-height: 44px; font-size: 17px; padding: 8px 16px; box-shadow: 3px 3px 0 var(--carvao); }
.botao--grande { font-size: 26px; min-height: 60px; }

.ligacao {
  font-family: var(--titulo);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--carvao);
  text-decoration: none;
  border-bottom: 2px solid var(--laranja);
  padding: 6px 0;
}

/* logo: FINALISTAS + tarja S.A. */
.logo { display: inline-flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--carvao); line-height: 1; }
.logo__nome { font-family: var(--titulo); font-weight: 800; font-size: 32px; line-height: .86; letter-spacing: -.005em; }
.logo__tarja {
  background: var(--laranja); color: var(--carvao);
  font-family: var(--titulo); font-weight: 800; font-size: 14px; letter-spacing: .08em;
  padding: 2px 10px; margin-top: -1px; transform: rotate(-4deg);
}
.logo:hover { color: var(--carvao); }
.logo--claro, .logo--claro:hover { color: var(--creme); }

/* ---------- topo ---------- */
.topo {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 24px;
  padding: 14px var(--margem);
  background: rgba(247, 244, 239, .86);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(20, 17, 15, .08);
}
.topo__autor { margin-left: auto; font-size: 15px; color: var(--cinza); }
.topo__autor a { color: var(--carvao); text-decoration: none; }

/* ---------- herói ---------- */
.heroi {
  max-width: var(--largura);
  margin: 0 auto;
  padding: clamp(40px, 7vw, 96px) var(--margem) clamp(56px, 8vw, 110px);
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.heroi__texto { display: flex; flex-direction: column; gap: 28px; }
.heroi__titulo {
  font-family: var(--titulo);
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(48px, 5.4vw, 84px);
  line-height: .88;
  letter-spacing: -.01em;
}
.heroi__titulo .linha { display: block; }
.heroi__titulo .destaque { color: var(--laranja-texto); }
.heroi__sub { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.5; max-width: 560px; }
.heroi__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; }

/* entrada escalonada */
.entra { opacity: 0; transform: translateY(18px); animation: entra .8s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(var(--d) * 90ms + 120ms); }
@keyframes entra { to { opacity: 1; transform: none; } }

/* ---------- cromos ---------- */
.cromo {
  --canto: 64px;
  position: relative;
  width: 260px;
  aspect-ratio: 3 / 4;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--papel);
  clip-path: polygon(0 0, calc(100% - var(--canto)) 0, 100% var(--canto), 100% 100%, 0 100%);
}
.cromo::after {
  content: "";
  position: absolute; top: 0; right: 0;
  width: var(--canto); height: var(--canto);
  background: var(--laranja);
  clip-path: polygon(0 0, 0 100%, 100% 100%);
}
.cromo__num { font-family: var(--serifa); font-style: italic; font-size: 38px; line-height: 1; color: var(--laranja-texto); }
.cromo__etiqueta { font-family: var(--titulo); font-weight: 800; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--laranja); margin-top: 8px; }
.cromo__foto { flex: 1; background: var(--areia-escura); display: flex; align-items: flex-end; justify-content: center; overflow: hidden; }
.cromo__foto svg { width: 72%; fill: var(--cinza-claro); }
.cromo__nome { font-family: var(--titulo); font-weight: 800; font-size: 28px; line-height: 1; text-transform: uppercase; }
.cromo__rodape { display: flex; justify-content: space-between; font-size: 12px; color: var(--cinza); margin-top: auto; }
.cromo__rodape b { color: inherit; font-weight: 600; }
.cromo__logo { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; box-shadow: inset 0 0 0 2px #4A433D; font-family: var(--titulo); font-weight: 700; font-size: 22px; color: var(--cinza-claro); text-transform: uppercase; padding: 10px; }
.cromo__grande { font-family: var(--titulo); font-weight: 800; font-size: 44px; line-height: .9; text-transform: uppercase; }
.cromo__funcoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; font-size: 13px; font-weight: 600; margin-top: auto; }

.cromo--aluno { background: var(--papel); }
.cromo--patrocinio { background: var(--carvao); color: var(--creme); }
.cromo--patrocinio .cromo__num { color: var(--laranja); }
.cromo--patrocinio .cromo__rodape { color: var(--cinza-claro); }
.cromo--empresa { background: var(--laranja); color: var(--carvao); }
.cromo--empresa::after { background: var(--carvao); }
.cromo--empresa .cromo__num, .cromo--empresa .cromo__etiqueta { color: var(--carvao); }

/* o leque do herói */
.leque {
  position: relative;
  height: clamp(420px, 44vw, 560px);
  --mx: 0; --my: 0;
  filter: drop-shadow(0 18px 22px rgba(20, 17, 15, .28));
}
.leque .cromo { position: absolute; left: 50%; top: 50%; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.leque__1 { transform: translate(calc(-50% - 150px + var(--mx) * -10px), calc(-50% + 24px + var(--my) * -8px)) rotate(-13deg); animation: cai1 1s .35s cubic-bezier(.2, .8, .2, 1) both; }
.leque__2 { transform: translate(calc(-50% + var(--mx) * 6px), calc(-50% - 14px + var(--my) * 6px)) rotate(-2deg); z-index: 2; animation: cai2 1s .5s cubic-bezier(.2, .8, .2, 1) both; }
.leque__3 { transform: translate(calc(-50% + 150px + var(--mx) * 14px), calc(-50% + 36px + var(--my) * 10px)) rotate(10deg); z-index: 3; animation: cai3 1s .65s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes cai1 { from { opacity: 0; transform: translate(-50%, -150%) rotate(-40deg); } }
@keyframes cai2 { from { opacity: 0; transform: translate(-50%, -160%) rotate(20deg); } }
@keyframes cai3 { from { opacity: 0; transform: translate(-50%, -150%) rotate(40deg); } }
.leque:hover .leque__1 { transform: translate(calc(-50% - 175px), calc(-50% + 34px)) rotate(-17deg); }
.leque:hover .leque__3 { transform: translate(calc(-50% + 175px), calc(-50% + 46px)) rotate(14deg); }
.leque__nota { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; font-size: 12px; letter-spacing: .08em; color: var(--cinza); }

/* ---------- faixa ---------- */
.faixa {
  background: var(--laranja);
  color: var(--carvao);
  transform: rotate(-4deg);
  margin: -10px -40px 0;
  padding: 16px 0;
  overflow: hidden;
  position: relative;
  z-index: 5;
}
.faixa__rolo { display: flex; gap: 28px; width: max-content; animation: rola 30s linear infinite; }
.faixa__rolo span, .faixa__rolo i {
  font-family: var(--titulo); font-weight: 800; font-style: normal;
  font-size: clamp(30px, 4vw, 52px); line-height: 1; text-transform: uppercase; white-space: nowrap;
}
@keyframes rola { to { transform: translateX(-50%); } }

/* ---------- história ---------- */
.historia {
  background: var(--carvao);
  color: var(--creme);
  margin-top: -40px;
  padding: clamp(110px, 12vw, 160px) var(--margem) clamp(72px, 9vw, 120px);
}
.historia > * { max-width: var(--largura); margin-left: auto; margin-right: auto; }
.cabeca { display: flex; flex-direction: column; gap: 18px; margin-bottom: clamp(40px, 5vw, 64px); }
.historia .titulo-secao em { color: var(--laranja); }
.linha-tempo {
  list-style: none; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px;
  border-top: 2px solid var(--creme);
}
.marco { padding: 28px 24px 8px 0; display: flex; flex-direction: column; gap: 10px; }
.marco__ano { font-family: var(--serifa); font-style: italic; font-size: clamp(54px, 6vw, 84px); line-height: 1; color: var(--cinza-claro); }
.marco h3 { font-family: var(--titulo); font-weight: 800; font-size: 26px; text-transform: uppercase; letter-spacing: .02em; }
.marco p { color: #D9D0C2; font-size: 16px; }
.marco--agora .marco__ano { color: var(--laranja); }
.citacao {
  margin-top: clamp(56px, 7vw, 96px);
  padding-left: clamp(0px, 8vw, 140px);
}
.citacao p { font-family: var(--serifa); font-style: italic; font-size: clamp(32px, 4.2vw, 60px); line-height: 1.12; max-width: 980px; }
.citacao cite { display: block; margin-top: 18px; font-style: normal; font-size: 15px; color: var(--cinza-claro); letter-spacing: .04em; }

/* ---------- caderneta ---------- */
.caderneta {
  max-width: var(--largura);
  margin: 0 auto;
  padding: clamp(80px, 10vw, 140px) var(--margem);
}
.caderneta__cabeca { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: clamp(36px, 5vw, 60px); }
.caderneta__cabeca > div { display: flex; flex-direction: column; gap: 18px; }
.contador { font-family: var(--titulo); font-weight: 700; font-size: 22px; letter-spacing: .06em; text-transform: uppercase; color: var(--cinza); }
.contador b { font-family: var(--serifa); font-style: italic; font-weight: 400; font-size: 56px; color: var(--laranja-texto); letter-spacing: 0; vertical-align: -6px; }

.pagina {
  list-style: none; margin: 0;
  padding: clamp(20px, 3vw, 40px);
  background: var(--areia);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 26px);
  box-shadow: inset 0 0 0 1px rgba(20, 17, 15, .06), 0 30px 60px -40px rgba(20, 17, 15, .45);
  position: relative;
}
.pagina::before { /* a dobra da caderneta */
  content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(20, 17, 15, .12), transparent);
}
.espaco {
  position: relative;
  aspect-ratio: 3 / 4.2;
  border: 2px dashed rgba(20, 17, 15, .28);
  display: flex; align-items: center; justify-content: center;
}
.espaco::before {
  content: attr(data-num);
  font-family: var(--serifa); font-style: italic; font-size: 54px; color: rgba(20, 17, 15, .22);
}
.autocolante {
  --canto: 44px;
  position: absolute; inset: -2px;
  padding: 18px 16px;
  display: flex; flex-direction: column; gap: 10px;
  background: var(--papel);
  clip-path: polygon(0 0, calc(100% - var(--canto)) 0, 100% var(--canto), 100% 100%, 0 100%);
  opacity: 0;
  transform: translateY(-46px) rotate(var(--r, 5deg)) scale(1.06);
  transition: opacity .35s ease, transform .6s cubic-bezier(.2, 1.4, .4, 1);
}
.autocolante::after {
  content: ""; position: absolute; top: 0; right: 0;
  width: var(--canto); height: var(--canto);
  background: var(--laranja);
  clip-path: polygon(0 0, 0 100%, 100% 100%);
}
.espaco:nth-child(1) { --r: -6deg; }
.espaco:nth-child(2) { --r: 7deg; }
.espaco:nth-child(3) { --r: -4deg; }
.espaco:nth-child(4) { --r: 6deg; }
.espaco:nth-child(5) { --r: -7deg; }
.espaco.colado { filter: drop-shadow(0 10px 14px rgba(20, 17, 15, .22)); }
.espaco.colado .autocolante { opacity: 1; transform: rotate(calc(var(--r) * .12)); }
.autocolante__num { font-family: var(--serifa); font-style: italic; font-size: 40px; line-height: 1; color: var(--laranja-texto); }
.autocolante h3 { font-family: var(--titulo); font-weight: 800; font-size: clamp(20px, 1.7vw, 26px); line-height: .95; text-transform: uppercase; hyphens: auto; -webkit-hyphens: auto; }
.autocolante p { font-size: 15px; line-height: 1.45; }
.autocolante--laranja { background: var(--laranja); }
.autocolante--laranja::after { background: var(--carvao); }
.autocolante--laranja .autocolante__num { color: var(--carvao); }
.autocolante--escuro { background: var(--carvao); color: var(--creme); }
.autocolante--escuro .autocolante__num { color: var(--laranja); }

/* ---------- aprendem ---------- */
.aprendem {
  background: var(--carvao);
  color: var(--creme);
  padding: clamp(72px, 9vw, 120px) var(--margem);
  overflow: hidden;
}
.aprendem > * { max-width: var(--largura); margin-left: auto; margin-right: auto; }
.palavras { list-style: none; padding: 0; margin-top: 28px; display: flex; flex-direction: column; }
.palavras li {
  font-family: var(--titulo); font-weight: 800; text-transform: uppercase;
  font-size: clamp(58px, 11vw, 168px); line-height: .88; letter-spacing: -.01em;
  color: transparent;
  -webkit-text-stroke: 2px var(--creme);
  transition: color .4s ease;
}
.palavras li:hover { color: var(--creme); }
.palavras .palavras__destaque { color: var(--laranja); -webkit-text-stroke: 0; }
.palavras .palavras__destaque:hover { color: var(--laranja); }
.aprendem__fecho { font-family: var(--serifa); font-style: italic; font-size: clamp(28px, 3.4vw, 48px); margin-top: 24px; color: var(--creme); }

/* ---------- escola ---------- */
.escola {
  max-width: var(--largura);
  margin: 0 auto;
  padding: clamp(80px, 10vw, 140px) var(--margem);
}
.grelha-escola { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--carvao); }
.item { padding: 28px 28px 8px 0; display: flex; flex-direction: column; gap: 12px; }
.item + .item { padding-left: 28px; border-left: 1px solid rgba(20, 17, 15, .15); }
.item__num { font-family: var(--serifa); font-style: italic; font-size: 44px; line-height: 1; color: var(--laranja-texto); }
.item h3 { font-family: var(--titulo); font-weight: 800; font-size: 26px; line-height: 1; text-transform: uppercase; }
.item p { font-size: 16px; color: var(--cinza); }
.item--dados h3::after {
  content: "RGPD"; display: inline-block; margin-left: 10px; vertical-align: 3px;
  background: var(--laranja); color: var(--carvao); font-size: 12px; letter-spacing: .1em; padding: 2px 8px; transform: rotate(-4deg);
}

/* ---------- contacto ---------- */
.contacto {
  background: var(--carvao);
  color: var(--creme);
  padding: clamp(80px, 10vw, 140px) var(--margem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}
.contacto > * { min-width: 0; }
.contacto__falta { display: flex; flex-direction: column; gap: 28px; position: sticky; top: 110px; }
.contacto__texto { color: #D9D0C2; font-size: 18px; max-width: 480px; margin-top: 18px; }
.espaco-vazio {
  width: 200px; aspect-ratio: 3 / 4;
  border: 3px dashed var(--laranja);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  transform: rotate(-3deg);
  animation: pisca 2.4s ease-in-out infinite;
}
.espaco-vazio__num { font-family: var(--serifa); font-style: italic; font-size: 48px; color: var(--laranja); line-height: 1; }
.espaco-vazio__texto { font-family: var(--titulo); font-weight: 800; font-size: 22px; letter-spacing: .1em; text-transform: uppercase; }
@keyframes pisca { 50% { border-color: rgba(245, 130, 31, .35); } }

.formulario {
  background: var(--papel);
  color: var(--carvao);
  padding: clamp(24px, 3.4vw, 44px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 20px;
  clip-path: polygon(0 0, calc(100% - 70px) 0, 100% 70px, 100% 100%, 0 100%);
  position: relative;
}
.formulario::after {
  content: ""; position: absolute; top: 0; right: 0; width: 70px; height: 70px;
  background: var(--laranja); clip-path: polygon(0 0, 0 100%, 100% 100%);
}
.campo { display: flex; flex-direction: column; gap: 8px; min-width: 0; border: 0; padding: 0; margin: 0; }
.campo--perfil, .campo--largo, .consentimento, .formulario .botao, .formulario__estado { grid-column: 1 / -1; }
.campo > label, .campo legend {
  font-family: var(--titulo); font-weight: 700; font-size: 17px; letter-spacing: .08em; text-transform: uppercase; padding: 0;
}
.opcional { text-transform: none; letter-spacing: 0; font-family: var(--corpo); font-weight: 400; color: var(--cinza); font-size: 14px; }
input[type="text"], input[type="email"], textarea {
  font: inherit; font-size: 17px;
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  background: #FFFFFF;
  color: var(--carvao);
  border: 2px solid var(--carvao);
  border-radius: 0;
  appearance: none;
}
textarea { resize: vertical; min-height: 96px; }
input[type="text"]:focus, input[type="email"]:focus, textarea:focus { outline: none; border-color: var(--laranja-texto); box-shadow: 4px 4px 0 var(--laranja); }
.campo[data-erro] input { border-color: #B3261E; }
.opcoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.opcoes label { position: relative; cursor: pointer; }
.opcoes input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.opcoes span {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 14px;
  border: 2px solid var(--carvao); background: #FFFFFF;
  font-size: 15px; font-weight: 500;
  transition: background .15s ease, transform .15s ease;
}
.opcoes input:checked + span { background: var(--laranja); transform: rotate(-2deg); font-weight: 600; }
.opcoes input:focus-visible + span { outline: 3px solid var(--laranja-texto); outline-offset: 2px; }
.consentimento { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: var(--cinza); cursor: pointer; }
.consentimento input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--laranja-texto); flex-shrink: 0; }
.formulario .botao { justify-self: start; margin-top: 6px; }
.formulario__estado { font-size: 15px; min-height: 1.5em; font-weight: 500; }
.formulario__estado[data-tipo="erro"] { color: #B3261E; }
.formulario__estado[data-tipo="ok"] { color: var(--laranja-texto); }
.formulario.enviado { animation: colar .7s cubic-bezier(.2, 1.4, .4, 1); }
@keyframes colar { 0% { transform: rotate(4deg) scale(1.04); } 100% { transform: none; } }

/* ---------- rodapé ---------- */
.rodape {
  background: var(--carvao);
  color: var(--cinza-claro);
  border-top: 1px solid rgba(245, 239, 230, .12);
  padding: 40px var(--margem) 48px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px 40px;
  font-size: 14px;
}
.rodape a { color: var(--creme); }
.rodape .logo { margin-right: auto; }
.rodape .sub { color: var(--laranja); }

/* ---------- revelar ao rolar ---------- */
.revela { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); }
.revela.visto { opacity: 1; transform: none; }

/* ---------- ecrãs pequenos ---------- */
@media (max-width: 1080px) {
  .pagina { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pagina::before { display: none; }
  .grelha-escola { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .item:nth-child(3) { padding-left: 0; border-left: 0; }
  .linha-tempo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .heroi { grid-template-columns: minmax(0, 1fr); }
  .leque { height: 400px; margin-top: 8px; }
  .leque .cromo { width: 200px; --canto: 50px; }
  .leque__1 { transform: translate(calc(-50% - 100px), calc(-50% + 20px)) rotate(-13deg); }
  .leque__3 { transform: translate(calc(-50% + 100px), calc(-50% + 30px)) rotate(10deg); }
  .leque:hover .leque__1 { transform: translate(calc(-50% - 110px), calc(-50% + 24px)) rotate(-15deg); }
  .leque:hover .leque__3 { transform: translate(calc(-50% + 110px), calc(-50% + 34px)) rotate(12deg); }
  .cromo__grande { font-size: 34px; }
  .contacto { grid-template-columns: minmax(0, 1fr); }
  .contacto__falta { position: static; }
  .topo__autor { display: none; }
  .topo .botao--pequeno { margin-left: auto; }
}
@media (max-width: 600px) {
  body { font-size: 16px; }
  .pagina { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .espaco { aspect-ratio: auto; }
  .espaco::before { position: absolute; }
  .espaco:last-child { grid-column: 1 / -1; }
  .autocolante { position: relative; inset: auto; margin: -2px; padding: 16px 14px 18px; }
  .autocolante h3 { font-size: 20px; }
  .autocolante p { font-size: 14px; }
  .grelha-escola { grid-template-columns: minmax(0, 1fr); }
  .item, .item + .item { padding-left: 0; border-left: 0; }
  .linha-tempo { grid-template-columns: minmax(0, 1fr); }
  .formulario { grid-template-columns: minmax(0, 1fr); clip-path: polygon(0 0, calc(100% - 46px) 0, 100% 46px, 100% 100%, 0 100%); }
  .formulario::after { width: 46px; height: 46px; }
  .leque { height: 340px; }
  .leque .cromo { width: 168px; --canto: 42px; padding: 14px; gap: 8px; }
  .leque__1 { transform: translate(calc(-50% - 78px), calc(-50% + 16px)) rotate(-13deg); }
  .leque__3 { transform: translate(calc(-50% + 78px), calc(-50% + 24px)) rotate(10deg); }
  .cromo__num { font-size: 28px; }
  .cromo__nome { font-size: 22px; }
  .cromo__grande { font-size: 28px; }
  .cromo__logo { font-size: 16px; }
  .espaco-vazio { width: 150px; }
  .faixa { margin-left: -30px; margin-right: -30px; }
}

/* ---------- menos movimento ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .entra, .revela, .autocolante { opacity: 1; transform: none; }
}

/* Campo-armadilha contra spam: escondido de pessoas, visível para robôs */
.armadilha { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Páginas de texto: privacidade e 404 */
.legal { max-width: 760px; margin: 0 auto; padding: clamp(120px, 14vw, 170px) var(--margem) 96px; }
.legal--erro { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding-top: 64px; }
.legal h1 { font-family: var(--titulo); font-weight: 800; font-size: clamp(44px, 7vw, 76px); line-height: .95; text-transform: uppercase; margin: 12px 0 24px; }
.legal h2 { font-family: var(--titulo); font-weight: 700; font-size: 26px; text-transform: uppercase; letter-spacing: .01em; margin: 40px 0 8px; }
.legal p { margin: 0 0 12px; }
.legal a:not(.botao) { color: var(--laranja-texto); text-underline-offset: 3px; }
.legal__lead { font-family: var(--serifa); font-style: italic; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.3; }
.legal__voltar { margin-top: 48px !important; }