/* BL-03 · cierre nocturno: tinta, cielo y plancha botánica. */
/* Pie compacto: el texto baja sobre las colinas, el cielo queda arriba.
   El paisaje es una capa de fondo (no pseudo), anclada abajo y con el volcán completo. */
#kc-footer {
  --bl03-footer-floor: 84px;
  isolation: isolate;
  overflow: hidden; /* BL-04: the meteor flew 66px past the right edge, widening the page so iOS pushed the ring off-screen */
  display: flex;
  flex-direction: column;
  min-height: 320px;
  padding-block: 0;
  background-color: #0A0A0B;
  background-image:
    radial-gradient(ellipse 26rem 9.5rem at 50% calc(100% - 9.5rem), rgba(10, 10, 11, 0.84) 0%, rgba(10, 10, 11, 0.62) 50%, rgba(10, 10, 11, 0) 100%),
    url('../../assets/page/bl-footer-noche.webp'),
    radial-gradient(ellipse 8rem 5rem at 21% 37%, rgba(243, 243, 240, 0.035), transparent 76%),
    linear-gradient(153deg, transparent 35%, rgba(243, 243, 240, 0.008) 42%, rgba(243, 243, 240, 0.026) 48%, rgba(243, 243, 240, 0.014) 53%, transparent 61%),
    radial-gradient(ellipse 24rem 13rem at 78% 13%, rgba(243, 243, 240, 0.055), transparent 72%),
    radial-gradient(ellipse 34rem 15rem at 22% 8%, rgba(243, 243, 240, 0.025), transparent 76%);
  background-size: auto, max(1050px, 100vw) auto, auto, auto, auto, auto;
  background-repeat: no-repeat;
  background-position: center, center bottom, center, center, center, center;
}

@media (min-width: 768px) {
  #kc-footer { min-height: 360px; }
}

#kc-footer::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 2.5rem;
  left: calc(50% - 152px);
  width: 26px;
  height: 28px;
  border-radius: 50%;
  background:
    repeating-linear-gradient(126deg, transparent 0 4px, rgba(35, 37, 41, 0.16) 4.3px 4.7px, transparent 5px 8px),
    radial-gradient(ellipse at 31% 27%, #f5f4ef 0%, #ddddda 62%, #b6b8bb 100%);
  -webkit-mask: radial-gradient(circle 12px at 70% 43%, transparent 0 93%, #000 100%);
  mask: radial-gradient(circle 12px at 70% 43%, transparent 0 93%, #000 100%);
  filter: drop-shadow(0 0 5px rgba(243, 243, 240, 0.18)) drop-shadow(0 0 13px rgba(243, 243, 240, 0.08));
  pointer-events: none;
}

#kc-footer .kc-footer__inner {
  position: relative;
  z-index: 1;
  flex: 1 0 auto;
  align-content: end;
  padding-bottom: calc(var(--bl03-footer-floor) + env(safe-area-inset-bottom));
}

#kc-footer .kc-footer__inner::before,
#kc-footer .kc-footer__inner::after,
#kc-footer .kc-footer__mark::before,
#kc-footer .kc-footer__mark::after,
#kc-footer .kc-footer__inner > [data-event-field="eventDate.display"]::before,
#kc-footer .kc-footer__inner > .kc-footer__link::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 50%;
  width: 1px;
  height: 1px;
  transform: translateX(-50%);
  pointer-events: none;
}

/* WebKit paints box-shadow dots reliably below 1px; the diagonal specks stay dim behind copy. */
#kc-footer .kc-footer__inner::before {
  bottom: auto;
  opacity: 0.8;
  background: rgba(243, 243, 240, 0.72);
  box-shadow:
    -46vw 5px 0 rgba(243,243,240,.72), -39vw 12px 0 rgba(243,243,240,.48), -31vw 7px 0 rgba(243,243,240,.62), -24vw 16px 0 rgba(243,243,240,.54),
    -18vw 4px 0 rgba(243,243,240,.62), -11vw 11px 0 rgba(243,243,240,.48), -4vw 6px 0 rgba(243,243,240,.66), 3vw 14px 0 rgba(243,243,240,.46),
    9vw 7px 0 rgba(243,243,240,.6), 17vw 3px 0 rgba(243,243,240,.5), 23vw 12px 0 rgba(243,243,240,.64), 30vw 6px 0 rgba(243,243,240,.44),
    38vw 11px 0 rgba(243,243,240,.58), 46vw 4px 0 rgba(243,243,240,.68), -44vw 18px 0 rgba(243,243,240,.42), -29vw 21px 0 rgba(243,243,240,.5),
    33vw 18px 0 rgba(243,243,240,.43), -13vw 19px 0 rgba(243,243,240,.36),
    -46vw 78px 0 rgba(243,243,240,.64), -40vw 91px 0 rgba(243,243,240,.48), -33vw 73px 0 rgba(243,243,240,.58), -27vw 87px 0 rgba(243,243,240,.42),
    -20vw 76px 0 rgba(243,243,240,.64), -14vw 94px 0 rgba(243,243,240,.52), -7vw 82px 0 rgba(243,243,240,.45), 0vw 90px 0 rgba(243,243,240,.58),
    8vw 75px 0 rgba(243,243,240,.45), 14vw 93px 0 rgba(243,243,240,.58), 21vw 80px 0 rgba(243,243,240,.42), 28vw 90px 0 rgba(243,243,240,.62),
    35vw 75px 0 rgba(243,243,240,.46), 42vw 87px 0 rgba(243,243,240,.58), 48vw 95px 0 rgba(243,243,240,.42),
    -48vw 31px 0 rgba(243,243,240,.5), 48vw 46px 0 rgba(243,243,240,.62), -46vw 61px 0 rgba(243,243,240,.46), 46vw 67px 0 rgba(243,243,240,.56),
    -40vw 50px 0 rgba(243,243,240,.4), 41vw 33px 0 rgba(243,243,240,.5), -37vw 38px 0 rgba(243,243,240,.44), 39vw 58px 0 rgba(243,243,240,.52);
  animation: bl03-footer-twinkle 6.8s ease-in-out -1.2s infinite alternate;
}

/* The Milky Way runs low-opacity from lower-left to upper-right, crossing no text contrast threshold. */
#kc-footer .kc-footer__mark::before {
  width: 0.6px;
  height: 0.6px;
  background: rgba(243, 243, 240, 0.12);
  box-shadow:
    -47vw 86px 0 rgba(243,243,240,.13), -43vw 83px 0 rgba(243,243,240,.12), -39vw 82px 0 rgba(243,243,240,.14), -35vw 77px 0 rgba(243,243,240,.11),
    -31vw 78px 0 rgba(243,243,240,.13), -27vw 73px 0 rgba(243,243,240,.12), -23vw 70px 0 rgba(243,243,240,.15), -19vw 72px 0 rgba(243,243,240,.11),
    -15vw 65px 0 rgba(243,243,240,.14), -11vw 66px 0 rgba(243,243,240,.12), -7vw 63px 0 rgba(243,243,240,.14), -3vw 58px 0 rgba(243,243,240,.1),
    1vw 61px 0 rgba(243,243,240,.14), 5vw 55px 0 rgba(243,243,240,.11), 9vw 55px 0 rgba(243,243,240,.13), 13vw 52px 0 rgba(243,243,240,.12),
    17vw 50px 0 rgba(243,243,240,.15), 21vw 49px 0 rgba(243,243,240,.11), 25vw 47px 0 rgba(243,243,240,.14), 29vw 44px 0 rgba(243,243,240,.12),
    33vw 44px 0 rgba(243,243,240,.14), 37vw 41px 0 rgba(243,243,240,.11), 41vw 38px 0 rgba(243,243,240,.13), 45vw 37px 0 rgba(243,243,240,.1),
    48vw 30px 0 rgba(243,243,240,.13), -44vw 80px 0 rgba(243,243,240,.1), -8vw 60px 0 rgba(243,243,240,.11), 40vw 40px 0 rgba(243,243,240,.12);
  animation: bl03-footer-twinkle 8.1s ease-in-out -4.6s infinite alternate;
}

#kc-footer .kc-footer__inner > [data-event-field="eventDate.display"]::before {
  width: 1.6px;
  height: 1.6px;
  background: rgba(243, 243, 240, 0.74);
  box-shadow:
    -43vw 30px 0 rgba(243,243,240,.72), 46vw 33px 0 rgba(243,243,240,.82), -46vw 53px 0 rgba(243,243,240,.65), 46vw 60px 0 rgba(243,243,240,.76),
    -48vw 67px 0 rgba(243,243,240,.58), 48vw 46px 0 rgba(243,243,240,.82), -41vw 75px 0 rgba(243,243,240,.66), 40vw 66px 0 rgba(243,243,240,.62),
    -38vw 86px 0 rgba(243,243,240,.72), 40vw 81px 0 rgba(243,243,240,.58), -25vw 95px 0 rgba(243,243,240,.62), 25vw 92px 0 rgba(243,243,240,.7);
  animation: bl03-footer-twinkle 7.4s ease-in-out -2.8s infinite alternate;
}

#kc-footer .kc-footer__inner > .kc-footer__link::before {
  width: 1.6px;
  height: 1.6px;
  background: rgba(243, 243, 240, 0.84);
  box-shadow:
    -29vw 10px 0 rgba(243,243,240,.82), 24vw 9px 0 rgba(243,243,240,.74), -10vw 4px 0 rgba(243,243,240,.7), 12vw 14px 0 rgba(243,243,240,.78),
    -47vw 97px 0 rgba(243,243,240,.74), 47vw 99px 0 rgba(243,243,240,.86);
  animation: bl03-footer-twinkle 5.9s ease-in-out -0.4s infinite alternate;
}

/* An extra wide-sky layer gives the 1440px view more than the mobile field. */
#kc-footer .kc-footer__mark::after {
  display: none;
}
@media (min-width: 768px) {
  #kc-footer .kc-footer__mark::after {
    display: block;
    width: 1px;
    height: 1px;
    background: rgba(243, 243, 240, 0.48);
    box-shadow:
      -49vw 25px 0 rgba(243,243,240,.42), -45vw 42px 0 rgba(243,243,240,.54), -42vw 74px 0 rgba(243,243,240,.38), -38vw 12px 0 rgba(243,243,240,.44),
      -34vw 88px 0 rgba(243,243,240,.48), -30vw 29px 0 rgba(243,243,240,.36), -26vw 46px 0 rgba(243,243,240,.52), -22vw 82px 0 rgba(243,243,240,.4),
      -18vw 23px 0 rgba(243,243,240,.46), -14vw 94px 0 rgba(243,243,240,.52), -9vw 33px 0 rgba(243,243,240,.4), -5vw 87px 0 rgba(243,243,240,.48),
      6vw 78px 0 rgba(243,243,240,.42), 10vw 21px 0 rgba(243,243,240,.5), 15vw 89px 0 rgba(243,243,240,.4), 19vw 36px 0 rgba(243,243,240,.52),
      23vw 74px 0 rgba(243,243,240,.42), 27vw 17px 0 rgba(243,243,240,.48), 31vw 52px 0 rgba(243,243,240,.36), 36vw 92px 0 rgba(243,243,240,.54),
      40vw 29px 0 rgba(243,243,240,.42), 44vw 77px 0 rgba(243,243,240,.5), 48vw 11px 0 rgba(243,243,240,.4), -48vw 99px 0 rgba(243,243,240,.46),
      -2vw 26px 0 rgba(243,243,240,.38), 3vw 36px 0 rgba(243,243,240,.42), 8vw 46px 0 rgba(243,243,240,.36), 13vw 64px 0 rgba(243,243,240,.46),
      18vw 26px 0 rgba(243,243,240,.42), 22vw 56px 0 rgba(243,243,240,.38), 28vw 78px 0 rgba(243,243,240,.48), 34vw 36px 0 rgba(243,243,240,.4),
      39vw 45px 0 rgba(243,243,240,.46), 43vw 21px 0 rgba(243,243,240,.38), -41vw 59px 0 rgba(243,243,240,.48), -35vw 66px 0 rgba(243,243,240,.4),
      -28vw 73px 0 rgba(243,243,240,.5), -16vw 53px 0 rgba(243,243,240,.4), 2vw 98px 0 rgba(243,243,240,.46), 46vw 94px 0 rgba(243,243,240,.42);
    animation: bl03-footer-twinkle 9s ease-in-out -5.1s infinite alternate;
  }
}

/* One ivory 90px meteor, with a soft head and a fading tail, crosses every nine seconds. */
#kc-footer .kc-footer__inner::after {
  top: 2rem;
  width: 90px;
  height: 1px;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(243, 243, 240, 0.92) 42%, rgba(243, 243, 240, 0.4) 72%, transparent);
  animation: bl03-footer-shoot 9s ease-in-out infinite;
}

#kc-footer:not(.bl-live) .kc-footer__inner::before,
#kc-footer:not(.bl-live) .kc-footer__mark::before,
#kc-footer:not(.bl-live) .kc-footer__mark::after,
#kc-footer:not(.bl-live) .kc-footer__inner > [data-event-field="eventDate.display"]::before,
#kc-footer:not(.bl-live) .kc-footer__inner > .kc-footer__link::before,
#kc-footer:not(.bl-live) .kc-footer__inner::after,
body.is-gate-locked #kc-footer .kc-footer__inner::before,
body.is-gate-locked #kc-footer .kc-footer__mark::before,
body.is-gate-locked #kc-footer .kc-footer__mark::after,
body.is-gate-locked #kc-footer .kc-footer__inner > [data-event-field="eventDate.display"]::before,
body.is-gate-locked #kc-footer .kc-footer__inner > .kc-footer__link::before,
body.is-gate-locked #kc-footer .kc-footer__inner::after { animation-play-state: paused; }

@keyframes bl03-footer-twinkle {
  from { opacity: 0.45; }
  to { opacity: 1; }
}

@keyframes bl03-footer-shoot {
  0%, 67% { opacity: 0; transform: translate(-45vw, 0.5rem) rotate(-24deg); }
  72% { opacity: 0.9; transform: translate(-3vw, 0) rotate(-24deg); }
  78% { opacity: 0; transform: translate(45vw, -0.5rem) rotate(-24deg); }
  100% { opacity: 0; transform: translate(45vw, -0.5rem) rotate(-24deg); }
}

@media (prefers-reduced-motion: reduce) {
  #kc-footer .kc-footer__inner::before,
  #kc-footer .kc-footer__mark::before,
  #kc-footer .kc-footer__mark::after,
  #kc-footer .kc-footer__inner > [data-event-field="eventDate.display"]::before,
  #kc-footer .kc-footer__inner > .kc-footer__link::before { animation: none; opacity: 0.72; }
  #kc-footer .kc-footer__inner::after { animation: none; opacity: 0; }
}