
:root{
  --azul:#306BA9;
  --naranja:#E16D2B;
  --gris:#8F8F8F;
  --verde:#00A86B;
}

html{ scroll-behavior:smooth; }
*{ box-sizing:border-box }

/* Logo: entrada + pulso + brillo */
.logo-anim{
  display:inline-flex; align-items:center; gap:.5rem;
  animation: logoIn .9s ease-out both, logoPulse 4s ease-in-out infinite;
  filter: drop-shadow(0 0 6px rgba(255,166,0,.4));
}
@keyframes logoIn{ from{opacity:0; transform:translateY(10px) scale(.96)} to{opacity:1; transform:translateY(0) scale(1)} }
@keyframes logoPulse{ 0%,100%{transform: scale(1)} 50%{transform: scale(1.02)} }

/* Títulos con subrayado animado */
.titulo-animado{ position:relative; display:inline-block; color:var(--azul); }
.titulo-animado::after{
  content:""; position:absolute; left:0; bottom:-6px; height:3px; width:100%;
  background:linear-gradient(90deg, var(--azul), var(--naranja));
  transform:scaleX(0); transform-origin:left; transition:transform .5s ease;
}
.titulo-animado.visible::after{ transform:scaleX(1); }

/* Scroll reveal */
.reveal-up{ opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.reveal-up.visible{ opacity:1; transform:translateY(0); }
.reveal-left{ opacity:0; transform:translateX(-30px); transition:opacity .7s ease, transform .7s ease; }
.reveal-left.visible{ opacity:1; transform:translateX(0); }
.reveal-right{ opacity:0; transform:translateX(30px); transition:opacity .7s ease, transform .7s ease; }
.reveal-right.visible{ opacity:1; transform:translateX(0); }

/* Botón con shine */
.btn-shine{ position:relative; overflow:hidden; }
.btn-shine::after{
  content:""; position:absolute; inset:0; left:-70%; width:50%;
  background:linear-gradient(120deg, rgba(255,255,255,.5), rgba(255,255,255,0));
  animation: shine 2.2s infinite;
}
@keyframes shine{ 100%{ left:120%; } }
