.container-fluid.p-0{
  overflow: visible;
  min-height: 0;
}

.aboutBox{
    width:80%;
    margin:auto;
}
.col{
  margin:0;
}
.par{
  font-size: var(--text-body-lg);
  line-height: 1.75;
  font-weight: var(--font-weight-regular);
  max-width: min(65ch, 100%);
}
section{
  height:auto;
  overflow: visible;
}
.sub-content{
    width:100%;
    margin:0;
    min-height:0;
    height:fit-content;
}

/* About & Join — responsive two-column layout */
.about-section,
.join-section {
  overflow: visible;
}
.about-section .container,
.join-section .container {
  max-width: 1140px;
}
.about-section__inner,
.join-section__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 3rem);
}
.about-section__content,
.join-section__content {
  max-width: 36rem;
}
.about-section__text {
  margin: 0;
}
.about-section__visual,
.join-section__visual {
  display: flex;
  justify-content: center;
  align-items: center;
}
.about-section__deco,
.join-section__deco {
  width: min(280px, 70%);
  height: auto;
  opacity: 0.18;
  transform: scaleX(-1);
}
.join-section__deco {
  opacity: 0.12;
}
.section-kicker {
  opacity: 1;
  color: var(--text-primary, #001D5E);
  background: linear-gradient(90deg, rgba(52, 231, 191, 0.28) 0%, rgba(255, 255, 255, 0) 88%);
  width: fit-content;
  max-width: 100%;
  padding: 0.35rem 0.75rem;
  border-radius: 6px;
  font-size: var(--text-h3);
  line-height: var(--leading-h3);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.75rem;
}
.section-kicker span {
  color: var(--text-primary, #001D5E);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--tracking-tight);
}
button{
    outline: none !important;
    border:none !important;
}

.sec1{
  border:none;
  color:#fff !important;
  display:block;
  min-height:60vh; /* use viewport-relative height so it scales */
  overflow:hidden;
  position:relative;
}
.sec1 .cont{
    position: relative;
    width:100% !important;
    max-width: 100%;
}
.cont2{
    position: relative;
    width:100% !important;
}
.cont4{
    position: relative;
    width:100% !important;
}
.bg{
    opacity:0.1;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}
.sec2{
    border:none;
    display:block;
    height:auto;
    overflow:visible;
    position: relative;
}
.sec5 .d-flex{
    color:#ffffff;
    height:182px;
    border-radius:8px;
    width:85%;
    margin:auto;
    align-items:center;
}

input,textarea{
    background-color:#F3F4F7 !important;
    border-radius:6px !important;
    border:none;
    padding:12px !important;
    font-size: var(--text-body) !important;
    line-height: var(--leading-body) !important;
}
textarea{
    height:165px;
    margin-left:10px;
}

.cont img{
  width:100%;
  height:auto;
  object-fit:cover;
  display:block;
}
.cont2 img{
    opacity:0.2;
    -webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
  .centered {
    position: absolute;
    top: 35%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    pointer-events: none; /* allow clicks to pass to buttons safely */
  }
  .centered .container{ pointer-events: auto; }
  .about-section__content {
    font-size: var(--text-body);
    line-height: var(--leading-body);
    font-weight: var(--font-weight-regular);
  }
  .centered h1, .centered h2{
    font-size: var(--text-display);
    line-height: var(--leading-display);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--tracking-tight);
  }
  .sub-content p{
    font-size: clamp(0.9375rem, 0.9vw + 0.85rem, var(--text-body));
    line-height: 1.75;
    font-weight: var(--font-weight-regular);
    word-wrap: break-word;
  }
  .centered p{
    font-size: var(--text-hero-lead);
    line-height: var(--leading-hero-lead);
    font-weight: var(--font-weight-regular);
    margin-bottom: 1rem;
  }
  .centered .hero-lead{
    max-width: 42rem;
    margin-left: auto;
    margin-right: auto;
    opacity: 0.95;
  }
  .centered3{
    position: absolute;
    top: 50%;
    left: 72%;
    transform: translate(-50%, -50%);
  }
  .centered3 img{
    width: 237.17px;
height: 237.17px;
opacity:1 !important;
  }
  .short_div{
    background:url("../images/About/about-join-image.png") no-repeat;
    background-position:left;
  }
  .short_div img{
    margin-top:25px;    
    height:157px;
    width:180px;
  }
  /* prefer global .btn for consistency; keep old class for backward compatibility */
  .get_started{ border-radius:6px; }
  a.btn-outline-primary{ border:2px solid #fff; background:transparent; color:#fff; }
  .sec1 .centered .btn-outline-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0.5rem 1.25rem;
    min-height: 0;
    box-sizing: border-box;
    vertical-align: middle;
  }
  a:hover{
    text-decoration: none !important;
    color:#fff;
  }
  .centered_video{
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translate(-50%, -50%);
    height:auto;
    width:45%;
    overflow:hidden;
  }
  .centered_video video{
    height:auto;
    width:100%;
  }
  .title.section-kicker {
    font-size: var(--text-h4);
    line-height: var(--leading-h4);
  }
  .img_top {
    position: absolute;
    top: 20%;
    left: 40%;
    transform: translate(-50%, -50%);
  }
  .img_left {
    position: absolute;
    top: 45%;
    left: 5%;
    transform: translate(-50%, -50%);
  }
  .img_bottom {
    position: absolute;
    top: 95%;
    left: 40%;
    transform: translate(-50%, -50%);
  }
  .img_left img{
    height:150px;
    width:150px;
  }
  .img_top img{
    height:150px;
    width:150px;
  }
  .img_bottom img{
    height:150px;
    width:150px;
  }
  .sec8{ padding: 2.5rem 0; }

  /* Contact — centered block, readable measure, stacked fields on narrow screens */
  .sec8 .contact-section-title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    font-weight: var(--font-weight-bold);
    margin-bottom: 1.25rem !important;
  }
  .sec8 .contact-form {
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
  }
  .sec8 .contact-message {
    min-height: 10rem;
    line-height: 1.65;
    resize: vertical;
  }
  .sec8 .contact-form-row {
    align-items: stretch;
  }
  @media (max-width: 575.98px) {
    .sec8 .contact-input-half {
      flex: 1 1 100%;
      min-width: 100%;
    }
  }
  /* Utility spacing classes to keep gaps consistent */
  .section-gap{ padding-top: 3rem; padding-bottom: 3rem; }
  .about-section.section-gap {
    padding-top: 2rem;
  }

/* Services — homepage offerings, aligned with existing cards and kickers */
.services-section .container {
  max-width: 1140px;
}
.services-section__intro {
  max-width: 40rem;
  margin-bottom: 2rem;
}
.services-section__heading {
  color: var(--text-primary, #001D5E);
  font-size: var(--text-h3);
  line-height: var(--leading-h3);
  font-weight: var(--font-weight-bold);
  margin: 0 0 0.75rem;
}
.services-section__lead {
  margin: 0;
  color: var(--text-primary, #001D5E);
}
.services-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}
.service-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--surface, #ffffff);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: var(--radius, 8px);
  box-shadow: 0 6px 18px rgba(13, 38, 76, 0.04);
  padding: 1.25rem 1.25rem 2.25rem;
  min-height: 100%;
  transition: transform .18s ease, box-shadow .18s ease;
}
.service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 6px 18px rgba(13, 38, 76, 0.08);
}
.service-card__link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 100%;
  color: inherit;
  text-decoration: none !important;
}
a.service-card__link:hover,
a.service-card__link:focus,
a.service-card__link:active {
  color: inherit !important;
  text-decoration: none !important;
}
.service-card__num {
  margin: 0 0 0.5rem;
  font-size: var(--text-sm);
  line-height: var(--leading-sm);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--tracking-wide);
  color: var(--primary-900, #0130C8);
}
.service-card__title {
  margin: 0 0 0.5rem;
  font-size: var(--text-h5);
  line-height: var(--leading-h5);
  font-weight: var(--font-weight-semibold);
  color: var(--text-primary, #001D5E);
}
.service-card__desc {
  margin: 0 0 1rem;
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--text-primary, #001D5E);
  opacity: 0.88;
  flex: 1 1 auto;
}
.service-card__caps {
  list-style: none;
  margin: 0;
  padding: 0;
}
.service-card__caps li {
  position: relative;
  padding-left: 0.85rem;
  margin-bottom: 0.35rem;
  font-size: var(--text-sm);
  line-height: var(--leading-sm);
  color: var(--muted, #6b7280);
}
.service-card__caps li:last-child {
  margin-bottom: 0;
}
.service-card__caps li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--primary-100, #34E7BF);
}
.service-card__arrow {
  position: absolute;
  right: 1.1rem;
  bottom: 1.1rem;
  color: var(--primary-900, #0130C8);
  font-size: 1rem;
  line-height: 1;
}
.services-cta {
  margin-top: 2.5rem;
  text-align: center;
}
.services-cta__heading {
  margin: 0 0 0.35rem;
  font-size: var(--text-h4);
  line-height: var(--leading-h4);
  font-weight: var(--font-weight-bold);
  color: var(--text-primary, #001D5E);
}
.services-cta__text {
  margin: 0 0 1rem;
  font-size: var(--text-body);
  line-height: var(--leading-body);
  color: var(--text-primary, #001D5E);
  opacity: 0.88;
}
.services-cta .btn {
  color: #fff;
}
@media (prefers-reduced-motion: reduce) {
  .service-card {
    transition: none;
  }
  .service-card:hover {
    transform: none;
  }
}
  /* Buttons use global styles from components.css for consistent sizing */
.touch{
    width:70%;
}

/* Join With Us — body text at readable size (replaces legacy small element) */
.sec6 .sec6-body{
  font-size: var(--text-body-lg);
  line-height: 1.75;
  font-weight: var(--font-weight-regular);
  color: var(--text-primary, #001D5E);
  max-width: min(65ch, 100%);
  margin: 0;
}
.sec6 .title{
  margin-bottom: 0.75rem;
}

/* Tablet (768px - 991px) */
@media (max-width:991.98px) and (min-width:768px) {
  .services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-section__inner,
  .join-section__inner {
    gap: 2rem;
  }
  .about-section__deco,
  .join-section__deco {
    width: min(220px, 60%);
  }
}

/* Mobile */
@media (max-width:767.98px) {
  .centered {
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    padding: 0 1.25rem;
    text-align: center;
  }
  .centered .container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    text-align: center;
  }
  .centered .hero-headline,
  .centered h1,
  .centered h2 {
    font-size: clamp(1.15rem, 3.5vw + 0.4rem, 1.4rem);
    line-height: 1.35;
    margin-bottom: 0.5rem;
  }
  .centered .hero-lead,
  .centered p {
    font-size: 0.8125rem;
    line-height: 1.5;
    margin-bottom: 0.75rem;
  }
  .sec1 .centered .btn-outline-primary {
    font-size: 0.875rem;
    padding: 0.5rem 1.15rem;
    min-height: 2.25rem;
  }
  .sec1 {
    min-height: auto;
    padding: 0;
    overflow: hidden; /* clip hero image only */
  }
  .sec1 .cont {
    width: 100% !important;
    max-width: 100%;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
  }
  .sec1 .cont img {
    width: 100%;
    display: block;
    object-fit: cover;
  }
  .about-section__inner,
  .join-section__inner {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .about-section__content,
  .join-section__content {
    max-width: 100%;
    padding: 0;
  }
  .about-section__visual,
  .join-section__visual,
  .join-section__visual.sm {
    display: none !important;
    height: 0;
    overflow: hidden;
  }
  .section-kicker {
    font-size: var(--text-h4);
    line-height: var(--leading-h4);
  }
  .services-grid {
    grid-template-columns: 1fr;
  }
  .services-section.section-gap {
    padding-top: 2rem;
    padding-bottom: 2rem;
    margin-top: 0;
  }
  .services-section .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .services-section__heading {
    font-size: var(--text-h4);
    line-height: var(--leading-h4);
  }
  .services-cta {
    margin-top: 1.75rem;
  }
  /* Tighter gap between hero and About us */
  .about-section.section-gap {
    padding-top: 1rem;
    padding-bottom: 2rem;
    margin-top: -0.25rem;
  }
  .join-section.section-gap {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .sec2, .sec6 { padding-left: 0; padding-right: 0; }
  .about-section .container,
  .join-section .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .section-gap { padding-top: 1.5rem; padding-bottom: 1.5rem; }
  .sec8 { overflow: visible; padding-bottom: 0.5rem; }
  .sec8 .container { max-width: 100%; padding: 0 1rem; }
  .sec8 .contact-message { min-height: 5rem; }
  .sec8 .contact-section-title { margin-bottom: 0.75rem !important; }
  .touch { width: 96%; }
}

@media (max-width:567px) {
  .centered_video {
    position: absolute;
    top: 72%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    width: 80%;
    overflow: hidden;
  }
  .centered .hero-headline,
  .centered h2 {
    font-size: 1.2rem;
  }
  .centered .hero-lead,
  .centered p {
    font-size: 0.75rem;
    line-height: 1.45;
  }
  .services-section.section-gap {
    padding-top: 1.5rem;
    margin-top: 0;
  }
  .about-section.section-gap {
    padding-top: 0.75rem;
    margin-top: -0.5rem;
  }
  .about-section .container,
  .join-section .container {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
  .short_div img { height: 155px; margin-left: 10px; width: 80px !important; }
  .touch { width: 96%; }
}