/* «Regala l'app»: the A4 poster for the reception. Every size is in container units (cqw) of the sheet, so the
   preview on screen and the printed A4 are the same drawing. The gym's photo on top, its logo, the QR in a card. */
.gx .rg-print { margin-top: 24px }
.gx .rg-print-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px }
.gx .rg-print-head h2 { margin: 0 }
.gx .rg-print-head p { margin: 4px 0 0 }
.rg-sheet-wrap { display: flex; justify-content: center; padding: 24px; border-radius: 16px; background: #e9ebf0 }
.rg-sheet { container-type: inline-size; width: min(100%, 520px); aspect-ratio: 210 / 297; background: #fff; color: #14161f; overflow: hidden;
  display: grid; grid-template-rows: 52% 48%; box-shadow: 0 18px 50px rgba(20,22,31,.22); border-radius: 4px; font-family: 'Archivo', system-ui, sans-serif;
  -webkit-print-color-adjust: exact; print-color-adjust: exact }
.rg-sheet-photo { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 6cqw 7cqw 6.5cqw;
  background: linear-gradient(180deg, rgba(10,11,18,.35) 0%, rgba(10,11,18,.08) 35%, rgba(10,11,18,.88) 100%),
    var(--foto, linear-gradient(150deg, var(--brand-primary), #0a0b12 75%)) center 30% / cover no-repeat; color: #fff }
.rg-sheet-top { display: flex; align-items: center; justify-content: space-between; gap: 3cqw }
.rg-sheet-top img { height: 11cqw; width: auto; max-width: 50cqw; display: block }
.rg-sheet-name { font: 700 6cqw/1 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .02em }
.rg-sheet-tag { padding: 1.2cqw 2.6cqw; border-radius: 999px; border: .35cqw solid rgba(255,255,255,.55); font: 600 2.6cqw/1 'Archivo', sans-serif; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap }
.gx .rg-sheet .rg-sheet-title, .rg-sheet-title { margin: 0; font: 700 13.5cqw/.9 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .005em }
.rg-sheet-title span { display: block }
.rg-sheet-acc { color: var(--brand-accent-on-dark, var(--brand-accent)) }
.rg-sheet-body { display: grid; grid-template-columns: 36cqw 1fr; grid-template-rows: auto auto auto; align-content: space-between; gap: 2.4cqw 5cqw; padding: 5cqw 7cqw 4.2cqw; min-height: 0 }
.rg-sheet-qr { grid-row: 1 / 3; align-self: start; display: flex; flex-direction: column; align-items: center; gap: 1.6cqw }
.rg-sheet-qrbox { width: 36cqw; aspect-ratio: 1; padding: 2.6cqw; border-radius: 3cqw; border: .7cqw solid var(--brand-primary); background: #fff }
.rg-sheet-qrbox svg { width: 100%; height: 100%; display: block }
.gx .rg-sheet .rg-sheet-qr p, .rg-sheet-qr p { margin: 0; font: 600 2.5cqw/1.2 'Archivo', sans-serif; color: #4a5060; text-align: center }
.rg-sheet-steps { list-style: none; margin: 0; padding: 0; counter-reset: passo; display: grid; gap: 2.6cqw; align-content: start }
.rg-sheet-steps li { counter-increment: passo; display: grid; grid-template-columns: 7cqw 1fr; column-gap: 2.4cqw; align-items: center }
.rg-sheet-steps li::before { content: counter(passo); grid-row: 1 / 3; width: 7cqw; height: 7cqw; border-radius: 50%; display: grid; place-items: center;
  background: var(--brand-primary); color: var(--brand-on-primary); font: 700 3.8cqw/1 'Oswald', sans-serif }
.rg-sheet-steps b { font: 700 3.4cqw/1.15 'Archivo', sans-serif }
.rg-sheet-steps span { font: 400 2.4cqw/1.25 'Archivo', sans-serif; color: #5a6070 }
.rg-sheet-perks { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1.2cqw; align-self: end }
.rg-sheet-perks li { padding: .9cqw 2cqw; border-radius: 999px; background: color-mix(in srgb, var(--brand-primary) 10%, #fff); color: var(--brand-primary); font: 700 2.3cqw/1.2 'Archivo', sans-serif }
.gx .rg-sheet .rg-sheet-link, .rg-sheet-link { grid-column: 1 / -1; margin: 0; padding-top: 2cqw; border-top: .3cqw solid #e3e5eb; font: 600 2.6cqw/1.2 'Archivo', sans-serif; color: #4a5060; text-align: center; word-break: break-all }
@media (max-width: 560px) { .rg-sheet-wrap { padding: 12px; border-radius: 12px } }
@media print {
  @page { size: A4 portrait; margin: 0 }
  html, body { background: #fff !important }
  body * { visibility: hidden !important }
  .rg-sheet, .rg-sheet * { visibility: visible !important }
  .rg-sheet { position: fixed; inset: 0; width: 210mm !important; height: 297mm; aspect-ratio: auto; box-shadow: none; border-radius: 0 }
  .rg-sheet-wrap { padding: 0; background: none }
  /* printed from a layer (strati.js, wave 4b): the dialog's frame (transform, height, scroll) lets go of the poster */
  dialog.st[open], dialog.st[open].st--sotto { transform: none !important; filter: none !important; max-height: none !important; height: auto !important;
    overflow: visible !important; box-shadow: none !important; animation: none !important }
  dialog.st .st-carta, dialog.st .st-corpo { overflow: visible !important }
  dialog.st::backdrop { background: none !important }
}