/* ==========================================================================
   LA INVITACIÓN PARA IMPRIMIR — el acomodo común (cada tema la viste en su tema.css)
   Tarjeta de 5 × 7 pulgadas = 127 × 178 mm al corte. La hoja lleva 3 mm de sobrante
   por lado (133 × 184), que es lo que pide la imprenta para cortar parejo.
   --mm es "un milímetro": en pantalla se encoge para caber en el celular; al imprimir
   vale 1 mm exacto. TODO se mide con él (también la letra) para que la tarjeta salga
   igual en pantalla que en papel.
   Lo importante queda a más de 12 mm de la orilla (9 mm del corte): el marco fino.
   ========================================================================== */
body.imprenta{ min-height:100dvh; display:grid; justify-items:center; align-content:start; gap:1.4rem; padding:1.4rem 1rem 2.8rem; background:var(--papel-hondo); }
.pliego{ --mm:calc(min(100vw - 2rem, 440px) / 133); display:grid; gap:1.3rem; justify-items:center; }
.cara{ position:relative; box-sizing:border-box; width:calc(var(--mm) * 133); height:calc(var(--mm) * 184); overflow:hidden; display:grid; place-items:center; text-align:center; background:var(--papel); color:var(--tinta); box-shadow:var(--sombra-alta); }
.cara::after{ content:""; position:absolute; z-index:1; inset:calc(var(--mm) * 12); border:calc(var(--mm) * .3) solid var(--marca-claro); pointer-events:none; }
.cara__dentro{ position:relative; z-index:2; width:calc(var(--mm) * 96); display:flex; flex-direction:column; align-items:center; }
.cara__dentro > *{ margin:0; }

.imp__arriba{ font-family:var(--f-texto); font-weight:500; font-size:calc(var(--mm) * 2.7); line-height:1.5; letter-spacing:.32em; text-transform:uppercase; color:var(--marca); }
.imp__nombre{ margin:calc(var(--mm) * 5) 0; font-family:var(--f-display); font-weight:600; font-size:calc(var(--mm) * 15); line-height:1.02; color:var(--acento); }
.imp__nombre .amp{ display:block; font-size:.5em; line-height:1.15; font-style:italic; font-weight:400; }      /* cada nombre en su renglón: así caben los largos */
/* si el tema no trae su propio adorno, va uno sencillo arriba */
.cara__dentro--adorno::before{ content:""; width:calc(var(--mm) * 26); height:calc(var(--mm) * 2.4); margin-bottom:calc(var(--mm) * 4.5); background:
  linear-gradient(var(--marca-claro), var(--marca-claro)) left center / 38% calc(var(--mm) * .3) no-repeat,
  linear-gradient(var(--marca-claro), var(--marca-claro)) right center / 38% calc(var(--mm) * .3) no-repeat,
  conic-gradient(from 45deg at 50% 50%, var(--marca-claro) 0 25%, var(--marca-claro) 25% 100%) center / calc(var(--mm) * 1.7) calc(var(--mm) * 1.7) no-repeat; }
.imp__frase{ margin-bottom:calc(var(--mm) * 6.5); max-width:calc(var(--mm) * 78); font-family:var(--f-display); font-style:italic; font-size:calc(var(--mm) * 4.2); line-height:1.35; color:var(--tinta); }
.imp__fecha{ display:flex; align-items:center; justify-content:center; gap:calc(var(--mm) * 4.5); }
.imp__fecha span{ display:flex; flex-direction:column; justify-content:center; box-sizing:border-box; min-width:calc(var(--mm) * 27); height:calc(var(--mm) * 11.5); border-top:calc(var(--mm) * .3) solid var(--marca); border-bottom:calc(var(--mm) * .3) solid var(--marca); font-family:var(--f-texto); font-size:calc(var(--mm) * 2.8); line-height:1.5; letter-spacing:.22em; text-transform:uppercase; color:var(--tinta); }
.imp__fecha small{ font-size:1em; }
.imp__fecha b{ font-family:var(--f-display); font-weight:600; font-size:calc(var(--mm) * 16); line-height:.9; color:var(--acento); }
.imp__hora{ margin-top:calc(var(--mm) * 4.5); font-family:var(--f-texto); font-size:calc(var(--mm) * 2.9); letter-spacing:.24em; text-transform:uppercase; color:var(--tinta); }
.imp__lugar{ margin-top:calc(var(--mm) * 6.5); display:flex; flex-direction:column; gap:calc(var(--mm) * .8); }
.imp__lugar b{ font-family:var(--f-display); font-weight:600; font-size:calc(var(--mm) * 5.6); line-height:1.15; color:var(--marca); }
.imp__lugar span{ font-family:var(--f-texto); font-size:calc(var(--mm) * 2.9); line-height:1.45; color:var(--tinta-suave); }
.imp__nota{ margin-top:calc(var(--mm) * 5); font-family:var(--f-display); font-style:italic; font-size:calc(var(--mm) * 3.8); color:var(--tinta-suave); }

/* el reverso: el color de la marca, y el código que abre la invitación digital */
.cara--reverso{ background:var(--marca); color:var(--papel); }
.cara--reverso::after{ border-color:rgba(255,255,255,.5); }
.cara--reverso .imp__arriba{ color:var(--papel); }
.imp__mono{ margin-bottom:calc(var(--mm) * 7); font-family:var(--f-display); font-style:italic; font-weight:500; font-size:calc(var(--mm) * 13); line-height:1; }
.imp__qr{ margin:calc(var(--mm) * 6) 0; padding:calc(var(--mm) * 2.6); background:#FFFFFF; border-radius:calc(var(--mm) * 1.6); }
.imp__qr canvas{ display:block; width:calc(var(--mm) * 36); height:calc(var(--mm) * 36); image-rendering:pixelated; }
.imp__pasos{ max-width:calc(var(--mm) * 80); font-family:var(--f-texto); font-size:calc(var(--mm) * 3.2); line-height:1.55; }
.imp__liga{ margin-top:calc(var(--mm) * 4); font-family:var(--f-texto); font-size:calc(var(--mm) * 2.4); letter-spacing:.05em; opacity:.9; word-break:break-all; }

.imprenta__botones{ display:grid; gap:.7rem; justify-items:center; width:min(100%, 380px); text-align:center; }
.imprenta__botones .boton{ width:100%; }
.imprenta__nota{ margin:0; font-size:.86rem; line-height:1.5; color:var(--tinta-suave); }
.imprenta__volver{ font-size:.84rem; font-weight:600; color:var(--tinta-suave); }

@media print{
  @page{ size:133mm 184mm; margin:0; }
  html, body.imprenta{ display:block; min-height:0; padding:0; margin:0; background:#FFFFFF !important; }
  .imprenta__botones{ display:none; }
  .pliego{ --mm:1mm; display:block; }
  .cara{ box-shadow:none; break-after:page; page-break-after:always; break-inside:avoid; }
  *{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}