/* CREA Studio · Colibrí en la intro (oct 2026). Archivo aditivo: no toca hero, logo ni menú.
   Solo aparece en la intro completa (primera página de la visita). En la intro corta no sale. */
.ct-intro-stage { position: relative; display: block; line-height: 0; }
.ct-intro .ct-bird {
  position: absolute; z-index: 2; pointer-events: none;
  width: 56%; aspect-ratio: 1 / 1;
  right: -40%; top: -100%;
}
.ct-intro .ct-bird-fly, .ct-intro .ct-bird-bob { position: absolute; inset: 0; }
.ct-intro .ct-bird-fly { animation: ctb-fly 2.7s cubic-bezier(.2,.7,.2,1) both; will-change: transform, opacity; }
.ct-intro .ct-bird-bob { animation: ctb-bob 1.1s ease-in-out infinite alternate; }
.ct-intro .ct-bird img {
  position: absolute; display: block; height: auto; max-width: none;
  opacity: 1; transform: none; animation: none; object-fit: contain;
}
.ct-intro .ct-bird img.ct-bb, .ct-intro .ct-bird img.ct-bb-blink { left: 19.936%; top: 10.447%; width: 70.175%; z-index: 2; }
.ct-intro .ct-bird img.ct-bb-blink { z-index: 3; opacity: 0; animation: ctb-blink 2.7s linear both; }
.ct-intro .ct-bird img.ct-bw-l {
  left: 3.493%; top: 7.895%; width: 47.512%; z-index: 4;
  transform-origin: 78.25% 69.41%;
  animation: ctb-flap-l .13s ease-in-out infinite alternate;
}
.ct-intro .ct-bird img.ct-bw-r {
  left: 61.579%; top: 20.284%; width: 37.703%; z-index: 1;
  transform-origin: 23.86% 67.89%;
  animation: ctb-flap-r .13s ease-in-out infinite alternate;
}
/* Núcleo del pecho que late */
.ct-intro .ct-bird-core {
  position: absolute; z-index: 5; left: 61.8%; top: 56.2%; width: 13%; aspect-ratio: 1/1;
  transform: translate(-50%,-50%); border-radius: 50%;
  background: radial-gradient(circle, rgba(255,90,80,.95) 0%, rgba(255,20,10,.45) 35%, rgba(255,0,0,0) 70%);
  mix-blend-mode: screen; animation: ctb-core .9s ease-in-out infinite alternate;
}
@keyframes ctb-flap-l { from { transform: rotate(4deg); } to { transform: rotate(-34deg) scaleY(.92); } }
@keyframes ctb-flap-r { from { transform: rotate(-4deg); } to { transform: rotate(30deg) scaleY(.92); } }
@keyframes ctb-bob { from { transform: translateY(-3%); } to { transform: translateY(3%); } }
@keyframes ctb-core { from { opacity: .35; transform: translate(-50%,-50%) scale(.8); } to { opacity: 1; transform: translate(-50%,-50%) scale(1.15); } }
/* Vuelo: entra desde abajo a la izquierda (el colibrí mira a la derecha), pasa por encima del logo,
   se posa en la esquina superior derecha y sale disparado hacia arriba a la derecha */
@keyframes ctb-fly {
  0%   { opacity: 0; transform: translate(-330%, 190%) rotate(16deg) scale(.6); }
  6%   { opacity: 1; }
  20%  { transform: translate(-185%, -25%) rotate(-4deg) scale(.82); }
  30%  { transform: translate(-60%, -42%) rotate(-8deg) scale(.95); }
  38%  { transform: translate(0, 0) rotate(0) scale(1); }
  70%  { opacity: 1; transform: translate(0, 0) rotate(0) scale(1); }
  76%  { transform: translate(-6%, 6%) rotate(-8deg) scale(1); }
  90%  { opacity: 1; transform: translate(260%, -320%) rotate(18deg) scale(.5); }
  100% { opacity: 0; transform: translate(260%, -320%) rotate(18deg) scale(.5); }
}
/* Parpadeo: dos veces mientras está quieto junto al logo */
@keyframes ctb-blink {
  0%, 45% { opacity: 0; } 46%, 49% { opacity: 1; } 50%, 60% { opacity: 0; } 61%, 63% { opacity: 1; } 64%, 100% { opacity: 0; }
}
/* Intro completa más larga para que el colibrí luzca (antes 1,55 s) */
.ct-intro:not(.ct-intro--quick) { animation-duration: 2.7s; }
.ct-intro:not(.ct-intro--quick) img.ct-intro-logo { animation-duration: 2.7s; }
/* Intro corta (al navegar): logo + colibrí FIJO en su lugar, sin aleteo ni vuelo; aparece y se va junto con el logo.
   Usa las mismas piezas de la intro completa (ya quedaron en caché), así que no descarga nada nuevo. */
.ct-intro.ct-intro--quick .ct-bird { animation: ct-logo-in-quick .7s ease-out both; }
.ct-intro.ct-intro--quick .ct-bird-fly,
.ct-intro.ct-intro--quick .ct-bird-bob,
.ct-intro.ct-intro--quick .ct-bird img,
.ct-intro.ct-intro--quick .ct-bird-core { animation: none !important; transform: none; }
.ct-intro.ct-intro--quick .ct-bird img.ct-bb-blink { opacity: 0; }
.ct-intro.ct-intro--quick .ct-bird-core { transform: translate(-50%,-50%); opacity: .8; }

/* Fondo semitransparente (opción): la página se ve oscurecida y desenfocada detrás;
   un halo oscuro detrás del logo asegura que las letras blancas siempre se lean. */
.ct-intro.ct-intro--semi { background: rgba(5,5,7,.58); -webkit-backdrop-filter: blur(9px) saturate(.8); backdrop-filter: blur(9px) saturate(.8); }
.ct-intro.ct-intro--semi .ct-intro-stage::before {
  content: ""; position: absolute; z-index: 0; left: 50%; top: 50%;
  width: 230%; height: 420%; transform: translate(-50%,-50%); pointer-events: none;
  background: radial-gradient(closest-side, rgba(5,5,7,.92) 0%, rgba(5,5,7,.75) 45%, rgba(5,5,7,0) 100%);
}
.ct-intro.ct-intro--semi img.ct-intro-logo { position: relative; z-index: 1; }

/* Colibrí fijo junto al logo del menú */
.cg-logo { gap: 0; }
body.crea-public.crea-public.crea-public .cg-logo img.cg-logo-bird { width: auto !important; height: 46px !important; max-width: none !important; max-height: none !important; flex: none; display: block; margin-right: -4px; position: relative; z-index: 2; }
@media (max-width: 767px) { body.crea-public.crea-public.crea-public .cg-logo img.cg-logo-bird { height: 40px !important; } }
@media (max-width: 767px) {
  .ct-intro .ct-bird { width: 58%; right: -12%; top: -138%; }
}
@media (prefers-reduced-motion: reduce) { .ct-intro .ct-bird { display: none; } }

/* Colibrí también en el menú desplegable (celular): mismo tamaño y lugar que en la barra */
html body .cg-panel__top img.cg-panel__bird {
  position: absolute; z-index: 2; display: block; object-fit: contain;
  left: var(--cg-panel-bird-left, 20px); top: var(--cg-panel-bird-top, 9px);
  width: var(--cg-panel-bird-width, 43px) !important; height: var(--cg-panel-bird-height, 40px) !important;
  max-width: none !important; max-height: none !important;
}