/*
Theme Name: Rakheja Enterprises Child
Description: Child theme for Rakheja Enterprises
Author: Mukul Dahiya
Template: rakheja-enterprises
Version: 1.0
*/

* {
    box-sizing: border-box;
    /* margin: 0;
    padding: 0; */
    font-family: Arial, Helvetica, sans-serif;
}

/* OUR TEAM PAGE */

.our-team-page {
    width: 100%;
    font-family: Arial, Helvetica, sans-serif;
}

/* HERO */
.team-hero {
    height: 420px;
    background: #111;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.team-hero-title {
    font-size: 52px;
    font-weight: 800;
}

.team-hero-subtitle {
    font-size: 22px;
    margin-top: 10px;
}

/* BLOCK */
.team-block {
    max-width: 1200px;
    margin: 80px auto;
    padding: 0 20px;
}

.team-title {
    font-size: 40px;
    font-weight: 800;
    text-align: center;
    margin-bottom: 50px;
}

/* FOUNDER */
.person-full img {
    width: 100%;
    height: 500px;
    object-fit: cover;
}

.person-full .person-info {
    padding: 25px 0;
    text-align: center;
}

/* GRID */
.person-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.person-card img {
    width: 100%;
    height: 360px;
    object-fit: cover;
}

/* TEXT */
.person-info {
    text-align: center;
    padding-top: 15px;
}

.person-name {
    font-size: 22px;
    font-weight: 700;
}

.person-role {
    font-size: 16px;
    color: #555;
    margin: 6px 0;
}

.person-detail {
    font-size: 14px;
    color: #666;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .team-hero-title {
        font-size: 38px;
    }

    .team-title {
        font-size: 30px;
    }

    .person-grid {
        grid-template-columns: 1fr;
    }

    .person-full img {
        height: 320px;
    }
}


.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}

.lightbox.is-open { display: block; }

.lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.85);
  animation: lbFadeIn .2s ease forwards;
}

.lightbox-panel {
  position: relative;
  width: min(92vw, 1100px);
  height: min(88vh, 800px);
  margin: 6vh auto 0;
  display: grid;
  grid-template-columns: 60px 1fr 60px;
  align-items: center;
  gap: 10px;
}

.lb-figure {
  margin: 0;
  height: 100%;
  display: grid;
  place-items: center;
}

.lb-img {
  max-width: 100%;
  max-height: 100%;
  border-radius: 10px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  opacity: 0;
  transform: scale(.98);
  transition: opacity .22s ease, transform .22s ease;
}

.lb-img.is-visible {
  opacity: 1;
  transform: scale(1);
}

.lb-nav, .lb-close {
  border: 0;
  cursor: pointer;
  background: rgba(255,255,255,.12);
  color: #fff;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 22px;
  transition: transform .15s ease, background .15s ease, opacity .15s ease;
}

.lb-nav:hover, .lb-close:hover {
  background: rgba(255,255,255,.22);
  transform: scale(1.05);
}

.lb-close {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 44px;
  height: 44px;
  font-size: 28px;
  background: rgba(255,255,255,.18);
}

.lb-nav.is-disabled {
  opacity: .25;
  pointer-events: none;
}

.lb-nav.is-hidden {
  display: none;
}

@keyframes lbFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
