/* 73 · Pasaporte al Sí — papelería de viaje vintage: pasaporte, sellos, estampillas y boleto.
   Guion: el pasaporte cerrado se abre; la «página de datos» con los nombres; un avión de papel cruza y deja una línea
   punteada; en la fecha un sello de entrada cae y estampa: el día queda dentro del sello. */
.c-pasaporte { --display-peso: 400; --nombre-color: #1C2E4A; --titulo-letra: "Archivo Black"; --titulo-espacio: -.02em; --dia-letra: "Archivo Black"; --dia-color: #A93636;
	--y-letra: "Archivo Black"; --y-tam: .34em; --y-color: #A93636; --y-margen: .2em 0 .3em; --radio: 6px; --vj: 70px; --sombra: 0 18px 22px rgb(28 46 74 / .2); --nombre-tam: clamp(2.8rem, 7.4vw, 6.2rem); --display-espacio: 0; }
.c-pasaporte .e-evento { color: #A93636; font-family: "IBM Plex Mono", monospace; font-weight: 600; letter-spacing: .3em; }
.c-pasaporte .e-nombre { line-height: 1.3; }
.c-pasaporte .e-fecha { font-family: "IBM Plex Mono", monospace; color: #1C2E4A; font-size: .85rem; letter-spacing: .06em; border-top: 1px solid #1C2E4A; border-bottom: 1px solid #1C2E4A; padding: 6px 4px; }
.c-pasaporte .e-titulos::before { content: ""; position: absolute; inset: -5vh -5vw; z-index: -1; border-radius: 10px; background: rgb(251 247 238 / .9); box-shadow: 0 30px 60px -30px rgb(28 46 74 / .4);
	background-image: repeating-linear-gradient(45deg, transparent 0 10px, rgb(78 125 99 / .05) 10px 11px), repeating-linear-gradient(-45deg, transparent 0 10px, rgb(28 46 74 / .05) 10px 11px); }

.pa-estampilla { --w: min(18vmin, 180px); left: 5vw; top: 6vh; --r: -10deg; --dy: -16vh; --dr: -10deg; --ex: -20vw; --ey: 0px; --ed: .5s; --fd: 8s; }
.pa-boleto { --w: min(28vmin, 280px); right: 3vw; top: 8vh; --r: 8deg; --dy: -18vh; --ex: 30vw; --ey: 0px; --ed: .7s; --fd: 7s; }
.pa-avion { --w: min(20vmin, 200px); left: 4vw; bottom: 12vh; --r: -8deg; --dx: 60vw; --dy: -40vh; --dr: -10deg; --ex: -40vw; --ey: 20vh; --ed: 1s; --fd: 4s; }
.pa-sello { --w: min(16vmin, 160px); right: 8vw; bottom: 8vh; --r: 14deg; --dy: 12vh; --ex: 20vw; --ey: 20vh; --ed: 1.3s; --fd: 0s; opacity: .85; }
.pa-sello .e-img { animation: none; filter: none; }

.c-pasaporte .xv-entrada { background: #F2EBDD; }
.pa-entrada-pasaporte { position: absolute; left: 50%; top: 50%; width: min(56vmin, 400px); translate: -50% -50%; opacity: .25; }
html.abriendo .pa-entrada-pasaporte { transition: transform 1.2s cubic-bezier(.65,0,.35,1), opacity 1.2s; transform: perspective(900px) rotateY(-80deg); transform-origin: 0 50%; opacity: 0; }

.c-pasaporte .e-ornamento { width: min(56%, 220px); }
.c-pasaporte .e-firma { font-family: "Homemade Apple", cursive; color: #1C2E4A; font-size: clamp(1.4rem, 3vw, 2rem); }

/* fecha: el sello cae y estampa */
.pa-m-sello { left: 0; top: 0; width: 100%; transform: translateY(calc((1 - var(--t1)) * -60%)) scale(calc(1.6 - var(--t1) * .6)) rotate(calc(-12deg + var(--t1) * 4deg)); opacity: clamp(0, calc(var(--t1) * 2), 1); filter: none; }
.c-pasaporte .e-dia { font-size: clamp(4rem, 11vw, 6.2rem); }
.c-pasaporte .e-mes { font-family: "IBM Plex Mono", monospace; font-weight: 600; text-transform: uppercase; letter-spacing: .3em; color: #A93636; font-size: .9rem; }
.c-pasaporte .e-anio { font-family: "IBM Plex Mono", monospace; color: #A93636; }
.c-pasaporte .e-dia-caja { rotate: -8deg; }

.c-pasaporte .xv-superficie { background: #FBF7EE; border: 1px dashed rgb(28 46 74 / .5); }
.c-pasaporte .e-itinerario { background: #1C2E4A; --tinta: #F2EBDD; --tinta-2: #D9D3C2; --acento: #E8B4A0; --linea: rgba(242,235,221,.2); color: #F2EBDD; }
.c-pasaporte .xv-momento time { font-family: "IBM Plex Mono", monospace; color: #A93636; } .c-pasaporte .e-itinerario .xv-momento time { color: #E8C98E; }
.c-pasaporte .xv-titulo .xv-script { font-family: "Homemade Apple", cursive; font-size: .7em; color: #A93636; }
.c-pasaporte .e-itinerario .xv-titulo .xv-script { color: #E8C98E; }
.pa-cierre-pasaporte { position: relative; display: block; width: min(28vmin, 200px); margin: 0 auto; rotate: -6deg; }
.c-pasaporte .e-cierre-arte { position: relative; inset: auto; z-index: 0; }

@media (max-width: 760px) {
	.pa-estampilla { --w: 26vw; left: 2vw; top: 4vh; }
	.pa-boleto { --w: 40vw; right: -6vw; top: 6vh; }
	.pa-avion { --w: 28vw; left: 2vw; bottom: 9vh; }
	.pa-sello { --w: 24vw; right: 3vw; bottom: 6vh; }
	.c-pasaporte { --nombre-tam: clamp(2.2rem, 9.4vw, 3.4rem); }
}
@media (min-width: 761px) { .pa-entrada-pasaporte { opacity: .12; } }