/* Modern Home Styles */
#hero {
  min-height: 90vh;
  display: flex;
  align-items: center;
  background: radial-gradient(circle at top right, hsla(var(--primary-h), var(--primary-s), var(--primary-l), 0.05), transparent),
    radial-gradient(circle at bottom left, hsla(var(--accent-h), var(--accent-s), var(--accent-l), 0.05), transparent),
    var(--bg-main);
  padding: 0;
  overflow: hidden;
  position: relative;
}

html.dark-mode #hero {
  background: radial-gradient(circle at top right, hsla(var(--primary-h), var(--primary-s), var(--primary-l), 0.15), transparent),
    radial-gradient(circle at bottom left, hsla(var(--accent-h), var(--accent-s), var(--accent-l), 0.15), transparent),
    var(--bg-main);
}

#hero::before {
  content: '';
  position: absolute;
  width: 150%;
  height: 150%;
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%232563EB' fill-opacity='0.03' d='M44.7,-76.4C58.1,-69.2,69.2,-58.1,76.4,-44.7C83.7,-31.4,87.1,-15.7,85.8,-0.7C84.6,14.3,78.7,28.6,70.5,41.4C62.3,54.2,51.8,65.6,39.1,73.4C26.4,81.3,13.2,85.6,-0.6,86.6C-14.4,87.6,-28.8,85.3,-41.8,78.1C-54.8,70.9,-66.4,58.8,-73.9,45C-81.4,31.2,-84.8,15.6,-84.6,0.1C-84.4,-15.4,-80.6,-30.8,-72.6,-44C-64.6,-57.2,-52.4,-68.2,-38.7,-75.2C-25,-82.2,-12.5,-85.2,1.3,-87.4C15.1,-89.6,30.2,-83.6,44.7,-76.4Z' transform='translate(100 100)' /%3E%3C/svg%3E") no-repeat center;
  animation: blob-float 20s infinite alternate linear;
  z-index: -1;
}

@keyframes blob-float {
  from {
    transform: translate(-10%, -10%) rotate(0deg);
  }

  to {
    transform: translate(10%, 10%) rotate(360deg);
  }
}

.hero-content {
  max-width: 800px;
}

.hero-content h1 {
  margin-bottom: 1.5rem;
  line-height: 1.1;
}

.hero-content p {
  font-size: 1.25rem;
  margin-bottom: 2.5rem;
  max-width: 600px;
}

/* Expertise Section */
.expertise-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
}

.card-icon {
  width: 60px;
  height: 60px;
  background: hsla(var(--primary-h), var(--primary-s), var(--primary-l), 0.1);
  color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  transition: var(--transition);
}

.card:hover .card-icon {
  background: var(--primary);
  color: white;
  transform: scale(1.1) rotate(5deg);
}

/* Profiles */
.about-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.profile-image {
  width: 100%;
  max-width: 500px;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  border: 4px solid var(--bg-surface);
}

@media (max-width: 768px) {
  .about-content {
    grid-template-columns: 1fr;
    text-align: center;
  }
}