/* 125 · Invernadero — boda de jardín botánico: hierro blanco, vidrio verdoso, helechos y terracota. Se abre la puerta del invernadero: el vidrio se desempaña y se entra.
   Portada: la cúpula de hierro y vidrio vista desde adentro, con haces de luz entre los cristales (WebGL, modo rayos) y helechos colgantes.
   Orden: los paños del invernadero — cada sección es un paño de vidrio con marco de hierro que se desempaña al llegar.
   Fecha: el cayado de un helecho nuevo se desenrolla y el día aparece. Cierre: la cúpula de noche con faroles. */
.c-invernadero { --display-peso: 400; --nombre-color: #1E2420; --titulo-letra: "DM Serif Display"; --titulo-peso: 400; --titulo-espacio: -.01em;
	--dia-letra: "Gloock"; --dia-color: #1E2420; --y-letra: "DM Serif Display"; --y-color: #B86A4B; --y-tam: .55em; --pareja-tam: .8;
	--radio: 4px; --vj: 50px; --sombra: 0 16px 20px rgb(30 36 32 / .2); --nombre-tam: clamp(3.2rem, 8vw, 6.8rem); --ap-w: min(62vw, 320px); }
.c-invernadero .xv-cielo { display: none; }
.c-invernadero main { background: linear-gradient(180deg, #E8EFE7, #EEF2EC 40%, #E3EAE2); }
.c-invernadero main > .xv-sec:not(#portada) { background: transparent; }
.c-invernadero .v-velo { background: radial-gradient(50% 40% at 50% 48%, rgb(244 246 240 / .82), transparent 76%); }

/* apertura: la puerta empañada */
.ap-cosa[data-efecto="entra"]::after { content: ""; position: absolute; inset: 6% 10%; z-index: 3; border-radius: 40% 40% 4px 4px; pointer-events: none;
	background: radial-gradient(80% 70% at 50% 50%, rgb(255 255 255 / .82), rgb(240 245 240 / .5)); backdrop-filter: blur(3px); transition: opacity .9s ease; }
html.so-abre .ap-cosa[data-efecto="entra"]::after { opacity: 0; }
html.so-abre .ap-cosa[data-efecto="entra"] .ap-pieza { transform: scale(3.2); opacity: 0; transition: transform 1.4s cubic-bezier(.6,0,.3,1) .6s, opacity .7s ease 1.1s; }

/* portada */
.c-invernadero .e-evento { color: #3E5E3A; letter-spacing: .42em; font-weight: 700; font-size: .74rem; }
.c-invernadero .e-fecha { color: #465249; font-weight: 600; letter-spacing: .06em; background: rgb(250 251 247 / .76); padding: 6px 16px; border-radius: 999px; }
.c-invernadero .e-nombre { text-shadow: 0 2px 24px rgb(250 251 247 / .9); }
.iv-helecho-a { --w: min(24vmin, 220px); left: 6vw; top: -2vh; --dy: -10vh; --ex: 0px; --ey: -40vh; --ed: .3s; --fd: 6s; --fa: 4px; --fr: 2.5deg; }
.iv-helecho-b { --w: min(20vmin, 190px); right: 8vw; top: -4vh; --dy: -12vh; --ex: 0px; --ey: -40vh; --ed: .5s; --fd: 7s; --fa: 4px; --fr: 2.5deg; }
.iv-helecho-a .e-img, .iv-helecho-b .e-img { transform-origin: 50% 0; }
.iv-regadera { --w: min(22vmin, 210px); right: 6vw; bottom: 4vh; --dy: 10vh; --ex: 30vw; --ey: 0px; --ed: .7s; --fd: 8s; --fa: 4px; --fr: 1deg; }
.iv-cayado { --w: min(12vmin, 110px); left: 10vw; bottom: 5vh; --dy: 12vh; --ex: 0px; --ey: 30vh; --ed: .8s; --fd: 5s; --fa: 4px; --fr: 3deg; }

/* paños de vidrio con marco de hierro blanco */
.c-invernadero main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { position: relative; background: linear-gradient(135deg, rgb(255 255 255 / .82), rgb(225 236 228 / .7));
	border: 8px solid #F4F4EF; outline: 1px solid rgb(30 36 32 / .28); outline-offset: -8px; border-radius: 6px; padding: clamp(40px, 5vw, 64px) clamp(22px, 5vw, 64px);
	box-shadow: 0 0 0 1px rgb(30 36 32 / .18), 0 34px 60px -40px rgb(30 36 32 / .5); }
.c-invernadero main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho::before { content: ""; position: absolute; inset: -8px; pointer-events: none;
	background: linear-gradient(115deg, transparent 30%, rgb(255 255 255 / .55) 45%, transparent 55%) -100% 0 / 200% 100% no-repeat; transition: background-position 1.6s ease .6s; }
.c-invernadero main > .xv-sec.llego:not(#portada):not(#fecha):not(#cierre) > .xv-ancho::before { background-position: 120% 0; }
.c-invernadero .xv-kicker { color: #3E5E3A; letter-spacing: .32em; font-weight: 700; }
.c-invernadero .xv-titulo { color: #1E2420; }
.c-invernadero .xv-titulo .xv-script { font-style: italic; color: #3E5E3A; }
.c-invernadero .xv-superficie { background: rgb(255 255 255 / .7); border: 1px solid rgb(62 94 58 / .2); border-radius: 4px; box-shadow: none; }
.c-invernadero .xv-momento time { color: #B86A4B; font-weight: 700; }
.c-invernadero .e-firma { font-family: "DM Serif Display", serif; font-style: italic; color: #3E5E3A; }
.c-invernadero .xv-boton:not(.xv-boton-suave) { background: #3E5E3A; color: #FFFFFF; border-color: #3E5E3A; }
.c-invernadero .e-ornamento { width: min(60%, 240px); }

/* fecha: el cayado se desenrolla */
.c-invernadero .e-fecha-k { color: #3E5E3A; letter-spacing: .4em; font-weight: 700; }
.iv-m-cayado { left: 64%; top: 2%; width: 30%; transform-origin: 30% 20%; opacity: clamp(0, calc(var(--t1) * 2), 1);
	transform: rotate(calc((1 - var(--t1)) * -200deg)) scale(calc(.3 + var(--t1) * .7)); }
.iv-m-vaho { inset: 8%; border-radius: 50%; background: radial-gradient(circle, rgb(255 255 255 / .9), rgb(255 255 255 / 0) 70%); opacity: calc(.4 + var(--t2) * .6); }
.c-invernadero .e-dia { font-size: clamp(5.4rem, 16vw, 9rem); }
.c-invernadero .e-mes { font-family: "DM Serif Display", serif; font-style: italic; color: #3E5E3A; }
.c-invernadero .e-anio { color: #465249; }

/* cierre: la cúpula de noche con faroles */
.c-invernadero .e-cierre { background: radial-gradient(90% 70% at 50% 20%, #2C3D33, #141C17 75%) !important; color: #EEF2EC; --tinta: #EEF2EC; --tinta-2: #C9D8CF; --nombre-color: #F4F4EF; padding-top: clamp(220px, 32vh, 290px); }
.c-invernadero .e-cierre .xv-kicker { color: #E9B28F; }
.c-invernadero .e-cierre .e-nombre-fin { color: #F4F4EF; }
.c-invernadero .e-cierre p, .c-invernadero .e-cierre a { color: #DDE6DE; }
.iv-cierre-a, .iv-cierre-b { position: absolute; top: -2%; width: min(26vw, 210px); opacity: .9; filter: brightness(.6); animation: e-flota 6s ease-in-out infinite alternate; }
.iv-cierre-a { left: 2%; } .iv-cierre-b { right: 2%; animation-delay: -3s; }
.iv-farol { position: absolute; top: 9%; width: 14px; height: 14px; border-radius: 50%; background: #FFE3A6; box-shadow: 0 0 20px 8px rgb(255 205 120 / .6), 0 0 70px 20px rgb(255 190 100 / .25); animation: iv-titila 2.4s ease-in-out infinite alternate; }
.iv-f1 { left: 30%; top: 14%; } .iv-f2 { left: 50%; top: 7%; animation-delay: -.8s; } .iv-f3 { left: 70%; top: 14%; animation-delay: -1.6s; }
@keyframes iv-titila { to { opacity: .7; transform: scale(.85); } }

@media (max-width: 760px) {
	.c-invernadero { --nombre-tam: clamp(3rem, 14vw, 4.4rem); }
	.iv-helecho-a { --w: 34vw; left: -4vw; } .iv-helecho-b { --w: 30vw; right: -4vw; }
	.iv-regadera { --w: 30vw; right: 0; bottom: 5vh; } .iv-cayado { --w: 16vw; left: 6vw; bottom: 7vh; }
	.c-invernadero main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { padding: 40px 20px; }
}