/* Estilos propios de la portada (index.html).
   Reúne lo que antes estaba repartido en 5 archivos CSS. */

body { overflow-x: clip; }

/* ---- Encabezado ---- */
.encabezado {
  background-image: url("../img/encabezado.webp");
  background-size: auto 100%;
}
.bienvenida {
  background: rgba(255, 255, 255, 0.85);
  padding: 21px;
  border-radius: 21px;
  text-align: center;
  color: #6819e8;
  font-weight: 500;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .round-3.fondito {
    width: 60%;
    margin: 0 auto;
  }
}

/* Animación del logo (antes venía de animate.css completo) */
@keyframes tada {
  0% { transform: scale3d(1, 1, 1); }
  10%, 20% { transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); }
  30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  100% { transform: scale3d(1, 1, 1); }
}
.tada { animation: tada 1s both; }

/* ---- Categorías ---- */
.titulo-categorias {
  background: linear-gradient(90deg, #5f2a9b 0%, #6253c3 29%, #ed53e8 100%);
}
.titulo-categorias h1 {
  font-family: 'Nunito Sans', sans-serif;
  color: #fff;
  text-transform: none;
  font-size: 39px;
  margin-top: 9px;
}
.row a {
  font-size: 21px;
  text-decoration: none;
}
.categorias a:hover { font-weight: bold; }
.tarjetas {
  border: 3px solid #7437d0;
  border-radius: 19px;
  padding: 16px;
  text-align: center;
  height: 100%;
}
.tarjetas:hover { background-color: #ffedff; }
.tarjetas h3 {
  color: #7437d0;
  font-weight: bold;
}

/* ---- Packs / rutinas ---- */
.rutinas { background: #fff0e3; }
.rutinas-titulo {
  font-family: 'Engagement', cursive;
  text-transform: none;
  font-size: 48px;
  font-weight: 400;
  text-align: center;
  padding: 20px;
  color: #b58200;
}
.pack {
  border-radius: 38px;
  padding: 16px;
  text-align: center;
  height: 100%;
  background-color: #fff;
  color: #000;
}
.pack h3 {
  font-weight: bold;
  padding-bottom: 0;
  margin-bottom: 1.5rem;
  color: #000;
}
.pack p { font-weight: 400; }
.pack .clave { margin-top: 1rem; }

/* ---- Pie de página ---- */
.pie { background-color: #4b0f0f; }
footer {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
  text-align: left;
  font: bold 16px sans-serif;
  padding: 55px 25px;
  color: #fff;
}
@media (max-width: 767px) {
  .footer-contacts { margin: 30px 0; }
}
.footer-contacts > div {
  display: flex;
  align-items: center;
}
.footer-contacts p {
  color: #fff;
  margin: 8px 0 0;
}
.footer-contacts a {
  color: #fdfeff;
  text-decoration: none;
  font-size: 16px;
}
.footer-contacts-icon {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #b58200;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin: 10px 15px 10px 0;
}
.footer-contacts-icon svg { width: 13px; height: 13px; fill: #fff; }
span.new-line-span {
  display: block;
  font-weight: normal;
  font-size: 14px;
  line-height: 2;
}
.footer-about h4 {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 20px;
}
.footer-about p {
  line-height: 30px;
  color: #ffbc00;
  font-size: 18px;
  font-weight: normal;
  margin: 0 0 25px;
}
.check {
  width: 15px;
  height: 15px;
  margin-right: 8px;
  vertical-align: -2px;
  fill: none;
  stroke: var(--bs-success);
  stroke-width: 2.5;
}
.social-links {
  margin: 20px 0 25px;
  text-align: center;
}
.social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  background-color: #6819e8;
  border-radius: 2px;
  margin: 0 8px 5px;
}
.social-links svg { width: 20px; height: 20px; fill: #fff; }
.company-name {
  margin-top: 25px;
  color: #8f9296;
  font-size: 11px;
  text-align: right;
}

/* ---- Animaciones al hacer scroll (reemplaza a la librería AOS) ---- */
[data-aos] {
  transition: opacity .5s ease, transform .5s ease;
}
.aos-preparado [data-aos]:not(.aos-visible) { opacity: 0; }
.aos-preparado [data-aos="fade"]:not(.aos-visible) { transform: none; }
.aos-preparado [data-aos="zoom-in"]:not(.aos-visible) { transform: scale(.6); }
.aos-preparado [data-aos="slide-left"]:not(.aos-visible) { transform: translateX(100px); }
.aos-preparado [data-aos="slide-right"]:not(.aos-visible) { transform: translateX(-100px); }
.aos-preparado [data-aos="zoom-in-left"]:not(.aos-visible) { transform: translateX(100px) scale(.6); }
.aos-preparado [data-aos="zoom-in-right"]:not(.aos-visible) { transform: translateX(-100px) scale(.6); }

@media (prefers-reduced-motion: reduce) {
  .tada { animation: none; }
  [data-aos] { transition: none; }
  .aos-preparado [data-aos]:not(.aos-visible) { opacity: 1; transform: none; }
}