/*
 * Datasheet CITAURA: páginas A4 retrato, iguais na tela e na impressão.
 * Capa e contracapa em "noite cívica"; páginas internas claras para leitura e impressão.
 */
.ds {
  --ds-night: #031015;
  --ds-night-2: #0a1f27;
  --ds-paper: #ffffff;
  --ds-paper-2: #f2f5f4;
  --ds-ink: #10232a;
  --ds-ink-soft: #4b6066;
  --ds-rule: #d5dedc;
  --ds-gold: #ffde59;
  --ds-gold-ink: #9a7a00;
  --ds-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --ds-body: "Archivo", Arial, sans-serif;
  display: grid;
  justify-content: center;
  gap: 28px;
  padding: 32px 16px 56px;
  background: #1a2b31;
}

.sheet {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 210mm;
  height: 297mm;
  overflow: hidden;
  background: var(--ds-paper);
  color: var(--ds-ink);
  font-family: var(--ds-body);
  font-size: 9pt;
  line-height: 1.45;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}

/* ---------- Faixas de página ---------- */
.sheet__band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12mm;
  padding: 7mm 14mm 6mm;
  background: var(--ds-night);
  color: #eef4f2;
  border-bottom: 1.2mm solid var(--ds-gold);
}

.sheet__band img { height: 11mm; width: auto; }

.sheet__band-title {
  display: flex;
  align-items: baseline;
  gap: 3mm;
  font-family: var(--ds-display);
  text-transform: uppercase;
}

.sheet__band-title strong { font-size: 22pt; font-weight: 700; letter-spacing: 0.02em; }
.sheet__band-title span { font-size: 9pt; font-weight: 600; letter-spacing: 0.14em; color: var(--ds-gold); }
.sheet__band-section { font-family: var(--ds-display); font-size: 13pt; font-weight: 500; color: #c6d1d0; text-align: right; }

.sheet__body { flex: 1; padding: 9mm 14mm 6mm; display: flex; flex-direction: column; gap: 6mm; min-height: 0; }

.sheet__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4mm 14mm;
  background: var(--ds-night);
  color: #a8b7b8;
  font-size: 7.5pt;
  letter-spacing: 0.04em;
}

.sheet__foot b { color: var(--ds-gold); font-weight: 600; }
.sheet__page { font-family: var(--ds-display); font-size: 11pt; color: #eef4f2; }

/* ---------- Títulos internos ---------- */
.ds-kicker {
  margin: 0;
  font-size: 7pt;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ds-gold-ink);
}

.ds-title {
  margin: 1mm 0 0;
  font-family: var(--ds-display);
  font-size: 20pt;
  font-weight: 600;
  line-height: 1.05;
}

.ds-lead { margin: 2mm 0 0; color: var(--ds-ink-soft); max-width: 150mm; }
.ds-note { margin: 0; font-size: 7pt; color: var(--ds-ink-soft); }

/* ---------- Capa ---------- */
.sheet--cover,
.sheet--back {
  background: var(--ds-night) var(--cover-image, none) center / cover no-repeat;
  color: #eef4f2;
}

.sheet--cover::before,
.sheet--back::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(3, 16, 21, 0.92) 0%, rgba(3, 16, 21, 0.55) 38%, rgba(3, 16, 21, 0.2) 62%, rgba(3, 16, 21, 0.95) 100%);
}

.cover {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 14mm 14mm 0;
}

.cover__top { display: flex; justify-content: space-between; align-items: flex-start; }
.cover__top img { height: 17mm; width: auto; }
.cover__doc { text-align: right; font-size: 7.5pt; letter-spacing: 0.14em; text-transform: uppercase; color: #c6d1d0; }
.cover__doc strong { display: block; font-family: var(--ds-display); font-size: 12pt; letter-spacing: 0.06em; color: var(--ds-gold); }

.cover__title { margin-top: 16mm; }
.cover__title p { margin: 0; font-size: 8pt; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ds-gold); }
.cover__title h1 {
  margin: 2mm 0 0;
  font-family: var(--ds-display);
  font-size: 92pt;
  font-weight: 700;
  line-height: 0.86;
  letter-spacing: 0.01em;
}
.cover__title h1 small { display: block; font-size: 20pt; font-weight: 500; letter-spacing: 0.32em; color: #c6d1d0; }
.cover__title .cover__headline {
  margin: 6mm 0 0;
  max-width: 110mm;
  font-size: 14pt;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
  text-transform: none;
  color: #eef4f2;
}

.cover__visual {
  position: absolute;
  right: -6mm;
  top: 92mm;
  width: 150mm;
  filter: drop-shadow(0 10mm 18mm rgba(0, 0, 0, 0.55));
}
.cover__visual--atrio { width: 112mm; right: 8mm; top: 78mm; }
.cover__visual--vetor { width: 138mm; right: 4mm; top: 104mm; }

.cover__badge {
  position: absolute;
  left: 14mm;
  top: 150mm;
  display: grid;
  place-content: center;
  width: 34mm;
  height: 34mm;
  border-radius: 50%;
  border: 0.8mm solid var(--ds-gold);
  background: rgba(3, 16, 21, 0.72);
  text-align: center;
  font-family: var(--ds-display);
  line-height: 1;
}
.cover__badge span { font-size: 7pt; letter-spacing: 0.12em; text-transform: uppercase; color: #c6d1d0; }
.cover__badge strong { font-size: 25pt; color: var(--ds-gold); }
.cover__badge em { font-style: normal; font-size: 10pt; }

.cover__bottom { margin-top: auto; padding-bottom: 10mm; display: grid; gap: 5mm; position: relative; }
.cover__apps { display: flex; flex-wrap: wrap; gap: 2mm; }
.cover__apps span { padding: 1.2mm 3mm; border: 0.25mm solid rgba(238, 244, 242, 0.4); border-radius: 10mm; font-size: 7.5pt; }
.cover__metrics { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 0.3mm solid rgba(238, 244, 242, 0.3); }
.cover__metrics div { padding: 4mm 4mm 0 0; }
.cover__metrics span { display: block; font-size: 7pt; letter-spacing: 0.1em; text-transform: uppercase; color: #a8b7b8; }
.cover__metrics strong { font-family: var(--ds-display); font-size: 17pt; font-weight: 600; }
.cover__status { font-size: 7pt; color: #a8b7b8; }
.cover__status b { color: var(--ds-gold); font-weight: 600; }

/* ---------- Construção ---------- */
.build { display: grid; grid-template-columns: 78mm 1fr; gap: 7mm; align-items: stretch; }
.build__visual { margin: 0; padding: 6mm 3mm; background: var(--ds-paper-2); border-radius: 2mm; display: flex; flex-direction: column; justify-content: center; }
.build__visual img { width: 100%; height: auto; display: block; }
.build__visual figcaption { margin-top: 3mm; font-size: 7pt; color: var(--ds-ink-soft); text-align: center; }

.parts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 2.4mm 5mm; }
.parts li { display: grid; grid-template-columns: 7mm 1fr; gap: 2mm; padding-top: 2mm; border-top: 0.25mm solid var(--ds-rule); }
.parts b {
  display: grid;
  place-content: center;
  width: 6mm;
  height: 6mm;
  border-radius: 50%;
  background: var(--ds-night);
  color: var(--ds-gold);
  font-family: var(--ds-display);
  font-size: 8pt;
}
.parts strong { display: block; font-size: 8pt; }
.parts p { margin: 0.4mm 0 0; font-size: 7.3pt; line-height: 1.35; color: var(--ds-ink-soft); }

.highlights { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm; margin-top: auto; }
.highlights div { padding: 4mm; background: var(--ds-night); color: #eef4f2; border-radius: 2mm; }
.highlights span { display: block; font-size: 6.8pt; letter-spacing: 0.1em; text-transform: uppercase; color: #a8b7b8; }
.highlights strong { font-family: var(--ds-display); font-size: 15pt; color: var(--ds-gold); }

/* ---------- Tabelas ---------- */
/* Neutraliza o estilo de tabela escuro e largo do styles.css (min-width 900px). */
.ds-table { width: 100%; min-width: 0; border-collapse: collapse; font-size: 8pt; color: var(--ds-ink); }
.ds-table tbody tr { border-top: 0; }
.ds-table tbody tr:hover { background: inherit; }
.ds-table tbody th { color: var(--ds-ink); white-space: nowrap; }
.ds-table code { color: inherit; }
.ds-table thead th {
  padding: 2.2mm 2mm;
  background: var(--ds-night);
  color: #eef4f2;
  font-size: 6.8pt;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: left;
}
.ds-table thead th:first-child { border-left: 1mm solid var(--ds-gold); }
.ds-table td,
.ds-table tbody th { padding: 2mm; border-bottom: 0.25mm solid var(--ds-rule); text-align: left; font-weight: 400; }
.ds-table tbody th { font-family: var(--ds-display); font-size: 11pt; font-weight: 600; }
.ds-table tbody tr:nth-child(even) { background: var(--ds-paper-2); }
.ds-table code { font-family: "Consolas", "Courier New", monospace; font-size: 7pt; }
.ds-table .num { font-variant-numeric: tabular-nums; }

/* ---------- Código do produto ---------- */
.code { padding: 5mm; background: var(--ds-paper-2); border-radius: 2mm; }
.code__example { display: flex; flex-wrap: wrap; gap: 1.2mm; margin: 2mm 0 4mm; }
.code__example code {
  padding: 1.6mm 2.6mm;
  background: var(--ds-night);
  color: var(--ds-gold);
  border-radius: 1mm;
  font-family: "Consolas", "Courier New", monospace;
  font-size: 10pt;
}
.code__legend { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3mm; }
.code__legend div { border-top: 0.6mm solid var(--ds-gold); padding-top: 1.6mm; }
.code__legend code { font-family: "Consolas", "Courier New", monospace; font-size: 8pt; font-weight: 700; }
.code__legend span { display: block; font-size: 7pt; color: var(--ds-ink-soft); }

/* ---------- Especificações ---------- */
.specs { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; align-items: start; }
.specs article { break-inside: avoid; }
.specs h3,
.ds-block h3 {
  margin: 0 0 2mm;
  padding-bottom: 1.6mm;
  border-bottom: 0.6mm solid var(--ds-night);
  font-family: var(--ds-display);
  font-size: 12pt;
  font-weight: 600;
}
.ds-dl { margin: 0; }
.ds-dl div { display: grid; grid-template-columns: 42% 1fr; gap: 3mm; padding: 1.5mm 0; border-bottom: 0.25mm solid var(--ds-rule); }
.ds-dl dt { color: var(--ds-ink-soft); font-size: 7.6pt; }
.ds-dl dd { margin: 0; font-size: 7.8pt; font-weight: 500; }

/* ---------- Aplicação ---------- */
.apply { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; align-items: start; }
.optics { display: grid; gap: 2.4mm; }
.optics div { display: grid; grid-template-columns: 16mm 1fr; gap: 3mm; align-items: center; padding: 2.6mm; background: var(--ds-paper-2); border-left: 1mm solid var(--ds-gold); }
.optics strong { font-family: var(--ds-display); font-size: 15pt; }
.optics span { display: block; font-size: 7.6pt; font-weight: 600; }
.optics p { margin: 0.4mm 0 0; font-size: 7.2pt; color: var(--ds-ink-soft); }

.swatches { list-style: none; margin: 3mm 0 2mm; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.6mm; }
.swatches li { display: grid; gap: 1mm; font-size: 7pt; }
.swatches i { display: block; height: 8mm; border-radius: 1mm; background: var(--swatch); box-shadow: inset 0 0 0 0.25mm rgba(0, 0, 0, 0.18); }

.norms { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.6mm; }
.norms li { padding: 1.8mm 0 1.8mm 5mm; border-bottom: 0.25mm solid var(--ds-rule); position: relative; font-size: 7.6pt; }
.norms li::before { content: ""; position: absolute; left: 0; top: 3.1mm; width: 2mm; height: 2mm; background: var(--ds-gold); transform: rotate(45deg); }

.steps { list-style: none; margin: auto 0 0; padding: 5mm; display: grid; grid-template-columns: repeat(5, 1fr); gap: 3mm; background: var(--ds-night); color: #eef4f2; border-radius: 2mm; counter-reset: step; }
.steps li { counter-increment: step; display: grid; gap: 1mm; align-content: start; font-size: 7.2pt; color: #c6d1d0; }
.steps li::before { content: counter(step, decimal-leading-zero); font-family: var(--ds-display); font-size: 16pt; color: var(--ds-gold); }
.steps strong { font-size: 8pt; color: #eef4f2; }
.steps-title { margin: 0 0 -2mm; }

.ds-callout { padding: 4mm 5mm; border: 0.3mm solid var(--ds-rule); border-left: 1.2mm solid var(--ds-gold); background: #fffdf2; font-size: 7.6pt; }
.ds-callout strong { display: block; font-family: var(--ds-display); font-size: 12pt; }
.ds-callout a { color: var(--ds-ink); }

/* ---------- Contracapa ---------- */
.back { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 22mm 16mm 14mm; }
.back__brand img { width: 92mm; height: auto; }
.back__brand p { margin: 5mm 0 0; font-family: var(--ds-display); font-size: 18pt; color: #c6d1d0; }
.back__contact { display: grid; grid-template-columns: 1fr auto; gap: 8mm; align-items: end; }
.back__contact h2 { margin: 0 0 3mm; font-family: var(--ds-display); font-size: 24pt; font-weight: 600; }
.back__contact p { margin: 0 0 1.5mm; font-size: 9pt; color: #c6d1d0; }
.back__contact a { color: var(--ds-gold); text-decoration: none; font-weight: 600; }
.back__qr { padding: 3mm; background: #ffffff; border-radius: 2mm; text-align: center; color: var(--ds-ink); font-size: 6.5pt; }
.back__qr img { display: block; width: 30mm; height: 30mm; margin-bottom: 1.4mm; }
.back__legal { margin-top: 8mm; padding-top: 4mm; border-top: 0.3mm solid rgba(238, 244, 242, 0.25); font-size: 6.8pt; line-height: 1.5; color: #8fa1a3; }

/* ---------- Rastreabilidade (somente tela) ---------- */
.ds-trace { width: min(210mm, 100%); margin: 0 auto; color: #c6d1d0; font-family: var(--ds-body); font-size: 13px; }
.ds-trace summary { cursor: pointer; padding: 12px 0; color: #eef4f2; font-weight: 600; }
.ds-trace ul { margin: 0 0 12px; padding-left: 18px; }
.ds-trace .ds-table { background: #ffffff; color: var(--ds-ink); }

/* ---------- Entrada suave (somente tela) ---------- */
@media screen and (prefers-reduced-motion: no-preference) {
  .sheet { animation: sheet-in 0.7s cubic-bezier(0.16, 1, 0.3, 1) both; }
  .sheet:nth-child(2) { animation-delay: 0.08s; }
  .sheet:nth-child(n + 3) { animation-delay: 0.14s; }
  .cover__visual { animation: lamp-on 1.6s 0.25s ease-out both; }
}

@keyframes sheet-in {
  from { transform: translateY(18px); }
  to { transform: none; }
}

@keyframes lamp-on {
  0% { filter: drop-shadow(0 10mm 18mm rgba(0, 0, 0, 0.55)) brightness(0.55); }
  45% { filter: drop-shadow(0 10mm 18mm rgba(0, 0, 0, 0.55)) brightness(1.08); }
  100% { filter: drop-shadow(0 10mm 18mm rgba(0, 0, 0, 0.55)) brightness(1); }
}

/* ---------- Telas estreitas: a folha vira página fluida ---------- */
@media screen and (max-width: 840px) {
  .ds { grid-template-columns: minmax(0, 1fr); padding: 16px 0 40px; gap: 16px; }
  .sheet { width: 100%; height: auto; min-height: 0; font-size: 13px; box-shadow: none; }
  .sheet--cover { min-height: 640px; }
  .cover__title h1 { font-size: 72px; }
  .cover__title h1 small { font-size: 18px; }
  .cover__visual { position: relative; top: auto; right: auto; width: 100%; margin: 12px 0; }
  .cover__badge { position: relative; top: auto; left: auto; margin-bottom: 12px; }
  .cover__metrics strong { font-size: 18px; }
  .sheet__band { padding: 14px 16px 12px; }
  .sheet__band-section { display: none; }
  .sheet__body { padding: 18px 16px; }
  .sheet__foot { padding: 10px 16px; font-size: 11px; }
  .build,
  .specs,
  .apply,
  .parts,
  .back__contact { grid-template-columns: 1fr; }
  .highlights,
  .steps { grid-template-columns: 1fr; }
  .code__legend { grid-template-columns: 1fr 1fr; }
  .table-scroll { overflow-x: auto; }
  .ds-table { min-width: 560px; }
  .back { padding: 32px 16px 20px; min-height: 560px; }
  .back__brand img { width: 220px; }
}

/* ---------- Impressão: uma folha por página A4 ---------- */
@media print {
  @page { size: A4 portrait; margin: 0; }
  html,
  body { margin: 0; background: #ffffff; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .screen-only,
  .site-footer,
  .ds-trace { display: none !important; }
  .ds { display: block; padding: 0; background: none; }
  .sheet { box-shadow: none; break-after: page; page-break-after: always; animation: none !important; }
  .sheet:last-child { break-after: auto; page-break-after: auto; }
  .cover__visual { animation: none !important; }
}
