.events--wrapper {
  margin: 0 auto;
  max-width: 96rem;
}

.events .col-2-30-70 {
  gap: var(--gap-32) var(--gap-32);
}

.events__heading {
  margin: 0 auto;
  max-width: 76.7rem;
  text-align: center;
}

.events__heading .buttons {
  justify-content: center;
}

.events__event {
  display: flex;
  flex-direction: column;
  row-gap: var(--gap-24);
}

.events__event-inner {
  background-color: var(--white);  
  border: 1px solid var(--color-typography);
  border-radius: var(--border-radius);
  column-gap: var(--gap-48);  
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Distribute space between elements */
  height: 100%; /* Ensure card takes full height */ 
  padding: var(--gap-32);
  position: relative;
}

.events__event-inner :where(h3, p) {
  margin-bottom: 0;
}

.events__event-inner img {
  border-radius: var(--border-radius);  
  height: 100% !important; 
  max-width: 100% !important;
  object-fit: cover;
}

.events__event-content {
  display: flex;
  flex-direction: column;
  row-gap: var(--gap-24);
  width: 100%;
}

.events__image {
  position: relative
}

.events--tag {
  background-color: var(--turquoise);
  border-radius: var(--border-radius);
  font-weight: 700;
  right: var(--gap-24);
  padding: 0.4rem 1.2rem;
  position: absolute;
  top: -1.4rem;
}

.events__price {
  align-items: flex-end;
  border-top: 1px solid var(--color-typography);  
  display: flex;
  justify-content: space-between;
  margin-top: var(--gap-24);
  padding-top: var(--gap-24);
}

.events__price span:first-of-type {
  margin-right: var(--gap-8);
}

.events__date {
  display: flex;
  gap: var(--gap-48)
}

.events__date-inner {
  display: flex;
  flex-direction: column;
  gap: var(--gap-8); 
}

.events__duration {
  display: flex;
  flex-direction: column;
  gap: var(--gap-8); 
}

@media screen and (max-width: 1023px) {
  .events__price {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--gap-12);
  }

@media screen and (max-width: 767px) {
  .events__event {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    width: 100%;
  }
  
  .events__event-inner {
    flex-direction: column;
    padding: var(--gap-24);    
  }
}