/* AntucoDev Departamentos - estilos */
.antucodev-dept-wrap{max-width:1200px;margin:48px auto; padding:0 16px;}
.antucodev-dept-grid{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start}
@media (max-width: 900px){.antucodev-dept-grid{grid-template-columns:1fr}}
.antucodev-dept-list ul{list-style:none;margin:0;padding:0}
.antucodev-dept-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
 background:#C8553D;color:#fff;border:0;border-radius:6px;padding:14px 16px;cursor:pointer;
 font-family:'Barlow', 'Source Sans Variable', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
 transition:transform .06s ease, background .2s ease, box-shadow .2s ease;}
.antucodev-dept-btn:hover{transform:translateY(-1px);box-shadow:0 2px 10px rgba(0,0,0,.08)}
.antucodev-dept-btn .antucodev-dept-title{font-weight:600;font-size:15px;line-height:1.2;text-align:left}
.antucodev-dept-btn .antucodev-dept-arrow{
  /* Mantiene estilo visual pero empuja la flecha hacia la derecha */
  opacity: .85;
  font-weight: 700;
  margin-left: auto;
}
.antucodev-dept-btn {
  display: flex;
  justify-content: space-between; /* texto a la izquierda, flecha al extremo derecho */
  align-items: center;
}
.antucodev-dept-btn.is-active{outline:3px solid rgba(200,85,61,.25)}

.antucodev-dept-members{position:relative}
.antucodev-dept-panel{display:none}
.antucodev-dept-panel.is-active{display:grid;grid-template-columns:1fr; gap:14px;}

.antucodev-member-card{display:flex; align-items:center; gap:14px; background:#F2F2F2; border-radius:20px; padding:10px 50px; box-sizing:border-box; width:100%;}
.antucodev-member-thumb{width:56px;height:56px;object-fit:cover;border-radius:50%;display:block;}
.antucodev-member-name{margin:0; font-size:18px; font-weight:700; color:#57534E;
  font-family:'Barlow', 'Source Sans Variable', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  overflow-wrap: anywhere;
}
.antucodev-member-role{color:#9b857d; margin-left:8px; font-weight:600;}

/* vacio */
.antucodev-empty{background:#faf7f6; border:1px dashed #e1d6d3; padding:12px 16px; border-radius:10px; color:#7a6a64;}

/* ============================
   Soporte para Subdepartamentos
   ============================ */
/* El contenedor details se comporta como tarjeta flex vertical */
.antucodev-member-subdept summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
}
.antucodev-member-subdept summary::-webkit-details-marker { display: none; }

/* Para los detalles de integrantes con subdepartamento, usamos layout vertical
   en el contenedor <details> para que el resumen y el contenido se apilen
   y no se ubiquen a la derecha en pantallas grandes */
.antucodev-member-subdept {
  display: block;
}
/* Etiqueta para resaltar integrantes con subdepartamento */
.antucodev-badge {
  margin-left: 8px;
  padding: 2px 6px;
  border-radius: 9999px;
  background: #4A6B47; /* Verde corporativo */
  color: #fff;
  font-size: 12px;
  line-height: 1;
}
/* Contenedor de detalles del subdepartamento */
.antucodev-subdept {
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed #e1d6d3;
}
.antucodev-subdept-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 6px;
  color: #57534E;
}
.antucodev-subdept-desc {
  font-size: 14px;
  color: #57534E;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

/* === Datos de contacto === */
.antucodev-member-contact {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.antucodev-member-phone,
.antucodev-member-email {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #7a6a64;
}

.antucodev-member-email a {
  color: inherit;
  text-decoration: none;
  font-weight: normal;
}

.antucodev-contact-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: inline-block;
}

/* =========================
   Ajustes responsivos y UX
   ========================= */
@media (max-width: 600px) {
  /* Reduce padding lateral de las tarjetas para evitar desbordes */
  .antucodev-member-card {
    padding: 12px 16px;
    /* Apila contenido para nombres/cargos largos incluso si no tienen subdepartamento */
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
  }
  /* Disminuye el gap general en móvil */
  .antucodev-dept-grid {
    gap: 20px;
  }

  /* Ajusta el padding de los botones de departamento para evitar desbordes extremos */
  .antucodev-dept-btn {
    padding-left: 12px;
    padding-right: 12px;
  }

  /* En vistas pequeñas, apila contenido de integrantes con subdepartamento */
  .antucodev-member-subdept summary {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* Más espacio y aire para detalles de subdepartamento */
/* Ajustamos margen y padding para dar más aire a los subdepartamentos en todas las vistas */
.antucodev-subdept {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px dashed #e1d6d3;
}
.antucodev-member-subdept summary {
  align-items: flex-start;
}