/* Smooth image zoom hover effect for about section profile image */
.about-profile-img {
  border-radius: 50%;
  border: 3px solid #e5e7eb;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
  width: 64px;
  height: 64px;
  object-fit: cover;
  background: #f3f4f6;
  display: block;
  -webkit-transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.about-profile-img:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
/* Smooth image zoom hover effect for about section main image (rectangular, not circular) */
.about-zoom-img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.1);
  -webkit-transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.about-zoom-img:hover {
  -webkit-transform: scale(1.045);
  transform: scale(1.045);
}
/* Glassmorphism style for mobile/tablet stats squares */
#about-mobile-tablet-block .bg-blue-50,
#about-stats-desktop > div {
  background: linear-gradient(
    135deg,
    rgba(240, 241, 243, 0.85) 0%,
    rgba(210, 212, 216, 0.85) 100%
  ) !important;
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.1);
  -webkit-backdrop-filter: blur(8px) saturate(160%);
  backdrop-filter: blur(8px) saturate(160%);
  border-radius: 1rem;
  border: 1px solid rgba(200, 200, 200, 0.18);
  -webkit-transition: box-shadow 0.3s, background 0.3s;
  transition: box-shadow 0.3s, background 0.3s;
}

#about-mobile-tablet-block .bg-blue-50:hover,
#about-stats-desktop > div:hover {
  box-shadow: 0 12px 32px 0 rgba(31, 38, 135, 0.18);
  background: linear-gradient(
    135deg,
    rgba(250, 250, 250, 0.95) 0%,
    rgba(210, 212, 216, 0.95) 100%
  ) !important;
}
/* Glassmorphism style for stat squares */

/* --- About Section Responsive Stats/Buttons Control --- */
#about-stats-desktop,
#about-buttons-desktop {
  display: none;
}
#about-mobile-tablet-block {
  display: block;
}
@media screen and (min-width: 1000px) {
  #about-stats-desktop,
  #about-buttons-desktop {
    display: flex;
  }
  #about-mobile-tablet-block {
    display: none;
  }
}