/* 48 · Pequeño Gran Paso — libro infantil con textura de gouache: amarillo lápiz, rojo manzana y verde pizarra.
   Guion: una pizarra se borra para abrir; el nombre queda escrito en tiza sobre la pizarra, con la manzana en el
   marco. Un avión de papel cruza de sección en sección. En la fecha la pizarra se borra en círculo y aparece el
   día escrito en tiza. Al final, el birrete pequeño cae sobre el nombre. */

.c-kinder { --display-peso: 400; --nombre-color: #FFFFFF; --titulo-letra: "Lilita One"; --dia-color: #FFFFFF; --radio: 20px; --vj: 96px;
	--nombre-tam: clamp(2.8rem, 8vw, 6rem); --sombra: 0 16px 18px rgb(47 42 38 / .2); }
.c-kinder .e-titulos { gap: 6px; translate: 0 -2vh; }
.c-kinder .e-nombre { text-shadow: 0 0 1px #fff, 2px 2px 0 rgb(255 255 255 / .15); letter-spacing: .01em; }
.c-kinder .e-evento { font-family: "Gochi Hand", cursive; text-transform: none; letter-spacing: .02em; font-size: clamp(1.4rem, 2.6vw, 2rem); color: #FFE08A; }
.c-kinder .e-grado-t { color: #FFFFFF; font-family: "Gochi Hand", cursive; font-weight: 400; font-size: clamp(1.3rem, 2.4vw, 1.8rem); }
.c-kinder .e-grado-i, .c-kinder .e-fecha { color: #E5EDE7; }

/* la pizarra con el nombre en tiza */
.kd-pizarra { --w: min(110vmin, 860px); left: calc(50% - min(55vmin, 430px)); top: calc(50% - min(40vmin, 312px)); --ds: .05; --ey: 0px; --ed: .1s; --fd: 0s; }
.kd-pizarra .e-img { animation: none; }
.kd-manzana { --w: min(12vmin, 110px); left: calc(50% - min(48vmin, 376px)); top: calc(50% - min(48vmin, 372px)); --r: -8deg; --dy: -20vh; --dr: -30deg; --ey: -50vh; --ed: .9s; --fd: 4s;
	transition: opacity .3s ease var(--ed), translate .9s cubic-bezier(.34,1.56,.64,1) var(--ed); }
.kd-lapices { --w: min(16vmin, 150px); left: calc(50% + min(38vmin, 300px)); top: calc(50% + min(26vmin, 200px)); --dy: 16vh; --dr: 20deg; --ex: 20vw; --ey: 0px; --ed: 1.1s; --fd: 6s; }
.kd-birrete { --w: min(16vmin, 150px); left: calc(50% + min(32vmin, 250px)); top: calc(50% - min(48vmin, 372px)); --r: 14deg; --dy: -24vh; --dr: 20deg; --ey: -40vh; --ed: 1.3s; --fd: 3.4s; }
.kd-avion { --w: min(18vmin, 170px); left: 4vw; top: 70vh; --r: -14deg; --dx: 80vw; --dy: -50vh; --dr: 6deg; --ex: -30vw; --ey: 0px; --ed: 1.6s; --fd: 2.6s; --fa: 8px; }

/* entrada: pizarra verde que se borra en círculo */
.c-kinder .xv-entrada { background: #2F4F3E radial-gradient(70% 60% at 50% 40%, #3A6150, #2A4637 70%); box-shadow: inset 0 0 0 14px #B98A52, inset 0 0 0 18px #8C6236; }
.kd-entrada-manzana { position: absolute; left: 8%; top: 8%; width: min(14vmin, 110px); }
.kd-entrada-lapices { position: absolute; right: 7%; bottom: 7%; width: min(16vmin, 130px); }
.c-kinder .xv-entrada .xv-evento { color: #FFE08A; font-family: "Gochi Hand", cursive; text-transform: none; letter-spacing: .02em; font-size: 1.5rem; }
.c-kinder .xv-entrada .xv-boton:not(.xv-boton-suave) { background: #FFC83D; border-color: #FFC83D; color: #2F2A26; }

/* bienvenida */
.c-kinder .e-ornamento { width: min(60%, 220px); }
.c-kinder .e-firma { font-family: "Gochi Hand", cursive; color: #C42B36; }

/* fecha: la pizarra aparece, se borra en círculo y queda el día en tiza */
.kd-m-pizarra { left: -10%; top: 12%; width: 120%; transform: scale(calc(.5 + var(--t1) * .5)); opacity: clamp(0, calc(var(--t1) * 2.4), 1); }
.kd-m-borrado { left: 50%; top: 48%; width: 62%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgb(255 255 255 / .12), rgb(255 255 255 / .04) 60%, transparent 72%);
	transform: scale(var(--t2)); opacity: var(--t2); }
.c-kinder .e-dia-caja { translate: 0 2%; }
.c-kinder .e-dia { font-family: "Lilita One", sans-serif; font-size: clamp(4.4rem, 12vw, 7rem); text-shadow: 0 0 1px #fff; }
.c-kinder .e-mes { font-family: "Gochi Hand", cursive; color: #FFE08A; }
.c-kinder .e-anio { color: #E5EDE7; }

/* secciones con lápices de colores */
.c-kinder .e-itinerario { background: #E7F1E9; }
.c-kinder .xv-momento time { color: #C42B36; font-family: "Lilita One", sans-serif; font-weight: 400; font-size: 1.15rem; }
.c-kinder .xv-momento span { font-family: "Gochi Hand", cursive; font-size: 1.45rem; }
.c-kinder .xv-superficie { background: #FFFFFF; border: 0; box-shadow: 0 8px 0 #FFC83D, 0 24px 40px -24px rgb(47 42 38 / .4); }
.c-kinder .xv-titulo .xv-script { color: #C42B36; font-size: 1.15em; }

/* cierre: el birrete pequeño cae sobre el nombre */
.kd-cierre-birrete { position: absolute; left: 50%; top: 22%; width: min(18vmin, 150px); translate: -50% 0; rotate: -10deg; }
.c-kinder .e-nombre-fin { color: #2F4F3E; }

@media (max-width: 760px) {
	.kd-pizarra { --w: 118vw; left: -9vw; top: 26vh; }
	.c-kinder { --nombre-tam: clamp(2.2rem, 11vw, 3.4rem); }
	.kd-manzana { left: 4vw; top: 20vh; --w: 18vw; }
	.kd-lapices { left: 72vw; top: 72vh; --w: 24vw; }
	.kd-birrete { left: 68vw; top: 16vh; --w: 24vw; }
	.kd-avion { --w: 28vw; top: 82vh; }
}

/* Segunda revisión: lectura sin interferir con la ilustración. */
@media(max-width:760px) { .c-kinder .e-titulos .e-fecha { background:#2F4F3E; color:#FFFFFF; padding:8px 12px; border-radius:8px; margin-top:8px; } }
