/* 93 · Mármol Líquido — mosaico (bento): las secciones son losetas de distintos tamaños que se acomodan al bajar.
   Portada: pintura que fluye en vetas de mármol (fondo vivo). En la fecha las vetas giran y se asientan en un disco con el día. */
.c-marmol { --display-peso: 900; --display-estilo: italic; --nombre-color: #2B2B2B; --titulo-letra: "Syne"; --titulo-peso: 800; --titulo-espacio: -.03em; --dia-letra: "Playfair Display"; --dia-color: #2B2B2B;
	--y-letra: "Playfair Display"; --y-peso: 400; --y-tam: .36em; --y-color: #2F6E62; --radio: 20px; --vj: 54px; --sombra: 0 22px 26px rgb(43 43 43 / .2);
	--nombre-tam: clamp(4.4rem, 12vw, 10.2rem); --pareja-tam: 1; --display-espacio: -.02em; }
.c-marmol .e-evento { color: #2F6E62; letter-spacing: .5em; font-family: "Syne", sans-serif; font-weight: 700; font-size: .76rem; }
.c-marmol .e-nombre { line-height: .98; text-shadow: 0 2px 30px rgb(255 255 255 / .9); }
.c-marmol .e-fecha { color: #2B2B2B; font-weight: 600; background: rgb(255 255 255 / .75); padding: 6px 16px; border-radius: 999px; }
.c-marmol .v-velo { background: radial-gradient(55% 40% at 50% 48%, rgb(255 255 255 / .55), transparent 72%); }
.ma-flores { --w: min(24vmin, 240px); right: 4vw; bottom: 4vh; --r: 8deg; --dy: 14vh; --ey: 30vh; --ed: .8s; --fd: 7s; }
.c-marmol .so-y { font-family: "Playfair Display", serif; font-style: italic; font-size: .5em; color: #2F6E62; }
/* el mosaico */
.c-marmol .bento { background: none; }
.c-marmol main { background: #F6F4EF; }
.c-marmol .bento > .xv-sec > .xv-ancho { background: #FFFFFF; border-radius: 22px; padding: clamp(22px, 3vw, 36px); box-shadow: 0 30px 60px -40px rgb(43 43 43 / .35); border: 1px solid #ECE8DF; transition: transform .9s cubic-bezier(.2,.9,.25,1), opacity .8s; }
.c-marmol .bento > .xv-sec:not(.llego) > .xv-ancho { transform: translateY(40px) rotate(-1.5deg) scale(.96); opacity: 0; }
.c-marmol .b-bienvenida { grid-column: span 4; grid-row: span 2; }
.c-marmol .b-personas { grid-column: span 2; }
.c-marmol .b-lugares { grid-column: span 2; }
.c-marmol .b-itinerario { grid-column: span 3; }
.c-marmol .b-vestimenta { grid-column: span 3; }
.c-marmol .b-regalos { grid-column: span 6; }
.c-marmol .bento > .b-bienvenida > .xv-ancho { display: grid; align-content: center; background: linear-gradient(135deg, #FFFFFF, #F1F6F4); }
.c-marmol .bento > .b-personas > .xv-ancho, .c-marmol .bento > .b-vestimenta > .xv-ancho { border-color: #2F6E62; background: #2F6E62; color: #FFFFFF; --tinta: #FFFFFF; --tinta-2: #E2F0EC; --acento: #F0DDA4; --linea: rgba(255,255,255,.2); }
.c-marmol .b-personas .xv-kicker, .c-marmol .b-vestimenta .xv-kicker { color: #F0DDA4; }
.c-marmol .b-personas, .c-marmol .b-vestimenta { --tinta: #FFFFFF; --tinta-2: #E2F0EC; color: #FFFFFF; }
.c-marmol .b-personas p, .c-marmol .b-personas li, .c-marmol .b-vestimenta p, .c-marmol .b-vestimenta h3, .c-marmol .b-vestimenta .xv-titulo { color: #FFFFFF; }
@media (min-width: 901px) { .c-marmol .bento .b-regalos .e-detalles-2 { grid-template-columns: 1fr 1fr; column-gap: 40px; } }
.c-marmol .bento .e-bien-grid, .c-marmol .bento .e-dos, .c-marmol .bento .e-detalles-2 { grid-template-columns: 1fr; }
.c-marmol .bento .e-lugares { grid-template-columns: 1fr; }
.c-marmol .bento .xv-cab { margin-bottom: 14px; }
.c-marmol .xv-kicker { color: #2F6E62; }
.c-marmol .xv-titulo .xv-script { font-family: "Playfair Display", serif; font-style: italic; font-weight: 900; color: #2F6E62; letter-spacing: -.02em; }
.c-marmol .xv-superficie { background: #F6F4EF; border: 1px solid #ECE8DF; }
.c-marmol .xv-momento time { color: #2F6E62; }
.c-marmol .e-firma { font-family: "Playfair Display", serif; font-style: italic; color: #2F6E62; }
.c-marmol .e-ornamento { width: min(56%, 200px); }
.c-marmol .bento .e-bien-arte { min-height: 0; }
/* fecha: remolino → disco */
.c-marmol .e-fecha-sec { background: #F6F4EF; }
.c-marmol .e-fecha-k { color: #2F6E62; }
.ma-m-remolino { inset: 0; border-radius: 50%; background: conic-gradient(from 0deg, #F6F4EF, #9CC7BD, #F6F4EF, #3F7E72, #F6F4EF, #C9A452, #F6F4EF);
	filter: blur(calc(8px - var(--t1) * 6px)); transform: rotate(calc(var(--m) * 540deg)) scale(calc(1.2 - var(--t1) * .3)); opacity: clamp(0, calc((1 - var(--t2)) * 1.6), 1); }
.ma-m-disco { left: 0; top: 0; width: 100%; opacity: var(--t2); transform: rotate(calc((1 - var(--t2)) * 160deg)) scale(calc(.6 + var(--t2) * .4)); }
.c-marmol .e-dia-caja { padding: 14px 22px; background: rgb(255 255 255 / .86); border-radius: 50%; aspect-ratio: 1; place-content: center; width: 50%; min-width: 150px; }
.c-marmol .e-dia { font-style: italic; font-weight: 900; font-size: clamp(3.2rem, 9vw, 5rem); }
.c-marmol .e-mes { font-family: "Syne", sans-serif; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; color: #2F6E62; font-size: .62rem; margin-top: 4px; }
.ma-cierre-disco { position: relative; display: block; width: min(26vmin, 200px); margin: 0 auto; }
.c-marmol .e-cierre-arte { position: relative; inset: auto; z-index: 0; }
@media (max-width: 760px) {
	.c-marmol { --nombre-tam: clamp(3.8rem, 17vw, 5.4rem); }
	.ma-flores { --w: 34vw; right: -4vw; }
	.c-marmol .bento { padding: 8vh 0; width: calc(100% - 2rem); }
}