/* ===== Academia Electrocam ===== */
/* Ocultar el título del tema (lo reemplaza nuestro hero) y cualquier sidebar en esta página */
.ec-academia-page h1.entry-title.main_title,
.ec-academia-page .et_post_meta_wrapper > h1.entry-title { display: none !important; }
.ec-academia-page #sidebar,
.ec-academia-page .et_pb_widget_area { display: none !important; }
.ec-academia { max-width: 1200px; margin: 0 auto; padding: 0 20px 64px; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }

/* Encabezado */
.ec-aca-hero { text-align: center; padding: 48px 20px 28px; }
.ec-aca-hero .ec-aca-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  color: #e31c1c; font-weight: 700; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase;
  margin-bottom: 10px;
}
.ec-aca-hero .ec-aca-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #e31c1c; }
.ec-aca-hero h1 { font-size: clamp(30px, 5vw, 46px); font-weight: 800; color: #1a1a1a; margin: 0 0 12px; line-height: 1.1; }
.ec-aca-hero p { color: #666; font-size: 16px; max-width: 640px; margin: 0 auto; line-height: 1.6; }

/* Filtros */
.ec-aca-filters { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 24px 0 36px; }
.ec-aca-chip {
  border: 1px solid #e3e3e3; background: #fff; color: #444;
  padding: 9px 16px; border-radius: 999px; font-size: 13.5px; font-weight: 600; cursor: pointer;
  transition: all .18s ease; white-space: nowrap;
}
.ec-aca-chip:hover { border-color: #e31c1c; color: #e31c1c; }
.ec-aca-chip.is-active { background: #e31c1c; border-color: #e31c1c; color: #fff; box-shadow: 0 4px 12px rgba(227,28,28,.28); }

/* Grid */
.ec-aca-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.ec-aca-card {
  background: #fff; border: 1px solid #ededed; border-radius: 14px; overflow: hidden; cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; display: flex; flex-direction: column;
}
.ec-aca-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0,0,0,.14); border-color: #e0e0e0; }
.ec-aca-thumb { position: relative; aspect-ratio: 16/9; background: #111; overflow: hidden; }
.ec-aca-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.ec-aca-card:hover .ec-aca-thumb img { transform: scale(1.05); }
.ec-aca-play {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.15); transition: background .2s ease;
}
.ec-aca-card:hover .ec-aca-play { background: rgba(0,0,0,.3); }
.ec-aca-play span {
  width: 58px; height: 58px; border-radius: 50%; background: rgba(227,28,28,.95);
  display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0,0,0,.35);
  transition: transform .2s ease;
}
.ec-aca-card:hover .ec-aca-play span { transform: scale(1.08); }
.ec-aca-play span::after { content: ""; border-style: solid; border-width: 10px 0 10px 17px; border-color: transparent transparent transparent #fff; margin-left: 4px; }
.ec-aca-body { padding: 16px 16px 18px; }
.ec-aca-tag { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #e31c1c; margin-bottom: 7px; }
.ec-aca-card h3 { font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0; line-height: 1.35; }

/* Estado vacío */
.ec-aca-empty { text-align: center; padding: 60px 20px; color: #777; }
.ec-aca-empty svg { width: 64px; height: 64px; color: #e31c1c; opacity: .9; margin-bottom: 18px; }
.ec-aca-empty h3 { font-size: 22px; color: #1a1a1a; margin: 0 0 8px; font-weight: 800; }
.ec-aca-empty p { font-size: 15px; max-width: 460px; margin: 0 auto; line-height: 1.6; }

/* Lightbox */
.ec-aca-lightbox { position: fixed; inset: 0; z-index: 100000; background: rgba(8,8,8,.9); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center; padding: 24px; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.ec-aca-lightbox.is-open { opacity: 1; pointer-events: auto; }
.ec-aca-lightbox .ec-aca-player { position: relative; width: 100%; max-width: 900px; aspect-ratio: 16/9; background: #000; border-radius: 12px; overflow: hidden; box-shadow: 0 30px 70px rgba(0,0,0,.5); }
.ec-aca-lightbox .ec-aca-iframe-wrap { position: absolute; inset: 0; }
.ec-aca-lightbox iframe { width: 100%; height: 100%; border: 0; }
.ec-aca-close { position: absolute; top: -46px; right: 0; background: none; border: 0; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; width: 44px; height: 44px; }
.ec-aca-close:hover { color: #e31c1c; }

@media (max-width: 600px) {
  .ec-aca-grid { grid-template-columns: 1fr; }
  .ec-aca-close { top: -42px; }
}
