/* JahedTech Custom Styling */
:root {
  --primary: #06b6d4;      /* Cyan 500 */
  --primary-hover: #22d3ee;/* Cyan 400 */
  --accent: #10b981;       /* Emerald 500 */
  --surface: #0f172a;      /* Slate 900 */
  --surface-card: #1e293b; /* Slate 800 */
  --border: #334155;       /* Slate 700 */
}

/* Background Subtle Grid Effect */
.bg-circuit-grid {
  background-color: #020617;
  background-image: 
    radial-gradient(rgba(6, 182, 212, 0.08) 1px, transparent 1px),
    radial-gradient(rgba(16, 185, 129, 0.05) 1px, transparent 1px);
  background-size: 32px 32px;
  background-position: 0 0, 16px 16px;
}

/* Glow effects */
.glow-cyan {
  box-shadow: 0 0 25px -5px rgba(6, 182, 212, 0.25);
}

.glow-emerald {
  box-shadow: 0 0 25px -5px rgba(16, 185, 129, 0.25);
}

.hover-glow:hover {
  box-shadow: 0 0 30px -5px rgba(6, 182, 212, 0.35);
  border-color: rgba(6, 182, 212, 0.5);
}

/* Video Embed Wrapper (16:9 ratio) */
.video-responsive {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  border-radius: 0.75rem;
  background-color: #0b0f19;
  border: 1px solid #1e293b;
}

.video-responsive iframe,
.video-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Hackster.io-style Bill of Materials styling */
.bom-table th {
  background-color: rgba(15, 23, 42, 0.8);
  font-family: 'Fira Code', monospace;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
}

.bom-table tr:hover td {
  background-color: rgba(30, 41, 59, 0.4);
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #020617;
}
::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #06b6d4;
}

/* Code block formatting */
pre code {
  font-family: 'Fira Code', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 0.875rem !important;
  line-height: 1.6 !important;
}

/* Badge pulse animation */
@keyframes pulse-subtle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.85; transform: scale(1.02); }
}

.animate-pulse-subtle {
  animation: pulse-subtle 3s infinite ease-in-out;
}

/* Smooth Image Transitions */
.project-img-zoom {
  transition: transform 0.4s ease, filter 0.4s ease;
}
.project-card:hover .project-img-zoom {
  transform: scale(1.04);
}