/*==================================
PAGE BANNER
==================================*/

.page-banner {
  position: relative;

  padding: 180px 0 120px;

  background: url("../images/3.jpeg") center center/cover no-repeat;

  overflow: hidden;
}

.banner-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(rgba(5, 35, 95, 0.88), rgba(0, 87, 217, 0.72));
}

.banner-content {
  position: relative;

  z-index: 2;

  color: #fff;

  text-align: center;
}

.banner-content h1 {
  font-size: 64px;

  font-weight: 800;

  margin-bottom: 20px;
}

.breadcrumb {
  justify-content: center;

  background: transparent;

  margin: 0;

  padding: 0;
}

.breadcrumb-item {
  color: #fff;
}

.breadcrumb-item a {
  color: #fff;

  text-decoration: none;
}

.breadcrumb-item + .breadcrumb-item::before {
  color: #fff;
}

/*==================================
COMPANY INTRO
==================================*/

.company-intro {
  padding: 120px 0;

  background: #fff;
}

.about-image {
  position: relative;

  overflow: hidden;

  border-radius: 24px;
}

.about-image img {
  transition: 0.5s;
}

.about-image:hover img {
  transform: scale(1.05);
}

.about-counter {
  background: #fff;

  padding: 25px;

  border-radius: 18px;

  text-align: center;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);

  height: 100%;
}

.about-counter h2 {
  font-size: 48px;

  font-weight: 800;

  color: #0057D9;

  margin-bottom: 10px;
}

.about-counter span {
  color: #666;

  font-weight: 600;
}

/*==================================
OUR STORY
==================================*/

.our-story {
  padding: 100px 0;

  background: #f8f9fb;
}

.our-story p {
  font-size: 17px;

  line-height: 1.9;

  color: #666;
}

/*==================================
MISSION
==================================*/

.mission-section {
  padding: 120px 0;

  background: #fff;
}

.mission-card {
  background: #f8f9fb;

  border-radius: 20px;

  padding: 40px 35px;

  text-align: center;

  transition: 0.35s;

  height: 100%;
}

.mission-card:hover {
  transform: translateY(-8px);

  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

.mission-card i {
  width: 80px;

  height: 80px;

  background: #0057D9;

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: auto auto 25px;

  border-radius: 50%;

  font-size: 32px;
}

.mission-card h4 {
  font-size: 26px;

  font-weight: 700;

  margin-bottom: 15px;
}

.mission-card p {
  margin: 0;

  line-height: 1.8;
}

/*==================================
CEO SECTION
==================================*/

.ceo-section {
  padding: 120px 0;

  background: #f8f9fb;
}

.ceo-image {
  overflow: hidden;

  border-radius: 24px;
}

.ceo-image img {
  width: 100%;

  transition: 0.5s;
}

.ceo-image:hover img {
  transform: scale(1.05);
}

.ceo-info {
  margin-top: 35px;

  padding-left: 20px;

  border-left: 4px solid #0057D9;
}

.ceo-info h4 {
  font-size: 28px;

  font-weight: 700;

  margin-bottom: 8px;
}

.ceo-info span {
  color: #0057D9;

  font-weight: 600;
}

/*==================================
WHY ABOUT
==================================*/

.why-about {
  padding: 120px 0;

  background: #fff;
}

.why-box {
  background: #fff;

  border-radius: 20px;

  padding: 40px 30px;

  text-align: center;

  transition: 0.35s;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);

  height: 100%;
}

.why-box:hover {
  transform: translateY(-8px);

  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.12);
}

.why-box i {
  font-size: 42px;

  color: #0057D9;

  margin-bottom: 20px;
}

.why-box h5 {
  font-size: 22px;

  font-weight: 700;

  margin-bottom: 12px;
}

.why-box p {
  margin: 0;
}

/*==================================
CERTIFICATE
==================================*/

.certification-section {
  padding: 120px 0;

  background: #f8f9fb;
}

.certificate-card {
  background: #fff;

  border-radius: 20px;

  padding: 45px 25px;

  text-align: center;

  transition: 0.35s;

  height: 100%;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

.certificate-card:hover {
  transform: translateY(-8px);
}

.certificate-card i {
  width: 80px;

  height: 80px;

  border-radius: 50%;

  background: #0057D9;

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 34px;

  margin: auto auto 25px;
}

.certificate-card h5 {
  margin: 0;

  font-size: 22px;

  font-weight: 700;
}

/*==================================
GLOBAL PRESENCE
==================================*/

.global-presence {
  padding: 120px 0;

  background: #fff;
}

.global-presence img {
  width: 100%;

  border-radius: 20px;

  transition: 0.5s;
}

.global-presence img:hover {
  transform: scale(1.04);
}

/*==================================
ABOUT PAGE RESPONSIVE
==================================*/

@media (max-width: 1199px) {
  .banner-content h1 {
    font-size: 54px;
  }
}

@media (max-width: 991px) {
  .page-banner {
    padding: 160px 0 100px;
  }

  .banner-content h1 {
    font-size: 44px;
  }

  .company-intro,
  .our-story,
  .mission-section,
  .ceo-section,
  .why-about,
  .certification-section,
  .global-presence {
    padding: 90px 0;
  }

  .ceo-image {
    margin-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .page-banner {
    padding: 140px 0 80px;
  }

  .banner-content h1 {
    font-size: 36px;
  }

  .section-title {
    font-size: 34px;
  }

  .about-counter {
    margin-top: 20px;
  }

  .mission-card,
  .why-box,
  .certificate-card {
    padding: 30px 20px;
  }
}

@media (max-width: 576px) {
  .banner-content h1 {
    font-size: 30px;
  }

  .about-counter h2 {
    font-size: 38px;
  }

  .ceo-info {
    padding-left: 15px;
  }
}

/* 2026 client content update */
.mission-section-expanded .mission-card-detail{height:100%;text-align:left}.mission-section-expanded .mission-card-detail h4{margin-bottom:18px}.mission-section-expanded .mission-card-detail p{margin-bottom:12px;line-height:1.75}.core-values-panel{margin-top:34px;padding:34px;border:1px solid #e1e8f0;border-radius:22px;background:#fff;box-shadow:0 18px 48px rgba(13,39,73,.07)}.core-values-heading{display:flex;gap:16px;align-items:center;margin-bottom:24px}.core-values-heading>i{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:#edf4fc;color:#114f96;font-size:1.35rem}.core-values-heading h3{margin:3px 0 0}.value-card{height:100%;padding:24px;border-radius:16px;background:#f7f9fc;border:1px solid #e7edf4}.value-card h5{margin:0 0 10px;color:#102f58}.value-card p{margin:0;line-height:1.7;color:#5b6878}@media(max-width:767px){.core-values-panel{padding:22px 18px}}

/* ==========================================================
   ABOUT — Mission, Vision & Core Values responsive restoration
   ========================================================== */
.mission-section-expanded{
  position:relative;
  padding:110px 0;
  background:linear-gradient(180deg,#ffffff 0%,#f5f9fe 100%);
  overflow:hidden;
}
.mission-section-expanded::before{
  content:"";
  position:absolute;
  width:420px;height:420px;
  right:-190px;top:-190px;
  border-radius:50%;
  background:rgba(0,87,217,.06);
  pointer-events:none;
}
.mission-section-expanded>.container{position:relative;z-index:1}
.mission-section-expanded>.container>.row{
  align-items:stretch;
}
.mission-section-expanded .mission-card-detail{
  position:relative;
  height:100%;
  min-height:100%;
  padding:38px 36px;
  border:1px solid #e2eaf4;
  border-radius:22px;
  background:#fff;
  text-align:left;
  box-shadow:0 18px 46px rgba(7,39,84,.08);
  overflow:hidden;
}
.mission-section-expanded .mission-card-detail::after{
  content:"";
  position:absolute;
  width:120px;height:120px;
  right:-48px;bottom:-48px;
  border-radius:50%;
  background:rgba(0,87,217,.05);
}
.mission-section-expanded .mission-card-detail:hover{
  transform:translateY(-5px);
  box-shadow:0 24px 54px rgba(7,39,84,.12);
}
.mission-section-expanded .mission-card-detail>i{
  width:62px;height:62px;
  margin:0 0 23px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#0057d9,#1da1f2);
  color:#fff;
  font-size:25px;
  box-shadow:0 12px 28px rgba(0,87,217,.20);
}
.mission-section-expanded .mission-card-detail h4{
  margin:0 0 18px;
  color:#0a2e73;
  font-size:28px;
  font-weight:800;
}
.mission-section-expanded .mission-card-detail p{
  margin:0 0 13px;
  color:#5f6d7e;
  font-size:14.5px;
  line-height:1.78;
}
.mission-section-expanded .mission-card-detail p:last-child{margin-bottom:0}
.mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail{
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(145deg,#082d68,#0057d9);
  border-color:transparent;
  color:#fff;
}
.mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail::after{background:rgba(255,255,255,.07)}
.mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail>i{
  background:rgba(255,255,255,.13);
  box-shadow:none;
}
.mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail h4{color:#fff}
.mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail p{color:rgba(255,255,255,.84);font-size:16px;line-height:1.9}

.mission-section-expanded .core-values-panel{
  margin-top:34px;
  padding:36px;
  border:1px solid #e2eaf4;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 46px rgba(7,39,84,.07);
}
.mission-section-expanded .core-values-heading{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:26px;
  padding-bottom:22px;
  border-bottom:1px solid #edf2f7;
}
.mission-section-expanded .core-values-heading>i{
  flex:0 0 56px;
  width:56px;height:56px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#edf5ff;
  color:#0057d9;
  font-size:22px;
}
.mission-section-expanded .core-values-heading .section-subtitle{margin-bottom:4px}
.mission-section-expanded .core-values-heading h3{
  margin:0;
  color:#0a2e73;
  font-size:30px;
  font-weight:800;
}
.mission-section-expanded .value-card{
  position:relative;
  height:100%;
  min-height:195px;
  padding:25px 24px 24px;
  border:1px solid #e5edf6;
  border-radius:17px;
  background:#f8fbff;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.mission-section-expanded .value-card::before{
  content:"";
  display:block;
  width:38px;height:4px;
  margin-bottom:17px;
  border-radius:99px;
  background:linear-gradient(90deg,#0057d9,#1da1f2);
}
.mission-section-expanded .value-card:hover{
  transform:translateY(-5px);
  border-color:#caddef;
  box-shadow:0 16px 35px rgba(7,39,84,.09);
}
.mission-section-expanded .value-card h5{
  margin:0 0 10px;
  color:#102f58;
  font-size:18px;
  font-weight:750;
}
.mission-section-expanded .value-card p{
  margin:0;
  color:#637184;
  font-size:13.5px;
  line-height:1.75;
}

@media(max-width:991.98px){
  .mission-section-expanded{padding:82px 0}
  .mission-section-expanded .mission-card-detail{padding:32px 28px}
  .mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail{min-height:330px}
  .mission-section-expanded .core-values-panel{padding:30px 26px}
}
@media(max-width:767.98px){
  .mission-section-expanded{padding:68px 0}
  .mission-section-expanded .mission-card-detail{padding:28px 23px;border-radius:18px}
  .mission-section-expanded .mission-card-detail>i{width:54px;height:54px;border-radius:15px;font-size:22px}
  .mission-section-expanded .mission-card-detail h4{font-size:24px}
  .mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail{min-height:auto}
  .mission-section-expanded .col-lg-6:nth-child(2) .mission-card-detail p{font-size:15px}
  .mission-section-expanded .core-values-panel{padding:25px 20px;border-radius:19px}
  .mission-section-expanded .core-values-heading{align-items:flex-start}
  .mission-section-expanded .core-values-heading h3{font-size:26px}
  .mission-section-expanded .value-card{min-height:0;padding:22px 20px}
}
@media(max-width:575.98px){
  .mission-section-expanded .core-values-heading>i{width:48px;height:48px;flex-basis:48px;border-radius:14px}
  .mission-section-expanded .core-values-heading h3{font-size:24px}
}
