@charset "UTF-8";
/* apps/myfuture/static/myfuture/scss/home-articles.css
   Artículos de v2: titular del home, temas como píldoras y dos tarjetas con la ilustración arriba. */
.home-articles {
  padding: clamp(70px, 10vh, 110px) 0;
}

.home-articles__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: -20px 0 30px;
}

.v2-chip {
  cursor: pointer;
  padding: 9px 18px;
  border: 1px solid rgba(76, 201, 240, 0.3);
  border-radius: 50px;
  background: transparent;
  color: #F1EDDF;
  font: inherit;
  font-size: 0.95rem;
  letter-spacing: 1px;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.v2-chip:hover,
.v2-chip:focus-visible {
  border-color: #4cc9f0;
}

.v2-chip.is-on {
  background: #c2ff05;
  border-color: #c2ff05;
  color: #03162b;
  font-weight: 700;
}

.v2-panel[hidden] {
  display: none;
}

.home-articles__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.home-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(76, 201, 240, 0.3);
  border-radius: 16px;
  background: rgba(10, 74, 143, 0.4);
  box-shadow: 0 15px 35px rgba(3, 22, 43, 0.8);
  color: #F1EDDF;
  text-decoration: none;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.home-card:hover,
.home-card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 0 25px rgba(76, 201, 240, 0.2), 0 15px 45px rgba(0, 0, 0, 0.6);
}

.home-card__img {
  display: block;
  width: 100%;
  aspect-ratio: 16/8;
  -o-object-fit: cover;
     object-fit: cover;
}

.home-card__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 20px 24px 24px;
}

.home-card__tag {
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #4cc9f0;
}

.home-card__title {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
}

.home-card__meta {
  font-size: 0.8125rem;
  color: #8E887A;
}

.home-articles__more {
  margin-top: 26px;
}

@media (max-width: 768px) {
  .home-articles__cards {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .home-card {
    transition: none;
  }
  .home-card:hover {
    transform: none;
  }
}
/* Tema claro: tarjetas blancas con borde azul claro y sombra en dos niveles; acento azul eléctrico */
html[data-theme=light] .v2-chip {
  color: #0a2540;
  border-color: #b7cbec;
}

html[data-theme=light] .v2-chip:hover {
  border-color: #0050d6;
}

html[data-theme=light] .v2-chip.is-on {
  background: #0050d6;
  border-color: #0050d6;
  color: #fff;
}

html[data-theme=light] .home-card {
  background: #fff;
  border-color: #b7cbec;
  box-shadow: 0 1px 2px rgba(5, 60, 118, 0.08), 0 14px 28px -14px rgba(5, 60, 118, 0.28);
  color: #0a2540;
}

html[data-theme=light] .home-card:hover {
  box-shadow: 0 2px 4px rgba(5, 60, 118, 0.08), 0 22px 40px -16px rgba(0, 80, 214, 0.4);
}

html[data-theme=light] .home-card__tag {
  color: #0050d6;
}

html[data-theme=light] .home-card__meta {
  color: #4f627d;
}/*# sourceMappingURL=home-articles.css.map */