/* 55 · Nube de Algodón — nubes de algodón de azúcar, mate y soñadoras: celeste, rosa, crema y oro suave.
   Guion: las nubes cubren la pantalla y se apartan; el nombre del bebé entre nubes, con el móvil de cuna girando
   arriba y una cigüeña que cruza el cielo. En la fecha una nube se vuelve un corazón con el día. */

.c-nube { --display-peso: 700; --nombre-color: #3D3A5C; --titulo-letra: "Fredoka"; --titulo-peso: 600; --dia-letra: "Fredoka"; --dia-color: #3D3A5C; --radio: 28px; --vj: 120px;
	--sombra: 0 24px 30px rgb(61 58 92 / .12); }
.c-nube .e-nombre { text-shadow: 0 4px 0 #FFFFFF, 0 18px 40px rgb(249 201 214 / .8); }
.c-nube .e-padres { color: #A84B71; font-family: "Sacramento", cursive; font-size: clamp(2rem, 4.4vw, 3.2rem); }
.c-nube .e-evento { color: #A84B71; }
.c-nube .e-titulos { translate: 0 4vh; }

.nu-movil { --w: min(24vmin, 230px); left: calc(50% - min(12vmin, 115px)); top: -4vh; --dy: -16vh; --ey: -30vh; --ed: .4s; --fd: 5s; --fa: 6px; --fr: 4deg; }
.nu-movil .e-img { transform-origin: 50% 0; }
.nu-ciguena { --w: min(24vmin, 230px); left: -8vw; top: 16vh; --dx: 70vw; --dy: -8vh; --ex: -30vw; --ey: 0px; --ed: 1s; --fd: 3.2s; --fa: 10px; --fr: 2deg; }
.nu-nube-izq, .nu-nube-der { --w: min(56vmin, 540px); bottom: -8vh; --ey: 0px; --ed: .1s; --fd: 9s; --fa: 6px; --fr: .5deg; }
.nu-nube-izq { left: -12vw; --dx: -16vw; --ex: 30vw; }
.nu-nube-der { right: -12vw; --dx: 16vw; --ex: -30vw; }
.nu-nube-der .e-img { scale: -1 1; }

/* entrada: nubes que se apartan */
.c-nube .xv-entrada { background: linear-gradient(180deg, #CDE9F9, #FDE7EE); }
.nu-entrada-n1, .nu-entrada-n2, .nu-entrada-n3 { position: absolute; width: min(60vmin, 520px); opacity: .95; }
.nu-entrada-n1 { left: -14vw; top: 4%; } .nu-entrada-n2 { right: -16vw; bottom: 2%; scale: -1 1; } .nu-entrada-n3 { left: 30%; bottom: -16%; width: min(46vmin, 400px); }
.c-nube .xv-entrada-contenido { background: rgb(255 255 255 / .62); backdrop-filter: blur(10px); padding: 30px clamp(22px, 5vw, 48px); border-radius: 32px; }

/* bienvenida */
.c-nube .e-ornamento { width: min(60%, 240px); }
.c-nube .e-firma { font-family: "Sacramento", cursive; color: #A84B71; font-size: clamp(2.4rem, 4.6vw, 3.6rem); }

/* fecha: la nube se vuelve un corazón */
.nu-m-nube { left: 6%; top: 22%; width: 88%; transform: scale(calc(1 + var(--t1) * .15)); opacity: clamp(0, calc((1 - var(--t2)) * 2.2), 1); }
.nu-m-corazon { left: 50%; top: 50%; width: 52%; aspect-ratio: 1; translate: -50% -42%; background: linear-gradient(135deg, #FDE7EE, #F9C9D6); border-radius: 18%;
	transform: rotate(45deg) scale(calc(.3 + var(--t2) * .7)); opacity: var(--t2); box-shadow: 0 30px 50px -24px rgb(180 83 122 / .5); }
.nu-m-corazon::before, .nu-m-corazon::after { content: ""; position: absolute; width: 100%; height: 100%; border-radius: 50%; background: inherit; }
.nu-m-corazon::before { left: -50%; top: 0; background: linear-gradient(135deg, #FDE7EE, #F9C9D6); }
.nu-m-corazon::after { left: 0; top: -50%; background: linear-gradient(135deg, #FDE7EE, #F9C9D6); }
.c-nube .e-dia-caja { translate: 0 -4%; }
.c-nube .e-dia { font-size: clamp(4.4rem, 12vw, 7rem); }
.c-nube .e-mes { font-family: "Sacramento", cursive; color: #A84B71; font-size: clamp(2.4rem, 6vw, 3.8rem); }

/* secciones suaves */
.c-nube .xv-superficie { background: #FFFFFF; border: 0; box-shadow: 0 24px 50px -30px rgb(61 58 92 / .35); }
.c-nube .e-itinerario { background: linear-gradient(180deg, #EAF4FB, #FDE7EE); }
.c-nube .xv-momento { border: 0; background: #FFFFFF; border-radius: 999px; padding: 14px 24px; margin-bottom: 10px; }
.c-nube .xv-momento time { color: #A84B71; }
.c-nube .xv-titulo .xv-script { font-size: 1.5em; }

/* cierre */
.nu-cierre-n1, .nu-cierre-n2 { position: absolute; width: min(44vmin, 380px); opacity: .85; }
.nu-cierre-n1 { left: -10vw; bottom: 4%; } .nu-cierre-n2 { right: -10vw; top: 6%; scale: -1 1; }

@media (max-width: 760px) {
	.nu-nube-izq, .nu-nube-der { --w: 86vw; bottom: -4vh; }
	.nu-nube-izq { left: -36vw; } .nu-nube-der { right: -36vw; }
	.nu-movil { --w: 40vw; left: 30vw; }
	.nu-ciguena { --w: 40vw; top: 18vh; }
}