/* ---------- VARIABLES ---------- */
:root{
  --bg-1: #2d1b69;
  --bg-2: #1a0b3d;
  --glass: rgba(255,255,255,0.05);
  --muted: #e2e8f0;
  --accent1: #f59e0b; /* orange */
  --accent2: #10b981; /* emerald */
  --accent-grad: linear-gradient(90deg,var(--accent1),var(--accent2));
  --card-radius: 14px;
  --container: 1100px;
}

/* ---------- RESET ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family: 'Poppins',system-ui,Arial;
  color:#e6eef8;
  background:
    radial-gradient(800px 400px at 10% 10%, rgba(124,77,255,0.06), transparent),
    radial-gradient(700px 350px at 90% 80%, rgba(56,189,248,0.03), transparent),
    linear-gradient(180deg,var(--bg-1),var(--bg-2));
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}

/* ---------- LAYOUT ---------- */
.container{width:90%;max-width:var(--container);margin:0 auto;padding:0 12px}

/* ---------- NAV ---------- */
.site-header{position:sticky;top:0;z-index:60;backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,0.02)}
.nav-container{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{display:flex;align-items:center;gap:10px}
.brand-code{background:rgba(0,0,0,0.18);padding:8px;border-radius:8px;color:var(--accent2);font-family:'Roboto Mono'}
.brand-name{font-weight:700;color:var(--accent2)}
.nav ul{display:flex;gap:22px;list-style:none}
.nav a{color:var(--muted);text-decoration:none;font-weight:600}
.nav a:hover{color:var(--accent2)}
.nav-actions{display:flex;gap:12px;align-items:center}
.resume-btn{background:var(--accent-grad);padding:8px 12px;border-radius:12px;color:#051025;text-decoration:none;font-weight:700;box-shadow:0 6px 18px rgba(60,50,120,0.14)}
.theme-btn{background:transparent;border:1px solid rgba(255,255,255,0.04);padding:8px 10px;border-radius:10px;color:var(--muted);cursor:pointer}

/* ---------- FLOATING BACKGROUND WORDS ---------- */
.floating-bg{position:fixed;inset:0;pointer-events:none;z-index:0}
.floating-bg .word{
  position:absolute;font-weight:900;color:rgba(255,255,255,0.06);
  font-size:clamp(28px,6vw,96px);mix-blend-mode:overlay;
  animation: floatWord linear infinite;
  filter:blur(0.5px);
}
.floating-bg .word:nth-child(1){left:6%;top:22%;animation-duration:18s}
.floating-bg .word:nth-child(2){left:72%;top:36%;animation-duration:22s}
.floating-bg .word:nth-child(3){left:28%;top:66%;animation-duration:20s}
.floating-bg .word:nth-child(4){left:84%;top:10%;animation-duration:24s}
.floating-bg .word:nth-child(5){left:48%;top:78%;animation-duration:26s}
@keyframes floatWord{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-40px) rotate(10deg)}100%{transform:translateY(0) rotate(0)}}

/* ---------- HERO ---------- */
/* Hero Section */
.hero h1 {
  font-size: 3.8rem; /* Bigger main heading */
  font-weight: 800;
  margin-bottom: 15px;
  color: #fff;
}

.hero h2.role {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 20px;
  color: #ccc;
}

/* Glowing Circular Photo */
.photo-glow {
  width: 230px;
  height: 230px;
  border-radius: 50%;
  overflow: hidden;
  border: 6px solid #000; /* black circle */
  box-shadow: 0 0 25px rgba(138, 43, 226, 0.8), 
              0 0 50px rgba(0, 191, 255, 0.6);
  animation: glowPulse 3s infinite alternate;
}

.photo-glow img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Glow animation */
@keyframes glowPulse {
  from {
    box-shadow: 0 0 15px rgba(138, 43, 226, 0.7),
                0 0 30px rgba(0, 191, 255, 0.5);
  }
  to {
    box-shadow: 0 0 30px rgba(138, 43, 226, 1),
                0 0 60px rgba(0, 191, 255, 0.9);
  }
}


/* CTAs */
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px;align-items:center}
.btn{padding:10px 16px;border-radius:10px;font-weight:700;border:1px solid rgba(255,255,255,0.04);cursor:pointer;text-decoration:none}
.btn.primary{background:var(--accent-grad);color:#031226;box-shadow:0 12px 30px rgba(124,77,255,0.12)}
.btn.outline{background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;box-shadow:0 8px 20px rgba(102,126,234,0.3);position:relative;overflow:hidden}
.btn.outline:hover{background:linear-gradient(135deg,#764ba2,#667eea);transform:translateY(-2px);box-shadow:0 12px 25px rgba(102,126,234,0.4)}
.btn.outline::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left 0.5s}
.btn.outline:hover::before{left:100%}
.socials{display:flex;gap:8px;margin-left:12px}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:8px;background:rgba(255,255,255,0.02);color:var(--muted);text-decoration:none}
.socials a:hover{color:var(--accent2);transform:translateY(-4px)}

/* Hero Social Icons */
.hero-socials{display:flex;gap:15px;margin-top:20px;justify-content:flex-start}
.hero-socials a{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:12px;text-decoration:none;font-size:1.5rem;transition:all 0.3s ease;transform:translateY(0)}
.hero-socials a:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.3)}

.social-github{background:linear-gradient(135deg,#333,#24292e);color:#fff}
.social-github:hover{background:linear-gradient(135deg,#24292e,#000)}

.social-linkedin{background:linear-gradient(135deg,#0077b5,#005885);color:#fff}
.social-linkedin:hover{background:linear-gradient(135deg,#005885,#004066)}

.social-leetcode{background:linear-gradient(135deg,#ffa116,#ff8c00);color:#fff}
.social-leetcode:hover{background:linear-gradient(135deg,#ff8c00,#e67e00)}

/* Role Highlighting */
.role-highlight{background:linear-gradient(135deg,#ff6b6b,#4ecdc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative}
.role-highlight::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:2px;background:linear-gradient(135deg,#ff6b6b,#4ecdc4);border-radius:2px}

/* HERO LAYOUT */
.hero-inner{display:grid;grid-template-columns:2fr 1fr;gap:40px;align-items:center;min-height:80vh}

/* PHOTO GLOW */
.photo-glow{width:400px;height:400px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 30px 120px rgba(60,40,120,0.25);position:relative;overflow:visible}
.photo-glow::before{
  content:"";position:absolute;inset:-25px;border-radius:50%;
  background:conic-gradient(from 120deg,var(--accent1),var(--accent2));filter:blur(40px);opacity:0.8
}
.photo-glow img{width:360px;height:360px;border-radius:50%;object-fit:cover;border:8px solid rgba(0,0,0,0.35);position:relative;z-index:2}

/* ---------- ABOUT ---------- */
.about{padding:60px 0;border-bottom:2px solid rgba(255,255,255,0.1)}
.section-title{text-align:center;font-size:34px;background:var(--accent-grad);-webkit-background-clip:text;color:transparent;margin-bottom:10px}
.section-sub{text-align:center;color:var(--muted);margin-bottom:30px}
.about-grid{display:grid;grid-template-columns:1fr 520px;gap:28px;align-items:start}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.015), rgba(255,255,255,0.01));border-radius:var(--card-radius);padding:24px;border:1px solid rgba(255,255,255,0.03);box-shadow:0 8px 30px rgba(2,6,23,0.6)}
.card h3{margin-bottom:12px}
.journey p{color:var(--muted);margin-bottom:12px}
.mini-stats{display:flex;gap:18px;margin-top:12px}
.mini-stat-link{text-decoration:none;color:inherit;transition:transform 0.3s ease}
.mini-stat-link:hover{transform:translateY(-3px)}
.mini-stats div{background:rgba(255,255,255,0.02);padding:12px;border-radius:10px;text-align:center;min-width:120px;cursor:pointer;transition:all 0.3s ease}
.mini-stat-link:hover div{background:rgba(255,255,255,0.08);box-shadow:0 4px 15px rgba(0,0,0,0.2)}
.mini-stats strong{display:block;font-size:20px;color:var(--accent2)}

/* ---------- SKILLS (inside about card) ---------- */
.skills-card .skill-group{margin-top:16px}
.skills-card h4{color:var(--accent1);margin-bottom:12px}
.skill{margin-bottom:14px}
.skill-label{display:flex;justify-content:space-between;color:var(--muted);margin-bottom:6px;font-weight:600}
.progress{height:10px;background:rgba(255,255,255,0.04);border-radius:999px;overflow:hidden}
.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--accent1),var(--accent2));border-radius:999px;transition:width 1.2s cubic-bezier(.2,.9,.25,1)}

/* ---------- PROJECTS ---------- */
.projects{padding:60px 0;border-bottom:2px solid rgba(255,255,255,0.1)}
.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.project{border-radius:12px;overflow:hidden;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.03)}
.project img{width:100%;height:160px;object-fit:cover;display:block}
.project-body{padding:14px}
.project-links a{color:var(--accent2);margin-right:8px}

/* ---------- INTERNSHIPS ---------- */
.internships{padding:60px 0;border-bottom:2px solid rgba(255,255,255,0.1)}
.internships-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:25px;margin-top:30px}
.internship-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.04));border:1px solid rgba(255,255,255,0.05);border-radius:var(--card-radius);padding:24px;box-shadow:0 6px 20px rgba(0,0,0,0.3);transition:transform 0.3s ease, box-shadow 0.3s ease}eat(auto-fit,minmax(320px,1fr));gap:25px;margin-top:30px}
.internship-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.04));border:1px solid rgba(255,255,255,0.05);border-radius:var(--card-radius);padding:24px;box-shadow:0 6px 20px rgba(0,0,0,0.3);transition:transform 0.3s ease, box-shadow 0.3s ease}
.internship-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.4)}
.internship-header{display:flex;align-items:center;gap:15px;margin-bottom:15px}
.company-logo{width:50px;height:50px;background:var(--accent-grad);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem}
.internship-info h3{color:#fff;margin-bottom:5px;font-size:1.2rem}
.internship-info h4{color:var(--accent2);margin-bottom:5px;font-size:1rem}
.duration{color:var(--muted);font-size:0.9rem}
.internship-description p{color:var(--muted);margin-bottom:15px;line-height:1.6}
.skills-used{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:15px}
.skill-tag{background:rgba(255,255,255,0.1);color:var(--accent2);padding:4px 10px;border-radius:15px;font-size:0.8rem;font-weight:600}
.internship-actions{margin-top:15px}
.internship-actions .btn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font-size:0.9rem}

/* Internship Filter Buttons */
.internship-filter-buttons{display:flex;justify-content:center;gap:15px;margin:30px 0;flex-wrap:wrap}
.internship-filter-buttons .filter-btn{padding:12px 25px;border:none;border-radius:25px;cursor:pointer;font-weight:600;font-size:1rem;transition:all 0.3s ease;box-shadow:0 4px 15px rgba(0,0,0,0.2)}
.internship-filter-buttons .filter-btn:nth-child(1){background:linear-gradient(135deg,#667eea,#764ba2);color:white}
.internship-filter-buttons .filter-btn:nth-child(2){background:linear-gradient(135deg,#f093fb,#f5576c);color:white}
.internship-filter-buttons .filter-btn:nth-child(3){background:linear-gradient(135deg,#4facfe,#00f2fe);color:white}
.internship-filter-buttons .filter-btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.3)}
.internship-filter-buttons .filter-btn.active{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,0.4);filter:brightness(1.1)}

/* Internship Type Badges */
.internship-type{display:inline-block;padding:3px 8px;border-radius:12px;font-size:0.7rem;font-weight:700;margin-left:8px}
.internship-type.virtual{background:linear-gradient(135deg,#f093fb,#f5576c);color:white}
.internship-type.live{background:linear-gradient(135deg,#4facfe,#00f2fe);color:white}


/* Certifications Section */
/* ---------- CERTIFICATIONS (updated to card layout) ---------- */
#certifications {
  padding: 60px 20px;
  text-align: center;
}

#certifications .section-title {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 30px;
  background: linear-gradient(90deg, var(--accent1), var(--accent2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Grid layout */
.certifications-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 25px;
  margin-top: 30px;
}

/* Card style */
.certificate-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.04));
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: var(--card-radius);
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.certificate-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}

/* Thumbnail image */
.certificate-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* Ensure all certificate images are square */
.certifications-grid .certificate-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

/* Card content */
.certificate-info {
  padding: 16px;
}

.certificate-info h3 {
  font-size: 1.2rem;
  margin-bottom: 8px;
  color: #fff;
}

.certificate-info p {
  font-size: 0.95rem;
  color: var(--muted);
  margin-bottom: 12px;
}

/* Button */
.certificate-info .btn {
  display: inline-block;
  padding: 8px 14px;
  font-size: 0.9rem;
  font-weight: 600;
  background: var(--accent-grad);
  color: #031226;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.certificate-info .btn:hover {
  background: linear-gradient(90deg, var(--accent2), var(--accent1));
}

/* PDF preview for certificates */
.pdf-preview {
  width: 100%;
  height: 180px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  overflow: hidden;
}

.pdf-preview embed {
  width: 100%;
  height: 100%;
  border: none;
  pointer-events: none;
}

.services {
  padding: 80px 0;
  text-align: center;
  border-bottom:2px solid rgba(255,255,255,0.1);
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 40px;
}

.service-card {
  background: #0f172a;
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 12px 25px rgba(0,0,0,0.4);
}

.service-card .icon {
  font-size: 2rem;
  margin-bottom: 15px;
  color: #38bdf8; /* change color for each card if you like */
}



/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:360px 1fr;gap:20px;margin-top:18px}
.contact-card .muted{color:var(--muted)}
.contact-form label{display:block;margin-bottom:10px;font-weight:600;color:var(--muted)}
.contact-form input,.contact-form textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,0.03);background:transparent;color:var(--text)}
.contact-form .btn.primary{padding:10px 16px}

/* ---------- FOOTER ---------- */
.site-footer{text-align:center;padding:30px 0;margin-top:40px;color:var(--muted)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .hero-inner{grid-template-columns:1fr 320px}
  .photo-glow{width:300px;height:300px}
  .photo-glow img{width:270px;height:270px}
  .about-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .nav ul{display:none}
  .brand-name{font-size:14px}
  .hero-inner{grid-template-columns:1fr;gap:18px}
  .photo-glow{width:240px;height:240px}
  .photo-glow img{width:200px;height:200px}
  .floating-bg .word{font-size:36px}
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Section fade-in on load */
.section {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease-in-out;
}

.section.show {
  opacity: 1;
  transform: translateY(0);
}

/* Smooth hover effects */
.card, .btn, a {
  transition: all 0.3s ease;
}

.card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/* Progress bars (Core Skills) */
.progress {
  height: 10px;
  background: rgba(255,255,255,0.04);
  border-radius: 999px;
  overflow: hidden;
}

.skill {
  margin-bottom: 20px;
}

.skill-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
  font-size: 14px;
  color: #fff;
}

.progress {
  background: #2a2a40; /* dark background behind bar */
  border-radius: 6px;
  overflow: hidden;
  height: 10px;
}

.progress-fill {
  height: 100%;
  width: 0; /* will be animated with JS */
  background: linear-gradient(90deg, #a855f7, #3b82f6); /* purple → blue */
  border-radius: 6px;
  transition: width 1.5s ease-in-out;
}



.skill-bar {
  position: relative;
  height: 8px;
  background: #1a1a1a; /* dark background */
  border-radius: 4px;
  overflow: hidden;
}

.skill-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 1s ease-in-out;
}

.skill-fill.lightblue-purple {
  background: linear-gradient(90deg, #4facfe, #8e44ad); /* light blue → purple */
}
.progress {
  background: #2a2a40; /* dark bar background */
  border-radius: 6px;
  overflow: hidden;
  height: 10px;
}

.progress-fill {
  height: 100%;
  width: 0; /* animate later */
  background: linear-gradient(90deg, #a855f7, #3b82f6); /* purple → blue gradient */
  border-radius: 6px;
  transition: width 1.5s ease-in-out;
}
/* General Layout */
#skills {
  text-align: center;
  padding: 40px;
  color: #fff;
}

.section-title {
  font-size: 2rem;
  margin-bottom: 20px;
  background: linear-gradient(90deg, #7f00ff, #00bfff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.skill-group {
  margin: 30px auto;
  max-width: 600px;
}

.group-title {
  font-size: 1.4rem;
  margin-bottom: 15px;
  background: linear-gradient(90deg, #7f00ff, #00bfff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* General Layout */
#skills {
  padding: 40px;
  color: #fff;
  text-align: center; /* keeps bars + percentages centered */
}

.section-title {
  font-size: 2rem;
  margin-bottom: 20px;
  background: linear-gradient(90deg, #7f00ff, #00bfff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center; /* stays centered */
}

.skill-group {
  margin: 30px auto;
  max-width: 600px;
}

.group-title {
  font-size: 1.4rem;
  margin-bottom: 15px;
  background: linear-gradient(90deg, #7f00ff, #00bfff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: left;   /* 👈 aligned left */
}

.skill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 12px 0;
  font-size: 1rem;
}

.skill span:first-child {
  width: 150px;
  text-align: left;
}

.skill span:last-child {
  width: 50px;
  text-align: right;
}

.progress {
  flex: 1;
  height: 10px;
  margin: 0 10px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  width: var(--percent, 0%);
  background: linear-gradient(90deg, #7f00ff, #00bfff);
  border-radius: 5px;
  transition: width 1s ease-in-out;
}

/* Certificate Modal */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.9);
}

.modal-content {
  position: relative;
  margin: auto;
  display: block;
  width: 90%;
  max-width: 800px;
  top: 50%;
  transform: translateY(-50%);
}

.modal-content img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.close {
  position: absolute;
  top: -40px;
  right: 0;
  color: #fff;
  font-size: 35px;
  font-weight: bold;
  cursor: pointer;
}

.close:hover {
  color: var(--accent2);
}

/* Project Image Overlay */
.project-image-container {
  position: relative;
  overflow: hidden;
  height: 150px;
}

.project-image-container img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.project-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.project-image-container:hover .project-overlay {
  opacity: 1;
}

.overlay-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 15px;
  background: var(--accent-grad);
  color: #fff;
  text-decoration: none;
  border-radius: 8px;
  transition: transform 0.3s ease;
}

.overlay-btn:hover {
  transform: translateY(-3px);
}

.overlay-btn i {
  font-size: 1.5rem;
}

.overlay-btn span {
  font-size: 0.9rem;
  font-weight: 600;
}

/* Certificate Filter Buttons */
.cert-filter-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 40px 0;
  flex-wrap: wrap;
}

.filter-btn {
  padding: 15px 30px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  font-weight: 700;
  font-size: 1.1rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
  transform: translateY(0);
}

.filter-btn:nth-child(1) {
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: white;
}

.filter-btn:nth-child(2) {
  background: linear-gradient(135deg, #f093fb, #f5576c);
  color: white;
}

.filter-btn:nth-child(3) {
  background: linear-gradient(135deg, #4facfe, #00f2fe);
  color: white;
}

.filter-btn:nth-child(4) {
  background: linear-gradient(135deg, #43e97b, #38f9d7);
  color: white;
}

.filter-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

.filter-btn.active {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.4);
  filter: brightness(1.1);
}

/* Certificate Buttons */
.cert-buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.btn.badge {
  background: linear-gradient(135deg, #ff6b6b, #feca57);
  color: #fff;
  border: none;
  font-size: 0.85rem;
}

.btn.badge:hover {
  background: linear-gradient(135deg, #ff5252, #ffb300);
  transform: translateY(-2px);
}

/* Responsive for internships */
@media (max-width:700px){
  .internships-grid{grid-template-columns:1fr}
  .internship-header{flex-direction:column;text-align:center}
  .company-logo{margin-bottom:10px}
}