/* 120 · Escudo y Monograma — boda heráldica en marino, peltre y marfil. Sobre marino con forro de damasco y una medalla de peltre que gira y se suelta.
   Portada: el escudo vacío con las iniciales grabadas en relieve; la luz rasante pasa por el papel (WebGL, modo rayos).
   Orden: el linaje — cada sección va bajo una hoja de papel vegetal que se levanta como un calco; un filete doble enmarca toda la invitación.
   Fecha: el escudo se parte en cuatro cuarteles y el día queda en el centro. Cierre: el escudo con las dos iniciales entrelazadas. */
.c-escudo { --display-peso: 500; --nombre-color: #1C2A44; --titulo-letra: "Cinzel"; --titulo-peso: 500; --titulo-espacio: .08em; --titulo-mayus: none;
	--dia-letra: "Cormorant SC"; --dia-color: #1C2A44; --y-letra: "EB Garamond"; --y-color: #8C6F35; --y-tam: .5em; --pareja-tam: .8;
	--radio: 2px; --vj: 54px; --sombra: 0 14px 18px rgb(28 42 68 / .2); --nombre-tam: clamp(3.2rem, 7.6vw, 6.6rem); --titulos-dy: -4vh; }
.c-escudo .xv-cielo { display: none; }
.c-escudo main { background: radial-gradient(120% 60% at 50% 0%, #FBF9F4, #F5F1E8 55%, #EFEAE0); }
.c-escudo main > .xv-sec:not(#portada) { background: transparent; }
.c-escudo .v-velo { background: radial-gradient(52% 44% at 50% 50%, rgb(251 249 244 / .78), transparent 76%); }
/* el filete doble que enmarca toda la invitación */
.c-escudo.cel::after { content: ""; position: fixed; inset: 10px; z-index: 40; pointer-events: none; border: 3px double rgb(140 111 53 / .55); opacity: 0; transition: opacity 1.2s ease .6s; }
html.e-abierto .c-escudo.cel::after { opacity: 1; }

/* portada */
.c-escudo .e-evento { font-family: "Cinzel", serif; color: #8C6F35; letter-spacing: .42em; font-size: .78rem; }
.c-escudo .e-fecha { font-family: "Cinzel", serif; letter-spacing: .16em; font-size: .82rem; color: #46506A; }
.c-escudo .e-nombre { text-shadow: 0 1px 0 #FFFFFF, 0 -1px 0 rgb(28 42 68 / .18); }
.ec-escudo { --w: min(22vmin, 200px); left: calc(50% - min(11vmin, 100px)); top: 5vh; --dy: -10vh; --ds: -.1; --ex: 0px; --ey: -20vh; --ed: .3s; --fd: 9s; --fa: 3px; --fr: 0deg; }
.ec-escudo .e-img { filter: drop-shadow(0 10px 14px rgb(28 42 68 / .16)); }
.ec-ini { position: absolute; left: 0; right: 0; top: 30%; display: flex; justify-content: center; align-items: baseline; gap: .12em; font: 600 calc(var(--w) * .22)/1 "Cormorant SC", serif; color: #EDE7DA;
	text-shadow: -1px -1px 0 rgb(28 42 68 / .28), 1px 1px 0 #FFFFFF; letter-spacing: .02em; clip-path: inset(0 100% 0 0); transition: clip-path 1.6s cubic-bezier(.6,0,.3,1) 1.2s; }
.ec-ini i { font: italic 400 .6em/1 "EB Garamond", serif; color: #B59A5B; text-shadow: none; }
html.e-abierto .ec-ini { clip-path: inset(0 0 0 0); }
.ec-ramas { --w: min(36vmin, 320px); left: calc(50% - min(18vmin, 160px)); bottom: 1vh; --dy: 8vh; --ex: 0px; --ey: 20vh; --ed: .5s; --fd: 8s; --fa: 4px; --fr: 0deg; opacity: .9; }

/* secciones: hojas de papel marfil con un filete fino; el papel vegetal las cubre y se levanta */
.c-escudo main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { background: #FBF9F4; padding: clamp(32px, 5vw, 62px) clamp(22px, 5vw, 62px);
	box-shadow: inset 0 0 0 10px #FBF9F4, inset 0 0 0 11px rgb(28 42 68 / .22), 0 30px 60px -40px rgb(28 42 68 / .45); }
.c-escudo .xv-kicker { font-family: "Cinzel", serif; color: #8C6F35; letter-spacing: .34em; }
.c-escudo .xv-titulo { color: #1C2A44; }
.c-escudo .xv-titulo .xv-script { font-family: "EB Garamond", serif; font-style: italic; font-weight: 400; color: #8C6F35; text-transform: none; }
.c-escudo .xv-superficie { background: #F5F1E8; border: 1px solid rgb(28 42 68 / .14); border-radius: 2px; box-shadow: none; }
.c-escudo .xv-momento time { font-family: "Cinzel", serif; color: #8C6F35; letter-spacing: .06em; }
.c-escudo .e-firma { font-family: "EB Garamond", serif; font-style: italic; color: #8C6F35; }
.c-escudo .xv-boton:not(.xv-boton-suave) { background: #1C2A44; color: #F5F1E8; border-color: #1C2A44; border-radius: 2px; letter-spacing: .14em; }
.c-escudo .xv-boton-suave { border-radius: 2px; }
.c-escudo .e-ornamento { width: min(56%, 220px); }

/* fecha: el escudo se parte en cuatro cuarteles */
.c-escudo .e-fecha-k { font-family: "Cinzel", serif; color: #8C6F35; letter-spacing: .4em; }
.ec-cuartel { inset: 2% 12%; opacity: clamp(0, calc(var(--t1) * 1.8), 1); transform: translate(calc(var(--sx) * var(--t2) * 16%), calc(var(--sy) * var(--t2) * 14%)) scale(calc(.8 + var(--t1) * .2)); }
.ec-cuartel img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 16px rgb(28 42 68 / .14)); }
.ec-q1 { --sx: -1; --sy: -1; clip-path: inset(0 50% 50% 0); } .ec-q2 { --sx: 1; --sy: -1; clip-path: inset(0 0 50% 50%); }
.ec-q3 { --sx: -1; --sy: 1; clip-path: inset(50% 50% 0 0); } .ec-q4 { --sx: 1; --sy: 1; clip-path: inset(50% 0 0 50%); }
.ec-m-aro { inset: 26%; border-radius: 50%; border: 3px double rgb(140 111 53 / .7); opacity: var(--t2); transform: scale(calc(.6 + var(--t2) * .4)) rotate(calc(var(--t2) * 90deg)); }
.c-escudo .e-dia { font-weight: 600; font-size: clamp(5rem, 15vw, 8.4rem); }
.c-escudo .e-mes { font-family: "Cinzel", serif; text-transform: uppercase; letter-spacing: .3em; font-size: clamp(.9rem, 2.4vw, 1.25rem); color: #8C6F35; }
.c-escudo .e-anio { color: #46506A; }

/* cierre: el escudo con las iniciales entrelazadas */
.ec-cierre { position: absolute; left: 50%; top: 4%; width: min(32vmin, 230px); translate: -50% 0; }
.ec-cierre img { width: 100%; height: auto; filter: drop-shadow(0 18px 22px rgb(28 42 68 / .18)); }
.ec-ini-fin { position: absolute; font-size: min(7vmin, 52px); top: 29%; clip-path: none; color: #E9E2D2; }
.c-escudo .e-cierre { padding-top: clamp(230px, 34vh, 300px); }
.c-escudo .e-cierre .xv-kicker { font-family: "Cinzel", serif; color: #8C6F35; }

@media (max-width: 760px) {
	.c-escudo { --nombre-tam: clamp(3rem, 14vw, 4.4rem); }
	.ec-escudo { --w: 34vw; left: 33vw; top: 9vh; }
	.ec-ramas { --w: 56vw; left: 22vw; bottom: 3vh; }
	.c-escudo.cel::after { inset: 6px; }
	.c-escudo main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { padding: 40px 24px; }
}

/* Escudo entero: el relieve enmarca la fecha sin cortes rectangulares. */
.ec-completo { --sx:0; --sy:0; clip-path:none; }

.c-escudo .e-dia { line-height:1; }
.c-escudo .e-mes { margin-top:.1em; }
