/* Our Services Section Lead & Description Modern Styles */
/* Our Services Section Lead & Description Modern Styles - Left Aligned */
.services-lead-modern {
  text-align: left;
  max-width: 720px;
  margin: 0 0 18px 0;
  font-size: 1.18em;
  color: #374151;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.01em;
}
.services-desc-modern {
  text-align: left;
  max-width: 650px;
  margin: 0 0 28px 0;
  font-size: 1.04em;
  color: #57606a;
  font-weight: 400;
  line-height: 1.6;
}
@media (max-width: 600px) {
  .services-lead-modern, .services-desc-modern {
    font-size: 1em;
    max-width: 98vw;
    padding-left: 6px;
    padding-right: 6px;
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
}
/* Why Choose Our Investment Plans Badges */
.investment-why-title {
  font-size: 1.6em;
  color: #2563eb;
  font-weight: 700;
  margin-bottom: 22px;
  letter-spacing: 0.01em;
}

.investment-why-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
  margin-bottom: 10px;
}

.why-badge {
  display: inline-block;
  padding: 13px 26px;
  border-radius: 32px;
  font-weight: 600;
  font-size: 1.08em;
  box-shadow: 0 2px 12px 0 rgba(37,99,235,0.08), 0 1.5px 0 0 #e5e7eb;
  background: linear-gradient(90deg, #f6f8fa 60%, #f0f4ff 100%);
  color: #2563eb;
  transition: transform 0.13s, box-shadow 0.13s, background 0.13s;
  margin-bottom: 0;
  border: 1.5px solid #e5e7eb;
  cursor: default;
}
.why-badge.why-green {
  background: linear-gradient(90deg, #f6f8fa 60%, #e6f9ed 100%);
  color: #22863a;
  border-color: #d1f5e2;
}
.why-badge.why-blue {
  background: linear-gradient(90deg, #f6f8fa 60%, #e3eaff 100%);
  color: #2563eb;
  border-color: #c7d7fa;
}
.why-badge:hover, .why-badge:focus {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 6px 24px 0 rgba(37,99,235,0.13), 0 2px 0 0 #e5e7eb;
  background: linear-gradient(90deg, #e3eaff 60%, #f6f8fa 100%);
}

@media (max-width: 600px) {
  .investment-why-badges {
    gap: 10px;
  }
  .why-badge {
    padding: 10px 12px;
    font-size: 0.98em;
  }
}
/* =========================================================
   INVESTMENT PLANS (UPGRADED)
========================================================= */
.investment-plans-section {
  padding: 90px 0 40px 0;
  background: linear-gradient(180deg, #f8fafc 60%, #e0e7ff 100%);
}

.investment-plans-title {
  font-size: 2.3rem;
  font-weight: 800;
  color: #1e40af;
  margin-bottom: 18px;
  letter-spacing: 0.5px;
}

.investment-plan-card {
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 8px 32px rgba(37,99,235,0.10), 0 1.5px 8px rgba(16,185,129,0.07);
  border: 1.5px solid #e0e7ff;
  padding: 38px 28px 30px 28px;
  text-align: center;
  position: relative;
  transition: box-shadow 0.3s, transform 0.3s;
  min-height: 370px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.investment-plan-card:hover {
  box-shadow: 0 16px 48px rgba(37,99,235,0.16), 0 4px 18px rgba(16,185,129,0.10);
  transform: translateY(-8px) scale(1.025);
  border-color: #2563eb;
}
.plan-name {
  font-size: 1.1rem;
  font-weight: 800;
  color: #2563eb;
  letter-spacing: 1.2px;
  margin-bottom: 2px;
  text-transform: uppercase;
}
.plan-label {
  font-size: 1.02rem;
  color: #16a34a;
  font-weight: 600;
  margin-bottom: 18px;
  letter-spacing: 0.5px;
}
.plan-details {
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
}
.plan-details li {
  font-size: 1.01rem;
  color: #334155;
  padding: 7px 0;
  border-bottom: 1px dashed #e0e7ff;
}
.plan-details li:last-child {
  border-bottom: none;
}
.btn-invest-plan {
  display: inline-block;
  margin-top: 18px;
  padding: 13px 36px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 1.08rem;
  background: linear-gradient(90deg, #2563eb 60%, #16a34a 100%);
  color: #fff;
  box-shadow: 0 4px 18px rgba(37,99,235,0.10);
  border: none;
  text-decoration: none;
  transition: background 0.25s, box-shadow 0.25s, transform 0.2s;
}
.btn-invest-plan:hover, .btn-invest-plan:focus {
  background: linear-gradient(90deg, #1e40af 60%, #16a34a 100%);
  color: #fff;
  box-shadow: 0 8px 32px rgba(37,99,235,0.18);
  transform: translateY(-2px) scale(1.04);
}
/* Why Choose Section */
.investment-plans-section .d-flex span {
  font-size: 1.01rem;
  background: #f1f5f9;
  border-radius: 10px;
  padding: 12px 22px;
  color: #2563eb;
  font-weight: 700;
  margin: 0 6px 10px 0;
  box-shadow: 0 2px 8px rgba(37,99,235,0.07);
  transition: background 0.2s, color 0.2s;
}
.investment-plans-section .d-flex span:hover {
  background: #2563eb;
  color: #fff;
}
/* How We Partner Steps */
.investment-plans-section .row.justify-content-center.mb-4 > div > div {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(37,99,235,0.07);
  padding: 22px 16px;
  height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: box-shadow 0.2s, transform 0.2s;
}
.investment-plans-section .row.justify-content-center.mb-4 > div > div:hover {
  box-shadow: 0 8px 24px rgba(37,99,235,0.13);
  transform: translateY(-4px) scale(1.03);
}
.investment-plans-section .row.justify-content-center.mb-4 > div > div > div:first-child {
  font-size: 1.08em;
  color: #16a34a;
  font-weight: 800;
  margin-bottom: 8px;
}
.investment-plans-section .row.justify-content-center.mb-4 > div > div > div:nth-child(2) {
  font-size: 1.01em;
  color: #2563eb;
  font-weight: 700;
  margin-bottom: 6px;
}
.investment-plans-section .row.justify-content-center.mb-4 > div > div > div:last-child {
  font-size: 0.98em;
  color: #64748b;
}
/* Testimonials Section */
.mod-testimonials {
  background: linear-gradient(180deg, #f8fafc 60%, #e0e7ff 100%);
  padding: 60px 0 40px 0;
}
.mod-testimonials h2 {
  font-size: 2.2em;
  font-weight: 800;
  color: #2563eb;
  margin-bottom: 12px;
}
.mod-testimonials h3 {
  font-size: 1.3em;
  color: #374151;
  margin-bottom: 28px;
}
.mod-testimonials p {
  font-size: 1.1em;
  color: #57606a;
  max-width: 700px;
  margin: 0 auto 36px auto;
}
.mod-testimonials .row.justify-content-center > div > div {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 16px rgba(37,99,235,0.07);
  padding: 28px 22px;
  height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: box-shadow 0.2s, transform 0.2s;
}
.mod-testimonials .row.justify-content-center > div > div:hover {
  box-shadow: 0 8px 32px rgba(37,99,235,0.13);
  transform: translateY(-4px) scale(1.03);
}
.mod-testimonials .row.justify-content-center > div > div > div:first-child {
  font-size: 1.1em;
  font-weight: 700;
  color: #16a34a;
}
.mod-testimonials .row.justify-content-center > div > div > div:nth-child(2) {
  font-size: 0.98em;
  color: #374151;
}
.mod-testimonials .row.justify-content-center > div > div > div:last-child {
  font-size: 0.98em;
  color: #57606a;
  margin: 10px 0;
}
.mod-testimonials .row.justify-content-center > div > div:last-child {
  font-size: 1em;
  color: #2563eb;
  font-weight: 600;
}
/* =========================================================
   SERVICES SECTION (FINAL – NO OVERLAP, IMAGE + SCROLL)
========================================================= */

.services-section {
  padding: 90px 0;
  background: #f8fafc;
}

/* section headings */
.services-title {
  font-size: 2.4rem;
  font-weight: 800;
  color: #1e40af;
  margin-bottom: 14px;
}

.services-lead {
  font-size: 1.1rem;
  color: #475569;
  max-width: 820px;
  margin: 0 auto 26px;
}

.services-desc {
  font-size: 1rem;
  color: #64748b;
  max-width: 760px;
  margin: 0 auto 60px;
}

/* =========================================================
   SERVICE CARD BASE
========================================================= */

.service-card-img-overlay {
  position: relative;
  height: 390px;                /* KEY FIX */
  border-radius: 20px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 16px 48px rgba(2,6,23,0.14);
  transition: transform .4s ease, box-shadow .4s ease;
  isolation: isolate;
}

/* hover lift */
.service-card-img-overlay:hover {
  transform: translateY(-10px);
  box-shadow: 0 24px 70px rgba(2,6,23,0.22);
}

/* =========================================================
   BACKGROUND IMAGES
========================================================= */

.service-energy {
  background: url("../images/Service/1.jpg") center/cover no-repeat;
}

.service-assets {
  background: url("../images/Service/gold.jpg") center/cover no-repeat;
}

.service-trading {
  background: url("../images/Service/3.jpg") center/cover no-repeat;
}

.service-agriculture {
  background: url("../images/Service/4.jpg") center/cover no-repeat;
}

.service-construction {
  background: url("../images/Service/5.jpg") center/cover no-repeat;
}

.service-realestate {
  background: url("../images/Service/6.jpg") center/cover no-repeat;
}

/* =========================================================
   DARK GRADIENT OVERLAY (READABILITY)
========================================================= */

.service-card-img-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(2,6,23,0.92),
    rgba(2,6,23,0.55),
    rgba(2,6,23,0.18)
  );
  z-index: 1;
}

/* =========================================================
   TEXT CONTENT LAYER
========================================================= */

.service-card-content {
  position: absolute;
  inset: 0;
  z-index: 2;
  padding: 26px 24px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #ffffff;
}

/* title */
.service-title {
  font-size: 1.4rem;
  font-weight: 800;
  margin-bottom: 4px;
}

/* category */
.service-type {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1.1px;
  opacity: 0.85;
  margin-bottom: 14px;
}

/* =========================================================
   DESCRIPTION BEHAVIOR
========================================================= */

.service-desc {
  font-size: 0.95rem;
  line-height: 1.6;
}

.service-desc.short {
  opacity: 0.9;
}

/* long text hidden */
.service-desc.full {
  margin-top: 14px;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: all .35s ease;
}

/* reveal + scroll */
.service-card-img-overlay:hover .service-desc.full {
  opacity: 1;
  max-height: 190px;
  overflow-y: auto;
  padding-right: 6px;
}

/* =========================================================
   SCROLLBAR (CLEAN)
========================================================= */

.service-desc.full::-webkit-scrollbar {
  width: 5px;
}

.service-desc.full::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #2563eb, #16a34a);
  border-radius: 10px;
}

/* =========================================================
   GRID SAFETY (BOOTSTRAP FIX)
========================================================= */

.services-section .row.justify-content-center {
  row-gap: 34px;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {
  .service-card-img-overlay {
    height: 360px;
  }
}

@media (max-width: 576px) {
  .services-title {
    font-size: 2rem;
  }

  .service-card-img-overlay {
    height: 330px;
  }

  .service-desc.full {
    max-height: 160px;
  }
}
