/*
 * CV Section Styles
 * Container box styling matching Hugo reference design
 */

/* CV Preview Container - Main bordered box */
.cv-preview {
  background: rgba(255, 255, 255, 0.03); /* var(--card-bg) */
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 1rem; /* 16px rounded corners */
  padding: 2rem; /* 32px mobile padding */
  max-width: 1280px;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .cv-preview {
    padding: 3rem; /* 48px desktop padding */
  }
}

/* CV Intro Section */
.cv-intro {
  margin-bottom: 2rem; /* 32px spacing */
}

.cv-intro p {
  color: #B0B0B0; /* var(--text-secondary) */
  font-size: 1.125rem; /* 18px */
  line-height: 1.625;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .cv-intro p {
    font-size: 1rem; /* 16px on mobile */
  }
}

/* CV Expertise Section */
.cv-expertise {
  margin-bottom: 2rem; /* 32px spacing */
}

.expertise-heading {
  color: #8EADCF !important; /* var(--accent) */
  text-transform: none !important;
  letter-spacing: normal !important;
  font-size: 1.8rem !important; /* 28.8px */
  margin-bottom: 1.5rem !important; /* 24px */
  font-weight: 300;
  text-align: center;
}

@media (max-width: 768px) {
  .expertise-heading {
    font-size: 1.4rem !important; /* 22.4px on mobile */
    letter-spacing: 2px;
  }
}

/* Expertise Grid - 2 columns on desktop, 1 on mobile */
.expertise-grid {
  display: grid;
  gap: 1.5rem; /* 24px between items */
}

@media (min-width: 768px) {
  .expertise-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Expertise Items - Individual cards with hover effects */
.expertise-item {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0.5rem; /* 8px rounded corners */
  padding: 1.5rem; /* 24px padding */
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.expertise-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.expertise-item h4 {
  color: #F5F5F5; /* var(--text) */
  margin-bottom: 0.5rem; /* 8px */
  font-weight: 500;
  font-size: 1.125rem; /* 18px */
}

.expertise-item p {
  color: #B0B0B0; /* var(--text-secondary) */
  font-size: 0.95rem; /* 15.2px */
  line-height: 1.6;
  margin-bottom: 0;
}

/* CV CTA Section */
.cv-cta {
  margin-top: 2rem; /* 32px top spacing */
  padding-top: 2rem; /* 32px top padding */
  text-align: center;
}

/* Note: .btn-outline styles have been moved to site.css for global application */

/* Accessibility - Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  .expertise-item {
    transition: none;
  }

  .expertise-item:hover {
    transform: none;
  }
}