:root { color: #17191a; background: #e8e5dd; font-family: Arial, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; padding: 24px; }
.poster { width: min(100%, 210mm); min-height: 297mm; margin: auto; padding: 22mm 20mm; background: #f5f1e8; display: flex; flex-direction: column; align-items: center; text-align: center; border: 1px solid #bbb; }
.brand { font-weight: 800; letter-spacing: .18em; font-size: 14px; }
.eyebrow { margin: 22mm 0 5mm; color: #ff5c35; font-weight: 800; letter-spacing: .16em; font-size: 12px; }
h1 { max-width: 150mm; margin: 0; font-size: 18mm; line-height: .95; letter-spacing: -.04em; }
.sub { max-width: 125mm; margin: 8mm 0 9mm; font-size: 6mm; line-height: 1.35; }
.qr-wrap { padding: 8mm; background: white; border: 2.5mm solid #17191a; box-shadow: 4mm 4mm 0 #ff5c35; }
.qr-wrap img { display: block; width: 82mm; height: 82mm; }
.steps { margin: 13mm 0 0; font-size: 5mm; font-weight: 700; }
.url { margin-top: auto; font-size: 3.5mm; color: #5e615f; overflow-wrap: anywhere; }
.controls { width: min(100%, 210mm); margin: 16px auto 0; display: flex; justify-content: center; gap: 12px; }
button, .controls a { padding: 12px 18px; border: 2px solid #17191a; border-radius: 999px; background: #17191a; color: white; font-weight: 700; text-decoration: none; cursor: pointer; }

@media print {
  @page { size: A4 portrait; margin: 0; }
  body { padding: 0; background: white; }
  .poster { border: 0; }
  .controls { display: none; }
}
