/* 83 · Trigal Dorado — scroll horizontal: se camina por el campo. El trigo del fondo se mece con el viento.
   En la fecha las espigas se trenzan en una corona con el día. */
.c-trigal { --display-peso: 400; --nombre-color: #FFFFFF; --titulo-letra: "Fraunces"; --titulo-peso: 900; --titulo-espacio: -.02em; --dia-letra: "Fraunces"; --dia-color: #4A3420;
	--y-letra: "Fraunces"; --y-peso: 400; --y-tam: .3em; --y-color: #FFE7B8; --y-margen: .1em 0 .16em; --radio: 18px; --vj: 54px; --sombra: 0 22px 26px rgb(74 52 32 / .3);
	--nombre-tam: clamp(5rem, 14vw, 11.5rem); --pareja-tam: 1; }
.c-trigal .e-y { font-style: italic; }
.c-trigal .e-evento { color: #FFF3DC; letter-spacing: .5em; font-weight: 700; text-shadow: 0 2px 10px rgb(74 52 32 / .6); }
.c-trigal .e-nombre { line-height: .95; text-shadow: 0 4px 30px rgb(74 52 32 / .55); }
.c-trigal .e-fecha { color: #4A3420; font-weight: 700; background: rgb(255 250 240 / .82); padding: 6px 16px; border-radius: 999px; }
.c-trigal .e-titulos { align-self: start; margin-top: 16vh; }
.c-trigal .e-pista { color: #FFF3DC; }
.tr-espigas-a, .tr-espigas-b { --w: min(26vmin, 260px); bottom: -6vh; --dy: 8vh; --ey: 20vh; --fd: 3.4s; --fa: 0px; --fr: 3deg; }
.tr-espigas-a { left: -2vw; --r: -6deg; --ed: .5s; } .tr-espigas-b { right: -2vw; --r: 8deg; --ed: .7s; --fdel: -1.2s; }
.tr-espigas-a .e-img, .tr-espigas-b .e-img { transform-origin: 50% 100%; }
.c-trigal .so-y { font-family: "Fraunces", serif; font-style: italic; font-size: .5em; color: #8F5A1A; }

/* el camino horizontal */
.c-trigal .h-pista { background: linear-gradient(90deg, #FBF3E3 0%, #F6E3C2 40%, #F3C9A2 75%, #E9A97A 100%); color: #8F5A1A; }
.c-trigal .h-panel { background: transparent; }
.c-trigal .h-panel > .xv-ancho { background: rgb(255 250 240 / .78); border-radius: 26px; padding: clamp(24px, 4vw, 48px); box-shadow: 0 30px 60px -40px rgb(74 52 32 / .45); width: min(100% - 2.5rem, 1040px); }
.c-trigal .h-panel::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22vh; background: url("img/espigas.webp") repeat-x bottom / auto 100%; opacity: .32; pointer-events: none; }
.c-trigal .xv-kicker { color: #8F5A1A; }
.c-trigal .xv-titulo .xv-script { font-family: "Pinyon Script", cursive; font-weight: 400; color: #8F5A1A; font-size: 1.3em; }
.c-trigal .xv-momento time { color: #8F5A1A; }
.c-trigal .xv-superficie { background: #FFFAF0; border-color: rgb(143 90 26 / .2); }
.c-trigal .e-firma { font-family: "Pinyon Script", cursive; color: #8F5A1A; }
.c-trigal .e-ornamento { width: min(60%, 220px); }
.c-trigal main > .xv-sec:not(#portada):not(.h-panel) { background: #FBF3E3; }

/* fecha: espigas → corona */
.c-trigal .e-fecha-sec { background: linear-gradient(180deg, #F3C9A2, #FBF3E3); }
.tr-m-espigas { left: 30%; top: 4%; width: 40%; transform: rotate(calc(var(--t1) * 180deg)) scale(calc(1 - var(--t1) * .4)); opacity: clamp(0, calc((1 - var(--t1)) * 2.5), 1); }
.tr-m-corona { left: 0; top: 1%; width: 100%; opacity: clamp(0, calc(var(--t1) * 2.6 - 1.2), 1); transform: scale(calc(.5 + var(--t2) * .5)) rotate(calc((1 - var(--t2)) * -120deg)); }
.c-trigal .e-dia { font-size: clamp(3.8rem, 10vw, 5.8rem); }
.c-trigal .e-mes { font-family: "Pinyon Script", cursive; color: #8F5A1A; font-size: clamp(2rem, 5vw, 2.8rem); }
.tr-cierre-corona { position: relative; display: block; width: min(30vmin, 220px); margin: 0 auto; }
.c-trigal .e-cierre-arte { position: relative; inset: auto; z-index: 0; }

@media (max-width: 760px) {
	.c-trigal { --nombre-tam: clamp(4.2rem, 20vw, 6rem); }
	.c-trigal .e-titulos { margin-top: 14vh; }
	.tr-espigas-a, .tr-espigas-b { --w: 36vw; }
	.c-trigal .h-panel > .xv-ancho { width: calc(100% - 2rem); padding: 22px 18px; }
}