:root{
  --accent: #7b61ff;
}
/* Gradient text */
.gradient-text{
  background: linear-gradient(90deg,#9b7bff,#6ee7f3,#7b61ff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Force light text for better contrast on dark background */
.cover-container,
.cover-container h1,
.cover-container h2,
.cover-container h3,
.cover-container p,
.cover-container a,
.cover-container li,
.cover-container .card,
.cover-container .card * {
  color: #ffffff !important;
}

.cover-container .text-muted {
  color: rgba(255,255,255,0.62) !important;
}

.cover-container .lead {
  color: rgba(255,255,255,0.72) !important;
}

.cover-container .nav-link {
  color: rgba(255,255,255,0.9) !important;
}

.site-nav{
  min-height:56px;
  padding:0.55rem max(1rem, calc((100vw - 1200px) / 2));
  background:rgba(8,13,25,0.9) !important;
  border-bottom:1px solid rgba(123,97,255,0.18);
  box-shadow:0 8px 24px rgba(0,0,0,0.18);
  backdrop-filter:blur(12px);
}

.site-brand{
  color:#9b7bff !important;
  font-size:1.2rem;
  font-weight:800;
  letter-spacing:0.04em;
  text-shadow:0 0 18px rgba(123,97,255,0.55);
}

.site-nav .navbar-nav{
  gap:0.25rem;
}

.site-nav .nav-link{
  position:relative;
  padding:0.45rem 0.8rem !important;
  border-radius:0.5rem;
  color:rgba(255,255,255,0.7) !important;
  font-size:0.85rem;
  transition:color 0.2s ease, background 0.2s ease;
}

.site-nav .nav-link:hover,
.site-nav .nav-link:focus,
.site-nav .nav-link.active{
  color:#fff !important;
  background:rgba(123,97,255,0.12);
}

.site-nav .nav-link.active::after{
  content:'';
  position:absolute;
  left:0.8rem;
  right:0.8rem;
  bottom:0.15rem;
  height:2px;
  border-radius:2px;
  background:#7b61ff;
  box-shadow:0 0 8px rgba(123,97,255,0.8);
}

.site-nav .navbar-toggler{
  border-color:rgba(155,123,255,0.45);
}

/* Keep the homepage content centered between the navbar and footer. */
.cover-container{
  width:100%;
  max-width:1200px;
  min-height:0;
  height:auto !important;
  flex-shrink:0;
  position:relative;
  z-index:1;
}

.hero-section{
  min-height:clamp(300px, calc(100vh - 520px), 400px);
}

main{
  width:100%;
}

.cover-container > main{
  flex:0 0 auto;
}

section{
  padding-bottom:2rem;
}

/* Larger stacked name styling */
.name-line{
  font-size:clamp(1.75rem, 3.2vw, 2.6rem);
  line-height:0.95;
  letter-spacing: -0.5px;
  text-shadow: 0 6px 18px rgba(0,0,0,0.6);
}

.hero-greeting{
  font-size:clamp(1.5rem, 3vw, 2.4rem);
  line-height:1.05;
}

.hero-role{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  margin-bottom:0.75rem;
  padding:0.3rem 0.65rem;
  border:1px solid rgba(123,97,255,0.25);
  border-radius:999px;
  background:rgba(123,97,255,0.12);
  color:#9b7bff !important;
  font-size:0.7rem;
  font-weight:600;
}

.hero-meta{
  color:rgba(255,255,255,0.72);
  font-size:0.8rem;
}

.hero-meta li{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  white-space:nowrap;
}

.hero-meta i{
  color:#9b7bff;
}

/* Bitmoji wrapper and ring */
.bitmoji-wrap{
  width: 320px;
  height: 320px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:auto;
  position:relative;
}
.bitmoji-img{
  width:260px;
  height:260px;
  object-fit:cover;
  box-shadow: 0 14px 40px rgba(0,0,0,0.7), inset 0 2px 8px rgba(255,255,255,0.02);
  border:8px solid rgba(123,97,255,0.08);
}
.bitmoji-wrap::before{
  content:'';
  position:absolute;
  width:380px;
  height:380px;
  border-radius:50%;
  background: radial-gradient(circle at center, rgba(123,97,255,0.14), rgba(0,0,0,0.15));
  filter: blur(22px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.6);
  z-index:-1;
}

/* Tech badges */
.tech-badge{
  padding:0.45rem 0.7rem;
  border-radius:12px;
  background: rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.04);
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
}

.tech-badge i{
  font-size:1rem;
  line-height:1;
}

.tech-logo{
  width:1rem;
  height:1rem;
  object-fit:contain;
}

.monochrome-logo{
  filter:grayscale(1) brightness(0) invert(1);
}

/* Cards transparent look */
.card.border-secondary{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border-color: rgba(255,255,255,0.06);
}

.cover-container > main > section:first-of-type .row{
  align-items:stretch;
}

.cover-container > main > section:first-of-type .col-md-6{
  display:flex;
}

.cover-container > main > section:first-of-type .card{
  width:100%;
}

.section-heading{
  border-bottom:1px solid rgba(255,255,255,0.1);
  padding-bottom:0.6rem;
}

.section-heading i,
.focus-icon i{
  color:var(--accent);
}

.focus-card{
  display:flex;
  gap:0.75rem;
  min-height:7.5rem;
  padding:1rem;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:0.5rem;
  background:rgba(255,255,255,0.02);
  overflow:hidden;
}

.focus-icon{
  display:grid;
  place-items:center;
  flex:0 0 2.25rem;
  height:2.25rem;
  border:1px solid rgba(123,97,255,0.7);
  border-radius:0.4rem;
  box-shadow:0 0 12px rgba(123,97,255,0.35);
}

.focus-card h6{margin:0 0 0.35rem;font-size:0.85rem;line-height:1.25}
.focus-card p{margin:0;color:rgba(255,255,255,0.6);font-size:0.75rem;line-height:1.4}

.focus-section{
  padding-bottom:0;
  margin-top:0.5rem !important;
  position:relative;
  z-index:2;
}

main > section:first-of-type{
  padding-bottom:0.75rem;
}

/* Buttons */
.btn-primary{
  background:linear-gradient(135deg,#7b61ff,#6845e8);
  border:1px solid rgba(155,123,255,0.65);
  color:#fff !important;
  box-shadow:0 8px 20px rgba(123,97,255,0.24);
}

.btn-primary:hover,
.btn-primary:focus{
  background:linear-gradient(135deg,#8d76ff,#7452f0);
  border-color:#a391ff;
  color:#fff !important;
}

/* Contact page */
.contact-page{
  min-height:calc(100vh - 56px);
  padding:3.5rem 1rem;
  background:radial-gradient(circle at 50% 0%, rgba(123,97,255,0.1), transparent 42%);
}

.contact-container{max-width:760px}

.contact-card{
  padding:clamp(1.5rem, 4vw, 3rem);
  border:1px solid rgba(155,123,255,0.24);
  border-radius:1rem;
  background:rgba(12,18,32,0.72);
  box-shadow:0 18px 55px rgba(0,0,0,0.28), 0 0 35px rgba(123,97,255,0.08);
}

.contact-kicker{
  display:inline-flex;
  gap:0.4rem;
  align-items:center;
  margin-bottom:0.75rem;
  color:#a996ff;
  font-size:0.8rem;
  font-weight:600;
}

.contact-heading h1{margin-bottom:0.5rem;font-size:clamp(2rem, 5vw, 3rem)}
.contact-heading p{margin:0 auto 2rem;max-width:34rem;color:rgba(255,255,255,0.62)}
.contact-card label{color:rgba(255,255,255,0.82);font-size:0.85rem}
.contact-card label span{color:#a996ff}

.contact-card .form-control{
  margin-top:0.35rem;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:0.6rem;
  background:rgba(255,255,255,0.05);
  color:#fff;
  padding:0.75rem 0.9rem;
}

.contact-card .form-control::placeholder{color:rgba(255,255,255,0.38)}
.contact-card .form-control:focus{border-color:#8f78ff;box-shadow:0 0 0 0.2rem rgba(123,97,255,0.18);background:rgba(255,255,255,0.07)}
.contact-card textarea{resize:vertical;min-height:8rem}

.contact-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.55rem;
  width:100%;
  padding:0.75rem 1.25rem;
  border:1px solid rgba(155,123,255,0.65);
  border-radius:0.6rem;
  background:linear-gradient(135deg,#7b61ff,#6845e8);
  color:#fff !important;
  box-shadow:0 8px 20px rgba(123,97,255,0.2);
}

.contact-submit:hover,.contact-submit:focus{background:linear-gradient(135deg,#8d76ff,#7452f0);color:#fff !important}
.contact-alert{max-width:760px;margin:0 auto 1.5rem;padding:0.8rem 1rem;border-radius:0.6rem;display:flex;gap:0.5rem;align-items:center}
.contact-alert-success{border:1px solid rgba(78,210,160,0.4);background:rgba(78,210,160,0.1);color:#9af0cf}
.contact-alert-error{border:1px solid rgba(255,110,130,0.4);background:rgba(255,110,130,0.1);color:#ffb2bd}

/* Experience and achievements pages */
.portfolio-page{
  min-height:calc(100vh - 56px);
  padding:3.5rem 1rem 4rem;
  background:radial-gradient(circle at 50% 0%, rgba(123,97,255,0.1), transparent 40%);
}

.portfolio-container{max-width:1100px}
.page-header{margin-bottom:2rem;max-width:700px}
.page-kicker{display:inline-flex;align-items:center;gap:0.4rem;color:#a996ff;font-size:0.8rem;font-weight:600}
.page-header h1{margin:0.6rem 0;font-size:clamp(2rem,5vw,3.25rem)}
.page-header p{margin:0;color:rgba(255,255,255,0.62);font-size:1rem}

.experience-card,.technology-card,.achievement-card{
  border:1px solid rgba(155,123,255,0.2);
  border-radius:1rem;
  background:rgba(12,18,32,0.72);
  box-shadow:0 18px 55px rgba(0,0,0,0.2);
}

.experience-card{padding:clamp(1.25rem,3vw,2rem)}
.experience-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding-bottom:1.5rem;border-bottom:1px solid rgba(255,255,255,0.1)}
.company-label,.achievement-label{color:#a996ff;font-size:0.8rem;font-weight:600;text-transform:uppercase;letter-spacing:0.08em}
.experience-heading h2{margin:0.35rem 0 0;font-size:clamp(1.5rem,3vw,2.25rem)}
.experience-date{text-align:right;color:rgba(255,255,255,0.7);font-size:0.85rem;line-height:1.8}
.experience-date i{color:#9b7bff}.experience-date span{color:rgba(255,255,255,0.55)}
.experience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin-top:1.5rem}
.experience-block h3{font-size:1rem;margin:0 0 0.75rem;color:#fff}.experience-block h3 i{color:#9b7bff;margin-right:0.4rem}
.experience-block ul{margin:0;padding-left:1.15rem;color:rgba(255,255,255,0.62);font-size:0.88rem;line-height:1.6}.experience-block li+li{margin-top:0.45rem}
.technology-card{margin-top:1.5rem;padding:1.5rem 2rem}.technology-card h2{font-size:1.25rem;margin-bottom:1.25rem}.technology-card h2 i{color:#9b7bff;margin-right:0.4rem}
.technology-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.technology-groups div{padding:0.85rem;border:1px solid rgba(255,255,255,0.08);border-radius:0.6rem;background:rgba(255,255,255,0.02)}.technology-groups h3{font-size:0.8rem;color:#a996ff;margin:0 0 0.35rem}.technology-groups p{font-size:0.82rem;color:rgba(255,255,255,0.65);margin:0;line-height:1.5}
.achievement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.achievement-card{display:flex;gap:1rem;padding:1.4rem}.achievement-card h2{font-size:1.1rem;margin:0.35rem 0 0.5rem}.achievement-card p{color:rgba(255,255,255,0.62);font-size:0.88rem;line-height:1.55;margin:0}.achievement-icon{display:grid;place-items:center;flex:0 0 2.8rem;height:2.8rem;border:1px solid rgba(123,97,255,0.7);border-radius:0.6rem;color:#9b7bff;box-shadow:0 0 16px rgba(123,97,255,0.25)}
.featured-achievement{background:linear-gradient(135deg,rgba(123,97,255,0.14),rgba(12,18,32,0.72))}

.experience-page{padding-top:2.25rem;padding-bottom:2.5rem}
.experience-page .experience-card{padding:1.35rem 1.5rem}
.experience-page .experience-heading{padding-bottom:1rem}
.experience-page .experience-grid{gap:1.15rem;margin-top:1.15rem}
.experience-page .experience-block h3{font-size:0.92rem;margin-bottom:0.5rem}
.experience-page .experience-block ul{font-size:0.8rem;line-height:1.45}
.experience-page .experience-block li+li{margin-top:0.25rem}
.experience-page .technology-card{margin-top:1rem;padding:1.2rem 1.5rem}
.experience-page .technology-card h2{font-size:1.1rem;margin-bottom:0.9rem}
.experience-page .technology-groups{gap:0.75rem}
.experience-page .technology-groups div{padding:0.7rem}
.experience-page .technology-groups p{font-size:0.76rem}

.resume-btn{
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  border:1px solid rgba(123,97,255,0.7) !important;
  border-radius:999px;
  color:#b4a5ff !important;
  background:rgba(123,97,255,0.08);
  transition:background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.resume-btn:hover,
.resume-btn:focus{
  border-color:#9b7bff !important;
  background:rgba(123,97,255,0.2);
  color:#fff !important;
}

@media (max-width:767px){
  .hero-section{min-height:auto;padding-top:2rem}
  .cover-container{padding-left:1rem !important;padding-right:1rem !important}
  .bitmoji-wrap{width:200px;height:200px}
  .bitmoji-img{width:160px;height:160px}
  .portfolio-page{padding-top:2.25rem}
  .experience-heading{display:block}
  .experience-date{text-align:left;margin-top:0.75rem}
  .experience-grid,.achievement-grid,.technology-groups{grid-template-columns:1fr}
  .technology-card{padding:1.25rem}
}