.elementor-16035 .elementor-element.elementor-element-6539204{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-16035 .elementor-element.elementor-element-0d2c46e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-0d2c46e *//* ============================================================
   RESET & BASE (isolated to .se-about-page scope)
   ============================================================ */
  .se-about-page *,
  .se-about-page *::before,
  .se-about-page *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  .se-about-page {
    font-family: "Figtree", sans-serif;
    color: #212529;
    background: #fff;
    overflow-x: hidden;
  }

  /* ============================================================
   CONTAINER
   ============================================================ */
  .se-about-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
  }

  /* ============================================================
   HERO — BASE (≥ 1500px) : full 110px sizes
   ============================================================ */
  .se-about-hero {
    padding: 80px 0 0;
  }

  /* "About Us" — fixed: 48px, muted #ADB5BD, weight 600 — unchanged across all breakpoints */
  h1.se-about-hero__label {
    color: #adb5bd !important;
    font-family: "Figtree", sans-serif;
    font-size: 48px;
    font-weight: 600 !important;
    line-height: 58px;
    margin-bottom: 24px;
  }

  /* "Built on Purpose. Driven by Potential." — 110px desktop base */
  h2.se-about-hero__title {
    color: #212529;
    font-family: "Figtree", sans-serif;
    font-size: 110px;
    font-weight: 700;
    line-height: 110px;
    margin-bottom: 40px;
  }

  /* Subheading paragraph */
  .se-about-hero__sub {
    color: #495057;
    font-family: "Figtree", sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    max-width: 90%;
  }

  /* ============================================================
   SHARED — ALTERNATING IMAGE + TEXT SECTIONS
   ============================================================ */

  /* Space between sections = 140px */
  .se-about-block {
    padding: 0 0 140px;
  }

  /* First block top gap from hero = 120px */
  .se-about-block--first {
    padding-top: 120px;
  }

  /* Two-column flex row */
  .se-about-block__row {
    display: flex;
    align-items: center;
    gap: 80px;
  }

  /* Reversed: text left, image right */
  .se-about-block__row--reverse {
    flex-direction: row-reverse;
  }

  /* ============================================================
   IMAGE COLUMN
   ============================================================ */
  .se-about-block__img-col {
    position: relative;
    flex-shrink: 0;
    width: 422px;
    height: 599px;
  }

  /* Oval pill image */
  .se-about-block__img {
    width: 422px;
    height: 599px;
    object-fit: cover !important;
    border-radius: 230px;
    display: block;
     /* Prevent stretching beyond intrinsic image size */
    max-width: 100%;
    max-height: 100%;
    
  }

  /* Ellipse accent — absolutely positioned, stable */
  .se-about-block__ellipse {
    position: absolute;
    bottom: 40px;
    right: -30px;
    width: 110px;
    height: 110px;
    pointer-events: none;
    z-index: 2;
  }

  /* Reversed block: ellipse on bottom-left */
  .se-about-block__row--reverse .se-about-block__ellipse {
    left: -30px;
    right: auto;
  }

  /* ============================================================
   TEXT COLUMN
   ============================================================ */
  .se-about-block__text-col {
    flex: 1;
  }

  /* Section badge e.g. "OUR MISSION" */
  .se-about-block__badge {
    display: inline-flex;
    align-items: center;
    height: 46px;
    padding: 5px 18px;
    font-family: "Figtree", sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 36px;
    letter-spacing: 0.28px;
    text-transform: uppercase;
    margin-bottom: 11px;
  }

  /* Badge colors per section */
  .se-about-block__badge--mission {
    background: #367be2;
    color: #fff;
  }
  .se-about-block__badge--approach {
    background: #f3bc25;
    color: #212529;
  }
  .se-about-block__badge--ecosystem {
    background: #2bd9ae;
    color: #212529;
  }

  /* Description paragraph */
  .se-about-block__para {
    color: #495057;
    font-family: "Figtree", sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 32px;
  }

  /* Bullet list */
  .se-about-block__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .se-about-block__list li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #212529;
    font-family: "Figtree", sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
  }

  /* Custom bullet icon — 24x24, aspect-ratio 1/1 */
  .se-about-block__list li::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    aspect-ratio: 1 / 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
  }

  /* Per-section bullet icons */
  .se-about-block--mission .se-about-block__list li::before {
    background-image: url("/wp-content/uploads/2026/05/check-circle-mission.svg");
  }

  .se-about-block--approach .se-about-block__list li::before {
    background-image: url("/wp-content/uploads/2026/05/shakti-approach-li.svg");
  }

  .se-about-block--ecosystem .se-about-block__list li::before {
    background-image: url("/wp-content/uploads/2026/05/ecosystem-li-icon.svg");
  }

  /* ============================================================
   BREAKPOINT 1 — LAPTOP / STANDARD DESKTOP  (max-width: 1499px)
   "About Us" stays 48px muted (set in base) | title stays 110px
   ============================================================ */
  @media (max-width: 1499px) {
    /* Subheading stays 24px */
    H2.se-about-hero__sub {
      font-size: 24px;
      line-height: 32px;
    }
  }

  /* ============================================================
   BREAKPOINT 2 — SMALL LAPTOP  (max-width: 1199px)
   ============================================================ */
  @media (max-width: 1199px) {
    /* "About Us" stays 48px — no change */
    /* title stays 110px */
    H2.se-about-hero__sub {
      font-size: 22px;
      line-height: 30px;
    }

    /* Slightly smaller image */
    .se-about-block__img-col {
      width: 360px;
      height: 510px;
    }
    .se-about-block__img {
      width: 360px;
      height: 510px;
    }

    /* Badge + text */
    .se-about-block__badge {
      font-size: 24px;
      height: 42px;
    }
    .se-about-block__para,
    .se-about-block__list li {
      font-size: 22px;
      line-height: 30px;
    }

    .se-about-block__row {
      gap: 60px;
    }
  }

  @media (max-width: 1024px) {
    h1.se-about-hero__label {
      font-size: 32px;
    }
    
    
       .se-about-hero__sub {
  
    max-width: 100%;
  }
  }

  /* ============================================================
   BREAKPOINT 3 — TABLET  (max-width: 991px)
   Columns stack vertically
   ============================================================ */
  @media (max-width: 991px) {
    /* "About Us" stays 48px — no change */
    h2.se-about-hero__title {
      font-size: 52px;
      line-height: 58px;
    }
    .se-about-hero__sub {
      font-size: 16px;
      line-height: 26px;
    }

    /* Stack columns */
    .se-about-block__row,
    .se-about-block__row--reverse {
      flex-direction: column;
      gap: 48px;
    }

    /* Image full-width centered */
    .se-about-block__img-col {
      width: 100%;
      max-width: 380px;
      height: 480px;
      margin: 0 auto;
    }

    .se-about-block__img {
      width: 100%;
      max-height: 480px;
      object-fit: contain !important;
     
    }

    /* Ellipse adjusted for stacked */
    .se-about-block__ellipse {
      width: 90px;
      height: 90px;
      bottom: 36px;
      right: -20px;
    }

    .se-about-block__row--reverse .se-about-block__ellipse {
      left: -20px;
      right: auto;
    }

    /* Badge */
    .se-about-block__badge {
      font-size: 22px;
      height: 40px;
    }

    /* Text — design system: p tablet = 16px */
    .se-about-block__para,
    .se-about-block__list li {
      font-size: 16px;
      line-height: 26px;
    }

    /* Section gaps reduced */
    .se-about-block {
      padding-bottom: 80px;
    }
    .se-about-block--first {
      padding-top: 80px;
    }
  }

  /* ============================================================
   BREAKPOINT 4 — MOBILE  (max-width: 575px)
   ============================================================ */
  @media (max-width: 575px) {
    .se-about-hero {
      padding: 48px 0 0;
    }

    h1.se-about-hero__label {
      font-size: 32px;
      margin-bottom: 16px;
    }
    /* "About Us" stays 48px — no change */
    h2.se-about-hero__title {
      font-size: 36px;
      line-height: 42px;
      margin-bottom: 24px;
    }
    .se-about-hero__sub {
      font-size: 16px;
      line-height: 26px;
    }

    /* Image */
    .se-about-block__img-col {
      max-width: 280px;
      height: 460px;
    }
    .se-about-block__img {
      height: 460px;
    }

    /* Ellipse scaled down */
    .se-about-block__ellipse {
      width: 72px;
      height: 72px;
      bottom: 75px;
      right: -14px;
    }

    .se-about-block__row--reverse .se-about-block__ellipse {
      left: -14px;
      right: auto;
    }

    /* Badge */
    .se-about-block__badge {
      font-size: 20px;
      height: 36px;
      padding: 4px 12px;
    }

    /* Text — design system: p mobile = 16px */
    .se-about-block__para,
    .se-about-block__list li {
      font-size: 16px;
      line-height: 26px;
    }

    /* Section gaps reduced */
    .se-about-block {
      padding-bottom: 56px;
    }
    .se-about-block--first {
      padding-top: 56px;
    }
  }
  
  
  
  
  @media(max-width:480px){
    .se-about-block--ecosystem   .se-about-block__list li {
          align-items: flex-start;
      }
      
   .se-about-block--ecosystem   .se-about-block__list li::before {
    margin-top: 2px;
  }
  }/* End custom CSS */