/* 82 · Villa de Piscina — como bucear: el fondo vivo es la luz bailando en la piscina; al bajar, el degradado se hace
   más profundo (del turquesa al azul profundo). En la fecha una burbuja sube desde el fondo y contiene el día. */
.c-piscina { --display-peso: 400; --nombre-color: #FFFFFF; --titulo-letra: "Bricolage Grotesque"; --titulo-peso: 800; --titulo-espacio: -.03em; --dia-letra: "Gloock"; --dia-color: #0E3A5C;
	--y-letra: "Gloock"; --y-tam: .34em; --y-color: #F2E6A0; --radio: 22px; --vj: 54px; --sombra: 0 20px 30px rgb(14 58 92 / .3);
	--nombre-tam: clamp(4.6rem, 12vw, 10rem); --pareja-tam: 1; --display-espacio: -.01em; }
.c-piscina .e-evento { color: #FFFFFF; letter-spacing: .5em; font-weight: 700; font-size: .8rem; text-shadow: 0 1px 10px rgb(14 58 92 / .6); }
.c-piscina .e-nombre { text-shadow: 0 4px 30px rgb(14 58 92 / .55); line-height: 1; }
.c-piscina .e-fecha { color: #FFFFFF; font-weight: 600; background: rgb(14 58 92 / .45); padding: 6px 16px; border-radius: 999px; backdrop-filter: blur(6px); }
.c-piscina .e-pista { color: #FFFFFF; }
.c-piscina .v-velo { background: radial-gradient(60% 40% at 50% 48%, rgb(14 58 92 / .28), transparent 72%); }
.pi-limones { --w: min(24vmin, 240px); right: 2vw; top: 4vh; --r: 18deg; --dy: -14vh; --dr: 14deg; --ex: 20vw; --ey: -10vh; --ed: .7s; --fd: 5s; --fa: 8px; --fr: 4deg; }
.c-piscina .so-y { font-family: "Gloock", serif; font-size: .5em; color: #0B6F86; }

/* bucear: el fondo de la página va del turquesa al azul profundo */
.c-piscina .xv-cielo { display: none; }
.c-piscina main { background: linear-gradient(180deg, #8ED7E0 0%, #3FB8C9 18%, #1E86A6 40%, #145E86 62%, #0E3A5C 82%, #0A2742 100%); }
.c-piscina main > .xv-sec:not(#portada) { background: transparent; --tinta: #FFFFFF; --tinta-2: #DDF2F6; --acento: #F2E6A0; --linea: rgba(255,255,255,.22); color: #FFFFFF; }
.c-piscina .xv-kicker { color: #F2E6A0; letter-spacing: .4em; }
.c-piscina .xv-titulo { color: #FFFFFF; }
.c-piscina .xv-titulo .xv-script { font-family: "Gloock", serif; color: #F2E6A0; font-weight: 400; }
.c-piscina .xv-superficie { background: rgb(255 255 255 / .12); border: 1px solid rgb(255 255 255 / .28); backdrop-filter: blur(10px); color: #FFFFFF; }
.c-piscina .xv-momento time { color: #F2E6A0; }
.c-piscina .e-firma { font-family: "Gloock", serif; color: #F2E6A0; }
.c-piscina .xv-boton:not(.xv-boton-suave) { background: #F2E6A0; color: #0E3A5C; border-color: #F2E6A0; }
.c-piscina .xv-boton-suave { color: #FFFFFF; border-color: rgb(255 255 255 / .5); }
.c-piscina .e-ornamento { width: min(60%, 220px); }
.c-piscina main > .xv-sec:not(#portada) .xv-ancho { animation: pi-flota 6s ease-in-out infinite alternate; }
@keyframes pi-flota { from { translate: 0 -4px; } to { translate: 0 4px; } }

/* fecha: la burbuja sube */
.c-piscina .e-fecha-k { color: #FFFFFF; }
.pi-m-burbuja { left: 0; top: 0; width: 100%; transform: translateY(calc((1 - var(--t1)) * 80%)) scale(calc(.35 + var(--t1) * .65)); opacity: clamp(0, calc(var(--t1) * 3), 1); }
.c-piscina .e-dia-caja { color: #FFFFFF; }
.c-piscina .e-dia { color: #FFFFFF; font-size: clamp(4.4rem, 12vw, 7rem); text-shadow: 0 4px 20px rgb(14 58 92 / .6); }
.c-piscina .e-mes { font-family: "Gloock", serif; color: #F2E6A0; }
.c-piscina .e-anio { color: #DDF2F6; }
.c-piscina .e-sem { color: #DDF2F6; }
.pi-cierre-luz { position: absolute; inset: 0; background: radial-gradient(60% 30% at 50% 0%, rgb(143 215 224 / .4), transparent 70%); }

@media (max-width: 760px) {
	.c-piscina { --nombre-tam: clamp(4rem, 19vw, 5.8rem); }
	.pi-limones { --w: 36vw; right: -6vw; top: 3vh; }
}

/* Lista personalizada visible al reducir el grupo. */
.xv-check { background:#FFFFFF; color:#173826; --tinta:#173826; --acento:#196B53; --boton:#196B53; --boton-tinta:#FFFFFF; --linea:rgba(23,56,38,.35); }