/* =========================================================
   UCM · v12.css — "En escena": vitrina animada de artistas
   Usa los colores de v11 (--v11-gold); en octubre pasa a rojo solo.
   ========================================================= */
.ucm-site .show{position:relative;padding:90px 0 70px;overflow:hidden}
.ucm-site .show-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.ucm-site .show-kicker{font-size:12px;letter-spacing:.34em;text-transform:uppercase;opacity:.7;margin:0}
.ucm-site .show-stage{position:relative;height:min(64vw,620px);min-height:420px}
.ucm-site .show-slide{position:absolute;inset:0;visibility:hidden;pointer-events:none}
.ucm-site .show-slide.is-on{visibility:visible;pointer-events:auto}

/* nombre gigante arriba a la izquierda */
.ucm-site .show-first{position:absolute;left:0;top:0;z-index:3;margin:0;font-size:clamp(56px,11vw,168px);line-height:.85;font-weight:800;letter-spacing:-.04em;color:var(--v11-gold,#C9A24D);clip-path:inset(0 100% 0 0);transform:translateX(-40px)}
.ucm-site .show-slide.is-on .show-first{animation:shFirst 1s cubic-bezier(.2,.8,.2,1) .15s forwards}
@keyframes shFirst{to{clip-path:inset(0 0 0 0);transform:none}}

/* marco del video / portada */
.ucm-site .show-frame{position:absolute;left:24%;right:14%;top:12%;bottom:12%;z-index:2;overflow:hidden;border-radius:4px;background:#111;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:0;transform:scale(.94)}
.ucm-site .show-slide.is-on .show-frame{animation:shFrame .9s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes shFrame{to{opacity:1;transform:none}}
.ucm-site .show-frame img,.ucm-site .show-frame video{width:100%;height:100%;object-fit:cover;display:block}
.ucm-site .show-slide.is-on .show-frame img{animation:shKen 9s ease-out forwards}
@keyframes shKen{from{transform:scale(1.14) translate(2%,1%)}to{transform:scale(1.02) translate(-1%,-1%)}}
.ucm-site .show-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),transparent 45%);pointer-events:none}

/* formas: diamantes y cortes diagonales de UCM */
.ucm-site .show-shapes{position:absolute;inset:0;z-index:1;pointer-events:none}
.ucm-site .show-shapes i{position:absolute;display:block;border:1.5px solid var(--v11-gold,#C9A24D);opacity:0}
.ucm-site .show-shapes .d1{width:140px;height:140px;right:6%;top:4%;transform:rotate(45deg) scale(.6)}
.ucm-site .show-shapes .d2{width:70px;height:70px;left:17%;bottom:4%;transform:rotate(45deg) scale(.6);background:var(--v11-gold,#C9A24D)}
.ucm-site .show-shapes .d3{width:220px;height:220px;right:-2%;bottom:-6%;transform:rotate(45deg) scale(.6)}
.ucm-site .show-shapes .l1,.ucm-site .show-shapes .l2{border:0;height:2px;background:var(--v11-gold,#C9A24D);transform-origin:left center}
.ucm-site .show-shapes .l1{left:20%;right:4%;top:9%;transform:rotate(-8deg) scaleX(0)}
.ucm-site .show-shapes .l2{left:10%;right:30%;bottom:9%;transform:rotate(-8deg) scaleX(0)}
.ucm-site .show-slide.is-on .show-shapes .d1{animation:shDia 1s .35s ease-out forwards,shFloat 7s 1.4s ease-in-out infinite alternate}
.ucm-site .show-slide.is-on .show-shapes .d2{animation:shDia 1s .5s ease-out forwards}
.ucm-site .show-slide.is-on .show-shapes .d3{animation:shDia 1.2s .6s ease-out forwards}
.ucm-site .show-slide.is-on .show-shapes .l1{animation:shLine .9s .25s ease-out forwards}
.ucm-site .show-slide.is-on .show-shapes .l2{animation:shLine .9s .55s ease-out forwards}
@keyframes shDia{to{opacity:.9;transform:rotate(45deg) scale(1)}}
@keyframes shFloat{from{transform:rotate(45deg) translateY(0)}to{transform:rotate(135deg) translateY(12px)}}
@keyframes shLine{to{opacity:.8;transform:rotate(-8deg) scaleX(1)}}

/* nombre completo delgado, abajo a la derecha, montado sobre la foto */
.ucm-site .show-full{position:absolute;right:6%;bottom:2%;z-index:4;margin:0;font-size:clamp(34px,6vw,92px);font-weight:300;letter-spacing:-.02em;line-height:1;color:transparent;-webkit-text-stroke:1.2px #ECE4D6;opacity:0;transform:translateY(30px)}
.ucm-site .show-slide.is-on .show-full{animation:shFull .9s .45s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes shFull{to{opacity:1;transform:none}}
.ucm-site .show-meta{position:absolute;left:24%;bottom:14%;z-index:4;padding:0 0 18px 22px;opacity:0;animation:none}
.ucm-site .show-slide.is-on .show-meta{animation:shFull .8s .7s ease-out forwards}
.ucm-site .show-meta small{display:block;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#ECE4D6;opacity:.85}
.ucm-site .show-meta a{display:inline-block;margin-top:6px;color:#ECE4D6;font-size:clamp(18px,1.8vw,24px);text-decoration:none;border-bottom:1px solid var(--v11-gold,#C9A24D)}
.ucm-site .show-meta a:hover{color:var(--v11-gold,#C9A24D)}

/* controles */
.ucm-site .show-ctrl{display:flex;align-items:center;gap:10px}
.ucm-site .show-ctrl button{width:44px;height:44px;border-radius:50%;background:transparent;border:1px solid var(--v11-line,#2a2618);color:inherit;font:inherit;cursor:pointer;display:grid;place-items:center}
.ucm-site .show-ctrl button:hover,.ucm-site .show-ctrl button:focus-visible{border-color:var(--v11-gold,#C9A24D);color:var(--v11-gold,#C9A24D)}
.ucm-site .show-count{font-size:12px;letter-spacing:.24em;opacity:.7;min-width:62px;text-align:center}
.ucm-site .show-bar{height:2px;background:var(--v11-line,#2a2618);margin-top:26px;position:relative;overflow:hidden}
.ucm-site .show-bar i{position:absolute;inset:0;background:var(--v11-gold,#C9A24D);transform-origin:left;transform:scaleX(0)}
.ucm-site .show-dots{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap;list-style:none;padding:0}
.ucm-site .show-dots button{background:none;border:0;color:inherit;opacity:.5;font:inherit;font-size:12px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;padding:6px 0}
.ucm-site .show-dots button[aria-current="true"]{opacity:1;color:var(--v11-gold,#C9A24D)}

@media (max-width:760px){
  .ucm-site .show{padding:70px 0 50px}
  .ucm-site .show-stage{height:auto;min-height:0;aspect-ratio:3/4}
  .ucm-site .show-frame{left:0;right:0;top:16%;bottom:10%}
  .ucm-site .show-meta{left:0;bottom:12%;padding-left:16px}
  .ucm-site .show-full{right:0;bottom:0}
  .ucm-site .show-shapes .d3{width:120px;height:120px}
}
@media (prefers-reduced-motion:reduce){
  .ucm-site .show-slide.is-on *{animation:none!important}
  .ucm-site .show-first{clip-path:none;transform:none}
  .ucm-site .show-frame,.ucm-site .show-full,.ucm-site .show-meta,.ucm-site .show-shapes i{opacity:1;transform:none}
  .ucm-site .show-shapes .l1,.ucm-site .show-shapes .l2{transform:rotate(-8deg)}
}
/* v17: vitrina más contenida, portadas nunca por encima de su tamaño real */
.ucm-site .show-stage{height:min(46vw,520px);min-height:380px}
.ucm-site .show-frame{left:auto;right:12%;top:8%;bottom:auto;width:min(420px,38vw);aspect-ratio:1/1}
.ucm-site .show-slide.is-on .show-frame img{animation:shKen2 9s ease-out forwards}
@keyframes shKen2{from{transform:scale(1.04)}to{transform:scale(1)}}
.ucm-site .show-meta{left:auto;right:calc(12% + min(420px,38vw) + 24px);bottom:22%;text-align:right;padding:0}
.ucm-site .show-full{right:4%;bottom:0}
@media (max-width:760px){
  .ucm-site .show-stage{height:auto;aspect-ratio:auto;min-height:0;padding-bottom:40px}
  .ucm-site .show-slide{position:relative;display:none}.ucm-site .show-slide.is-on{display:block}
  .ucm-site .show-first{position:relative}
  .ucm-site .show-frame{position:relative;right:auto;left:auto;top:auto;width:78vw;max-width:360px;margin:14px auto 0}
  .ucm-site .show-meta{position:relative;right:auto;bottom:auto;text-align:left;margin-top:14px}
  .ucm-site .show-full{position:relative;right:auto;bottom:auto;margin-top:6px}
}