/* 159 · After Office — coctelería y networking después del trabajo: ámbar, verde botella y cobre, con luz cálida de bar. Se abre con el vaso: el hielo cae, «clinc», y se sirve el cóctel.
   Portada: la barra con botellas iluminadas y luz cálida que respira (WebGL, modo velas).
   Orden: la carta del bar — cada sección es un cóctel de la carta con su nombre y una rodaja de naranja que llega rodando; el programa es «la hora feliz».
   Fecha: la rodaja de naranja gira y el día queda en su centro. Cierre: la coctelera, el vaso y la naranja. */
.c-after { --display-peso: 800; --nombre-color: #F3E9D7; --titulo-letra: "Syne"; --titulo-peso: 700; --titulo-espacio: -.02em;
	--dia-letra: "Fraunces"; --dia-color: #2A1A0A; --radio: 12px; --vj: 46px; --sombra: 0 18px 24px rgb(0 0 0 / .5); --nombre-tam: clamp(3.6rem, 10vw, 8.6rem);
	--ap-w: min(50vw, 240px); --ap-destello: rgb(227 154 59 / .6); }
.c-after .xv-cielo { display: none; }
.c-after main { background: radial-gradient(80% 40% at 50% 0%, #2A2118, #141414 60%); }
.c-after main > .xv-sec:not(#portada) { background: transparent; }
.c-after .v-velo { background: radial-gradient(46% 38% at 50% 50%, rgb(14 12 10 / .66), transparent 76%); }
/* apertura: el hielo cae en el vaso */
.c-after .ap-cosa:has(.ap-base) .ap-pieza { height: 100% !important; }
.c-after .ap-cosa .ap-base { top: -40%; left: 25%; width: 50% !important; height: 40% !important; z-index: 3; }
html.so-abre .ap-cosa[data-efecto="sirve"] .ap-base { animation: af-hielo .7s cubic-bezier(.5,0,.8,.4) forwards; }
@keyframes af-hielo { to { transform: translateY(150%) rotate(20deg); opacity: 0; } }
html.so-abre .ap-cosa[data-efecto="sirve"] .ap-pieza { animation: af-clinc 1.4s ease .6s forwards; }
@keyframes af-clinc { 0% { transform: none; } 10% { transform: translateY(3%) scale(1.02, .98); } 30% { transform: none; filter: brightness(1.2); } 100% { transform: scale(1.4); opacity: 0; filter: brightness(1.4) blur(2px); } }

.c-after .e-evento { font-family: "Syne", sans-serif; color: #E39A3B; letter-spacing: .4em; font-size: .74rem; }
.c-after .e-logo { color: #D8CCB6; border-color: rgb(243 233 215 / .3); }
.c-after .e-lema { color: #D8CCB6; }
.c-after .e-fecha { color: #D8CCB6; letter-spacing: .1em; }
.c-after .e-nombre { letter-spacing: -.02em; text-shadow: 0 4px 30px rgb(0 0 0 / .8), 0 0 40px rgb(227 154 59 / .3); }
.af-coctelera { --w: min(14vmin, 130px); left: 8vw; bottom: 6vh; --dy: 10vh; --ex: -30vw; --ey: 0px; --ed: .3s; --fd: 8s; --fa: 2px; --fr: 0deg; }
.af-vaso { --w: min(18vmin, 170px); right: 7vw; bottom: 5vh; --dy: 10vh; --ex: 30vw; --ey: 0px; --ed: .5s; --fd: 8s; --fa: 2px; --fr: 0deg; }
.af-hielo { --w: min(12vmin, 110px); right: 9vw; top: 12vh; --r: 12deg; --dy: -12vh; --dr: 30deg; --ex: 30vw; --ey: -20vh; --ed: .65s; --fd: 5s; --fa: 5px; --fr: 4deg; }

/* la carta del bar */
.c-after main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { position: relative; background: linear-gradient(170deg, #1F2A24, #17201B); border: 1px solid rgb(227 154 59 / .3); border-radius: 12px;
	padding: clamp(74px, 8vw, 96px) clamp(24px, 5vw, 64px) clamp(44px, 5vw, 64px); box-shadow: 0 40px 70px -40px rgb(0 0 0 / .9); }
.af-carta { top: 24px; left: clamp(24px, 5vw, 64px); right: clamp(90px, 12vw, 140px); display: flex; align-items: center; gap: 12px; }
.af-carta b { font: 800 clamp(1.1rem, 2.4vw, 1.4rem)/1 "Fraunces", serif; color: #F3E9D7; white-space: nowrap; }
.af-carta i { flex: 1; height: 0; border-bottom: 2px dotted rgb(227 154 59 / .5); }
.af-naranja { top: 12px; right: clamp(20px, 4vw, 40px); width: clamp(56px, 7vw, 76px); transform: translateX(60vw) rotate(540deg); transition: transform 1.6s cubic-bezier(.2,.8,.3,1) .2s; }
.llego > .xv-ancho > .af-naranja { transform: none; }
.c-after .xv-kicker { font-family: "Syne", sans-serif; color: #E39A3B; letter-spacing: .3em; }
.c-after .xv-titulo { color: #F3E9D7; }
.c-after .xv-titulo .xv-script { font-family: "Fraunces", serif; font-style: italic; color: #E39A3B; }
.c-after .xv-superficie { background: rgb(243 233 215 / .05); border: 1px solid rgb(227 154 59 / .2); border-radius: 10px; box-shadow: none; }
.c-after .xv-momento time { color: #E39A3B; font-weight: 600; }
.c-after .e-firma { font-family: "Fraunces", serif; color: #E39A3B; }
.c-after .xv-boton:not(.xv-boton-suave) { background: #D98A2B; color: #141414; border-color: #D98A2B; }
.c-after .e-ornamento { width: min(40%, 150px); }
.c-after .xv-rsvp textarea, .c-after .xv-rsvp input { background: rgb(243 233 215 / .06); color: #F3E9D7; border-color: rgb(227 154 59 / .3); }

/* fecha: la rodaja de naranja gira */
.c-after .e-fecha-k { font-family: "Syne", sans-serif; color: #E39A3B; letter-spacing: .4em; }
.af-m-naranja { inset: 0; width: 100%; opacity: clamp(0, calc(var(--t1) * 2), 1); transform: rotate(calc(var(--t1) * 540deg)) scale(calc(.3 + var(--t1) * .7)); filter: drop-shadow(0 0 40px rgb(227 154 59 / .5)); }
.af-m-disco { inset: 30%; border-radius: 50%; background: radial-gradient(circle, #FFF3DC, #F7D9A8); opacity: var(--t2); transform: scale(calc(.5 + var(--t2) * .5)); box-shadow: 0 0 0 4px rgb(255 255 255 / .6); }
.c-after .e-dia { font-size: clamp(2.6rem, 7.6vw, 4.2rem); }
.c-after .e-mes { font-family: "Syne", sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: #B5530E; font-size: clamp(.66rem, 1.6vw, .8rem); }
.c-after .e-anio { color: #6B4A2A; font-size: .58rem; }

.af-cierre-coctelera, .af-cierre-vaso, .af-cierre-naranja { position: absolute; top: 40px; left: 50%; }
.af-cierre-coctelera { width: min(14vmin, 86px); translate: -150% 0; }
.af-cierre-vaso { width: min(20vmin, 120px); translate: -40% 30px; }
.af-cierre-naranja { width: min(12vmin, 70px); translate: 80% 110px; rotate: 20deg; }
.c-after .e-cierre { padding-top: clamp(280px, 40vh, 330px); }
.c-after .e-cierre .xv-kicker { color: #E39A3B; font-family: "Syne", sans-serif; }

@media (max-width: 760px) {
	.c-after { --nombre-tam: clamp(3rem, 15vw, 4.4rem); }
	.af-coctelera { --w: 20vw; left: 4vw; } .af-vaso { --w: 28vw; right: 2vw; } .af-hielo { --w: 18vw; right: 6vw; top: 9vh; }
	.af-carta b { white-space: normal; }
}