:root {
  --oq-tinta: #360802;
  --oq-tinta-suave: #6a4a44;
  --oq-sinal: #f73b20;
  --oq-sinal-claro: #f84d35;
  --oq-papel: #ffffff;
  --oq-carvao: #000000;
  --oq-cinza: #ababab;
  --oq-areia: #e7dcdb;
  --oq-linho: #fdedea;
  --oq-citrino: #f5ffbb;
  --oq-menta: #bcffbb;
  --oq-coral: #fb2d54;
  --oq-cobalto: #477ee9;
  --oq-esmeralda: #34c771;
  --oq-vidro: rgba(247, 59, 32, 0.05);
  --oq-fio: rgba(54, 8, 2, 0.12);
  --oq-fio-forte: rgba(54, 8, 2, 0.24);

  --oq-fonte: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --oq-fonte-marca: "Futura", "Avenir Next", "Century Gothic", "Trebuchet MS", var(--oq-fonte);

  --oq-t-legenda: 12px;
  --oq-t-miudo: 14px;
  --oq-t-corpo: 16px;
  --oq-t-sub: 23px;
  --oq-t-titulo-p: 33px;
  --oq-t-titulo: 44px;
  --oq-t-titulo-g: 72px;
  --oq-t-mostra: 106px;

  --oq-p4: 4px;
  --oq-p8: 8px;
  --oq-p12: 12px;
  --oq-p16: 16px;
  --oq-p20: 20px;
  --oq-p24: 24px;
  --oq-p32: 32px;
  --oq-p48: 48px;
  --oq-p56: 56px;
  --oq-p80: 80px;
  --oq-p160: 160px;

  --oq-largura: 1200px;
  --oq-r-fio: 8px;
  --oq-r-botao: 12px;
  --oq-r-cartao: 16px;
  --oq-r-largo: 24px;
  --oq-r-nav: 84px;
  --oq-r-pilula: 9999px;

  --oq-sombra-baixo: rgba(0, 0, 0, 0.05) 0 -4px 16px 0;
  --oq-sombra-marca: rgba(247, 59, 32, 0.1) 0 8px 24px 0, rgba(247, 59, 32, 0.05) 0 2px 8px 0;

  --oq-topo: 74px;
}

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--oq-papel);
  color: var(--oq-tinta);
  font-family: var(--oq-fonte);
  font-size: var(--oq-t-corpo);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.01em;
  overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--oq-sinal); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 { margin: 0; font-weight: 500; letter-spacing: 0.01em; }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }

:focus-visible {
  outline: 2px solid var(--oq-sinal);
  outline-offset: 3px;
  border-radius: var(--oq-r-fio);
}

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

.oq-eixo {
  width: 100%;
  max-width: var(--oq-largura);
  margin-inline: auto;
  padding-inline: var(--oq-p24);
}

.oq-selo {
  display: inline-flex;
  align-items: center;
  gap: var(--oq-p8);
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--oq-sinal);
  font-weight: 500;
}
.oq-selo::before {
  content: "";
  width: 22px; height: 2px;
  background: var(--oq-sinal);
}

.oq-fio { height: 1px; background: var(--oq-fio); border: 0; margin: 0; }

/* ---------- botões ---------- */
.oq-tecla {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--oq-p8);
  font-family: inherit;
  font-size: var(--oq-t-miudo);
  font-weight: 500;
  letter-spacing: 0.03em;
  padding: 12px 22px;
  border-radius: var(--oq-r-botao);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.oq-tecla:hover { text-decoration: none; }
.oq-tecla--cheia { background: var(--oq-sinal); color: var(--oq-papel); }
.oq-tecla--cheia:hover { background: var(--oq-sinal-claro); transform: translateY(-1px); }
.oq-tecla--contorno { background: transparent; color: var(--oq-sinal); border-color: var(--oq-sinal); }
.oq-tecla--contorno:hover { background: var(--oq-vidro); }
.oq-tecla--nua { background: transparent; color: var(--oq-sinal); padding-inline: var(--oq-p8); }
.oq-tecla--nua:hover { text-decoration: underline; }
.oq-tecla--clara { background: var(--oq-papel); color: var(--oq-tinta); }
.oq-tecla--clara:hover { background: var(--oq-linho); }
.oq-tecla--fantasma {
  background: transparent; color: var(--oq-papel);
  border: 1px solid rgba(255,255,255,.6); border-radius: var(--oq-r-nav);
}
.oq-tecla--fantasma:hover { background: rgba(255,255,255,.12); }
.oq-tecla--pilula { border-radius: var(--oq-r-nav); }

/* ---------- 1. pórtico (cabeçalho) ---------- */
.oq-portico {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--oq-fio);
}
.oq-portico__eixo {
  display: flex;
  align-items: center;
  gap: var(--oq-p16);
  min-height: var(--oq-topo);
}
.oq-marca {
  font-family: var(--oq-fonte-marca);
  font-size: 21px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--oq-tinta);
  white-space: nowrap;
}
.oq-marca:hover { text-decoration: none; }
.oq-marca__eco { color: var(--oq-sinal); }
.oq-portico__nav { margin-left: auto; display: flex; align-items: center; gap: var(--oq-p16); }
.oq-portico__lista {
  display: flex;
  align-items: center;
  gap: var(--oq-p20);
}
.oq-portico__elo {
  font-size: 13px;
  letter-spacing: 0.03em;
  color: var(--oq-tinta);
  padding: 6px 2px;
  border-bottom: 1px solid transparent;
}
.oq-portico__elo:hover { color: var(--oq-sinal); text-decoration: none; border-bottom-color: var(--oq-sinal); }
.oq-portico__acao { margin-left: 0; flex: 0 0 auto; }
.oq-portico__chave {
  display: none;
  margin-left: auto;
  width: 44px; height: 40px;
  align-items: center; justify-content: center;
  background: transparent;
  border: 1px solid var(--oq-fio);
  border-radius: var(--oq-r-botao);
  color: var(--oq-tinta);
  cursor: pointer;
}

/* ---------- 2. frontão (hero) ---------- */
.oq-frontao {
  position: relative;
  overflow: hidden;
  padding-block: clamp(48px, 7vw, 96px) clamp(40px, 6vw, 80px);
}
.oq-frontao__fundo {
  position: absolute;
  inset: -10% -10% auto auto;
  width: min(74vw, 980px);
  height: auto;
  opacity: .16;
  filter: saturate(.7);
  -webkit-mask-image: radial-gradient(120% 90% at 78% 26%, #000 20%, transparent 72%);
  mask-image: radial-gradient(120% 90% at 78% 26%, #000 20%, transparent 72%);
  pointer-events: none;
  z-index: 0;
}
.oq-frontao__eixo { position: relative; z-index: 1; }
.oq-frontao__grelha {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}
.oq-frontao__titulo {
  margin-top: var(--oq-p20);
  font-size: clamp(42px, 8.2vw, 96px);
  line-height: 0.94;
  letter-spacing: 0.01em;
  font-weight: 500;
}
.oq-frontao__titulo em { font-style: normal; color: var(--oq-sinal); }
.oq-frontao__lead {
  margin-top: var(--oq-p24);
  max-width: 46ch;
  font-size: clamp(17px, 1.6vw, 21px);
  line-height: 1.5;
  color: var(--oq-tinta-suave);
}
.oq-frontao__teclas {
  margin-top: var(--oq-p32);
  display: flex;
  flex-wrap: wrap;
  gap: var(--oq-p12);
}
.oq-frontao__notas {
  margin-top: var(--oq-p32);
  padding-top: var(--oq-p20);
  border-top: 1px solid var(--oq-fio);
  display: flex;
  flex-wrap: wrap;
  gap: var(--oq-p24);
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--oq-tinta-suave);
}
.oq-frontao__moldura {
  position: relative;
  border-radius: var(--oq-r-largo);
  overflow: hidden;
  box-shadow: var(--oq-sombra-marca);
}
.oq-frontao__moldura img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.oq-frontao__etiqueta {
  position: absolute;
  left: var(--oq-p16);
  bottom: var(--oq-p16);
  background: rgba(255,255,255,.92);
  border-radius: var(--oq-r-pilula);
  padding: 7px 14px;
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--oq-tinta);
}
.oq-vitrine {
  margin-top: var(--oq-p20);
  padding: var(--oq-p16);
  background: var(--oq-vidro);
  border-radius: var(--oq-r-cartao);
}
.oq-vitrine__titulo {
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oq-tinta-suave);
  margin-bottom: var(--oq-p12);
}
.oq-vitrine__fila {
  display: flex;
  flex-wrap: wrap;
  gap: var(--oq-p8);
}
.oq-vitrine__pedra {
  width: 54px; height: 54px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--oq-fio);
  background: var(--oq-papel);
}
.oq-vitrine__pedra img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- 3. relevo (destaque da redação) ---------- */
.oq-relevo { padding-block: clamp(56px, 7vw, 96px); background: var(--oq-linho); }
.oq-relevo__cabeca {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: end;
}
.oq-relevo__titulo {
  margin-top: var(--oq-p16);
  font-size: clamp(32px, 4.6vw, 60px);
  line-height: 1.02;
}
.oq-relevo__autoria {
  font-size: var(--oq-t-miudo);
  letter-spacing: 0.04em;
  color: var(--oq-tinta-suave);
  margin-top: var(--oq-p12);
}
.oq-relevo__intro { font-size: 17px; line-height: 1.65; color: var(--oq-tinta-suave); }
.oq-relevo__palco {
  margin-top: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: var(--oq-p16);
}
.oq-relevo__quadro {
  border-radius: var(--oq-r-largo);
  overflow: hidden;
  background: var(--oq-papel);
}
.oq-relevo__quadro img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 9; }
.oq-relevo__coluna { display: grid; grid-template-rows: 1fr 1fr; gap: var(--oq-p16); min-height: 0; }
.oq-relevo__coluna .oq-relevo__quadro { min-height: 0; }
.oq-relevo__coluna .oq-relevo__quadro img { aspect-ratio: auto; height: 100%; }
.oq-relevo__grelha {
  margin-top: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
  gap: var(--oq-p16);
}
.oq-lasca {
  background: var(--oq-papel);
  border-radius: var(--oq-r-cartao);
  padding: var(--oq-p20);
  box-shadow: var(--oq-sombra-baixo);
}
.oq-lasca__icone { color: var(--oq-sinal); margin-bottom: var(--oq-p12); display: block; }
.oq-lasca__titulo { font-size: 19px; line-height: 1.25; }
.oq-lasca__texto { margin-top: var(--oq-p8); font-size: var(--oq-t-miudo); line-height: 1.55; color: var(--oq-tinta-suave); }
.oq-relevo__rodape {
  margin-top: clamp(24px, 3vw, 40px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--oq-p16);
  padding-top: var(--oq-p24);
  border-top: 1px solid var(--oq-fio);
}
.oq-marcas { display: flex; flex-wrap: wrap; gap: var(--oq-p8); }
.oq-marcas__item {
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 12px;
  border: 1px solid var(--oq-fio-forte);
  border-radius: var(--oq-r-pilula);
  color: var(--oq-tinta);
}
.oq-marcas__item--eco { border-color: var(--oq-sinal); color: var(--oq-sinal); }

/* ---------- 4. lauda (modelo editorial) ---------- */
.oq-lauda { padding-block: clamp(56px, 7vw, 96px); }
.oq-lauda__friso {
  width: 100%;
  height: clamp(120px, 18vw, 210px);
  object-fit: cover;
  object-position: center 30%;
  border-radius: var(--oq-r-largo);
  margin-bottom: clamp(32px, 4vw, 56px);
}
.oq-lauda__grelha {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(28px, 5vw, 72px);
}
.oq-lauda__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 3.8vw, 46px); line-height: 1.08; }
.oq-lauda__texto { margin-top: var(--oq-p20); color: var(--oq-tinta-suave); line-height: 1.7; }
.oq-lauda__texto + .oq-lauda__texto { margin-top: var(--oq-p12); }
.oq-passos { display: grid; gap: 0; }
.oq-passos__item {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: var(--oq-p20);
  padding-block: var(--oq-p24);
  border-top: 1px solid var(--oq-fio);
  align-items: start;
}
.oq-passos__item:last-child { border-bottom: 1px solid var(--oq-fio); }
.oq-passos__numero {
  font-size: 15px;
  letter-spacing: 0.14em;
  color: var(--oq-sinal);
  font-weight: 500;
  padding-top: 3px;
}
.oq-passos__titulo { font-size: 21px; line-height: 1.25; }
.oq-passos__texto { margin-top: var(--oq-p8); color: var(--oq-tinta-suave); font-size: 15px; line-height: 1.6; }

/* ---------- 5. mosaico (catálogo em ziguezague) ---------- */
.oq-mosaico { padding-block: clamp(56px, 7vw, 96px); background: var(--oq-papel); }
.oq-mosaico__cabeca {
  display: flex;
  flex-wrap: wrap;
  gap: var(--oq-p24);
  align-items: flex-end;
  justify-content: space-between;
  padding-bottom: var(--oq-p32);
}
.oq-mosaico__titulo { margin-top: var(--oq-p16); font-size: clamp(32px, 4.6vw, 60px); line-height: 1.02; max-width: 16ch; }
.oq-mosaico__nota { max-width: 44ch; color: var(--oq-tinta-suave); font-size: 15px; line-height: 1.65; }

.oq-lousa {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  padding-block: clamp(32px, 4.5vw, 64px);
  border-top: 1px solid var(--oq-fio);
}
.oq-lousa--espelho .oq-lousa__vista { order: 2; }
.oq-lousa--espelho .oq-lousa__verbo { order: 1; }
.oq-lousa__vista { position: relative; isolation: isolate; }
.oq-lousa__cena {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--oq-r-largo);
  background: var(--oq-areia);
}
.oq-lousa--alto .oq-lousa__cena { aspect-ratio: 3 / 4; object-position: center top; }
.oq-lousa--largo .oq-lousa__cena { aspect-ratio: 16 / 9; }
.oq-lousa__sinete {
  position: absolute;
  z-index: 2;
  right: -14px;
  bottom: -14px;
  width: 88px; height: 88px;
  border-radius: 22px;
  overflow: hidden;
  border: 4px solid var(--oq-papel);
  box-shadow: var(--oq-sombra-marca);
  background: var(--oq-papel);
}
.oq-lousa__sinete img { width: 100%; height: 100%; object-fit: cover; }
.oq-lousa__ordem {
  font-family: var(--oq-fonte-marca);
  font-size: clamp(44px, 6vw, 72px);
  line-height: .9;
  color: var(--oq-areia);
  letter-spacing: 0.02em;
}
.oq-lousa__genero {
  display: inline-block;
  margin-top: var(--oq-p12);
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oq-sinal);
}
.oq-lousa__titulo { margin-top: var(--oq-p8); font-size: clamp(26px, 3.2vw, 38px); line-height: 1.1; }
.oq-lousa__estudio { margin-top: var(--oq-p8); font-size: var(--oq-t-miudo); color: var(--oq-tinta-suave); letter-spacing: 0.04em; }
.oq-lousa__texto { margin-top: var(--oq-p16); color: var(--oq-tinta-suave); line-height: 1.7; }
.oq-lousa__ficha {
  margin-top: var(--oq-p20);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--oq-p12);
  padding-block: var(--oq-p16);
  border-top: 1px solid var(--oq-fio);
  border-bottom: 1px solid var(--oq-fio);
}
.oq-lousa__campo { font-size: var(--oq-t-legenda); }
.oq-lousa__rotulo { display: block; text-transform: uppercase; letter-spacing: 0.1em; color: var(--oq-cinza); }
.oq-lousa__valor { display: block; margin-top: 4px; font-size: var(--oq-t-miudo); color: var(--oq-tinta); }
.oq-lousa__teclas { margin-top: var(--oq-p20); display: flex; flex-wrap: wrap; gap: var(--oq-p12); align-items: center; }
.oq-lousa--tom-linho .oq-lousa__vista::after,
.oq-lousa--tom-menta .oq-lousa__vista::after,
.oq-lousa--tom-citrino .oq-lousa__vista::after {
  content: "";
  position: absolute;
  inset: auto auto -22px -22px;
  width: 120px; height: 120px;
  border-radius: var(--oq-r-largo);
  z-index: 0;
}
.oq-lousa--tom-linho .oq-lousa__vista::after { background: var(--oq-linho); }
.oq-lousa--tom-menta .oq-lousa__vista::after { background: var(--oq-menta); }
.oq-lousa--tom-citrino .oq-lousa__vista::after { background: var(--oq-citrino); }

/* ---------- 6. passes ---------- */
.oq-passes { padding-block: clamp(56px, 7vw, 96px); background: var(--oq-linho); }
.oq-passes__cabeca { max-width: 62ch; }
.oq-passes__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 4.2vw, 52px); line-height: 1.05; }
.oq-passes__texto { margin-top: var(--oq-p16); color: var(--oq-tinta-suave); line-height: 1.7; }
.oq-passes__grelha {
  margin-top: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--oq-p20);
  align-items: stretch;
}
.oq-passe {
  display: flex;
  flex-direction: column;
  background: var(--oq-papel);
  border-radius: var(--oq-r-largo);
  padding: var(--oq-p24);
  box-shadow: var(--oq-sombra-baixo);
}
.oq-passe--eco { outline: 1px solid var(--oq-sinal); }
.oq-passe__faixa {
  align-self: flex-start;
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--oq-sinal);
  margin-bottom: var(--oq-p12);
}
.oq-passe__nome { font-size: 26px; line-height: 1.15; }
.oq-passe__preco {
  margin-top: var(--oq-p12);
  font-family: var(--oq-fonte-marca);
  font-size: 44px;
  line-height: 1;
  letter-spacing: 0.01em;
}
.oq-passe__periodo { font-size: var(--oq-t-miudo); color: var(--oq-tinta-suave); margin-top: var(--oq-p4); }
.oq-passe__lista { margin-top: var(--oq-p20); display: grid; gap: var(--oq-p12); }
.oq-passe__item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: var(--oq-p12);
  font-size: 15px;
  line-height: 1.5;
  color: var(--oq-tinta-suave);
}
.oq-passe__item svg { color: var(--oq-sinal); margin-top: 3px; }
.oq-passe__tecla { margin-top: auto; padding-top: var(--oq-p24); }
.oq-passe__tecla .oq-tecla { width: 100%; }
.oq-passes__aviso {
  margin-top: var(--oq-p24);
  padding: var(--oq-p20);
  background: var(--oq-papel);
  border-radius: var(--oq-r-cartao);
  border-left: 3px solid var(--oq-sinal);
  font-size: 15px;
  line-height: 1.65;
  color: var(--oq-tinta-suave);
}

/* ---------- 7. apelo (formulário) ---------- */
.oq-apelo { position: relative; padding-block: clamp(56px, 7vw, 96px); background: #1b0a06; overflow: hidden; }
.oq-apelo__fundo {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center top;
  opacity: .22;
  z-index: 0;
}
.oq-apelo__eixo { position: relative; z-index: 1; }
.oq-apelo__grelha {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: start;
}
.oq-apelo__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 4.2vw, 52px); line-height: 1.05; color: var(--oq-papel); }
.oq-apelo__texto { margin-top: var(--oq-p16); color: rgba(255,255,255,.76); line-height: 1.7; max-width: 46ch; }
.oq-apelo__lista { margin-top: var(--oq-p24); display: grid; gap: var(--oq-p12); }
.oq-apelo__linha {
  display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: var(--oq-p12);
  color: rgba(255,255,255,.76); font-size: 15px; line-height: 1.5;
}
.oq-apelo__linha svg { color: var(--oq-sinal-claro); margin-top: 3px; }
.oq-forma {
  background: rgba(255,255,255,.96);
  border-radius: var(--oq-r-largo);
  padding: clamp(20px, 3vw, 32px);
  box-shadow: var(--oq-sombra-marca);
}
.oq-forma__escolha {
  display: flex; flex-wrap: wrap; gap: var(--oq-p8); align-items: baseline;
  padding: var(--oq-p12) var(--oq-p16);
  background: var(--oq-vidro);
  border-radius: var(--oq-r-cartao);
  font-size: var(--oq-t-miudo);
  margin-bottom: var(--oq-p20);
}
.oq-forma__escolha b { font-weight: 500; color: var(--oq-sinal); }
.oq-forma__campo { display: block; margin-bottom: var(--oq-p16); }
.oq-forma__rotulo {
  display: block;
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oq-tinta-suave);
  margin-bottom: var(--oq-p8);
}
.oq-forma__entrada {
  width: 100%;
  font-family: inherit;
  font-size: var(--oq-t-corpo);
  color: var(--oq-tinta);
  background: var(--oq-vidro);
  border: 1px solid transparent;
  border-radius: var(--oq-r-cartao);
  padding: 14px 16px;
}
.oq-forma__entrada::placeholder { color: var(--oq-cinza); }
.oq-forma__entrada:focus { border-color: var(--oq-sinal); outline: none; background: var(--oq-papel); }
.oq-forma__acordo {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: var(--oq-p12);
  align-items: start;
  font-size: 13px;
  line-height: 1.55;
  color: var(--oq-tinta-suave);
  margin-bottom: var(--oq-p20);
}
.oq-forma__caixa { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--oq-sinal); }
.oq-forma__tecla .oq-tecla { width: 100%; }
.oq-forma__aviso { margin-top: var(--oq-p16); font-size: var(--oq-t-legenda); line-height: 1.6; color: var(--oq-tinta-suave); }
.oq-forma__sucesso {
  display: none;
  margin-top: var(--oq-p16);
  padding: var(--oq-p16);
  border-radius: var(--oq-r-cartao);
  background: var(--oq-menta);
  color: #123d17;
  font-size: 15px;
  line-height: 1.55;
}
.oq-forma__sucesso.is-visivel { display: block; }

/* ---------- 8. dúvidas (FAQ) ---------- */
.oq-duvidas { padding-block: clamp(56px, 7vw, 96px); }
.oq-duvidas__grelha {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.oq-duvidas__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 4vw, 48px); line-height: 1.06; }
.oq-duvidas__nota { margin-top: var(--oq-p16); color: var(--oq-tinta-suave); font-size: 15px; line-height: 1.65; }
.oq-duvida { border-top: 1px solid var(--oq-fio); }
.oq-duvida:last-child { border-bottom: 1px solid var(--oq-fio); }
.oq-duvida__gatilho {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--oq-p16);
  background: transparent;
  border: 0;
  padding: var(--oq-p24) 0;
  font-family: inherit;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.01em;
  color: var(--oq-tinta);
  text-align: left;
  cursor: pointer;
}
.oq-duvida__gatilho:hover { color: var(--oq-sinal); }
.oq-duvida__cruz { flex: 0 0 auto; color: var(--oq-sinal); transition: transform .22s ease; }
.oq-duvida__gatilho[aria-expanded="true"] .oq-duvida__cruz { transform: rotate(45deg); }
.oq-duvida__painel { display: none; padding-bottom: var(--oq-p24); }
.oq-duvida__painel.is-aberto { display: block; }
.oq-duvida__texto { max-width: 68ch; color: var(--oq-tinta-suave); line-height: 1.7; font-size: 15px; }

/* ---------- 9. vozes (opiniões) ---------- */
.oq-vozes { padding-block: clamp(56px, 7vw, 96px); background: var(--oq-linho); }
.oq-vozes__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 4vw, 48px); line-height: 1.06; max-width: 18ch; }
.oq-vozes__grelha {
  margin-top: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(258px, 1fr));
  gap: var(--oq-p20);
}
.oq-voz {
  background: var(--oq-papel);
  border-radius: var(--oq-r-largo);
  padding: var(--oq-p24);
  box-shadow: var(--oq-sombra-baixo);
  display: flex;
  flex-direction: column;
}
.oq-voz__aspas { color: var(--oq-sinal); margin-bottom: var(--oq-p12); }
.oq-voz__texto { font-size: 17px; line-height: 1.6; }
.oq-voz__assinatura {
  margin-top: auto;
  padding-top: var(--oq-p24);
  display: flex;
  align-items: center;
  gap: var(--oq-p12);
}
.oq-voz__inicial {
  width: 42px; height: 42px;
  flex: 0 0 auto;
  border-radius: var(--oq-r-pilula);
  background: var(--oq-vidro);
  color: var(--oq-sinal);
  display: flex; align-items: center; justify-content: center;
  font-size: var(--oq-t-miudo);
  letter-spacing: 0.06em;
  font-weight: 500;
}
.oq-voz__nome { font-size: 15px; font-weight: 500; }
.oq-voz__papel { font-size: 13px; color: var(--oq-tinta-suave); }

/* ---------- 10. alicerce (sobre / contacto) ---------- */
.oq-alicerce { padding-block: clamp(56px, 7vw, 96px); }
.oq-alicerce__grelha {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.oq-alicerce__titulo { margin-top: var(--oq-p16); font-size: clamp(30px, 4vw, 48px); line-height: 1.06; }
.oq-alicerce__texto { margin-top: var(--oq-p16); color: var(--oq-tinta-suave); line-height: 1.7; }
.oq-alicerce__texto + .oq-alicerce__texto { margin-top: var(--oq-p12); }
.oq-pilares { display: grid; grid-template-columns: repeat(auto-fit, minmax(212px, 1fr)); gap: var(--oq-p16); }
.oq-pilar {
  background: var(--oq-vidro);
  border-radius: var(--oq-r-cartao);
  padding: var(--oq-p20);
}
.oq-pilar__icone { color: var(--oq-sinal); display: block; margin-bottom: var(--oq-p12); }
.oq-pilar__titulo { font-size: 18px; line-height: 1.25; }
.oq-pilar__texto { margin-top: var(--oq-p8); font-size: var(--oq-t-miudo); line-height: 1.55; color: var(--oq-tinta-suave); }
.oq-contacto {
  margin-top: var(--oq-p24);
  padding: var(--oq-p20);
  border: 1px solid var(--oq-fio);
  border-radius: var(--oq-r-cartao);
}
.oq-contacto__titulo { font-size: 18px; }
.oq-contacto__texto { margin-top: var(--oq-p8); font-size: 15px; line-height: 1.6; color: var(--oq-tinta-suave); }

/* ---------- 11. rodapé ---------- */
.oq-rodape { background: var(--oq-tinta); color: rgba(255,255,255,.72); padding-block: clamp(48px, 6vw, 72px) var(--oq-p32); }
.oq-rodape__grelha {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 48px);
}
.oq-rodape .oq-marca { color: var(--oq-papel); }
.oq-rodape__lema { margin-top: var(--oq-p16); font-size: var(--oq-t-miudo); line-height: 1.65; max-width: 34ch; }
.oq-rodape__coluna h3 {
  font-size: var(--oq-t-legenda);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oq-papel);
  margin-bottom: var(--oq-p16);
}
.oq-rodape__lista { display: grid; gap: var(--oq-p8); }
.oq-rodape__elo { font-size: var(--oq-t-miudo); color: rgba(255,255,255,.72); }
.oq-rodape__elo:hover { color: var(--oq-papel); }
.oq-rodape__fim {
  margin-top: clamp(32px, 4vw, 56px);
  padding-top: var(--oq-p20);
  border-top: 1px solid rgba(255,255,255,.16);
  display: flex;
  flex-wrap: wrap;
  gap: var(--oq-p12);
  justify-content: space-between;
  font-size: 13px;
}

/* ---------- páginas legais ---------- */
.oq-pergaminho { padding-block: clamp(48px, 6vw, 88px); }
.oq-pergaminho__eixo { max-width: 820px; }
.oq-pergaminho__titulo { font-size: clamp(32px, 4.6vw, 58px); line-height: 1.04; margin-top: var(--oq-p16); }
.oq-pergaminho__data { margin-top: var(--oq-p12); font-size: var(--oq-t-miudo); color: var(--oq-tinta-suave); }
.oq-pergaminho__voltar { margin-top: var(--oq-p24); }
.oq-pergaminho h2 { margin-top: clamp(32px, 4vw, 48px); font-size: clamp(22px, 2.6vw, 30px); line-height: 1.2; }
.oq-pergaminho h3 { margin-top: var(--oq-p24); font-size: 19px; }
.oq-pergaminho p { margin-top: var(--oq-p12); color: var(--oq-tinta-suave); line-height: 1.75; }
.oq-pergaminho ul { margin-top: var(--oq-p12); display: grid; gap: var(--oq-p8); }
.oq-pergaminho li {
  position: relative;
  padding-left: var(--oq-p20);
  color: var(--oq-tinta-suave);
  line-height: 1.7;
}
.oq-pergaminho li::before {
  content: "";
  position: absolute;
  left: 0; top: 12px;
  width: 8px; height: 1px;
  background: var(--oq-sinal);
}
.oq-pergaminho__tabela {
  margin-top: var(--oq-p16);
  border-top: 1px solid var(--oq-fio);
}
.oq-pergaminho__fila {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 2fr);
  gap: var(--oq-p16);
  padding-block: var(--oq-p16);
  border-bottom: 1px solid var(--oq-fio);
}
.oq-pergaminho__chave { font-size: var(--oq-t-miudo); letter-spacing: 0.04em; }
.oq-pergaminho__valor { font-size: var(--oq-t-miudo); color: var(--oq-tinta-suave); line-height: 1.65; }

/* ---------- sobreposições ---------- */
.oq-subir {
  position: fixed;
  right: 18px; bottom: 18px;
  z-index: 55;
  width: 46px; height: 46px;
  display: none;
  align-items: center; justify-content: center;
  background: var(--oq-sinal);
  color: var(--oq-papel);
  border: 0;
  border-radius: var(--oq-r-pilula);
  cursor: pointer;
  box-shadow: var(--oq-sombra-marca);
}
.oq-subir.is-visivel { display: flex; }
.oq-subir:hover { background: var(--oq-sinal-claro); }

.oq-biscoito {
  position: fixed;
  left: 18px; right: 18px; bottom: 18px;
  z-index: 70;
  display: none;
  gap: var(--oq-p16);
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 980px;
  margin-inline: auto;
  background: var(--oq-papel);
  border: 1px solid var(--oq-fio);
  border-radius: var(--oq-r-largo);
  padding: var(--oq-p20);
  box-shadow: var(--oq-sombra-marca);
}
.oq-biscoito.is-visivel { display: flex; }
.oq-biscoito__texto { font-size: 14px; line-height: 1.6; color: var(--oq-tinta-suave); max-width: 62ch; }
.oq-biscoito__teclas { display: flex; gap: var(--oq-p8); flex-wrap: wrap; }

/* ---------- adaptativo ---------- */
@media (max-width: 1080px) {
  .oq-portico__acao { display: none; }
  .oq-portico__lista { gap: var(--oq-p16); }
}

@media (max-width: 960px) {
  :root { --oq-topo: 68px; }
  .oq-portico__chave { display: flex; }
  .oq-portico__nav {
    position: fixed;
    inset: var(--oq-topo) 0 auto 0;
    background: var(--oq-papel);
    border-bottom: 1px solid var(--oq-fio);
    display: none;
    padding: var(--oq-p20) var(--oq-p24) var(--oq-p32);
    box-shadow: var(--oq-sombra-marca);
  }
  .oq-portico__nav.is-aberta { display: block; }
  .oq-portico__nav { gap: 0; }
  .oq-portico__lista { flex-direction: column; align-items: stretch; gap: 0; }
  .oq-portico__elo { padding: 14px 0; border-bottom: 1px solid var(--oq-fio); font-size: 16px; }
  .oq-portico__elo:hover { border-bottom-color: var(--oq-fio); }
  .oq-portico__acao { display: block; margin: var(--oq-p20) 0 0; }
  .oq-portico__acao .oq-tecla { width: 100%; }

  .oq-frontao__grelha,
  .oq-relevo__cabeca,
  .oq-relevo__palco,
  .oq-lauda__grelha,
  .oq-duvidas__grelha,
  .oq-alicerce__grelha,
  .oq-apelo__grelha { grid-template-columns: minmax(0, 1fr); }
  .oq-relevo__coluna { grid-template-rows: none; grid-template-columns: 1fr 1fr; }
  .oq-lousa { grid-template-columns: minmax(0, 1fr); gap: var(--oq-p24); }
  .oq-lousa--espelho .oq-lousa__vista,
  .oq-lousa--espelho .oq-lousa__verbo { order: initial; }
  .oq-lousa--alto .oq-lousa__cena { aspect-ratio: 4 / 3; }
  .oq-lousa--largo .oq-lousa__cena { aspect-ratio: 16 / 9; }
  .oq-rodape__grelha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .oq-eixo { padding-inline: var(--oq-p20); }
  .oq-frontao__fundo { width: 130vw; opacity: .12; }
  .oq-relevo__coluna { grid-template-columns: 1fr; }
  .oq-rodape__grelha { grid-template-columns: minmax(0, 1fr); }
  .oq-lousa__sinete { width: 64px; height: 64px; right: -8px; bottom: -10px; border-radius: 18px; }
  .oq-vitrine__fila { gap: 6px; }
  .oq-vitrine__pedra { width: 44px; height: 44px; border-radius: 12px; }
  .oq-biscoito { left: 12px; right: 12px; bottom: 12px; padding: var(--oq-p16); }
  .oq-pergaminho__fila { grid-template-columns: minmax(0, 1fr); gap: var(--oq-p4); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}