/*!************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/Components/HeroBanner/HeroBanner1.module.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************/
/* ── Fondo decorativo ── */
.HeroBanner1_bgCircle1__jZZl7 {
  position: absolute;
  top: -200px;
  left: -200px;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(20, 104, 177, 0.25) 0%, transparent 70%);
  animation: HeroBanner1_drift__yfSuy 12s ease-in-out infinite;
}

.HeroBanner1_bgCircle2__CJthx {
  position: absolute;
  bottom: -250px;
  right: -200px;
  width: 700px;
  height: 700px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(249, 115, 22, 0.12) 0%, transparent 70%);
  animation: HeroBanner1_drift__yfSuy 16s ease-in-out infinite reverse;
}

.HeroBanner1_bgDot__G6RcD {
  position: absolute;
  top: 30%;
  right: 15%;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(249, 115, 22, 0.18);
  animation: HeroBanner1_pulse__Rh4by 5s ease-in-out infinite;
}

/* ── Shapes flotantes imagen ── */
.HeroBanner1_floatCircle1__O2BOi {
  position: absolute;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(20, 104, 177, 0.12);
  right: -60px;
  top: 10%;
  animation: HeroBanner1_float__SmGkT 7s ease-in-out infinite;
}

.HeroBanner1_floatCircle2__DSEYO {
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: rgba(249, 115, 22, 0.1);
  left: -40px;
  bottom: 15%;
  animation: HeroBanner1_float__SmGkT 9s ease-in-out infinite reverse;
}

.HeroBanner1_floatCircle3___Y1Rc {
  position: absolute;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(16, 185, 129, 0.12);
  right: 20%;
  bottom: 5%;
  animation: HeroBanner1_pulse__Rh4by 4s ease-in-out infinite;
}

/* ── Tarjeta imagen ── */
.HeroBanner1_imageCard__KtGk8 {
  animation: HeroBanner1_cardFloat__Jc53o 10s ease-in-out infinite;
}

/* ── Keyframes ── */
@keyframes HeroBanner1_float__SmGkT {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-18px); }
}

@keyframes HeroBanner1_pulse__Rh4by {
  0%, 100% { transform: scale(1);    opacity: 0.5; }
  50%       { transform: scale(1.2); opacity: 0.9; }
}

@keyframes HeroBanner1_drift__yfSuy {
  0%, 100% { transform: translate(0, 0); }
  50%       { transform: translate(30px, -30px); }
}

@keyframes HeroBanner1_cardFloat__Jc53o {
  0%, 100% { transform: translateY(0px);  box-shadow: 0 30px 80px rgba(0,0,0,0.4); }
  50%       { transform: translateY(-8px); box-shadow: 0 40px 90px rgba(0,0,0,0.45); }
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .HeroBanner1_bgCircle1__jZZl7, .HeroBanner1_bgCircle2__CJthx { display: none; }
  .HeroBanner1_floatCircle1__O2BOi, .HeroBanner1_floatCircle2__DSEYO, .HeroBanner1_floatCircle3___Y1Rc { display: none; }
  @keyframes HeroBanner1_cardFloat__Jc53o {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-4px); }
  }
}