/* 79 · Galería de Arte — museo contemporáneo: pedestal, escultura abstracta, lienzo azul klein y marco dorado.
   Guion: se enciende la luz de la galería; los nombres como título de la exposición en la pared, el pedestal delante en
   parallax; en la fecha el lienzo azul gira sobre su eje y se vuelve un marco circular con el día, como una obra. */
.c-galeria { --display-peso: 400; --nombre-color: #161616; --titulo-letra: "Syne"; --titulo-peso: 800; --titulo-espacio: -.03em; --dia-letra: "Syne"; --dia-color: #FFFFFF;
	--y-letra: "Gloock"; --y-tam: .5em; --y-color: #1F2FD1; --radio: 0px; --vj: 56px; --sombra: 0 30px 40px rgb(22 22 22 / .2); --nombre-tam: clamp(4.4rem, 11vw, 9.4rem); --display-espacio: -.02em; }
.c-galeria .e-evento { color: #1F2FD1; font-family: "Syne", sans-serif; font-weight: 800; letter-spacing: .3em; font-size: .8rem; }
.c-galeria .e-nombre { line-height: .98; }
.c-galeria .e-fecha { color: #45433F; font-size: .85rem; letter-spacing: .08em; }
.c-galeria .e-titulos { justify-items: start; text-align: left; translate: -6vw -4vh; }
.c-galeria .e-titulos::after { content: "Óleo de dos autores · técnica mixta · 2027"; font: 500 .75rem/1.4 "Inter", sans-serif; color: #45433F; letter-spacing: .04em; border-left: 2px solid #1F2FD1; padding-left: 10px; }

.ga-lienzo { --w: min(22vmin, 220px); right: 8vw; top: 12vh; --dy: -14vh; --dr: 6deg; --ex: 20vw; --ey: 0px; --ed: .6s; --fd: 0s; }
.ga-lienzo .e-img, .ga-marco .e-img, .ga-pedestal .e-img, .ga-jarron .e-img { animation: none; }
.ga-marco { --w: min(18vmin, 180px); left: 6vw; top: 8vh; --dy: -12vh; --ex: -20vw; --ey: 0px; --ed: .8s; --fd: 0s; }
.ga-pedestal { --w: min(14vmin, 140px); right: 16vw; bottom: 0; --dy: 8vh; --ey: 30vh; --ed: 1s; --fd: 0s; }
.ga-jarron { --w: min(11vmin, 110px); left: 12vw; bottom: 2vh; --dy: 8vh; --ey: 30vh; --ed: 1.2s; --fd: 0s; }

.c-galeria .xv-entrada { background: #0E0E0E; transition: background 1s; }
.ga-cartela { position: absolute; left: 50%; top: 50%; width: min(80vw, 420px); height: 70%; translate: -50% -50%; background: radial-gradient(60% 40% at 50% 0, rgb(255 255 255 / .18), transparent 70%); }
.c-galeria .xv-entrada-contenido { position: relative; z-index: 1; }
html.abriendo .c-galeria .xv-entrada, html.abriendo.c-galeria .xv-entrada { background: #F4F3EF; }

.c-galeria .e-ornamento { width: min(40%, 160px); }
.c-galeria .e-firma { font-family: "Gloock", serif; color: #1F2FD1; font-size: clamp(1.8rem, 3.6vw, 2.6rem); }

/* fecha: lienzo gira → marco circular */
.ga-m-lienzo { left: 15%; top: 15%; width: 70%; transform: perspective(900px) rotateY(calc(var(--t1) * 90deg)); opacity: clamp(0, calc((1 - var(--t1)) * 4), 1); filter: none; }
.ga-m-marco { inset: 6%; border-radius: 50%; background: #1F2FD1; box-shadow: 0 0 0 10px #F4F3EF, 0 0 0 16px #C9A44A, 0 30px 50px -20px rgb(22 22 22 / .5);
	opacity: clamp(0, calc(var(--t1) * 4 - 3), 1); transform: perspective(900px) rotateY(calc((1 - var(--t2)) * -90deg)); }
.c-galeria .e-dia { font-weight: 800; font-size: clamp(4.4rem, 12vw, 7rem); }
.c-galeria .e-mes { font-family: "Gloock", serif; color: #FFFFFF; }
.c-galeria .e-anio { color: #E4E6F6; }

.c-galeria .xv-superficie { background: #FFFFFF; border: 0; box-shadow: 0 30px 60px -40px rgb(22 22 22 / .35); }
.c-galeria .e-itinerario { background: #FFFFFF; }
.c-galeria .xv-momento time { color: #1F2FD1; }
.c-galeria .xv-titulo .xv-script { font-family: "Gloock", serif; color: #1F2FD1; font-weight: 400; }
.ga-cierre-marco { position: relative; display: block; width: min(30vmin, 220px); margin: 0 auto; }
.c-galeria .e-cierre-arte { position: relative; inset: auto; z-index: 0; }

@media (max-width: 760px) {
	.c-galeria .e-titulos { translate: 0 -2vh; }
	.ga-lienzo { --w: 30vw; right: 4vw; top: 6vh; }
	.ga-marco { --w: 26vw; left: 4vw; top: 6vh; }
	.ga-pedestal { --w: 20vw; right: 8vw; }
	.ga-jarron { --w: 16vw; left: 8vw; }
	.c-galeria { --nombre-tam: clamp(3rem, 13vw, 4.6rem); --pareja-tam: 1; }
}
