 *{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:"Segoe UI",sans-serif;
}

body{
  background:#f5f7fb;
  color:#333;
}
.logo {
  display: flex;
  align-items: center;
}

.logo img {
  height: 50px;        /* perfect navbar height */
  width: auto;
  object-fit: contain;
}


/* NAVBAR */
.navbar{
  display:flex;
  justify-content:space-between;
  padding:20px 8%;
  background:#fff;
  box-shadow:0 4px 25px rgba(0,0,0,.1);
  position:sticky;
  top:0;
  z-index:999;
}

.logo{
  font-size:22px;
  font-weight:700;
  color:#003366;
}

nav a{
  margin-left:22px;
  text-decoration:none;
  font-weight:600;
  color:#333;
}

nav a.active{
  color:#007bff;
}

/* HERO */
.team-hero{
  height:70vh;
  background:url("https://images.pexels.com/photos/4145193/pexels-photo-4145193.jpeg") center/cover no-repeat;
  position:relative;
}

.team-hero .overlay{
  background:rgba(0,0,0,0.65);
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  color:white;
  text-align:center;
}

.team-hero h1{
  font-size:52px;
}

.team-hero p{
  font-size:22px;
  margin-top:10px;
}

/* INTRO */
.team-intro{
  padding:80px 12%;
  text-align:center;
}

.team-intro h2{
  font-size:38px;
  margin-bottom:20px;
}

.team-intro p{
  font-size:18px;
  line-height:1.7;
  max-width:900px;
  margin:auto;
}

/* TEAM GRID */
.team-section{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:35px;
  padding:70px 10%;
}

.team-card{
  background:white;
  padding:30px;
  border-radius:20px;
  text-align:center;
  box-shadow:0 15px 35px rgba(0,0,0,.15);
  transition:.3s;
}

.team-card:hover{
  transform:translateY(-12px);
}

.team-card img{
  width:160px;
  height:160px;
  object-fit:cover;
  border-radius:50%;
  margin-bottom:15px;
  box-shadow:0 10px 25px rgba(0,0,0,.2);
}

.team-card h3{
  font-size:22px;
  margin-bottom:5px;
  color:#003366;
}

.role{
  font-weight:600;
  color:#555;
  margin-bottom:8px;
}

.qualification{
  font-size:15px;
  color:#777;
}

/* FOOTER */
footer{
  background:#111;
  color:white;
  text-align:center;
  padding:22px;
  margin-top:50px;
}
.site-footer {
  background: #050a0f;
  color: #a0a0a0;
  font-family: 'Inter', 'Roboto', sans-serif;
  padding-top: 70px;
}

.footer-container {
  max-width: 1200px;
  margin: auto;
  padding: 0 20px 50px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 40px;
}

.footer-col h3 {
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 20px;
  font-size: 18px;
}

.footer-col p {
  margin-bottom: 12px;
  font-size: 15px;
}

.footer-col ul {
  list-style: none;
  padding: 0;
}

.footer-col ul li {
  margin-bottom: 12px;
}

.footer-col ul li a {
  text-decoration: none;
  color: #a0a0a0;
  transition: 0.3s;
}

.footer-col ul li a:hover {
  color: #ffffff;
}

.accent {
  color: #00c2cb;
  margin-right: 10px;
}

.social-icons a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 42px;
  height: 42px;
  background: #0b1a22;
  color: #00c2cb;
  border-radius: 50%;
  margin-right: 10px;
  transition: 0.3s;
  font-size: 18px;
}

.social-icons a:hover {
  background: #00c2cb;
  color: #050a0f;
}

/* Bottom Bar */
.footer-bottom {
  border-top: 1px solid #0f2430;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.footer-left {
  display: flex;
  align-items: center;
  gap: 15px;
}

.footer-left img {
  width: 40px;
}

.footer-left span {
  color: #ffffff;
  font-weight: 600;
}

.footer-right {
  font-size: 14px;
}

/* Back to Top Button */
.back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background: #00c2cb;
  color: #050a0f;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-size: 20px;
  box-shadow: 0 10px 30px rgba(0,194,203,0.3);
  transition: 0.3s;
}

.back-to-top:hover {
  transform: translateY(-5px);
}

/* Responsive */
@media(max-width: 900px) {
  .footer-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media(max-width: 500px) {
  .footer-container {
    grid-template-columns: 1fr;
  }

  .footer-bottom {
    text-align: center;
    flex-direction: column;
    gap: 10px;
  }
}
/* =========================================================
   TEAM CARDS V2 — upgraded "Vedantu-style" mentor cards
   (added without modifying any existing rules above)
   ========================================================= */

.team-section-v2{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  padding:70px 8%;
  align-items:start;
}

.team-card-v2{
  background:rgba(255,255,255,0.9);
  backdrop-filter: blur(6px);
  border-radius:22px;
  overflow:visible;
  box-shadow:0 18px 40px rgba(12,20,40,0.08);
  transition:transform .35s ease, box-shadow .35s ease;
  display:flex;
  flex-direction:column;
  position:relative;
}

.team-card-v2:hover{
  transform:translateY(-8px);
  box-shadow:0 34px 80px rgba(12,20,40,0.12);
}

.team-card-v2 .tc-photo{
  position:relative;
  width:100%;
  height:260px;
  overflow:visible;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}

.tc-avatar{
  width:230px;
  height:230px;
  border-radius:50%;
  overflow:hidden;
  border:6px solid #fff;
  box-shadow:0 18px 40px rgba(17,24,39,0.15);
  transform:translateY(50%);
  background:#eee;
}

.tc-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 20%;
  filter: none;
  display:block;
  transition:transform .4s ease, filter .3s ease;
}

.tc-caption{
  text-align:center;
  transform:translateY(30%);
  margin-top:6px;
}
.tc-caption .tc-name{font-weight:700;color:#161636;font-size:16px}
.tc-caption .tc-qual{font-size:13px;color:#4a4a4a;margin-top:4px}

/* inline meta under avatar (name/qualification/role) */
.tc-name-inline{font-size:20px;margin:6px 0 4px;color:#151828}
.tc-meta{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.tc-qual-inline{color:#6b6b83;font-weight:600}
.tc-role-inline{color:#4a4a4a;font-weight:700}

/* details (hidden by default) */
.tc-details{max-height:0;overflow:hidden;transition:max-height .45s ease,opacity .35s ease;padding:0 6px}
.team-card-v2.expanded .tc-details{max-height:800px;padding:12px 18px}
.expertise-tags span{display:inline-block;background:#f1f5f9;color:#333;padding:6px 10px;border-radius:999px;margin-right:8px;margin-bottom:8px;font-weight:600}
.tc-details h4{margin:8px 0 6px}
.tc-details h5{margin:10px 0 6px}
.tc-details ul{margin-left:20px}

/* small note overlay on photos */
.tc-note{ display:none }
.tc-role-badge{display:none}

/* Modal styles */
.team-modal{display:none;position:fixed;inset:0;z-index:9999;font-family:'Segoe UI',sans-serif}
.team-modal.show{display:block}
.team-modal-backdrop{position:absolute;inset:0;background:rgba(6,8,20,0.6)}
.team-modal-content{position:relative;width:92%;max-width:980px;margin:6% auto;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 30px 80px rgba(2,6,23,0.6)}
.team-modal-close{position:absolute;right:12px;top:12px;background:transparent;border:none;font-size:20px;cursor:pointer}
.team-modal-body{display:flex;gap:20px;padding:28px}
.team-modal-left img{width:280px;height:280px;object-fit:cover;border-radius:10px}
.team-modal-right h3{margin:0 0 8px;font-size:22px;color:#161636}
.modal-qualification{color:var(--accent,#4C3FE0);font-weight:700;margin-bottom:10px}
.modal-note{font-weight:600;color:#666;margin-bottom:12px}
.modal-bio{color:#444;line-height:1.7}

/* Explore CTA on team cards */
.tc-explore{
  background:linear-gradient(135deg,#ff7043,#ff5722);
  color:#fff;
  border:none;
  padding:10px 18px;
  border-radius:10px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(255,87,34,0.18);
}
.tc-explore:hover{transform:translateY(-3px)}

@media(max-width:900px){
  .team-modal-body{flex-direction:column;align-items:center}
  .team-modal-left img{width:220px;height:220px}
}

.team-card-v2:hover .tc-avatar img{
  transform:scale(1.03);
}

.team-card-v2 .tc-role-badge{
  position:absolute;
  bottom:14px;
  left:14px;
  background:var(--accent, #4C3FE0);
  color:#ffffff;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.3px;
  padding:6px 14px;
  border-radius:999px;
  box-shadow:0 8px 18px rgba(0,0,0,0.25);
}

.team-card-v2 .tc-body{
  padding:120px 26px 28px;
  flex:1;
  display:flex;
  flex-direction:column;
}

.team-card-v2 h3{
  font-size:21px;
  font-weight:700;
  color:var(--text-dark, #161636);
  margin-bottom:6px;
}

.team-card-v2 .tc-qualification{
  font-size:14px;
  font-weight:600;
  color:var(--accent, #4C3FE0);
  margin-bottom:14px;
  line-height:1.5;
}

.team-card-v2 .tc-bio{
  font-size:14.5px;
  line-height:1.7;
  color:var(--text-mute, #5C5C7A);
  margin-bottom:12px;
}

.team-card-v2 .tc-bio:last-child{
  margin-bottom:0;
}

@media(max-width:600px){
  .team-section-v2{
    padding:50px 6%;
    gap:28px;
  }
  .team-card-v2 .tc-photo{
    height:150px;
  }
  .tc-avatar{ width:160px; height:160px; transform:translateY(28%); }
  .team-card-v2 .tc-body{ padding:90px 18px 20px }
}

/* Responsive grid: tablet 2 columns, mobile 1 column */
@media (max-width:1000px){
  .team-section-v2{ grid-template-columns:repeat(2,1fr) }
}
@media (max-width:640px){
  .team-section-v2{ grid-template-columns:repeat(1,1fr); padding:40px 5% }
  .tc-avatar{ width:150px; height:150px; transform:translateY(22%) }
}
