/* ============================================================
   FOMCI Moodle Pro - Hero + Programas Carousel (professional)
   Usa los scripts del theme WordPress (GSAP/SplitText/Swiper).
   ============================================================ */

:root {
  --fomci-green: #95A73B;
  --fomci-magenta: #A03A8E;
  --fomci-purple: #814895;
  --fomci-navy: #202F5A;
}

/* Ocultar contenedores originales transformados */
.fomci-hide { display: none !important; }

/* ================= HERO ================= */
.block_cocoon_slider_6 {
  background: linear-gradient(115deg, #FFFFFF 0%, #F5F5F5 100%);
}
.block_cocoon_slider_6 .ccnBlockContent,
.block_cocoon_slider_6 .home1-mainslider,
.block_cocoon_slider_6 .banner-style-one { background: transparent !important; }

.fomci-hero {
  position: relative;
  overflow: hidden;
  padding: 64px 0 96px;
  background: radial-gradient(1200px 500px at 85% -10%, rgba(149,167,59,.10), transparent 60%),
              linear-gradient(115deg, #FFFFFF 0%, #F5F5F5 100%);
}
.fomci-hero-glow {
  position: absolute;
  top: -140px; right: -100px;
  width: 480px; height: 480px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(160,58,142,.08), transparent 65%);
  filter: blur(20px);
  pointer-events: none;
}
.fomci-hero-inner {
  display: flex;
  align-items: center;
  gap: 56px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
  z-index: 1;
}
.fomci-hero-text { flex: 1 1 52%; }
.fomci-hero-media { flex: 1 1 48%; position: relative; padding: 0 22px 22px 0; }

.fomci-hero-eyebrow {
  display: inline-block;
  margin: 0 0 20px;
  padding: 8px 16px;
  background: rgba(149,167,59,.12);
  border: 1px solid rgba(149,167,59,.3);
  border-radius: 999px;
  color: var(--fomci-green);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.fomci-hero-title {
  max-width: 640px;
  margin: 0 0 22px;
  color: var(--fomci-navy);
  font-size: clamp(2.1rem, 4.4vw, 3.4rem);
  font-weight: 700;
  line-height: 1.12;
}
.fomci-hero-title .char { display: inline-block; will-change: transform, opacity; }
.fomci-hero-sub {
  max-width: 540px;
  margin: 0 0 30px;
  color: #555;
  font-size: 1.05rem;
  line-height: 1.75;
}
.fomci-hero-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.fomci-hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 14px 30px;
  border: 2px solid var(--fomci-green);
  border-radius: 6px;
  background: var(--fomci-green);
  color: #fff;
  font-size: .96rem;
  font-weight: 700;
  text-decoration: none;
  transition: all .25s ease;
  box-shadow: 0 10px 24px rgba(149,167,59,.28);
}
.fomci-hero-cta:hover {
  transform: translateY(-2px);
  background: var(--fomci-magenta);
  border-color: var(--fomci-magenta);
  box-shadow: 0 14px 30px rgba(160,58,142,.3);
  color: #fff;
}
.fomci-hero-tag {
  color: var(--fomci-magenta);
  font-weight: 700;
  font-size: .95rem;
}

.fomci-hero-accent {
  position: absolute;
  top: 22px; right: 0; bottom: 0; left: 22px;
  background: var(--fomci-green);
  border-radius: 0 0 0 72px;
  z-index: 0;
  opacity: .92;
}
.fomci-hero-img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  min-height: 400px;
  max-height: 460px;
  object-fit: cover;
  border-radius: 0 0 0 72px;
  box-shadow: 0 24px 50px rgba(32,47,90,.18);
}

@media (max-width: 991.98px) {
  .fomci-hero { padding: 44px 0 68px; }
  .fomci-hero-inner { flex-direction: column-reverse; gap: 40px; }
  .fomci-hero-media { width: 100%; flex: 1 1 auto; }
  .fomci-hero-img { min-height: 340px; max-height: 400px; }
}
@media (max-width: 575.98px) {
  .fomci-hero-media { padding: 0 10px 10px 0; }
  .fomci-hero-accent { top: 10px; left: 10px; border-radius: 0 0 0 44px; }
  .fomci-hero-img { min-height: 260px; border-radius: 0 0 0 44px; }
  .fomci-hero-cta { width: 100%; }
}

/* ================= PROGRAMAS CAROUSEL ================= */
.fomci-programas {
  padding: 72px 0 84px;
  background: linear-gradient(180deg, #F7F7F5 0%, #fff 100%);
  position: relative;
}
.fomci-prog-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 44px;
  flex-wrap: wrap;
}
.fomci-prog-eyebrow {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--fomci-green);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.fomci-prog-heading h2 {
  margin: 0;
  color: var(--fomci-navy);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
}
.fomci-prog-all {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--fomci-green);
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: all .25s ease;
}
.fomci-prog-all:hover { color: var(--fomci-magenta); border-color: var(--fomci-magenta); }

.fomci-swiper { padding: 6px 6px 26px; overflow: visible; }
.fomci-swiper .swiper-slide { height: auto; }

.fomci-prog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 22px;
  overflow: hidden;
  text-decoration: none !important;
  box-shadow: 0 6px 22px rgba(32,47,90,.08);
  transition: transform .38s cubic-bezier(.22,.61,.36,1), box-shadow .38s cubic-bezier(.22,.61,.36,1), border-color .38s cubic-bezier(.22,.61,.36,1);
  border: 1px solid rgba(32,47,90,.06);
  isolation: isolate;
}
.fomci-prog-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  background: linear-gradient(90deg, var(--fomci-green), var(--fomci-magenta));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s cubic-bezier(.22,.61,.36,1);
  z-index: 3;
}
.fomci-prog-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 22px 48px rgba(32,47,90,.18);
  border-color: transparent;
}
.fomci-prog-card:hover::after { transform: scaleX(1); }

/* Media: muestra la imagen del banner COMPLETA (sin cortes), con un fondo
   desenfocado derivado de la misma imagen para rellenar los bordes. */
.fomci-prog-media {
  position: relative;
  aspect-ratio: 16 / 11;
  min-height: 240px;
  max-height: 300px;
  background-color: #EFF1E9;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  transition: transform .6s cubic-bezier(.22,.61,.36,1);
}
/* Backdrop desenfocado rellena los bordes de la imagen completa */
.fomci-prog-media::before {
  content: "";
  position: absolute;
  inset: -24px;
  background: inherit;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: blur(18px) saturate(1.1);
  opacity: .5;
  z-index: 0;
}
.fomci-prog-card:hover .fomci-prog-media {
  transform: scale(1.03);
}
/* Gradiente sutil inferior para legibilidad del icono */
.fomci-prog-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(32,47,90,.06) 0%, rgba(32,47,90,0) 45%, rgba(32,47,90,.18) 100%);
  pointer-events: none;
}
/* Etiqueta superior (badge) sobre la imagen */
.fomci-prog-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border-radius: 999px;
  background: var(--fomci-green);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1.2;
  box-shadow: 0 6px 16px rgba(149,167,59,.32);
}
.fomci-prog-icon {
  position: absolute;
  right: 22px;
  bottom: -26px;
  z-index: 2;
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--fomci-green), #7c8a2e);
  color: #fff;
  font-size: 22px;
  border: 4px solid #fff;
  box-shadow: 0 8px 20px rgba(124,138,46,.35);
  transition: transform .4s cubic-bezier(.22,.61,.36,1), background-color .4s cubic-bezier(.22,.61,.36,1);
}
.fomci-prog-icon [class*="flaticon"],
.fomci-prog-icon i,
.fomci-prog-icon span { color: #fff !important; font-size: 22px; line-height: 1; }
.fomci-prog-card:hover .fomci-prog-icon {
  transform: rotate(-8deg) scale(1.08);
  background: #7c8a2e;
}
.fomci-prog-body {
  padding: 34px 26px 26px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.fomci-prog-body h3 {
  margin: 0 0 18px;
  color: var(--fomci-navy);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
  text-transform: uppercase;
  letter-spacing: .2px;
  min-height: 3.9em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fomci-prog-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-top: 16px;
  border-top: 1px solid rgba(32,47,90,.08);
  width: 100%;
  color: var(--fomci-green);
  font-weight: 700;
  font-size: .95rem;
  transition: color .3s ease, gap .3s ease;
}
.fomci-prog-card:hover .fomci-prog-link { color: var(--fomci-magenta); gap: 14px; }

/* Navegación */
.fomci-swiper-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 22px;
}
.fomci-nav {
  width: 48px;
  height: 48px;
  border: 2px solid var(--fomci-green);
  border-radius: 50%;
  background: transparent;
  color: var(--fomci-green);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: all .25s ease;
}
.fomci-nav [class*="flaticon"],
.fomci-nav i { color: inherit; font-size: 16px; line-height: 1; }
.fomci-nav:hover {
  background: var(--fomci-green);
  color: #fff;
  border-color: var(--fomci-green);
}
.fomci-nav.swiper-button-disabled { opacity: .4; cursor: default; }
.fomci-swiper-pagination { display: flex; gap: 8px; align-items: center; }
.fomci-swiper-pagination .swiper-pagination-bullet {
  width: 9px; height: 9px; border-radius: 50%;
  background: #cfd3c4; opacity: 1; transition: all .3s ease;
}
.fomci-swiper-pagination .swiper-pagination-bullet-active {
  background: var(--fomci-green);
  transform: scale(1.35);
}
.fomci-programas .swiper-wrapper { align-items: stretch; }

@media (max-width: 767.98px) {
  .fomci-programas { padding: 52px 0 60px; }
  .fomci-prog-head { flex-direction: column; align-items: flex-start; }
}

/* ================= HEADER (similar al WordPress) ================= */
.fomci-wp-topbar {
  background: var(--fomci-green);
  color: #fff;
  font-size: 13px;
  font-family: inherit;
}
.fomci-wp-topbar-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 8px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.fomci-wp-topbar-left,
.fomci-wp-topbar-right {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.fomci-wp-tb {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #fff;
  text-decoration: none;
}
.fomci-wp-tb-ic { font-size: 14px; }
.fomci-wp-tb-label { opacity: .85; margin-right: 2px; }
.fomci-wp-social {
  width: 26px;
  height: 26px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  line-height: 26px;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .2s ease;
}
.fomci-wp-social i { line-height: 1; font-size: 13px; }
.fomci-wp-social:hover { background: #fff; color: var(--fomci-green); }
.fomci-wp-platform {
  background: var(--fomci-magenta);
  color: #fff;
  text-decoration: none;
  padding: 6px 16px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 12px;
  transition: background .2s ease;
}
.fomci-wp-platform:hover { background: var(--fomci-purple); }
.fomci-wp-login {
  color: #fff;
  text-decoration: none;
  padding: 7px 18px;
  border: 1px solid #fff;
  border-radius: 20px;
  font-weight: 700;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all .2s ease;
  letter-spacing: .3px;
}
.fomci-wp-login .fomci-wp-tb-ic { font-size: 14px; }
.fomci-wp-login:hover { background: #fff; color: var(--fomci-green); }

@media (max-width: 767.98px) {
  .fomci-wp-topbar-inner { justify-content: center; text-align: center; }
  .fomci-wp-topbar-left { justify-content: center; }
}

/* Logo original FOMCI en el header */
.navbar_brand img {
  width: auto;
  height: auto;
  max-height: 44px;
  max-width: 190px;
  object-fit: contain;
}
.navbar_brand {
  display: inline-flex;
  align-items: center;
}
.navbar_brand img.logo1 { display: none !important; }

/* El theme fija el header a 97px y el topbar verde (47px) + nav (87px) no
   caben; lo dejamos crecer a su contenido para que no desborde sobre el hero. */
body.ccn_header_style_4 header.header-nav.ccnHeader4 {
  height: auto !important;
  min-height: 124px !important;
}

/* ================= PROGRAMAS GRID (3 columnas) ================= */
.fomci-prog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}
.fomci-prog-col { display: flex; }
.fomci-prog-col .fomci-prog-card { width: 100%; }

@media (max-width: 1023.98px) {
  .fomci-prog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
}
@media (max-width: 575.98px) {
  .fomci-prog-grid { grid-template-columns: 1fr; gap: 24px; }
  .fomci-prog-media { min-height: 200px; max-height: 260px; }
  .fomci-prog-body { padding: 30px 22px 22px; }
}

/* ================= HEADER FIX — quitar barra azul, mejorar topbar ================= */

/* Ocultar la barra azul original de Moodle (.header_top.home4) */
body.ccn_header_style_4 .header_top.home4 {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Clavar el header al tope (el theme lo pone en top:40px por la barra azul eliminada) */
body.ccn_header_style_4.ccn_context_frontend header.header-nav.ccnHeader4:not(.stricky-fixed),
body.ccn_header_style_4 header.header-nav.ccnHeader4 {
  position: relative !important;
  top: 0 !important;
}
/* Compensar: como el header ahora es relative (ocupa flujo), no hace falta el
   margin-top:90px que el theme agrega al hero/slider para pasar bajo el absolute.
   Lo anulamos para que el hero pegue justo debajo de la nav. */
@media (min-width: 1200px) {
  .ccn_header_style_4 .block_cocoon_slider_6.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_1.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_1_v.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_2.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_3.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_4.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_slider_5.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_hero_1.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_hero_2.ccn_morphed,
  .ccn_header_style_4 .block_cocoon_hero_4.ccn_morphed {
    margin-top: 0 !important;
  }
}

/* Mejorar el topbar verde: centrar, sombra sutil, transiciones */
.fomci-wp-topbar {
  position: relative;
  z-index: 1001;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.fomci-wp-topbar-inner {
  justify-content: center;
}

/* Botón "Sitio web" verde en vez de púrpura */
.fomci-wp-platform {
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.4);
  border-radius: 999px;
  padding: 5px 16px;
  font-size: 12px;
  transition: all .25s ease;
}
.fomci-wp-platform:hover {
  background: #fff !important;
  color: var(--fomci-green) !important;
}

/* Navbar: sin margin-top por barra eliminada, transición suave */
header.ccnHeader4,
header[class*="ccnHeader"] {
  margin-top: 0 !important;
  padding-top: 0 !important;
  transition: box-shadow .3s ease;
}

/* Sombra al hacer scroll (clase JS .fomci-scrolled) */
.fomci-scrolled {
  box-shadow: 0 4px 20px rgba(32,47,90,.12) !important;
}

/* Topbar: los links heredan color blanco */
.fomci-wp-topbar a {
  color: #fff;
  text-decoration: none;
}

/* Social icons: bordes más sutiles */
.fomci-wp-social {
  border-color: rgba(255,255,255,.45);
}

/* Responsive: topbar comprimido en móvil */
@media (max-width: 767.98px) {
  .fomci-wp-topbar-inner {
    padding: 6px 12px;
    gap: 10px;
  }
  .fomci-wp-topbar .fomci-wp-tb-label {
    display: none;
  }
  .fomci-wp-topbar-left {
    gap: 10px;
    font-size: 12px;
  }
  /* Ocultar horario en móvil */
  .fomci-wp-topbar-left .fomci-wp-tb:nth-child(2) {
    display: none;
  }
  .fomci-wp-social {
    width: 24px;
    height: 24px;
    font-size: 11px;
    line-height: 22px;
  }
  .fomci-wp-platform {
    padding: 4px 12px;
    font-size: 11px;
  }
}

/* ================= FOOTER (similar al WordPress) ================= */
section.footer_one.fomci-wp-footer,
.fomci-wp-footer.bg-title { background-color: #0b1426 !important; margin-top: 0; }
.fomci-wp-footer { margin-top: 0; }
.fomci-wp-footer .vs-footer__top { padding: 80px 0 70px; }
.fomci-wp-footer .vs-footer__widget { color: #a8afc7; }
.fomci-wp-footer .vs-footer__logo { margin-bottom: 26px; }
.fomci-wp-footer .vs-footer__logo img { max-width: 200px; height: auto; }
.fomci-wp-footer .vs-footer__tagline-title {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 18px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.fomci-wp-footer .vs-footer__desc { font-size: 15px; line-height: 1.75; margin: 0 0 14px; }
.fomci-wp-footer .vs-footer__motto {
  color: var(--fomci-green);
  font-weight: 600;
  letter-spacing: .3px;
  margin: 0 0 22px;
}
.fomci-wp-footer .icon-call {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin: 0 0 22px;
}
.fomci-wp-footer .icon-call__icon {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--fomci-green);
  color: #fff;
  font-size: 20px;
}
.fomci-wp-footer .icon-call__title {
  display: block;
  color: #c9cfdf;
  font-size: 13.5px;
  margin-bottom: 6px;
}
.fomci-wp-footer .icon-call__number {
  display: block;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  margin-bottom: 6px;
}
.fomci-wp-footer .icon-call__number:hover { color: var(--fomci-green); }
.fomci-wp-footer .icon-call__wa {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #25D366;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.fomci-wp-footer .icon-call__wa:hover { color: #fff; }
.fomci-wp-footer .social-style {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 8px;
}
.fomci-wp-footer .social-style__label { color: #c9cfdf; font-size: 13.5px; margin-right: 6px; }
.fomci-wp-footer .social-style a {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.fomci-wp-footer .social-style a:hover {
  background: var(--fomci-green);
  color: #fff;
  transform: translateY(-3px);
}
.fomci-wp-footer .vs-footer__title {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 24px;
  padding-bottom: 14px;
  position: relative;
}
.fomci-wp-footer .vs-footer__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 46px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--fomci-green), var(--fomci-magenta));
}
.fomci-wp-footer .vs-footer__menu {
  display: flex;
  gap: 40px;
}
.fomci-wp-footer .vs-footer__menu--list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fomci-wp-footer .vs-footer__menu--list li { margin-bottom: 13px; }
.fomci-wp-footer .vs-footer__menu--list li:last-child { margin-bottom: 0; }
.fomci-wp-footer .vs-footer__menu--list a {
  color: #a8afc7;
  font-size: 15px;
  text-decoration: none;
  position: relative;
  padding-left: 0;
  transition: color .3s ease, padding-left .3s ease;
}
.fomci-wp-footer .vs-footer__menu--list a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 2px;
  background: var(--fomci-green);
  transform: translateY(-50%);
  transition: width .3s ease;
}
.fomci-wp-footer .vs-footer__menu--list a:hover { color: var(--fomci-green); padding-left: 18px; }
.fomci-wp-footer .vs-footer__menu--list a:hover::before { width: 10px; }
.fomci-wp-footer .sidebar-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.fomci-wp-footer .gallery-thumb {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 1/1;
}
.fomci-wp-footer .gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}
.fomci-wp-footer .gallery-thumb:hover img { transform: scale(1.1); }
.fomci-wp-footer .gallery-thumb .gal-btn {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(149,167,59,.45);
  color: #fff;
  font-size: 24px;
  opacity: 0;
  transition: opacity .35s ease;
}
.fomci-wp-footer .gallery-thumb:hover .gal-btn { opacity: 1; }
.fomci-wp-footer .vs-footer__bottom {
  background: var(--fomci-green);
  padding: 20px 0;
}
.fomci-wp-footer .vs-footer__copyright { color: #fff; font-size: 14.5px; margin: 0; }
.fomci-wp-footer .vs-footer__bottom--menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 26px;
}
.fomci-wp-footer .vs-footer__bottom--menu a {
  color: #fff;
  font-size: 14.5px;
  text-decoration: none;
  transition: opacity .3s ease;
}
.fomci-wp-footer .vs-footer__bottom--menu a:hover { opacity: .8; }

.fomci-whatsapp {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99999;
  width: 60px;
  height: 60px;
  background: #25D366;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: 0 4px 12px rgba(37, 211, 102, .4);
  transition: transform .3s, box-shadow .3s;
  text-decoration: none;
}
.fomci-whatsapp:hover { transform: scale(1.1); box-shadow: 0 6px 20px rgba(37,211,102,.6); color: #fff; }
@media (max-width: 768px) {
  .fomci-whatsapp { bottom: 20px !important; right: 20px !important; width: 52px !important; height: 52px !important; font-size: 28px !important; }
}
@media (max-width: 991.98px) {
  .fomci-wp-footer .vs-footer__menu { gap: 28px; }
  .fomci-wp-footer .vs-footer__top { padding: 60px 0 50px; }
}

/* ================= PÁGINA DE CURSOS (estilo EdCare) ================= */
.courses .fomci-course-card {
  position: relative;
  height: 100%;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(32,47,90,.08);
  box-shadow: 0 4px 18px rgba(32,47,90,.06);
  transition: transform .38s cubic-bezier(.22,.61,.36,1), box-shadow .38s cubic-bezier(.22,.61,.36,1);
}
.courses .fomci-course-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 22px 44px rgba(32,47,90,.16);
}
.courses .fomci-course-card__link { text-decoration: none; display: block; color: inherit; }
.courses .fomci-course-card__banner {
  position: relative;
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.courses .fomci-course-card__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.18), transparent 55%);
}
.courses .fomci-course-card__icon {
  position: relative;
  z-index: 2;
  width: 76px;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  font-size: 34px;
  backdrop-filter: blur(2px);
  transition: transform .38s cubic-bezier(.22,.61,.36,1);
}
.courses .fomci-course-card:hover .fomci-course-card__icon { transform: scale(1.1) rotate(-4deg); }
.courses .fomci-course-card__icon i { color: #fff; font-size: 34px; line-height: 1; }
.courses .fomci-course-card__body {
  padding: 20px 22px 24px;
}
.courses .fomci-course-card__title {
  margin: 0 0 8px;
  color: var(--fomci-navy);
  font-size: 1.0rem;
  font-weight: 700;
  line-height: 1.4;
  text-transform: uppercase;
  min-height: 2.8em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.courses .fomci-course-card__desc {
  margin: 0 0 16px;
  color: #666b80;
  font-size: .86rem;
  line-height: 1.55;
  min-height: 4em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.courses .fomci-course-card__go {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-top: 16px;
  border-top: 1px solid rgba(32,47,90,.08);
  width: 100%;
  color: var(--fomci-green);
  font-size: .92rem;
  font-weight: 700;
  transition: color .3s ease, gap .3s ease;
}
.courses .fomci-course-card:hover .fomci-course-card__go { color: var(--fomci-magenta); gap: 14px; }

/* Compactar header/breadcrumb de la página de cursos */
.fomci-course-page .inner_page_breadcrumb,
body.pagelayout-coursecategory .inner_page_breadcrumb {
  padding: 44px 0 40px;
  margin-bottom: 0;
}
.fomci-course-page .inner_page_breadcrumb .breadcrumb_content h1,
body.pagelayout-coursecategory .inner_page_breadcrumb .breadcrumb_content h1 {
  font-size: 1.9rem;
  margin-bottom: 6px;
}
@media (max-width: 767.98px) {
  .courses .fomci-course-card__title { min-height: 0; }
}

/* ================= PÁGINA DE LOGIN (split edublink-style, premium) ================= */
body.pagelayout-login .inner_page_breadcrumb { display: none !important; }
body.pagelayout-login #page-content { background: #eef0f6; }
body.pagelayout-login #page-content .wrapper { max-width: none !important; }
body.pagelayout-login #page-content .wrapper > .container { max-width: 1160px; }
body.pagelayout-login section.our-log {
  background: transparent !important;
  padding: 30px 0 44px;
  display: flex;
  align-items: center;
  width: 100% !important;
  justify-content: center;
}
body.pagelayout-login section.our-log > .container {
  width: 100% !important;
  max-width: none !important;
  padding: 0 30px;
}
body.pagelayout-login .fomci-login-wrap {
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
}
body.pagelayout-login .footer_one,
body.pagelayout-login .vs-footer {
  border-radius: 0 !important;
}
body.pagelayout-login .footer_one { margin-top: 0 !important; padding-top: 0 !important; }

.fomci-login-wrap {
  position: relative;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  align-items: stretch;
  min-height: 600px;
  height: auto;
  max-height: 90vh;
  border-radius: 24px;
  overflow: auto;
  background: #fff;
  box-shadow: 0 30px 70px -28px rgba(32,47,90,.4);
  box-sizing: border-box;
}
.fomci-login-wrap * { box-sizing: border-box; }
.fomci-login-visual {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: var(--fomci-navy);
}
.fomci-login-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--fomci-login-bg);
  background-size: cover;
  background-position: 50% 34%;
  background-repeat: no-repeat;
}
.fomci-login-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,26,52,.55) 0%, rgba(18,26,52,.28) 42%, rgba(9,14,30,.94) 100%);
}
.fomci-login-visual-inner {
  position: absolute;
  left: 34px; right: 34px; bottom: 30px;
  z-index: 2;
  color: #fff;
}
.fomci-login-visual-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--fomci-green);
  color: #fff !important;
  font-weight: 700;
  font-size: .7rem;
  padding: 7px 14px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 1.3px;
  margin-bottom: 12px;
  box-shadow: 0 8px 20px -8px rgba(149,167,59,.8);
}
.fomci-login-visual-inner h2,
.fomci-login-visual-inner .h2 {
  font-size: 1.7rem;
  line-height: 1.18;
  margin: 0 0 10px;
  font-weight: 800;
  letter-spacing: -.5px;
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.4);
}
.fomci-login-visual-inner p {
  margin: 0 0 16px;
  font-size: .92rem;
  line-height: 1.6;
  opacity: .96;
  max-width: 40ch;
  color: #fff !important;
}
.fomci-login-stats {
  display: flex;
  gap: 22px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.25);
}
.fomci-login-stat b {
  display: block;
  font-size: 1.3rem;
  font-weight: 800;
  line-height: 1.1;
  color: #fff !important;
}
.fomci-login-stat span {
  font-size: .72rem;
  color: rgba(255,255,255,.85);
  text-transform: uppercase;
  letter-spacing: .5px;
  font-weight: 600;
}
.fomci-login-form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 30px 46px 36px;
  position: relative;
  min-height: 0;
  overflow: hidden;
}
.fomci-login-form .fomci-login-head { margin-bottom: 4px; }
.fomci-login-form .fomci-login-eyebrow {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--fomci-green);
  margin-bottom: 6px;
}
.fomci-login-form .fomci-login-head h3 {
  margin: 0 0 6px;
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--fomci-navy);
  letter-spacing: -.4px;
}
.fomci-login-form .fomci-login-head p {
  margin: 0 0 20px;
  color: #7a8094;
  font-size: .9rem;
  line-height: 1.5;
}
.fomci-login-form .login_form { width: 100% !important; }
.fomci-login-form .login_form .form-group { margin-bottom: 14px; }
.fomci-login-form .login_form input.form-control {
  height: 48px;
  border-radius: 12px;
  border: 1.5px solid #e4e8f0;
  background: #fafbfd;
  padding: 0 16px;
  font-size: .92rem;
  color: var(--fomci-navy);
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.fomci-login-form .login_form input.form-control:focus {
  border-color: var(--fomci-green);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(149,167,59,.15);
  outline: none;
}
.fomci-login-form .login_form .btn-log {
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--fomci-green) 0%, #7C8A2E 100%);
  border: none;
  font-weight: 700;
  font-size: .98rem;
  letter-spacing: .4px;
  margin-top: 4px;
  box-shadow: 0 14px 26px -12px rgba(149,167,59,.85);
  transition: transform .25s ease, box-shadow .25s ease;
}
.fomci-login-form .login_form .btn-log:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px -14px rgba(124,138,46,.9);
}
.fomci-login-form .custom-control-label { font-size: .86rem; color: #5a5f70; }
.fomci-login-form .btn-fpswd { font-size: .84rem; color: var(--fomci-magenta); font-weight: 600; }
.fomci-login-form .btn-fpswd:hover { color: var(--fomci-navy); }
.fomci-login-form .login_head,
.fomci-login-form .tab-pane .login_head,
.fomci-login-wrap .tab-content .login_head { display: none !important; }
.fomci-login-form .login_form .mt-3 {
  margin-top: 16px !important;
  padding: 14px 16px;
  background: #fdf8ed;
  border: 1px solid #f0e4b8;
  border-radius: 10px;
  font-size: .82rem;
  color: #7a6b1e;
  line-height: 1.5;
}
.fomci-login-form .login_form .mt-2 {
  margin-top: 14px !important;
  padding-top: 14px;
  border-top: 1px solid #eef1f7;
  text-align: left;
}
.fomci-login-form .login_form .mt-2 p {
  font-size: .86rem;
  color: #6b7080;
  margin-bottom: 12px;
}
.fomci-login-form .login_form .mt-2 form {
  display: block;
  margin: 0;
}
.fomci-login-form .login_form .mt-2 form button,
.fomci-login-form .login_form .mt-2 button {
  width: 100%;
  padding: 12px 20px;
  border: 1.5px solid var(--fomci-green);
  border-radius: 10px;
  background: transparent;
  color: var(--fomci-green);
  font-weight: 700;
  font-size: .9rem;
  white-space: nowrap;
  transition: background .2s ease, color .2s ease;
  cursor: pointer;
  text-align: center;
}
.fomci-login-form .login_form .mt-2 form button:hover,
.fomci-login-form .login_form .mt-2 button:hover {
  background: var(--fomci-green);
  color: #fff;
}
.fomci-login-form .login_form .heading { display: none !important; }
.fomci-login-foot {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #eef1f7;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #8a91a5;
  font-size: .8rem;
}
.fomci-login-foot i { color: var(--fomci-green); }

/* ===== Fix: active-session modal on login page ===== */
.fomci-login-form-body .login_form.inner_page {
  padding: 0 !important;
}
.fomci-login-form-body .generalbox {
  width: 100% !important;
  padding: 0 !important;
}
.fomci-login-form-body:has(.modal-in-page) .login_form form#login,
.fomci-login-form-body:has(.modal-in-page) .login_form .divide,
.fomci-login-form-body:has(.modal-in-page) .login_form .ccn_first-time,
.fomci-login-form-body:has(.modal-in-page) .login_form .login-timemsg,
.fomci-login-form-body:has(.modal-in-page) .login_form .cookies-text {
  display: none !important;
}
.fomci-login-form-body #notice.modal-in-page,
.fomci-login-form-body .modal-in-page {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 24px 0 0 !important;
  background: transparent;
  border: none !important;
  border-radius: 0;
  box-shadow: none;
}
.fomci-login-form-body .modal-in-page .modal-content {
  padding: 28px;
  background: #fff;
  border: 1.5px solid #e4e8f0;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  width: 100%;
  max-width: none;
}
.fomci-login-form-body .modal-in-page .modal-header {
  padding: 0 0 14px;
  border-bottom: 1px solid #eef1f7;
  margin-bottom: 14px;
}
.fomci-login-form-body .modal-in-page .modal-header h4 {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--fomci-navy);
  margin: 0;
}
.fomci-login-form-body .modal-in-page .modal-body {
  padding: 0 0 20px;
}
.fomci-login-form-body .modal-in-page .modal-body p {
  font-size: .92rem;
  line-height: 1.65;
  color: #5a5f70;
  margin: 0;
}
.fomci-login-form-body .modal-in-page .modal-footer {
  padding: 18px 0 0;
  border-top: 1px solid #eef1f7;
}
.fomci-login-form-body .modal-in-page .modal-footer .buttons {
  display: flex;
  gap: 12px;
}
.fomci-login-form-body .modal-in-page .modal-footer .singlebutton {
  flex: 1;
}
.fomci-login-form-body .modal-in-page .modal-footer .singlebutton form {
  width: 100%;
}
.fomci-login-form-body .modal-in-page .btn-secondary {
  height: 46px;
  border-radius: 10px;
  border: 1.5px solid #e4e8f0;
  background: #fff;
  color: #5a5f70;
  font-weight: 600;
  font-size: .9rem;
  width: 100%;
  transition: background .2s, color .2s;
  padding: 0 16px;
}
.fomci-login-form-body .modal-in-page .btn-secondary:hover {
  background: #f5f6f8;
  color: var(--fomci-navy);
}
.fomci-login-form-body .modal-in-page .btn-primary {
  height: 46px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--fomci-green) 0%, #7C8A2E 100%);
  border: none;
  color: #fff;
  font-weight: 700;
  font-size: .9rem;
  width: 100%;
  box-shadow: 0 10px 20px -8px rgba(149,167,59,.6);
  transition: transform .2s, box-shadow .2s;
  padding: 0 16px;
}
.fomci-login-form-body .modal-in-page .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 26px -10px rgba(149,167,59,.8);
}

@media (max-width: 991.98px) {
  body.pagelayout-login section.our-log { min-height: 0; padding: 28px 0 40px; }
  .fomci-login-wrap { grid-template-columns: 1fr; height: auto; }
  .fomci-login-visual { min-height: 320px; }
  .fomci-login-visual-inner { left: 28px; right: 28px; bottom: 28px; }
  .fomci-login-form { padding: 36px 30px; }
}
@media (max-width: 575.98px) {
  .fomci-login-visual { min-height: 250px; }
  .fomci-login-visual-inner h2 { font-size: 1.5rem; }
  .fomci-login-stats { gap: 18px; }
  .fomci-login-form { padding: 28px 22px; }
}

/* ================= PERFIL DE USUARIO COMPACTO ================= */
/* Banner breadcrumb: compactar de 400px a una franja delgada profesional */
body.pagelayout-mypublic section.inner_page_breadcrumb {
  min-height: 0 !important;
  height: 96px !important;
  padding: 30px 0 20px !important;
  background-size: cover !important;
  background-position: center !important;
}
body.pagelayout-mypublic section.inner_page_breadcrumb .breadcrumb_content {
  padding: 0 !important;
  margin: 0 !important;
}
body.pagelayout-mypublic section.inner_page_breadcrumb .col-xl-12 {
  height: auto !important;
}
body.pagelayout-mypublic section.inner_page_breadcrumb h4.breadcrumb_title {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.25) !important;
  margin-bottom: 0 !important;
}
body.pagelayout-mypublic section.inner_page_breadcrumb ol,
body.pagelayout-mypublic section.inner_page_breadcrumb .breadcrumb {
  margin-bottom: 0 !important;
}

/* Contenedor del perfil */
body.pagelayout-mypublic .userprofile section.our-team {
  background: transparent !important;
  padding-top: 0 !important;
}

/* Card del perfil (contenido principal): los acordeones */
body.pagelayout-mypublic .userprofile .cs_row_three .details {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(32,47,90,.06);
  border: 1px solid rgba(228,232,240,.6);
  margin-bottom: 16px;
  overflow: hidden;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-heading {
  background: rgba(149,167,59,.05) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a {
  display: block;
  padding: 16px 22px;
  font-size: .92rem;
  font-weight: 700;
  color: var(--fomci-navy) !important;
  text-decoration: none !important;
  position: relative;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a::after {
  content: '\f078';
  font-family: 'FontAwesome';
  font-weight: normal;
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--fomci-green);
  font-size: .8rem;
  transition: transform .2s;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-heading.open .panel-title a::after,
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel:not(.collapsed) .panel-title a::after {
  transform: translateY(-50%) rotate(180deg);
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-body {
  padding: 20px 22px !important;
  border-top: 1px solid rgba(228,232,240,.6) !important;
}
body.pagelayout-mypublic .userprofile .my_resume_eduarea .content {
  margin-bottom: 14px;
}
body.pagelayout-mypublic .userprofile .my_resume_eduarea .edu_stats {
  font-size: .85rem;
  font-weight: 600;
  color: var(--fomci-navy) !important;
}
body.pagelayout-mypublic .userprofile .my_resume_eduarea .edu_center {
  font-size: .85rem;
  color: #6b7080;
}
body.pagelayout-mypublic .userprofile .my_resume_eduarea .circle {
  border-color: var(--fomci-green) !important;
}

/* Sidebar del perfil */
body.pagelayout-mypublic .userprofile .selected_filter_widget.siderbar_contact_widget {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(32,47,90,.06);
  border: 1px solid rgba(228,232,240,.6);
  padding: 22px;
  margin-bottom: 20px;
}
body.pagelayout-mypublic .userprofile .selected_filter_widget.siderbar_contact_widget h4 {
  font-size: .95rem;
  font-weight: 700;
  color: var(--fomci-navy);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--fomci-green);
}
body.pagelayout-mypublic .userprofile .selected_filter_widget.siderbar_contact_widget p {
  font-size: .8rem;
  font-weight: 600;
  color: #8a91a5;
  margin: 8px 0 2px;
}
body.pagelayout-mypublic .userprofile .selected_filter_widget.siderbar_contact_widget i {
  font-style: normal;
  font-size: .85rem;
  color: var(--fomci-navy);
}

/* Botón mensaje / contacto */
body.pagelayout-mypublic .userprofile .btn-primary {
  background: linear-gradient(135deg, var(--fomci-green) 0%, #7C8A2E 100%) !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 10px 20px !important;
  font-weight: 600 !important;
  font-size: .85rem !important;
  box-shadow: 0 8px 16px -6px rgba(149,167,59,.6) !important;
}
body.pagelayout-mypublic .userprofile .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 20px -8px rgba(149,167,59,.8) !important;
}

/* Espaciado del layout del perfil */
body.pagelayout-mypublic .userprofile .container,
body.pagelayout-mypublic .userprofile section.our-team > div {
  padding-top: 8px;
}

/* Responsive: móvil */
@media (max-width: 767.98px) {
  body.pagelayout-mypublic section.inner_page_breadcrumb {
    height: 84px !important;
    padding: 24px 0 18px !important;
  }
  body.pagelayout-mypublic section.inner_page_breadcrumb h4.breadcrumb_title {
    font-size: 1.2rem !important;
  }
  body.pagelayout-mypublic .userprofile .cs_row_three .details {
    margin-bottom: 12px;
  }
  body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a {
    padding: 14px 16px;
    font-size: .88rem;
  }
  body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a::after {
    right: 16px;
  }
  body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-body {
    padding: 16px 16px !important;
  }
}

/* ============ PERFIL: ACORDEÓN BIEN ESTRUCTURADO + FIX ICONOS FA6 ============ */
/* El theme declara el chevron con font-family 'FontAwesome' (nombre FA4), pero la
   plataforma carga Font Awesome 6 -> el glifo no resuelve y se ve roto. Fix: FA6. */
body.pagelayout-mypublic .userprofile #accordion .panel-heading .accordion-toggle::before {
  display: none !important;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f078" !important;
  -webkit-font-smoothing: antialiased;
  font-style: normal !important;
  text-rendering: auto;
  transform: translateY(-50%) rotate(180deg);
  transition: transform .2s ease;
}
body.pagelayout-mypublic .userprofile .panel-group.cc_tab .panel-title a.collapsed::after {
  transform: translateY(-50%) rotate(0deg);
}
/* Chevrons de la sidebar "Accesos" y otros que usan 'FontAwesome' roto */
body.pagelayout-mypublic .fa-skype::before,
body.pagelayout-mypublic .fa-icq::before,
body.pagelayout-mypublic .fa-yahoo::before,
body.pagelayout-mypublic .fa-aim::before,
body.pagelayout-mypublic .fa-windows::before {
  font-family: "Font Awesome 6 Brands" !important;
  font-weight: 400 !important;
}

/* Panel vacío (p.ej. "Detalles de usuario" sin datos) -> no mostrar cabecera rota */
body.pagelayout-mypublic .userprofile .panel:has(.panel-body:not(:has(*))) {
  display: none !important;
}

/* Avatar gigante que se solapa detrás del acordeón en el layout perfil */
body.pagelayout-mypublic #ccn_instructor_personal_infor,
body.pagelayout-mypublic .userprofile #ccn_instructor_personal_infor {
  display: none !important;
  position: static !important;
  width: auto !important;
}

/* MODO DE EDICIÓN: anclarlo debajo de la navbar, sin tapar el contenido
   (el form del theme queda position:fixed flotando sobre las tarjetas) */
body.pagelayout-mypublic .editmode-switch-form {
  position: fixed !important;
  top: 84px !important;
  right: 20px !important;
  left: auto !important;
  z-index: 1040 !important;
  background: #fff !important;
  border: 1px solid rgba(228,232,240,.85) !important;
  border-radius: 10px !important;
  padding: 5px 12px !important;
  box-shadow: 0 6px 18px -8px rgba(32,47,90,.25) !important;
}
/* Avatar de iniciales "AD" en el header del perfil -> redundante, ocultar */
body.pagelayout-mypublic .page-header-image,
body.pagelayout-mypublic .page-context-header .userinitials,
body.pagelayout-mypublic .userprofile .avatar-initials,
body.pagelayout-mypublic .userprofile .userpicture {
  display: none !important;
}

/* Padding-top del contenido del perfil para que no quede tapado por header fijo */
body.pagelayout-mypublic .userprofile {
  padding-top: 90px !important;
}
@media (max-width: 767.98px) {
  body.pagelayout-mypublic .userprofile {
    padding-top: 60px !important;
  }
  body.pagelayout-mypublic .editmode-switch-form,
  body.pagelayout-mypublic .editmode-switch-form .form-inline {
    display: none !important;
  }
}

/* ============ LOGO FOMCI EN SIDEBAR (todas las páginas dashboard) ============ */
body.ccn_context_dashboard .user_profile .media {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
  padding: 24px 16px 12px;
}
body.ccn_context_dashboard .user_profile .media::before {
  content: '';
  display: block;
  width: 100%;
  aspect-ratio: 160 / 56;
  background-image: url('https://montessorifomci.com/wp-content/themes/montessorifomci-theme/recursos/logo.jpeg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 8px;
}
body.ccn_context_dashboard .user_profile .media::after {
  content: 'Plataforma Educativa Montessori';
  font-family: 'Public Sans', 'Segoe UI', Arial, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--fomci-navy, #202F5A);
  letter-spacing: .5px;
  line-height: 1.3;
  margin-bottom: 6px;
  order: 1;
}
body.ccn_context_dashboard .user_profile .media .media-body {
  order: 2;
}
body.ccn_context_dashboard .user_profile .media-body h4 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--fomci-navy, #202F5A) !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0 !important;
}
@media (max-width: 767.98px) {
  body.ccn_context_dashboard .user_profile .media::before {
    width: 100%;
    aspect-ratio: 160 / 56;
  }
}