 /* ---------------- PALETTE ---------------- */
    :root {
      --black: #0b0b0b;
      --dark: #0f0f0f;
      --matte: #1a1a1a;
      --white: #ffffff;
      --cream: #f5f0e6;
      --gold: #d1a956;
      --gold-2: #e9c97a;
      --muted: #bfbfbf;
      --glass: rgba(255, 255, 255, 0.06);
    }

    /* Global */
    * {
      box-sizing: border-box;
    }


    body {
      margin: 0;
      background: var(--black);
      color: var(--white);
      font-family: "Playfair Display", serif;

      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      line-height: 1.6;
      position: relative;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    /* ---------- TOP BAR ---------- */
    .top-bar {
      background: var(--cream);
      padding: 8px 0;
      color: var(--dark);
      font-size: 13px;
    }

    .top-icons i {
      font-size: 16px;
      margin-left: 12px;
      color: var(--dark);
      cursor: pointer;
      transition: .18s ease;
    }

    .top-icons i:hover {
      color: var(--gold);
      transform: translateY(-2px);
    }

    @media(max-width:768px) {
      .top-bar {
        display: none;
      }
    }

    /* ---------- NAVBAR ---------- */
    .main-nav {
      background: transparent;
      border-bottom: 1px solid rgba(255, 255, 255, 0.03);
      padding: 12px 0;
    }

    .logo-box {
      display: flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
    }

    .logo-svg {
      width: 46px;
      height: 46px;
    }

    .logo-title {
      font-size: 20px;
      font-weight: 800;
      letter-spacing: 0.4px;
      color: var(--white);
    }

    .logo-sub {
      font-size: 12px;
      color: var(--muted);
      margin-top: -6px;
    }

    .navbar-nav .nav-link {
      color: var(--white) !important;
      /* font-weight: 600; */
      padding: 8px 12px;
      transition: .15s ease;
    }

    .navbar-nav .nav-link:hover {
      color: var(--gold) !important;
      transform: translateY(-2px);
    }

    .navbar-toggler-icon {
      filter: invert(1);
    }

    .sticky-top {
      backdrop-filter: blur(6px);
      background: linear-gradient(180deg, rgba(11, 11, 11, 0.7), rgba(11, 11, 11, 0.4));
    }

    /* ---------- HERO (big visual) ---------- */
    .hero {
      position: relative;
      height: 88vh;
      min-height: 520px;
      display: flex;
      align-items: center;
      overflow: hidden;
    }

    .hero .carousel-item img {
      width: 100%;
      height: 88vh;
      object-fit: cover;
      filter: brightness(0.6) saturate(0.9);
    }

    /* Decorative diagonal shape */
    .hero-shape {
      position: absolute;
      right: -10%;
      top: -8%;
      width: 60%;
      height: 120%;
      background: linear-gradient(135deg, rgba(209, 169, 86, 0.06) 0%, rgba(0, 0, 0, 0) 60%);
      transform: rotate(-12deg);
      pointer-events: none;
    }

    /* .hero-text {
      position: absolute;
      left: 6%;
      bottom: 18%;
      max-width: 720px;
      z-index: 3;
      text-align: left;
    } */

    .hero-text h1 {
      font-size: 56px;
      font-weight: 800;
      color: var(--white);
      margin: 0 0 12px 0;
      line-height: 1.02;
      text-shadow: 0 6px 30px rgba(0, 0, 0, 0.6);
    }

    .hero-text p {
      font-size: 20px;
      color: var(--muted);
      margin: 0 0 20px 0;
    }

    .hero-cta {
      display: flex;
      gap: 14px;
      align-items: center;
    }

    .btn-gold {
      background: linear-gradient(180deg, var(--gold-2), var(--gold));
      color: #111;
      border-radius: 10px;
      padding: 12px 22px;
      font-weight: 800;
      border: none;
      box-shadow: 0 8px 30px rgba(209, 169, 86, 0.12);
    }

    .btn-outline {
      background: transparent;
      border: 1px solid rgba(255, 255, 255, 0.06);
      color: var(--white);
      padding: 12px 18px;
      border-radius: 10px;
    }

    @media(max-width:768px) {
      .hero-text h1 {
        font-size: 30px;
      }

      .hero-text p {
        font-size: 15px;
      }

      .hero-shape {
        display: none;
      }
    }

    /* ---------- CONSULT BOX ---------- */
    .consult-box {
      background: linear-gradient(180deg, rgba(13, 13, 13, 0.9), rgba(10, 10, 10, 0.95));
      padding: 36px 0;
      border-top: 1px solid rgba(255, 255, 255, 0.03);
    }

    .consult-content {
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.3));
      padding: 22px;
      border-radius: 12px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border: 1px solid rgba(255, 255, 255, 0.03);
      gap: 16px;
    }

    @media(max-width:768px) {
      .consult-content {
        flex-direction: column;
      }
    }

    .consultbtn {
      display: flex;
    }

    @media(max-width:530px) {
      .consultbtn {
        flex-direction: column;
      }
    }


    .consult-content h2 {
      font-size: 20px;
      margin: 0;
      font-weight: 800;
      color: var(--white);
    }

    .consult-content p {
      margin: 0;
      color: var(--muted);
    }

    /* ---------- ABOUT ---------- */
    .about-section {
      padding: 80px 0;
      background: linear-gradient(180deg, var(--dark), rgba(15, 15, 15, 0.98));
      color: var(--white);
      text-align: justify;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 1fr 1.2fr;
      gap: 36px;
      align-items: center;
    }

    .about-img img {
      width: 100%;
      border-radius: 14px;
      object-fit: cover;
    }

    .about-section .about-title {
      font-size: 36px;
      font-weight: 800;
      color: var(--white);
      margin-bottom: 6px;
    }

    .about-sub {
      color: var(--gold);
      font-style: italic;
      margin-bottom: 16px;
    }

    .about-text {
      color: #d7d7d7;
      font-size: 16px;
      line-height: 1.75;
    }

    @media(max-width:992px) {
      .about-grid {
        grid-template-columns: 1fr;
        text-align: center;
      }

      .about-img img {
        max-width: 320px;
        margin: 0 auto;
        display: block;
      }
    }

    /* ---------- COUNTERS ---------- */
    .stats-wrapper {
      padding: 60px 0;
      background: url('../images/static.jpg') center/cover no-repeat;
      background-size: cover;
      position: relative;
      color: var(--white);
    }

    .stats-bg-dim {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(6, 6, 6, 0.45), rgba(6, 6, 6, 0.45));
    }

    .stats-row {
      position: relative;
      z-index: 2;
      display: flex;
      gap: 28px;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
    }

    .stat-box {
      text-align: center;
      flex: 1;
      min-width: 160px;
      padding: 16px;
    }

    .stat-box .icon {
      font-size: 44px;
      color: var(--gold);
      margin-bottom: 8px;
      display: inline-block;
    }

    .stat-number {
      font-size: 36px;
      font-weight: 800;
      margin: 6px 0;
      color: #fff;
    }

    .stat-text {
      color: var(--gold);
      font-weight: 600;
    }

    @media(max-width:768px) {
      .stats-row {
        gap: 18px;
        flex-direction: row;
        justify-content: center;
      }

      .stat-number {
        font-size: 28px;
      }
    }

/* NEW PRACTICE HOVER CARD */
.practice-card{
    background:linear-gradient(90deg, var(--gold), var(--dark));;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:16px;
    padding:40px 20px;
    text-align:center;
    position:relative;
    overflow:hidden;
    height:240px;
    cursor:pointer;
    transition:0.35s ease;
    box-shadow:0 8px 25px rgba(0,0,0,0.45);
}

.practice-card:hover{
    transform:translateY(-6px);
}

/* ICON */
.p-icon{
    font-size:46px;
    color:var(--gold-2);
    margin-bottom:14px;
    transition:0.3s;
}

.practice-card:hover .p-icon{
    transform:translateY(-8px);
    color:var(--gold);
}

/* TITLE */
.p-title{
    font-size:20px;
    font-weight:700;
    color:#fff;
    transition:0.3s;
}

.practice-card:hover .p-title{
    opacity:0;
    transform:translateY(-10px);
}

/* SLIDE-UP CONTENT LAYER */
.p-hover-box{
    position:absolute;
    left:0;
    bottom:-100%;
    width:100%;
    height:100%;
    padding:30px 22px;
    background:linear-gradient(180deg, rgba(209,169,86,0.22), rgba(209,169,86,0.05));
    backdrop-filter:blur(4px);
    border-top:1px solid rgba(255,255,255,0.08);
    color:#e9d8b5;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    transition:0.45s cubic-bezier(.2,.8,.2,1);
}

.practice-card:hover .p-hover-box{
    bottom:0;
}

/* Inner content animation */
.p-hover-box p{
    font-size:16px;
    line-height:1.6;
    opacity:0;
    transform:translateY(20px);
    transition:0.4s ease;
}

.practice-card:hover .p-hover-box p{
    opacity:1;
    transform:translateY(0);
}



    /* ---------- TESTIMONIALS (NO overlay) ---------- */
    .testimonial-section {
      padding: 100px 0;
      background: url('../images/testimony-bg.jpg') center/cover no-repeat;
      background-size: cover;
    }

    /* .test-overlay-helper { position:absolute; inset:0; background: linear-gradient(180deg, rgba(9,9,9,0.32), rgba(9,9,9,0.42)); pointer-events:none; } */
    .test-title {
      font-size: 40px;
      font-weight: 800;
      color: var(--white);
      margin-bottom: 6px;
    }

    .test-title-line {
      display: block;
      width: 96px;
      height: 4px;
      background: linear-gradient(90deg, var(--gold), var(--gold-2));
      margin: 12px auto 18px;
      border-radius: 6px;
    }

    .test-sub {
      color: var(--gold);
      margin-bottom: 28px;
      font-style: italic;
    }

    .test-card {
      max-width: 740px;
      margin: 0 auto;
      padding: 36px;
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.2));
      border: 1px solid rgba(255, 255, 255, 0.06);
      backdrop-filter: blur(6px);
      /* box-shadow: 0 30px 70px rgba(0, 0, 0, 0.6); */
    }

    .test-msg {
      color: #efefef;
      font-size: 18px;
      line-height: 1.7;
      margin-bottom: 16px;
    }

    .test-name {
      color: var(--gold);
      font-weight: 800;
      margin-bottom: 4px;
    }

    .test-role {
      color: var(--muted);
    }

    /* controls style */
    .carousel-control-prev-icon,
    .carousel-control-next-icon {
      filter: invert(1) drop-shadow(0 6px 18px rgba(0, 0, 0, 0.6));
    }

    /* ---------- UTILITIES / REUSE ---------- */
    .section-pad {
      padding-top: 80px;
      padding-bottom: 80px;
    }

    .muted {
      color: var(--muted);
    }

    /* small visual niceties */
    .fade-up {
      opacity: 0;
      transform: translateY(18px);
      transition: all .6s cubic-bezier(.2, .9, .2, 1);
    }

    .in-view {
      opacity: 1;
      transform: translateY(0);
    }



    /* Whole Section news */
    .legal-news-section {
      background: #0a0a0a;
      padding: 80px 0;
      text-align: justify;
    }

    .legal-title {
      color: #fff;
      font-size: 48px;
      font-weight: 800;
    }

    .legal-sub {
      color: #d4b574;
      font-style: italic;
      margin-bottom: 40px;
    }

    /* News Card */
    .news-card {
      display: flex;
      flex-direction: column;
      height: 100%;
      background: #111;
      border-radius: 14px;
      text-decoration: none;
      overflow: hidden;
      border: 1px solid #242424;
      transition: 0.3s ease;
      position: relative;
    }

    /* Premium Gradient Border on Hover */
    .news-card:hover {
      border: 1px solid transparent;
      background: linear-gradient(#111, #111) padding-box,
        linear-gradient(135deg, #d4b574, #fff) border-box;
      transform: translateY(-6px);
      box-shadow: 0 12px 25px rgba(0, 0, 0, 0.5);
    }

    /* Image */
    .news-img {
      height: 250px;
      overflow: hidden;
    }

    .news-img img {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transition: 0.4s;
    }

    .news-card:hover .news-img img {
      transform: scale(1.05);
    }

    /* Content */
    .news-body {
      padding: 22px;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      color: #fff;
    }

    .news-body h3 {
      font-size: 20px;
      font-weight: 700;
      line-height: 1.4;
      margin-bottom: 12px;
      color: #fff;
    }

    .news-body .meta {
      color: #d4b574;
      font-size: 14px;
      margin-bottom: 12px;
    }

    .news-body .desc {
      color: #cfcfcf;
      font-size: 16px;
      line-height: 1.6;
      margin-top: auto;
      /* aligns perfectly */
    }

    /* Clickable Hover Indication */
    .news-card:hover h3,
    .news-card:hover .meta {
      color: #d4b574;
    }




    /* BLOG SECTION */
  .blog-modern-section{
    background: var(--black);
    padding: 80px 0;
    text-align: center;
}

.blog-modern-title{
    font-size: 48px;
    font-weight: 800;
    color: var(--cream);
}

.blog-modern-sub{
    color: var(--gold);
    font-style: italic;
    margin-top: -6px;
}

/* CARD */
.blog-modern-card{
    display: block;
    border-radius: 14px;
    overflow: hidden;
    background: var(--matte);
    border: 1px solid var(--glass);
    text-decoration: none;
    box-shadow: 0 10px 35px rgba(0,0,0,0.45);
    transition: .35s ease;
    position: relative;
}

.blog-modern-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 16px 45px rgba(0,0,0,0.65);
}

/* IMAGE */
.bm-img{
    height: 240px;
    overflow: hidden;
    position: relative;
}

.bm-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .45s ease;
}

.blog-modern-card:hover .bm-img img{
    transform: scale(1.08);
}

/* GOLD OVERLAY */
.bm-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.65));
    opacity:0;
    transition:.4s;
}

.blog-modern-card:hover .bm-overlay{
    opacity:1;
}

/* CONTENT */
.bm-content{
    padding: 22px;
    text-align: left;
}

.bm-content h3{
    font-size: 20px;
    color: #fff;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 8px;
    transition:.3s;
}

.blog-modern-card:hover h3{
    color: var(--gold-2);
}

.bm-meta{
    font-size: 14px;
    color: var(--gold);
    font-weight: 600;
}




    /* Center Form Box */
    .consult-form-box {
      position: relative;
      z-index: 3;
      width: 75%;
      max-width: 900px;
      margin: auto;
      padding: 45px;

      /* REAL GLASS EFFECT */
      /* background: rgba(255,255,255,0.22); */
      /* backdrop-filter: blur(14px); */
      /* border: 1px solid rgba(255,255,255,0.35); */
      border-radius: 18px;
      box-shadow: 0 15px 45px rgba(0, 0, 0, 0.35);
    }

    /* Title */
    .consult-form-box h2 {
      font-size: 42px;
      font-weight: 800;
      color: beige;
    }

    /* Subtitle */
    .consult-form-box .sub {
      color: #b99954;
      margin-top: -4px;
      margin-bottom: 25px;
      font-size: 17px;
      font-style: italic;
    }

    /* Inputs */
    .form-input {
      height: 52px;
      border-radius: 10px;
      border: 1px solid #ddd;
      padding-left: 14px;
      font-size: 16px;
      background: rgba(255, 255, 255, 0.85);
    }

    textarea.form-input {
      height: auto;
      padding-top: 14px;
    }

    /* Button */
    .send-btn {
      background: linear-gradient(180deg, #e8c676, #caa048);
      border: none;
      padding: 12px 28px;
      font-size: 17px;
      font-weight: 700;
      border-radius: 12px;
      color: #111;
      transition: 0.25s;
    }

    .send-btn:hover {
      background: linear-gradient(180deg, #f1d286, #d0a956);
      transform: translateY(-3px);
    }


 /* footer  */
    .footer-section{
  position: relative;
  background: url("../images/footer2.jpg") center/cover no-repeat;
  padding: 80px 0 30px;
  color: #fff;
}

/* Light fade bottom for readability only */
.footer-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,0.05), rgba(0,0,0,0.4));
  pointer-events:none;
}

.footer-content{
  position:relative;
  z-index:2;
}

.footer-logo{
  width:220px;
}

.footer-title{
  font-size:22px;
  font-weight:800;
  margin-bottom:12px;
  color:#d4b574;
}

.footer-text{
  color:#ddd;
  font-size:15px;
  line-height:1.6;
}

.footer-links li {
  list-style:none;
  margin-bottom:8px;
}

.footer-links li a{
  color:#eee;
  text-decoration:none;
  font-size:15px;
  transition:.2s;
}

.footer-links li a:hover{
  color:#d4b574;
  transform:translateX(3px);
}


.footer-section .social-icons a{
  display:inline-block;
  margin-right:12px;
  font-size:20px;
  color:#fff;
  transition:.2s;
}

.footer-section .social-icons a:hover{
  color:#d4b574;
}

.footer-divider{
  border-color:rgba(255,255,255,0.2);
  margin:30px 0;
}

.footer-bottom{
  text-align:center;
  color:#ccc;
}



/* Scroll To Top Button */
/* Scroll To Top Button */
.scroll-top-btn{
  position: fixed;
  bottom: 35px;
  right: 35px;
  width: 52px;
  height: 52px;
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  border: none;
  border-radius: 50%;
  color: #111;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(0,0,0,0.35);
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s ease, transform .3s ease, visibility .4s;
  z-index: 9999;
}

.scroll-top-btn.show{
  opacity: 1;
  visibility: visible;
}

.scroll-top-btn:hover{
  transform: translateY(-6px);
}





/* ================= HERO ================= */
.about-hero{
    background:url('../images/banner-single.jpg') top/cover no-repeat;
    padding:25px 0;
    position:relative;
    color:#fff;
}
.about-hero::after{
    content:""; position:absolute; inset:0;
    background:rgba(0,0,0,0.55);
}
.about-hero .breadcrumb-small{
    position:relative; z-index:2;
    font-size:14px; color:#eaeaea;
}
.about-hero h1{
    position:relative; z-index:2;
    font-family:"Playfair Display";
    font-size:54px; font-weight:800;
}
.about-hero .tagline{
    position:relative; z-index:2;
    color:var(--gold);
    font-style:italic;
    margin-top:6px;
}

/* ================= MAIN WRAPPER ================= */
.about-wrapper{
    background:var(--black);
    padding:80px 0;
}

/* ================= CONTENT BOX ================= */
.about-box{
    background:var(--matte);
    padding:32px;
    border-radius:18px;
    border:1px solid var(--glass);
    backdrop-filter:blur(8px);
    color:#eee;
    box-shadow:0 8px 30px rgba(0,0,0,0.35);
}
.about-box p{
    font-size:17px;
    line-height:1.86;
    color:#d8d8d8;
    margin-bottom:18px;
}

.about-box .about-title{
    font-size:40px;
    font-family:"Playfair Display";
    font-weight:800;
    color:var(--gold-2);
}

.about-box .about-sub{
    font-style:italic;
    color:var(--gold);
    margin-bottom:18px;
}

/* ================= CEO BOX ================= */
.ceo-card{
    background:var(--matte);
    padding:26px;
    border-radius:16px;
    border:1px solid var(--glass);
    text-align:center;
    box-shadow:0 10px 35px rgba(0,0,0,0.45);
}
.ceo-card img{
    width:100%;
    border-radius:14px;
    margin-bottom:16px;
    box-shadow:0 10px 35px rgba(0,0,0,0.55);
}


/* ================= HIGHLIGHTS ================= */
.about-highlights .card{
    height:100%;
    padding:26px;
    border-radius:18px;
    background:linear-gradient(180deg,#fafafa,#e9e9e9);
    border:1px solid #ccc;
    text-align:center;
    transition:0.25s;
}
.about-highlights .card:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 45px rgba(0,0,0,0.14);
}
.about-highlights i{
    font-size:36px;
    color:var(--gold);
    margin-bottom:12px;
}
.about-highlights h5{
    font-weight:700;
    color:#222;
}
.about-highlights p{
    color:#555;
    font-size:15px;
}

/* ================= LONG CONTENT ================= */
.about-long{
    background:#fff;
    padding:60px 40px;
    border-radius:16px;
    margin-top:60px;
    box-shadow:0 10px 40px rgba(0,0,0,0.07);
}
.about-long p{
    font-size:17px;
    color:#333;
    line-height:1.9;
    margin-bottom:16px;
}

/* ================= CTA ================= */
.about-cta{
    margin-top:55px;
    background:linear-gradient(90deg,var(--gold-2),var(--gold));
    padding:22px;
    text-align:center;
    border-radius:16px;
    color:#111;
    font-size:24px;
    font-weight:800;
}



    /* JOBS PAGE */
.jobs-section {
    background: var(--black);
    padding: 80px 0;
}

.jobs-title {
    color: #fff;
    font-size: 44px;
    font-weight: 800;
    text-align: center;
    margin-bottom: 10px;
}

/* Main Job Cards */
.job-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #111;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #2b2b2b;
    text-decoration: none;
    transition: 0.3s;
}

/* Hover premium effect */
.job-card:hover {
    transform: translateY(-6px);
    border: 1px solid transparent;
    background: linear-gradient(#111, #111) padding-box,
        linear-gradient(135deg, var(--gold), var(--white)) border-box;
    box-shadow: 0 10px 30px rgba(0,0,0,0.45);
}

/* Image consistently aligned */
.job-img {
    height: 230px;
    overflow: hidden;
}

.job-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.4s;
}

.job-card:hover .job-img img {
    transform: scale(1.06);
}

/* Body content */
.job-body {
    padding: 20px 22px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.job-body h3 {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    margin-bottom: 10px;
    min-height: 58px; /* PERFECT ALIGNMENT */
}

.job-body .meta {
    color: var(--gold);
    margin-top: auto; /* Always bottom aligned */
    font-size: 14px;
}


/* PAGINATION */
.jobs-pagination {
    text-align: center;
    margin-top: 40px;
}

.page-btn,
.page-num {
    display: inline-block;
    padding: 10px 18px;
    margin: 0 6px;
    border-radius: 6px;
    color: #fff;
    border: 1px solid var(--gold);
    transition: 0.25s ease;
}

.page-num.active,
.page-btn:hover,
.page-num:hover {
    background: linear-gradient(90deg, var(--gold-2), var(--gold));
    color: #111;
    border-color: transparent;
}



/* ////// our advocate  */

/* MAIN SECTION */
.team-section{
    background: var(--black);
    padding:70px 0;
}

/* TITLE */
.team-title{
    text-align:center;
    font-size:48px;
    font-family:"Playfair Display";
    font-weight:800;
    color:var(--gold-2);
}

.team-sub{
    text-align:center;
    font-style:italic;
    color:var(--gold);
    margin-top:5px;
    margin-bottom:45px;
}

/* GRID */
.team-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap:35px;
}

/* CARD */
.team-card{
    background:var(--matte);
    border:1px solid var(--glass);
    border-radius:16px;
    padding:22px;
    color:#fff;
    box-shadow:0 8px 30px rgba(0,0,0,0.45);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    height:100%;
    transition:0.3s;
}
.team-card:hover{
    transform:translateY(-6px);
}

/* IMAGE */
.team-card img{
    width:100%;
    height:250px;
    object-fit:cover;
    border-radius:12px;
}

/* FALLBACK IMAGE */
.fallback{
    background:#0e639c;
    width:100%;
    height:250px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.fallback svg{
    width:100px;
    opacity:0.9;
}

/* TEXT */
.team-name{
    margin-top:14px;
    font-size:22px;
    font-weight:700;
    color:var(--gold-2);
}

.team-info{
    font-size:15px;
    color:#d6d6d6;
    line-height:1.6;
    margin-top:8px;
    flex-grow:1;
}

/* SOCIAL ALWAYS AT BOTTOM */
.team-card .social-icons{
    margin-top:15px;
    text-align:center;
}
.team-card .social-icons a{
    font-size:20px;
    color:var(--gold);
    margin:0 8px;
    transition:0.2s;
}
.team-card .social-icons a:hover{
    color:var(--gold-2);
}

.filter-bar {
    background: #111;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 0 20px rgba(255,255,255,0.06);
    margin-bottom: 40px;
}

.filter-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

.filter-bar select,
.filter-bar input {
    width: 240px;
    padding: 10px 14px;
    border-radius: 50px;
    border: 1px solid #444;
    background: #fff;
    color: #333;
    font-size: 15px;
    outline: none;
    transition: 0.3s ease;
}

.filter-bar select:focus,
.filter-bar input:focus {
    border-color: var(--gold);
    box-shadow: 0 0 8px rgba(255,215,0,0.5);
}



/* Floating Call Button */
/* Floating Call Button */
.call-floating{
  position: fixed;
  bottom: 110px;    /* ⬅ scroll btn se upar ho jayega */
  right: 35px;
  background: linear-gradient(180deg,green,rgb(125, 224, 125));
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
    font-size:26px;
    cursor:pointer;
    box-shadow:0 8px 20px rgba(0,0,0,0.35);
    transition:0.3s ease;
    z-index:9999;
    opacity:0;
    visibility:hidden;
    animation: pulseCall 1.5s infinite;
}

.call-floating.show{
    opacity:1;
    visibility:visible;
}

.call-floating:hover{
    width: 210px;
    border-radius: 50px;
    justify-content: flex-start;
    padding-left: 18px;
}

.call-floating .call-text{
    display:none;
    font-size:14px;
    font-weight:700;
}

.call-floating:hover .call-text{
    display:block;
    margin-left:15px;
}

@keyframes pulseCall{
    0%{ transform:scale(1); box-shadow:0 0 0 0 rgba(209,169,86,0.6); }
    70%{ transform:scale(1.05); box-shadow:0 0 0 12px rgba(209,169,86,0); }
    100%{ transform:scale(1); box-shadow:0 0 0 0 rgba(209,169,86,0); }
}

