:root {
  --navy: #091a52;
  --blue: #1249d8;
  --yellow: #f5c542;
  --mint: #dff7ec;
  --paper: #f4f6fc;
  --white: #ffffff;
  --ink-soft: #53658f;
  --line: #c9d4ee;
}

* { box-sizing: border-box; }
html { color: var(--navy); background: #dfe4ef; font-family: Arial, Helvetica, sans-serif; }
body { margin: 0; }
a { color: inherit; }
.screen-tools { width: min(210mm, calc(100% - 24px)); margin: 16px auto; display: flex; flex-wrap: wrap; gap: 10px; }
.screen-tools a, .screen-tools button { min-height: 42px; padding: 10px 16px; color: #fff; background: var(--blue); border: 0; border-radius: 4px; font: 700 13px Arial, sans-serif; text-decoration: none; cursor: pointer; }
.screen-tools .secondary { color: var(--navy); background: #fff; border: 1px solid var(--line); }
.page { width: 210mm; min-height: 297mm; margin: 0 auto 18px; padding: 12mm 16mm 10mm; display: flex; flex-direction: column; overflow: hidden; background: var(--paper); box-shadow: 0 8px 32px rgba(9, 26, 82, .14); }
.doc-header { min-height: 25mm; display: grid; grid-template-columns: 25mm 1fr auto; gap: 6mm; align-items: center; padding-bottom: 5mm; border-bottom: 1.2mm solid var(--yellow); }
.doc-logo { width: 23mm; height: 23mm; object-fit: contain; }
.doc-brand strong { display: block; margin-bottom: 2mm; font-size: 15pt; letter-spacing: .02em; }
.doc-brand span, .doc-header-meta, .doc-footer, .kicker, .tag, .number { font-family: "Courier New", Courier, monospace; }
.doc-brand span { display: block; color: var(--blue); font-size: 7.6pt; font-weight: 700; text-transform: uppercase; }
.doc-brand small { display: block; margin-top: 2.2mm; color: var(--ink-soft); font-size: 7pt; }
.doc-header-meta { align-self: start; padding-top: 2mm; color: var(--ink-soft); font-size: 7pt; line-height: 1.7; text-align: right; text-transform: uppercase; }
.doc-content { flex: 1; padding-top: 9mm; }
.doc-footer { display: flex; justify-content: space-between; gap: 8mm; margin-top: auto; padding-top: 4mm; border-top: .35mm solid var(--line); color: var(--ink-soft); font-size: 6.6pt; }
.kicker { margin: 0 0 4mm; color: var(--blue); font-size: 8pt; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
.kicker::before { content: ""; display: inline-block; width: 10mm; margin-right: 4mm; border-top: .45mm solid var(--blue); vertical-align: middle; }
h1, h2, h3, .serif { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
h1 { margin: 0 0 5mm; font-size: 31pt; line-height: 1.02; }
h2 { margin: 0 0 4mm; font-size: 22pt; line-height: 1.08; }
h3 { margin: 0 0 2.5mm; font-size: 14pt; line-height: 1.08; }
p { margin: 0 0 3mm; color: var(--ink-soft); font-size: 9.2pt; line-height: 1.38; }
.lead { max-width: 165mm; font-size: 10.6pt; }
.rule-quote { margin: 5mm 0 8mm; padding: 1mm 0 1mm 6mm; border-left: 1.3mm solid var(--yellow); }
.rule-quote strong { display: block; margin-bottom: 2mm; font: 400 16pt Georgia, serif; }
.grid-2, .grid-3, .grid-4 { display: grid; gap: 4mm; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { min-width: 0; padding: 5mm; background: #fff; border: .35mm solid var(--line); border-radius: 2mm; break-inside: avoid; }
.card.highlight { background: #dfe8fb; border-color: var(--blue); }
.number, .tag { color: var(--blue); font-size: 7.2pt; font-weight: 700; text-transform: uppercase; }
.number { display: block; margin-bottom: 4mm; }
.tag { display: block; margin-top: 3mm; }
.metrics { margin: 8mm -16mm 0; padding: 7mm 16mm; background: #dfe8fb; }
.metrics strong { display: block; margin-bottom: 2mm; font-family: "Courier New", monospace; font-size: 8pt; }
.price-list { display: grid; gap: 2.2mm; }
.price-row { display: grid; grid-template-columns: 11mm 1.25fr .95fr auto; gap: 4mm; align-items: center; min-height: 22mm; padding: 3.7mm 5mm; background: #fff; border: .35mm solid var(--line); border-radius: 2mm; break-inside: avoid; }
.price-row.highlight { background: #dfe8fb; border-color: var(--blue); border-width: .6mm; }
.price-row .number { margin: 0; }
.price-row h3 { margin: 0 0 1mm; font-size: 13.5pt; }
.price-row p { margin: 0; font-size: 7.8pt; line-height: 1.25; }
.price { white-space: nowrap; font: 700 20pt Georgia, serif; }
.price .tag { margin-top: 2mm; text-align: right; }
.full-row { display: grid; grid-template-columns: 1fr auto; gap: 6mm; align-items: center; margin-top: 3mm; padding: 4mm 5mm; background: #fff; border: .4mm solid var(--line); border-radius: 2mm; }
.full-row.highlight { background: #dfe8fb; border-color: var(--blue); }
.qr-call { display: flex; align-items: center; gap: 4mm; text-decoration: none; }
.qr-call img { width: 24mm; height: 24mm; background: #fff; }
.qr-call strong { display: block; color: var(--blue); font-family: "Courier New", monospace; font-size: 7.4pt; }
.notice { margin-top: 4mm; padding: 4mm 5mm; background: #fff; border-left: 1.3mm solid var(--yellow); }
.notice p { margin: 0; font-size: 7.6pt; }
.timeline { position: relative; margin-top: 5mm; padding-top: 6mm; }
.timeline::before { content: ""; position: absolute; top: 7mm; left: 0; right: 0; border-top: .35mm solid var(--line); }
.timeline .card { position: relative; padding: 6mm 0 0; background: transparent; border: 0; }
.timeline .card::before { content: ""; position: absolute; top: 5.7mm; left: 0; width: 3mm; height: 3mm; transform: translateY(-50%); background: var(--yellow); border-radius: 50%; }
.cta-panel { display: grid; grid-template-columns: 1.2fr .95fr 25mm; gap: 5mm; align-items: center; margin-top: 6mm; padding: 5mm; background: #fff; border: .35mm solid var(--line); border-left: 1.3mm solid var(--yellow); }
.cta-panel img { width: 23mm; height: 23mm; }
.legal-note { margin-top: 5mm; font-size: 6.8pt; }
.document-index { max-width: 1180px; margin: 0 auto; padding: clamp(28px, 6vw, 80px) 20px; }
.document-index header { display: grid; grid-template-columns: 92px 1fr; gap: 24px; align-items: center; margin-bottom: 54px; }
.document-index header img { width: 92px; }
.document-index h1 { font-size: clamp(40px, 6vw, 72px); }
.document-index .card { padding: 28px; }
.document-index .actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.document-index .actions a { padding: 11px 15px; color: #fff; background: var(--blue); border-radius: 4px; font-weight: 700; text-decoration: none; }
.document-index .actions a.secondary { color: var(--navy); background: #fff; border: 1px solid var(--line); }

@media (max-width: 800px) {
  .page { width: 100%; min-height: 0; margin: 0; padding: 22px 18px; overflow: visible; box-shadow: none; }
  .doc-header { grid-template-columns: 64px 1fr; }
  .doc-logo { width: 62px; height: 62px; }
  .doc-header-meta { grid-column: 1 / -1; text-align: left; }
  .grid-2, .grid-3, .grid-4, .price-row, .full-row, .cta-panel { grid-template-columns: 1fr; }
  .price { text-align: left; }
  .price .tag { text-align: left; }
  .doc-footer { flex-direction: column; }
}

@media print {
  @page { size: A4; margin: 0; }
  html, body { background: #fff; }
  .screen-tools { display: none !important; }
  .page { width: 210mm; height: 296.5mm; min-height: 0; margin: 0; padding: 10mm 15mm 8mm; overflow: hidden; box-shadow: none; page-break-after: always; break-after: page; }
  .page:last-child { page-break-after: auto; break-after: auto; }
  .doc-header { min-height: 23mm; grid-template-columns: 23mm 1fr auto; gap: 5mm; padding-bottom: 4mm; }
  .doc-logo { width: 21mm; height: 21mm; }
  .doc-content { min-height: 0; padding-top: 7mm; }
  .doc-footer { flex: none; margin-top: 3mm; padding-top: 3mm; }
  h1 { font-size: 28pt; }
  h2 { font-size: 20pt; }
  h3 { font-size: 12.5pt; }
  p { font-size: 8.4pt; line-height: 1.28; }
  .lead { font-size: 9.5pt; }
  .rule-quote { margin: 4mm 0 6mm; }
  .rule-quote strong { font-size: 14.5pt; }
  .grid-2, .grid-3, .grid-4 { display: grid; margin: 0; row-gap: 4mm; }
  .grid-2 { grid-template-columns: 48.5% 48.5%; column-gap: 3%; }
  .grid-3 { grid-template-columns: 31.2% 31.2% 31.2%; column-gap: 3.2%; }
  .grid-4 { grid-template-columns: 23.5% 23.5% 23.5% 23.5%; column-gap: 2%; }
  .grid-2 > .card, .grid-3 > .card, .grid-4 > .card { width: auto; margin: 0; min-width: 0; overflow-wrap: anywhere; }
  .grid-2 > .card { min-height: 35mm; }
  .grid-3 > .card { min-height: 43mm; }
  .card { min-width: 0; padding: 4mm; }
  .metrics { margin: 6mm -15mm 0; padding: 6mm 15mm; }
  .metrics > div { width: auto; margin: 0; min-width: 0; }
  .price-list { gap: 1.5mm; }
  .price-row { display: flex; min-height: 0; height: 17.5mm; gap: 0; padding: 2.2mm 4mm; }
  .price-row > .number { width: 9mm; flex: none; }
  .price-row > div { width: 48mm; flex: none; padding-right: 3mm; }
  .price-row > p { width: 49mm; flex: 1; padding-right: 3mm; }
  .price-row > .price { width: 35mm; flex: none; text-align: right; }
  .price-row h3 { margin: 0 0 .5mm; font-size: 10.8pt; }
  .price-row p { font-size: 7pt; line-height: 1.15; }
  .tag { margin-top: 1mm; font-size: 5.8pt; }
  .price { font-size: 16pt; }
  .full-row { display: flex; gap: 4mm; margin-top: 2mm; padding: 3mm 4mm; }
  .full-row > div { flex: 1; min-width: 0; }
  .full-row > p, .full-row > .price { width: 48mm; flex: none; }
  .full-row h2, .full-row h3 { margin-bottom: 1mm; }
  .notice { margin-top: 2mm; padding: 3mm 4mm; }
  .notice p { font-size: 6.4pt; }
  .timeline { margin-top: 3mm; padding-top: 4mm; border-top: .35mm solid var(--line); }
  .timeline::before { display: none; }
  .timeline.grid-4 > .card { min-height: 0; }
  .timeline .card { padding: 5mm 0 0; }
  .timeline .card::before { top: 4.7mm; }
  .cta-panel { display: grid; grid-template-columns: 1fr 55mm 23mm; gap: 4mm; margin-top: 4mm; padding: 4mm; }
  .cta-panel > * { min-width: 0; }
  .legal-note { margin-top: 3mm; font-size: 6.2pt; }
  a { text-decoration: none; }
}
