/* 
   ============================================================
   MAIN STYLESHEET - Portfolio Modular Architecture
   ============================================================
*/

/* NOTE: Sub-stylesheets (base, components, sections) are linked directly
   in index.html for maximum compatibility with local viewing. */

/* 
   ============================================================
   UNIFIED SECTION HEADERS & SHIMMER EFFECTS
   ============================================================
*/
#projects h2,
#experience h2,
#skills h2,
#contact h2,
.about-glass-card h2 {
  font-family: "Cinzel", serif !important;
  font-weight: 700 !important;
  font-size: 2.2rem !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
  background: linear-gradient(120deg, #fff 0%, #c4b5fd 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  margin-bottom: 2.5rem !important;
  text-align: center !important;
  position: relative !important;
  display: inline-block !important;
}

#projects h2::after,
#experience h2::after,
#skills h2::after,
#contact h2::after,
.about-glass-card h2::after {
  content: "" !important;
  position: absolute !important;
  width: 60px !important;
  height: 3px !important;
  background: linear-gradient(90deg, transparent, #8b5cf6, transparent) !important;
  bottom: -10px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  border-radius: 2px !important;
  animation: shimmerLine 2.5s linear infinite !important;
}

@keyframes shimmerLine {
  0% { opacity: 0.3; width: 30px; }
  50% { opacity: 1; width: 60px; }
  100% { opacity: 0.3; width: 30px; }
}

@media (max-width: 768px) {
  #projects h2,
  #experience h2,
  #skills h2,
  #contact h2,
  .about-glass-card h2 {
    font-size: 1.6rem !important;
    letter-spacing: 2px !important;
  }
}