/* ---------- Hero ---------- */
    .hero {
      position: relative;
      background:
        radial-gradient(circle at 80% 40%, rgba(59,130,246,.35), transparent 55%),
        linear-gradient(120deg, #0a1747 0%, #0e2260 60%, #123081 100%);
    }
    .hero .eyebrow { letter-spacing: 2px; font-size: .8rem; font-weight: 600; color: #cdd8ff; }
    .hero h1 { font-weight: 800; font-size: 3rem; line-height: 1.15;color:#fff; }
    .hero .accent-bar { width: 70px; height: 4px; background: var(--tn-blue); border-radius: 3px; margin: 1.1rem 0 1.4rem; }
    .hero p.lead-text { color: #c9d4f0; max-width: 460px; font-size: .98rem; line-height: 1.7; }

    .stats-box {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.15);
      border-radius: 16px;
      backdrop-filter: blur(6px);
      padding: 1.6rem 1rem;
    }
    .stat-cell { text-align: center; padding: .2rem .5rem; }
    .stat-cell .bi { font-size: 1.5rem; color: #7aa2ff; }
    .stat-cell h3 { font-weight: 800; font-size: 1.7rem; margin: .5rem 0 .1rem;color:#fff; }
    .stat-cell span { font-size: .78rem; color: #c9d4f0; }
    .stat-divider { border-right: 1px solid rgba(255,255,255,.15); }

    /* ---------- Section helpers ---------- */
    .eyebrow-c { color: var(--tn-blue); font-weight: 600; letter-spacing: 2px; font-size: .8rem; }
    .section-title { font-weight: 700; font-size: 2rem; color: #0a1a3f; }
    .accent-bar-left { width: 60px; height: 4px; background: var(--tn-blue); border-radius: 3px; }

    /* ---------- Who We Are ---------- */
    .who h2 { font-weight: 700; font-size: 1.9rem; color: #0a1a3f; }
    .who p { color: var(--tn-gray); line-height: 1.75; font-size: .95rem; }
    .btn-work {
      background: var(--tn-blue); color: #fff; font-weight: 600; border-radius: 30px;
      padding: .7rem 1.6rem; font-size: .9rem;
    }
    .btn-work:hover { background: #0f3ce0; color: #fff; }
    .who-img-wrap { position: relative; }
    .who-img-wrap img { border-radius: 14px; width: 100%; box-shadow: 0 25px 50px rgba(10,26,63,.18); }
    .exp-badge {
      position: absolute; left: -18px; bottom: 40px; background: #fff;
      border-radius: 14px; padding: 1rem 1.3rem; box-shadow: 0 20px 40px rgba(10,26,63,.15);
      display: flex; align-items: center; gap: .8rem; min-width: 210px;
    }
    .exp-badge .icon { width: 42px; height: 42px; border-radius: 50%; background: var(--tn-blue); color: #fff; display: grid; place-items: center; font-size: 1.1rem; }
    .exp-badge h5 { font-weight: 700; margin: 0; font-size: 1.05rem; color: #0a1a3f; }
    .exp-badge small { color: var(--tn-gray); font-size: .75rem; }
    .exp-badge .prog { height: 4px; background: #e3e9f7; border-radius: 3px; margin-top: .4rem; }
    .exp-badge .prog span { display: block; height: 100%; width: 78%; background: var(--tn-blue); border-radius: 3px; }

    /* ---------- Values ---------- */
    .values-section { background: linear-gradient(180deg, #eaf1ff 0%, #f4f8ff 100%); padding: 4rem 0; }
    .value-card {
      background: #fff; border-radius: 12px; padding: 1.6rem 1rem; text-align: center;
      height: 100%; border: 1px solid #e7edfb; transition: .25s; box-shadow: 0 6px 18px rgba(10,26,63,.04);
    }
    .value-card:hover { transform: translateY(-6px); box-shadow: 0 18px 34px rgba(10,26,63,.12); }
    .value-card .bi { font-size: 1.9rem; color: var(--tn-blue); }
    .value-card h6 { font-weight: 700; margin: .9rem 0 .5rem; color: #0a1a3f; }
    .value-card p { font-size: .8rem; color: var(--tn-gray); margin: 0; line-height: 1.55; }

    /* ---------- Journey ---------- */
    .journey {
      background: linear-gradient(120deg, #0e2f7a, #143fb0);
      border-radius: 16px; color: #fff; padding: 2.2rem 2rem;
    }
    .journey .j-title h4 { font-weight: 700; margin: 0; font-size: 1.4rem; }
    .journey .eyebrow { color: #b9c9ff; letter-spacing: 2px; font-size: .72rem; font-weight: 600; }
    .journey-year { text-align: center; position: relative; padding: 0 .5rem; }
    .journey-year h3 { font-weight: 800; font-size: 1.6rem; margin: 0; }
    .journey-year span { font-size: .72rem; color: #c7d4ff; display: block; margin-top: .2rem; }

    /* ---------- Team ---------- */
    .team-card {
      border: 1px solid #e7edfb; border-radius: 12px; overflow: hidden; background: #fff;
      transition: .25s; box-shadow: 0 6px 18px rgba(10,26,63,.05);
    }
    .team-card:hover { transform: translateY(-6px); box-shadow: 0 18px 34px rgba(10,26,63,.12); }
    .team-card img { width: 100%; height: 100%; object-fit: cover; }
    .team-card .body { text-align: center; padding: .5rem .5rem .5rem; }
    .team-card h6 { font-weight: 700; margin: 0; color: #0a1a3f; }
    .team-card small { color: var(--tn-gray); font-size: .78rem; }
    .team-social a { color: var(--tn-gray); font-size: .95rem; margin: 0 .35rem; }
    .team-social a:hover { color: var(--tn-blue); }

    /* ---------- CTA band ---------- */
    .cta-band { background: linear-gradient(90deg, #123089, #1b47c9); color: #fff; padding: 1.8rem 0; }
    .cta-band .ic { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.18); display: grid; place-items: center; font-size: 1.2rem; }
    .cta-band h4 { font-weight: 700; margin: 0; font-size: 1.25rem; }
    .cta-band p { margin: 0; color: #cdd8ff; font-size: .88rem; }
    .btn-contact { background: #fff; color: var(--tn-blue); font-weight: 600; border-radius: 30px; padding: .7rem 1.5rem; }
    .btn-contact:hover { background: var(--tn-blue); color: #eef2ff; }

   

    @media (max-width: 991px) {
      .hero h1 { font-size: 2.3rem;color: #fff; }
      .stats-box { margin-top: 2rem; }
      
      .exp-badge { left: 10px; }
    }