/* css styles */



/* Hero */
.hero-banner {
    position: relative;
    display: flex;
    justify-content: left;
  }


.hero-banner h1 {
    color: #ffffff;
    font-size: 4rem;
    position: relative;
  }

.hero-banner h2 {
    color: #7e8083;
    font-size: 3rem;
  }


.hero-banner .hero-image {
    position: absolute;
    display: none;
    height: auto;
}

  
.hero-banner .content-block .hero-text {
    color: #7e8083;
    width: 100%;
}







/***** Experiencia laboral *****/ 
.accordion-item {
  background-color: #2a383b;
  border: 0px solid #2a383b;
}

/* Estilo para el logotipo en el acordeón */
.logo-icon {
    width: 180px; /* Ajusta el ancho según tus necesidades */
    height: auto; /* Esto permite que la altura se ajuste automáticamente */
    margin-right: 0px; /* Espacio entre el logotipo y el texto del acordeón */
}

.accordion-button:not(.collapsed) {
    color: #a37b00;
    background-color: #527076;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}



/***** Educación *****/ 
/* Estructura: grid para lista, item con flex para contenido + fecha */
.education-section{ padding:2rem 1rem; max-width:980px; margin:0 auto; }
.education-section h2{ margin-bottom:1rem; font-size:1.25rem; }

.education-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1rem;
}

/* Card ligero por item */
.education-item{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  padding:0.9rem 1rem;
  border-radius:8px;
  border:1px solid rgba(0,0,0,.06);
  background:#515151;
  box-shadow:0 6px 14px rgba(8,8,8,0.03);
}

/* Contenido principal (grado + institución) */
.education-main{ min-width:0; }
.degree{ margin:0 0 .25rem 0; font-size:1rem; font-weight:700; color:#ffffff;}
.institution{ margin:0; color:#ffffff; font-size:.92rem; }

/* Fecha alineada a la derecha en pantallas amplias */
.period{ white-space:nowrap; color:#ffffff; font-size:.86rem; margin-left:auto; }

/* Responsive: apilar en pantallas pequeñas */
@media (max-width:640px){
  .education-item{ flex-direction:column; align-items:stretch; }
  .period{ margin-left:0; margin-top:.5rem; }
}



/***** Proyectos *****/ 

#projects .card-img-top {
  transition: transform 5s;
}


/* Márgenes de las tarjetas */
.my-3 {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}

/* Estilo de las tarjetas */
.card_proyectos {
  position: relative;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: rgba(238,232,213,.125);
  background-clip: border-box;
  border: 1px solid rgb(181, 137, 0);
  border-radius: 0.40rem;
}

.card-img-container {
  overflow: hidden; /* Oculta cualquier contenido que se salga de la tarjeta */
}

.card-img-top {
  transition: transform 0.3s; /* Agregamos una transición a la propiedad transform */
}

.card-img-container:hover .card-img-top {
  transform: scale(1.3); /* Cuando el mouse está sobre la tarjeta, la imagen hace zoom al 110% */
}


/* Estilo para pantallas de móviles */
@media (min-width: 767px) {
  .container_cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
}