/* Renovación visual 2026-10-06: botón de acción (Lemon Lime), cuadrícula bento y movimiento sutil.
   Paleta: Velvet Orchid #5c2679 · Jungle Teal #26795c · Fresh Sky #4ea5d9 · Celadon #aedcc0 · Lemon Lime #c5e063 */

/* Botón principal de inscripción: Lemon Lime con texto oscuro (contraste alto) y brillo suave */
.btn.btn-cta, .community .btn.btn-cta, .featured .btn.btn-cta, .community-wide .btn.btn-cta, .form .btn.btn-cta {
  background: #c5e063 !important;
  color: #232f2b !important;
  border-color: transparent !important;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(197, 224, 99, .55) !important;
  transition: transform .2s ease, box-shadow .25s ease, background-color .2s ease;
}
.btn.btn-cta:hover, .community .btn.btn-cta:hover, .featured .btn.btn-cta:hover, .community-wide .btn.btn-cta:hover, .form .btn.btn-cta:hover {
  background: #d3ec72 !important;
  color: #232f2b !important;
  box-shadow: 0 0 0 4px rgba(197, 224, 99, .35), 0 12px 28px rgba(197, 224, 99, .75) !important;
}

/* Cuadrícula bento */
.bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(150px, auto); gap: 16px; margin-top: 34px; }
.bento-tile { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 24px; border-radius: 26px; overflow: hidden; color: #232f2b; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; isolation: isolate; }
.bento-tile:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(35, 47, 43, .18); }
.bento-tile:focus-visible { outline: 3px solid #5c2679; outline-offset: 3px; }
.bento-tile .bt-label { font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.bento .bento-tile h3 { margin: 0; font-family: Alegreya, Georgia, serif; font-size: 1.55rem; line-height: 1.05; letter-spacing: -.03em; color: inherit !important; }
.bento-tile p { margin: 0; font-size: .88rem; line-height: 1.45; max-width: 36ch; }
.bento-tile .bt-go { margin-top: 8px; font-size: .84rem; font-weight: 800; }
.bento-tile .bt-go::after { content: " →"; transition: margin-left .2s ease; }
.bento-tile:hover .bt-go::after { margin-left: 4px; }
.bento-tile::before { content: ""; position: absolute; z-index: -1; right: -40px; top: -40px; width: 150px; height: 150px; border-radius: 50%; background: rgba(255, 255, 255, .16); }

.bt-comunidades { grid-column: 1 / 3; grid-row: 1 / 3; background: #5c2679; color: #f2f2f2; }
.bt-comunidades h3 { font-size: clamp(2.1rem, 4vw, 3.1rem); }
.bt-comunidades .bt-big { font-family: Alegreya, Georgia, serif; font-size: clamp(4.5rem, 10vw, 7rem); line-height: .85; color: #c5e063; letter-spacing: -.05em; }
.bt-comunidades p { font-size: 1rem; }
.bt-miembros { grid-column: 3; grid-row: 1; background: #c5e063; }
.bt-miembros .bt-num { font-family: Alegreya, Georgia, serif; font-size: 2.9rem; font-weight: 800; line-height: .9; letter-spacing: -.05em; }
.bt-cert { grid-column: 4; grid-row: 1 / 3; background: #26795c; color: #f2f2f2; }
.bt-cert::before { background: rgba(174, 220, 192, .22); }
.bt-webinars { grid-column: 3; grid-row: 2; background: #4ea5d9; color: #0f2b3d; }
.bt-recursos { grid-column: 1; grid-row: 3; background: #aedcc0; }
.bt-congreso { grid-column: 2 / 4; grid-row: 3; background: linear-gradient(120deg, #5c2679 0%, #26795c 100%); color: #f2f2f2; }
.bt-congreso .bt-date { display: inline-flex; align-self: flex-start; padding: 5px 12px; border-radius: 999px; background: #c5e063; color: #232f2b; font-size: .74rem; font-weight: 800; }
.bt-blog { grid-column: 4; grid-row: 3; background: #fff; border: 1px solid #cfe0d9; color: #5c2679; }
.bt-blog p { color: #58706a; }
.bt-webinars, .bt-recursos { color: #232f2b; }
.bt-webinars { color: #0f2b3d; }
.bt-blog::before { background: rgba(78, 165, 217, .14); }

@media (max-width: 900px) {
  .bento { grid-template-columns: repeat(2, 1fr); }
  .bt-comunidades { grid-column: 1 / 3; grid-row: auto; min-height: 280px; }
  .bt-miembros, .bt-cert, .bt-webinars, .bt-recursos, .bt-blog { grid-column: auto; grid-row: auto; }
  .bt-congreso { grid-column: 1 / 3; grid-row: auto; min-height: 190px; }
}
@media (max-width: 560px) {
  .bento { grid-template-columns: 1fr; }
  .bt-comunidades, .bt-congreso { grid-column: auto; }
}

/* Movimiento sutil: aparecer al hacer scroll (solo si hay JavaScript y no se pidió menos movimiento) */
.fx { opacity: 0; transform: translateY(20px); transition: opacity .55s ease, transform .55s ease; transition-delay: var(--fx-delay, 0s); }
.fx.fx-in { opacity: 1; transform: none; }
.bento-tile.fx.fx-in:hover { transform: translateY(-5px); transition-delay: 0s; }
.fx-confetti { position: fixed; inset: 0; z-index: 9999; pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .fx { opacity: 1 !important; transform: none !important; }
}

/* Fresh Sky (#4ea5d9): botones secundarios, bordes de tarjetas de cursos y blog, filtros del catálogo */
.btn.btn-secondary { border: 2px solid #4ea5d9; color: #0f3a55; background: transparent; box-shadow: 0 6px 16px rgba(78, 165, 217, .3); }
.btn.btn-secondary:hover { background: #4ea5d9; color: #0f2b3d; border-color: #4ea5d9; box-shadow: 0 8px 20px rgba(78, 165, 217, .5); }
.course .course-cta { background: #4ea5d9 !important; color: #0f2b3d !important; box-shadow: 0 6px 16px rgba(78, 165, 217, .4) !important; transition: transform .2s ease, box-shadow .2s ease; }
.course .course-cta:hover { transform: translateY(-2px); box-shadow: 0 0 0 4px rgba(78, 165, 217, .25), 0 10px 22px rgba(78, 165, 217, .55) !important; }
.course, .post, .webinar { border: 2px solid #4ea5d9 !important; }
.course:hover, .post:hover { box-shadow: 0 16px 34px rgba(78, 165, 217, .3) !important; }
.filters select { border: 2px solid #4ea5d9 !important; }
.filters select:focus-visible { outline-color: #4ea5d9 !important; }