1.

I am a heading big heading of two lines

Here goes your text ... Select any part of your text to access the formatting toolbar.

Aenean volutpat massa arcu, ut placerat purus imperdiet nec. Quisque varius bibendum purus quis hendrerit. Ut ac vestibulum justo.

Pellentesque placerat elit non dolor posuere laoreet. Suspendisse blandit, metus in cursus semper, nunc enim euismod libero, at dapibus sapien felis eu elit.

Ut elementum, elit vel suscipit dictum, nunc ligula ultrices lectus, in pulvinar ligula lacus sit amet dolor. Quisque non mi vitae nulla euismod consequat.

Mira nuestros servicios
2.

I am a heading big heading

Here goes your text ... Select any part of your text to access the formatting toolbar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sem lectus, tincidunt et egestas vel, auctor sit amet velit. Ut pharetra eget orci nec gravida.

Nulla interdum leo eu nibh laoreet, id viverra nisl suscipit. Donec porttitor metus id tristique viverra. Donec iaculis eu libero sit amet egestas. Cras cursus sollicitudin nulla a dignissim.

Mira nuestros servicios
3.

I am a heading heading

Here goes your text ... Select any part of your text to access the formatting toolbar.

Aenean volutpat massa arcu, ut placerat purus imperdiet nec. Quisque varius bibendum purus quis hendrerit. Ut ac vestibulum justo. Pellentesque placerat elit non dolor posuere laoreet. Suspendisse blandit, metus in cursus semper, nunc enim euismod libero, at dapibus sapien felis eu elit. Ut elementum, elit vel suscipit dictum, nunc ligula ultrices lectus, in pulvinar ligula lacus sit amet dolor. Quisque non mi vitae nulla euismod consequat.

Mira nuestros servicios
4.

I am a heading big heading of two lines

Here goes your text ... Select any part of your text to access the formatting toolbar.

Aenean volutpat massa arcu, ut placerat purus imperdiet nec. Quisque varius bibendum purus quis hendrerit.

Ut ac vestibulum justo. Pellentesque placerat elit non dolor posuere laoreet. Suspendisse blandit, metus in cursus semper, nunc enim euismod libero, at dapibus sapien felis eu elit. Ut elementum, elit vel suscipit dictum, nunc ligula ultrices lectus, in pulvinar ligula lacus sit amet dolor. Quisque non mi vitae nulla euismod consequat.

Mira nuestros servicios
<script>
	const cards = document.querySelectorAll('.fb-fancy-tab__header');

cards.forEach((card, index) => {
  card.addEventListener('click', handleClick);
  card.addEventListener('focus', handleFocus);

  if (index !== 0) {
    card.parentNode.classList.add('inactive');
  }
});

function handleClick(event) {
  const currentCard = event.currentTarget;
  const currentCardParent = currentCard.parentNode;
  
  if (!currentCardParent.classList.contains('active')) {
    resetActiveClass();
    currentCardParent.classList.add('active');
    cards[0].parentNode.classList.add('inactive');
  }
}

function handleFocus(event) {
  const currentCard = event.currentTarget;
  const currentCardParent = currentCard.parentNode;

  if (!currentCardParent.classList.contains('active')) {
    resetActiveClass();
    currentCardParent.classList.add('active');
    cards[0].parentNode.classList.add('inactive');
  }
}

function resetActiveClass() {
  cards.forEach((card, index) => {
    card.parentNode.classList.remove('active');
    if (index !== 0) {
      card.parentNode.classList.remove('inactive');
    }
  });
}




  
  // Obtener todos los elementos con clase .fb-fancy-tab__content
const contentElements = document.getElementsByClassName('fb-fancy-tab__content');

// Iterar sobre los elementos y determinar la altura máxima
let maxHeight = 0;
for (let i = 0; i < contentElements.length; i++) {
  const children = contentElements[i].children;
  let totalHeight = 0;

  // Obtener la altura total de los elementos internos
  for (let j = 0; j < children.length; j++) {
    totalHeight += children[j].offsetHeight;
  }

  // Actualizar la altura máxima si es necesario
  if (totalHeight > maxHeight) {
    maxHeight = totalHeight + 60;
  }
}

// Obtener los elementos con clase .fb-fancy-tab__wrapper y asignar el min-height
const wrapperElements = document.getElementsByClassName('fb-fancy-tab__wrapper');
for (let i = 0; i < wrapperElements.length; i++) {
  wrapperElements[i].style.minHeight = `${maxHeight}px`;
}


</script>