/* CEO Message Section Spacing Fixes */

/* Fix the large empty space below the CEO image */
.ceo-image {
  height: auto !important; /* Remove fixed height */
  max-height: 400px; /* Set reasonable max height */
}

.ceo-image img {
  height: auto !important; /* Remove fixed height */
  max-height: 400px; /* Set reasonable max height */
  object-fit: cover;
  width: 100%;
}

/* Reduce excessive gaps in the text section */
.ceo-text {
  padding: 0 !important; /* Remove extra padding */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ceo-text .title {
  margin-bottom: 16px !important; /* Reduce from 24px */
}

.ceo-quote {
  margin-bottom: 16px !important; /* Reduce from 20px */
  padding-left: 0 !important; /* Remove left padding */
}

.ceo-description {
  margin-bottom: 20px !important; /* Reduce from 32px */
}

.ceo-signature {
  margin-bottom: 20px !important; /* Reduce from 32px */
  padding: 16px !important; /* Reduce from 20px */
}

/* Better alignment between image and text */
.ceo-content {
  align-items: flex-start !important; /* Align to top instead of center */
  gap: 40px !important; /* Reduce gap from 60px */
}

/* Ensure both columns have similar visual weight */
.ceo-image {
  flex: 0 0 auto; /* Don't grow/shrink */
  width: 100%;
}

.ceo-text {
  flex: 1; /* Take remaining space */
  min-height: 400px; /* Match image height */
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Distribute content evenly */
}

/* Reduce overall section padding */
.ceo-message {
  padding: 10px 0 !important; /* Reduce from 100px */
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .ceo-content {
    gap: 30px !important; /* Reduce gap further on mobile */
  }
  
  .ceo-image img {
    max-height: 300px !important; /* Smaller on mobile */
  }
  
  .ceo-text {
    min-height: auto !important; /* Remove min-height on mobile */
  }
  
  .ceo-message {
    padding: 40px 0 !important; /* Reduce padding on mobile */
  }
}

@media (max-width: 480px) {
  .ceo-content {
    gap: 20px !important; /* Even smaller gap on small mobile */
  }
  
  .ceo-image img {
    max-height: 250px !important; /* Even smaller on small mobile */
  }
  
  .ceo-message {
    padding: 30px 0 !important; /* Minimal padding on small mobile */
  }
}

/* Fix any remaining spacing issues */
.ceo-cta {
  margin-top: auto; /* Push to bottom of flex container */
}

/* Ensure proper spacing between paragraphs */
.ceo-text p {
  margin-bottom: 16px !important; /* Consistent spacing */
}

.ceo-text p:last-of-type {
  margin-bottom: 20px !important; /* Slightly more space before signature */
}

/* Fix signature alignment */
.ceo-signature {
  border: 1px solid #e5e7eb !important; /* Add subtle border */
  border-radius: 8px !important; /* Rounded corners */
  background: #f9fafb !important; /* Light background */
}

/* Ensure the CEO avatar is properly sized */
.ceo-avatar {
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  background: var(--ucl-purple) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  flex-shrink: 0 !important;
}