/* ─── DESIGN TOKENS ─────────────────────────────── */
  :root {
      --teal: #0D837A;
      --teal-dark: #0D4A4A;
      --teal-mid: #1e7a7a;
      --teal-light: #E6F2DF;
      --amber: #E89D1B;
      --amber-hover: #D09018;
      --charcoal: #111827;
      --dark-navy: #0A1628;
      --body-text: #374151;
      --muted: #6B7280;
      --off-white: #F9FAFB;
      --white: #FFFFFF;
      --black: #000;
      --dot-color: rgba(26, 107, 107, 0.12);
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Regular.ttf') format('ttf');
      font-weight: 400;
      font-style: normal;
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Medium.ttf') format('ttf');
      font-weight: 500;
      font-style: normal;
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Italic.ttf') format('ttf');
      font-weight: 400;
      font-style: italic;
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Bold.ttf') format('ttf');
      font-weight: 700;
      font-style: normal;
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Black.ttf') format('ttf');
      font-weight: 800;
      font-style: normal;
  }

  @font-face {
      font-family: 'Satoshi';
      src: url('/fonts/Satoshi-Light.ttf') format('ttf');
      font-weight: 300;
      font-style: normal;
  }

  .light {
      font-weight: 300;
  }

  .regular {
      font-weight: 400;
  }

  .semibold {
      font-weight: 600;
  }

  .bold {
      font-weight: 700;
  }

  .extrabold {
      font-weight: 800;
  }

  *,
  *::before,
  *::after {
      box-sizing: border-box;
  }

  html {
      scroll-behavior: smooth;
  }

  body {
      font-family: 'Satoshi', sans-serif !important;
      color: var(--body-text);
      background: var(--white);
      overflow-x: hidden;
  }

  h1,
  h2,
  h3,
  h4,
  h5 {
      font-family: 'Satoshi', sans-serif;
      font-weight: 800;
      color: var(--black);
  }

  p {
      /* line-height: 1.1; */
      color: var(--white);
  }

  /* ─── DOT PATTERN UTILITY ─────────────────────────── */
  .dot-bg {
      background-image: radial-gradient(var(--dot-color) 1.5px, transparent 1.5px);
      background-size: 22px 22px;
  }

  /* ─── ANIMATIONS ─────────────────────────────────── */
  @keyframes fadeUp {
      from {
          opacity: 0;
          transform: translateY(32px);
      }

      to {
          opacity: 1;
          transform: translateY(0);
      }
  }

  @keyframes fadeIn {
      from {
          opacity: 0;
      }

      to {
          opacity: 1;
      }
  }

  @keyframes yoyoMove {
      0% {
          transform: translateY(0);
      }

      50% {
          transform: translateY(12px);
      }

      100% {
          transform: translateY(0);
      }
  }

  @keyframes barFill {
      from {
          width: 0;
      }
  }

  @keyframes countUp {
      from {
          opacity: 0;
          transform: translateY(10px);
      }

      to {
          opacity: 1;
          transform: translateY(0);
      }
  }
  
  .wpcf7-response-output{
      text-align: center;
    font-size: 18px;
    color: #0D837A;
    font-weight: bold;
  }

.wpcf7 form.sent .wpcf7-response-output {
    display: none !important;
}

  .fade-up {
      opacity: 0;
      transform: translateY(32px);
      transition: opacity 0.65s ease, transform 0.65s ease;
  }
  .exclusive-warehouse a{
          color: var(--teal) !important;

  }

  .fade-up.visible {
      opacity: 1;
      transform: translateY(0);
  }

  .fade-in {
      opacity: 0;
      transition: opacity 0.7s ease;
  }

  .fade-in.visible {
      opacity: 1;
  }

  /* delay helpers */
  .delay-1 {
      transition-delay: 0.1s;
  }

  .delay-2 {
      transition-delay: 0.2s;
  }

  .delay-3 {
      transition-delay: 0.3s;
  }

  .delay-4 {
      transition-delay: 0.4s;
  }

  .delay-5 {
      transition-delay: 0.5s;
  }

  .delay-6 {
      transition-delay: 0.6s;
  }

  /* ─── NAVBAR ─────────────────────────────────────── */
  #navbar {
      position: sticky;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
      background: transparent;
      transition: background 0.4s ease, box-shadow 0.4s ease, padding 0.3s;
      background: #FFF;
      box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
      padding: clamp(15px, 1.563vw, 30px) 0;
  }

  .nav-logo {
   display: block;
      width: clamp(150px, 11.979vw, 230px);
  }

   .nav-logo img {width: 100%;}

  .nav-logo-mark {
      width: 42px;
      height: 42px;
  }

  .nav-logo-text {
      display: flex;
      flex-direction: column;
      line-height: 1.1;
  }

  .nav-logo-text .the {
      font-size: 0.62rem;
      font-weight: 700;
      letter-spacing: 0.18em;
      color: var(--charcoal);
      text-transform: uppercase;
  }

  .nav-logo-text .kanodia {
      font-size: 1.1rem;
      font-weight: 800;
      color: var(--charcoal);
      letter-spacing: -0.3px;
  }

  .nav-logo-text .company {
      font-size: 0.55rem;
      letter-spacing: 0.22em;
      color: var(--muted);
      text-transform: uppercase;
  }

  .nav-link-item {
      /* font-size: clamp(10px,1.177vw,15px); */
      font-weight: 500;
      color: var(--black);
      letter-spacing: 0.01em;
      /* padding: 0.3rem 0.9rem !important; */
      transition: color 0.2s;
      text-decoration: none;
      font-size: clamp(14px, 0.938vw, 18px);
  }

  #navbar.scrolled .nav-link-item {
      color: var(--charcoal) !important;
  }

  .nav-link-item:hover {
      color: var(--teal) !important;
  }

  .btn-connect {
      border-radius: 50px;
      background: linear-gradient(94deg, #020631 -19.54%, #0D837A 100.41%);
      color: #fff !important;
      border-radius: 50px;
      font-size: 0.85rem;
      font-weight: 500;
      padding: 0.70rem 2.9rem;
      transition: background 0.3s, transform 0.2s;
      text-decoration: none;
  }

  .btn-connect:hover {
      transform: translateY(-1px);
  }


  /* ─── HERO ────────────────────────────────────────── */
  /* .hero {
      min-height: 100vh;
      display: grid;
      grid-template-columns: 1fr 1fr;
      position: relative;
      overflow: hidden;
  } */

  .hero-left {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 8rem 4rem 5rem 5rem;
      position: relative;
      overflow: hidden;
      min-height: 100vh;
      background: url("../images/Hero-Banner-Linear-Gradient.png") no-repeat center;
      background-size: cover;
  }

  /* Kanodia logo watermark */
  /* .hero-watermark {
      position: absolute;
      bottom: 0;
      left: 37%;
  } */

  .hero-watermark svg {
      width: 180px;
      height: 180px;
  }

  .hero-eyebrow {
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.6);
      margin-bottom: 1.25rem;
      animation: fadeUp 0.8s ease forwards;
  }

  .hero h2 {
      font-size: clamp(2rem, 2.3vw, 3.2rem);
      font-weight: 900;
      line-height: 1.15;
      color: var(--white);
      margin-bottom: 1.25rem;
      animation: fadeUp 0.8s 0.1s ease forwards;
      opacity: 0;
  }

  .hero-italic {
      font-style: italic;
      font-weight: 600;
      font-size: clamp(1rem, 1.5vw, 1.1rem);
      color: #FFFFFF;
      margin-bottom: 1rem;
      animation: fadeUp 0.8s 0.2s ease forwards;
      opacity: 0;
  }

  .hero-partner {
      font-size: 0.88rem;
      color: #fff;
      margin-bottom: 1rem;
      animation: fadeUp 0.8s 0.25s ease forwards;
      opacity: 0;
  }

  .hero-partner a {
      color: #FFF;
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
  }

  .hero-divider {
      border: none;
      border-top: 1px solid rgba(255, 255, 255, 0.2);
      margin: 0.5rem 0;
      animation: fadeIn 0.8s 0.3s ease forwards;
      opacity: 0;
  }

  .hero-body {
      font-size: 1rem;
      color: #FFFFFF;
      line-height: 1.75;
      max-width: 394px;
      margin-bottom: 1.75rem;
      animation: fadeUp 0.8s 0.35s ease forwards;
      opacity: 0;
  }

  .btn-outline-white {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      border: 1.5px solid rgba(255, 255, 255, 0.7);
      color: var(--white);
      border-radius: 50px;
      font-size: 0.9rem;
      font-weight: 400;
      padding: 0.75rem 2rem;
      text-decoration: none;
      transition: background 0.3s, border-color 0.3s, transform 0.2s;
      animation: fadeUp 0.8s 0.4s ease forwards;
      opacity: 0;
      width: max-content;
  }

  .btn-outline-white:hover {
      background: rgba(255, 255, 255, 0.12);
      border-color: #fff;
      color: #fff;
      transform: translateY(-2px);
  }

  .hero-scroll {
      /* position: absolute;
      bottom: 2rem;
      left: 5rem; */
      display: flex;
      align-items: center;
      gap: 0.75rem;
      color: white;
      font-size: 0.80rem;
      font-weight: 300;
      letter-spacing: 0.15em;
      writing-mode: vertical-rl;
      gap: 0.5rem;
      font-family: 'Satoshi', sans-serif;
      letter-spacing: 1.4px;
      animation: yoyoMove 1.5s infinite ease-in-out;
  }

  .hero-scroll img {
      width: 8px;
      height: auto;
      animation: floatArrow 2.2s infinite cubic-bezier(0.4, 0, 0.2, 1);
      animation-delay: 0.15s;
  }

  .hero-scroll span {
      animation: floatText 2.2s infinite cubic-bezier(0.4, 0, 0.2, 1);
  }

  @keyframes floatText {

      0%,
      100% {
          transform: translateY(0);
      }

      50% {
          transform: translateY(6px);
      }
  }

  @keyframes floatArrow {

      0%,
      100% {
          transform: translateY(0);
          opacity: 0.9;
      }

      50% {
          transform: translateY(12px);
          opacity: 0.6;
      }
  }

  .hero-scroll-arrow {
      width: 1px;
      height: 40px;
      background: rgba(255, 255, 255, 0.35);
      position: relative;
      overflow: hidden;
  }

  .hero-scroll-arrow::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 50%;
      background: rgba(255, 255, 255, 0.8);
      animation: scrollDown 1.8s ease-in-out infinite;
  }

  .hero-right {
      position: relative;
      overflow: hidden;
  }

  .hero-right img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
  }

  /* ─── PARTNER BAR ─────────────────────────────────── */
  .partner-bar {
      background: var(--white);
      padding: 1.75rem 0;
      border-bottom: 0.8px solid var(--teal);
  }

  .partner-bar-text {
      font-size: clamp(18px,1.302vw,25px);
      font-weight: 500;
      color: var(--black);
  }

  .partner-logos {
      display: flex;
      align-items: center;
      gap: clamp(15px, 3.125vw, 60px);
  }

  /* .partner-logo-item {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      font-size: 1rem;
      font-weight: 800;
      color: var(--charcoal);
      letter-spacing: -0.5px;
  } */

  .partner-divider {
      width: 1px;
      height: 45px;
      background: var(--black);
  }

  .bematrix-color {
      color: #3DB36B;
  }

  /* ─── SECTION: PROVEN SYSTEM ──────────────────────── */
  .proven-section {
      padding: 6rem 0;
      background: var(--white);
  }

  .proven-images-left {
      display: flex;
      flex-direction: column;
      gap: 0.8rem;
      /* width: 23.958vw */
  }

  .proven-images-right {
      display: flex;
      flex-direction: column;
      gap: 0.8rem;
      /* width: 23.958vw */
  }

  .proven-img {
      border-radius: clamp(10px, 1.042vw, 20px);
      background: #E5E7EB;
      overflow: hidden;
      aspect-ratio: 45/25;
  }

  .proven-img img {
      object-fit: cover;
      display: block;
  }

  /* .proven-img.tall {
      height: 269px;
  }

  .proven-img.short {
      height: 165px;
  } */

  .proven-center {
      text-align: center;
      z-index: 2;
  }

  .proven-center h2 {
      font-size: clamp(1.8rem, 2.3vw, 2.4rem);
      line-height: 1.2;
      font-weight: 800;
      margin-bottom: 1.25rem;
      color: var(--black)
  }

  .proven-center .subtitle {
      font-style: italic;
      font-weight: 700;
      font-size: clamp(18px, 1.302vw, 25px);
      color: var(--black);
      margin-bottom: 1.25rem;
      line-height: normal;
  }

  .proven-center p {
      font-size: clamp(14px, 1.146vw, 22px);
      color: var(--black);
      line-height: normal;
      /* margin-bottom: 1.75rem; */
  }

  .badge-amber {
      display: inline-block;
      background: var(--amber);
      color: #fff;
      /* font-size: 0.84rem; */
      font-weight: 500;
      padding: 0.45rem 0.9rem;
      border-radius: 10px;
      margin-bottom: 1.5rem;
  }

  .link-teal {
      color: var(--teal);
      font-size: clamp(14px, 0.938vw, 18px);
      font-weight: 500;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      border-bottom: 1.5px solid var(--teal);
      padding-bottom: 1px;
      transition: gap 0.2s;
  }

  .link-teal:hover {
      gap: 0.75rem;
  }

  /* Feature cards */
  .feature-card {
      background: var(--teal);
      color: #fff;
  border-radius: clamp(10px, 1.042vw, 20px);
        padding: clamp(25px, 1.823vw, 35px) clamp(50px, 5vw, 96px);
      text-align: center;
      height: 100%;
      transition: transform 0.3s, box-shadow 0.3s;
  }

  .feature-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 16px 40px rgba(26, 107, 107, 0.25);
  }

  .feature-card-icon {
      font-size: 2.2rem;
                margin-bottom: clamp(20px, 1.302vw, 25px);

  }

  .feature-card h4 {
      font-size: clamp(16px, 1.042vw, 20px) ;
      font-weight: 900;
      color: #fff;
      margin-bottom:clamp(10px, 0.781vw, 15px);
  }

  .feature-card p {
      font-size: clamp(16px, 0.938vw, 18px);
      color: #FFFFFF;
      line-height: 1.65;
      margin: 0;
  }

  /* ─── SECTION: WE DON'T BUILD BOOTHS ─────────────── */
  .booths-section {
      padding-top: 2.5rem;
      background: rgba(230, 242, 223, 0.50);
      position: relative;
      overflow: visible;
      z-index: 2;
  }



  .booths-section h2 {
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      line-height: 1.15;
      margin-bottom: 2.5rem;
      font-weight: 800;
  }

  /* Tab nav */
  .tabs-nav {
      display: flex;
      align-items: center;
      gap: 16px;
  }

  /* buttons */
  .tab-btn {
      background: none;
      border: none;
      font-size: clamp(14px, 0.938vw, 18px);
      color: rgba(0, 0, 0, 0.53);
      cursor: pointer;
      padding: 0;
      position: relative;
      transition: color 0.3s ease;
      white-space: nowrap;
  }

  /* active tab */
  .tab-btn.active {
      color: #0D837A;
      /* teal */
      font-weight: 500;
  }

  /* lines between tabs */
  .tab-line {
      flex: 1;
      height: 1px;
      background: #cfcfcf;
      position: relative;
      overflow: hidden;
  }

  /* animated fill line */
  .tab-line::after {
      content: "";
      position: absolute;
      inset: 0;
      background: #0D837A;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s ease;
  }

  /* 🔥 active state logic */
  .tab-btn.active+.tab-line::after {
      transform: scaleX(1);
  }

  .tab-content-panel {
      display: none;
  }

  .tab-content-panel.active {
      display: block;
      animation: fadeIn 0.4s ease;
  }

  .tab-body p {
      font-size: 1rem;
      color: var(--body-text);
      line-height: 1.8;
      max-width: 480px;
  }

  .tab-italic {
      font-style: italic;
      font-size: clamp(18px, 1.302vw, 25px);
      font-weight: 700;
      color: var(--teal) !important;
      margin-top: 1.25rem;
  }

  .btn-amber {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      background: var(--amber);
      color: #fff;
      border: none;
      border-radius: 6px;
      font-family: 'Manrope', sans-serif;
      font-size: 0.9rem;
      font-weight: 700;
      padding: 0.8rem 1.75rem;
      margin-top: 1.75rem;
      cursor: pointer;
      transition: background 0.3s, transform 0.2s;
      text-decoration: none;
  }

  .btn-amber:hover {
      background: var(--amber-hover);
      color: #fff;
      transform: translateY(-2px);
  }

  .booths-image {
      border-radius: 12px;
      /* height: 100%; */
  }

  .booths-image img {
      width: 100%;
      /* height: 100%; */
      object-fit: cover;
  }

  /* ─── CARBON FOOTPRINT ─────────────────────────────── */
  .carbon-section {
      /* padding: 5rem 0; */
      padding: clamp(50px, 5.208vw, 100px) 0;
      /* padding-top: 7rem; */
      position: relative;
      background-image:
          radial-gradient(var(--dot-color) 1.5px, transparent 1.5px),
          linear-gradient(to bottom, rgb(255, 255, 255), rgb(255, 255, 255));

      background-size: 22px 22px, auto;
  }



  /* .carbon-section::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image: url("/images/BackgroundGridDots.png");
      opacity: 0.7;
      background-repeat: repeat;
      z-index: 0;
  } */

  .carbon-section::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(to bottom,
              rgba(255, 255, 255, 0.9),
              rgba(255, 255, 255, 1));
      z-index: -1;
  }

  .carbon-section .container {
      position: relative;
      z-index: 2;
  }

  .carbon-section h2 {
      text-align: center;
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      margin-bottom: 3rem;
      font-weight: 800;
  }

  .carbon-card {
      background: #F3F8EF;
      border-radius: 14px;
      padding: 2.5rem 2.5rem;
  }

  .carbon-col {
      width: 100%;
  }

  .carbon-label {
      font-size: clamp(18px, 1.146vw, 22px);
      font-weight: 500;
      color: var(--black);
      margin-bottom: clamp(25px, 2.865vw, 55px);
      text-align: center;
  }

  .carbon-bar-wrap {
      height: 10px;
      background: #D1D5DB;
      border-radius: 10px;
      overflow: hidden;
      margin-bottom: 0.75rem;
  }

  .carbon-bar {
      height: 100%;
      border-radius: 10px;
      width: 0;
      transition: width 1.4s cubic-bezier(.4, 0, .2, 1);
  }

  .bar-red {
      background: #F00;
  }

  .bar-teal {
      background: var(--teal);
  }

  .carbon-pct {
      font-size: 1.75rem;
      font-weight: 800;
      color: var(--charcoal);
      text-align: center;
      margin-top: clamp(20px, 1.7vw, 25px)
  }

  .carbon-divider {
      width: 1px;
      background: #D1D5DB;
      align-self: stretch;
      margin: 0 1rem;
  }

  .carbon-note {
      color: var(--black);
      line-height: 1.4;
      margin-top: clamp(30px, 2.865vw, 55px);
      text-align: center;
      width: 60%;
      margin-left: auto;
      margin-right: auto;
      /* margin: 0 auto; */
  }

  /* ─── EXPERIENCE / FOUNDER ────────────────────────── */
  .experience-section {
      padding-top: 4.4rem;
      position: relative;
      overflow: hidden;
      background: url("../images/Founder-Section-Linear-Gradient.png") no-repeat center;
      background-size: cover;
  }

  .experience-section h2 {
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      color: #fff;
      margin-bottom: 1.25rem;
      font-weight: 800;
  }

  .experience-section p {
      color: #fff;
  }

  .experience-section p:nth-child(2) {
      color: #FFFFFF;
      line-height: 1.8;
      margin-bottom: 1rem;
      font-weight: 400;
      width: 80%;
      font-size: 0.9rem;
  }

  .experience-section p:first-of-type {
      color: #FFF;
      font-size:clamp(16px, 1.146vw, 22px);
      /*line-height: 1.4;*/
      font-weight: 300;
  }



  .experience-section .link-white {
      color: #FFF;
      font-size: 0.8rem;
      font-weight: 400;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      border-bottom: 1.5px solid rgba(255, 255, 255, 0.4);
      padding-bottom: 1px;
      transition: gap 0.2s, border-color 0.2s;
  }

  .experience-section .link-white:hover {
      gap: 0.75rem;
      border-color: #fff;
  }

  .quote-block {
      /*border-radius: 12px;*/
      /*padding: 2.5rem;*/
      /*margin-top: 2rem;*/
      position: absolute;
      bottom: 50px;
      right: 100%;
      width: 400px;
  }

  .petal-icon {
      width: 40px !important;
      height: auto;
  }

  .quote-mark {
      font-size: 3rem;
      color: rgba(255, 255, 255, 0.3);
      line-height: 1;
      margin-bottom: 0.5rem;
  }

    .quote-text {
      font-size: clamp(1.1rem, 1.7vw, 1.4rem) !important;
      font-style: italic;
      font-weight: 500 !important;
      color: #fff !important;
      line-height: normal!important;
      margin-left: clamp(20px, 2vw, 12px);
      width: 100%!important;
  }

  .quote-author {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-top: 1.5rem;
      margin-left: clamp(20px, 1.3vw, 10px);
  }

  .quote-author-logo {
      width: 36px;
      height: 36px;
  }

  .quote-author-info {
      line-height: 1.2;
  }

  .quote-author-name {
      font-size: 1rem;
      font-weight: 500;
      color: #fff;
  }

  .quote-author-title {
      font-size: 0.8rem;
      color: white;
      margin-top: clamp(3px, 1.2vw, 5px)
  }

  /* ─── EVERYTHING ALIGNED ─────────────────────────── */
  .aligned-section {
      padding: clamp(50px, 5.208vw, 100px) 0!important;
      
      /*background: var(--off-white);*/
      position: relative;
  }

  .aligned-section h2 {
      text-align: center;
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      margin-bottom: 0.75rem;
      font-weight: 800;
  }

  .aligned-section .section-sub {
      text-align: center;
      font-size: 0.96rem;
      color: var(--black);
      max-width: 540px;
      margin: 0 auto 3.5rem;
  }

  .capability-card {
      background: var(--teal-light);
      border-radius: 20px;
      padding: 1.75rem;
      height: 100%;
      position: relative;
      overflow: hidden;
      transition: all 0.4s ease;
      transition: transform 0.3s, box-shadow 0.3s;
  }

  .capability-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 12px 36px rgba(0, 0, 0, 0.08);
  }

  .capability-card:hover h4,
  .capability-card:hover p {
      color: #fff;
  }

  .capability-card-icon {
      font-size: 1.75rem;
      margin-bottom: 1rem;
      color: var(--teal);
  }

  .capability-card-icon img {
      width: clamp(40px, 3.125vw, 60px);
      height: auto;
      transition: filter 0.3s ease;
  }

  .capability-card:hover .capability-card-icon img {
      filter: brightness(0) invert(1);
  }

  .capability-card h4 {
      font-size: clamp(16px, 1.146vw, 22px);
      font-weight: 900;
      margin-bottom: clamp(10px, 0.781vw, 15px);
      color: var(--charcoal);
  }

  .capability-card p {
      /*font-size: 0.77rem;*/
      color: #000000;
      /*line-height: 1.65;*/
      margin: 0;
  }

  /* common overlay */
  .capability-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      opacity: 0;
      transition: opacity 0.4s ease;
      z-index: 1;
      mix-blend-mode: plus-darker;
  }

  /* 👇 Different images per card */
  #capabilities .row>div:nth-child(1) .capability-card::before {
      background-image:
          linear-gradient(180deg, rgba(13, 131, 122, 0) 12.59%, #0D837A 100%),
          url("../images/align-image-1.webp");
  }

  #capabilities .row>div:nth-child(2) .capability-card::before {
      background-image:
          linear-gradient(180deg, rgba(13, 131, 122, 0) 12.59%, #0D837A 100%),
          url("../images/align-image-2.webp");
  }

  #capabilities .row>div:nth-child(3) .capability-card::before {
      background-image:
          linear-gradient(180deg, rgba(13, 131, 122, 0) 12.59%, #0D837A 100%),
          url("../images/align-image-3.webp");
  }

  #capabilities .row>div:nth-child(4) .capability-card::before {
      background-image:
          linear-gradient(180deg, rgba(13, 131, 122, 0) 12.59%, #0D837A 100%),
          url("../images/align-image-4.webp");
  }

  #capabilities .row>div:nth-child(5) .capability-card::before {
      background-image:
          linear-gradient(180deg, rgba(13, 131, 122, 0) 12.59%, #0D837A 100%),
          url("../images/align-image-5.webp");
  }

  /* hover */
  .capability-card:hover::before {
      opacity: 1;
  }

  /* keep content above */
  .capability-card>* {
      position: relative;
      z-index: 2;
  }

  .rent-card {
      background: var(--teal-light);
      border-radius: 10px;
      padding: 2rem 2.5rem;
      margin-top: 1.5rem;
  }

  .rent-card .rent-icon {
      font-size: 2rem;
      color: var(--teal);
      margin-bottom: 1rem;
  }

  .rent-card h4 {
      font-size: 1.05rem;
      font-weight: 800;
      margin-bottom: 0.75rem;
  }

  .rent-card p {
      font-size: 0.9rem;
      color: #000000;
      line-height: 1.75;
      margin-bottom: 0.75rem;
  }

  .rent-card .rent-italic {
      font-style: italic;
      font-weight: 600;
      font-size: 0.96rem;
      color: #06060A;
      margin-bottom: 1rem;
  }

  .no-frag {
      background: var(--teal-light);
      border-radius: 10px;
      padding: 1.75rem;
      text-align: center;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
  }

  .no-frag p {
      font-size: 1rem;
      font-weight: 600;
      color: #000;
      margin-bottom: 0.4rem;
  }

  .no-frag .accent {
      color: var(--teal);
      font-weight: 800;
      font-size: 1.05rem;
  }

  /* ─── SCALE SECTION ─────────────────────────────── */
  .scale-section {
      /*padding: 6rem 0;*/
      padding:0 0 clamp(50px, 5.208vw, 100px) 0!important;
      background: var(--white);
      position: relative;
      overflow: hidden;
  }

  .scale-images {
      display: grid;
      grid-template-columns: 1fr;
  }

  .scale-images .img-large {
      border-radius: 12px;
      overflow: hidden;
      height: 260px;
  }

  .scale-images .img-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
  }

  .scale-images .img-small {
      border-radius: 12px;
      overflow: hidden;
      height: 100%;
  }

  .scale-images img {
      width: 100%;
      height: 100%;
      object-fit: cover;
  }

  .scale-content {
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  .scale-content h2 {
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      line-height: 1.2;
      margin-bottom: 1.5rem;
      font-weight: 800;
  }

  .scale-content p {
      font-size: clamp(14px, 1.146vw, 22px);
      color: var(--black);
      /*line-height: 1.8;*/
  }

  /* ─── BUILD TEAMS ─────────────────────────────────── */
  .teams-section {
      padding: 0;
      position: relative;
      overflow: visible;
      z-index: 1;
  }

  .teams-section::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: url("../images/Systems-Linear-Gradient.png") no-repeat center;
      background-size: cover;
      z-index: -1;
      pointer-events: none;
  }

  /* FLEX layout */
  .teams-inner {
      display: flex;
      /* align-items: center; */
      position: relative;
  }

  /* LEFT */
  .teams-left {
      /*width: 55%;*/
      padding: clamp(40px, 5vw, 96px) 0;
      /*padding-bottom: 0px;*/
      color: #fff;
      z-index: 2;
      
  }

  /* RIGHT */
  .teams-right {
      /*width: 53%;*/
      position: relative;
      /*margin-right: 50px*/
      position:absolute;
      top:-5%;
      left:0;
      width:100%;
      height:110%;
  }

  /* IMAGE */
  /* .teams-image {
      position: absolute;
      top: 50%;
      right: 0;
  } */

  .teams-image img {
      width: 100%;
      border-radius: 16px;
      display: block;
      box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);
  }

  .teams-left h2 {
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      color: #fff;
      margin-bottom: 1.25rem;
      font-weight: 800;
  }

  .teams-left p {
      font-size: clamp(14px, 1.146vw, 22px);
      color: #FFF;
    
  }

  .teams-left .italic {
      font-style: italic;
      font-weight: 500;
      color: #FFF;
      font-size:clamp(16px, 1.302vw, 25px);
  }

  .btn-outline-round {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      border: 1.5px solid rgba(255, 255, 255, 0.6);
      color: var(--teal);
      border-radius: 50px;
      font-size: 0.88rem;
      font-weight: 400;
      padding: 0.7rem 1.75rem;
      margin-top: 1rem;
      text-decoration: none;
      transition: background 0.3s, transform 0.2s;
      width: 50%;
      background: #FFFFFF
  }

  .btn-outline-round:hover {
      background: #FFFFFF;
      color: var(--teal);
      transform: translateY(-2px);
  }

  .teams-right {
      /*position: relative;*/
      overflow: visible;
      /*height: 100%;*/
  }

  .teams-right img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
  }

  /* ─── CONTACT FORM ──────────────────────────────── */
  .contact-section {
      padding: clamp(50px, 5.208vw, 100px) 0;
      /*padding-top: 7rem;*/
      background: var(--white);
  }

  .contact-section h2 {
      text-align: center;
      font-size: clamp(1.8rem, 2.5vw, 2.4rem);
      margin-bottom: 0.75rem;
      font-weight: 800;
  }

  .contact-section .section-sub {
      text-align: center;
      font-size: 0.96rem;
      color: var(--black);
      margin-bottom: 3rem;
  }

  /* Labels */
  .custom-form .custom-label {
      font-size: 13px;
      color: var(--black);
      margin-bottom: 6px;
  }

  /* Inputs & Select */
  .custom-form .custom-input {
      border: none;
      border-bottom: 1px solid #9aa0a6;
      border-radius: 0;
      background: transparent;
      padding: 8px 0;
      font-size: 15px;
      box-shadow: none;
  }

  /* Focus effect */
  .custom-form .custom-input:focus {
      border-bottom: 2px solid #0aa;
      outline: none;
  }

  /* Placeholder */
  .custom-form .custom-input::placeholder {
      color: #b0b0b0;
  }

  /* Remove default select arrow + add custom */
  .custom-form .custom-select {
      appearance: none;
      -webkit-appearance: none;
      -moz-appearance: none;

      background: url("data:image/svg+xml;utf8,<svg fill='%230aa' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>") no-repeat right center;

      background-size: 16px;
      padding-right: 24px;
  }

  /* Smooth transition */
  .custom-form .custom-input {
      transition: border 0.3s ease;
  }

  .custom-form .custom-input:focus {
      outline: none !important;
      box-shadow: none !important;
      border: none;
      border-bottom: 2px solid #0aa;
  }

  .btn-teal-pill {
      background: var(--teal);
      color: #fff;
      border: none;
      border-radius: 50px;
      font-family: 'Manrope', sans-serif;
      font-size: 0.9rem;
      font-weight: 500;
      padding: 0.85rem 2.5rem;
      margin-top: clamp(1.3rem, 1vw, 1.75rem);
      transition: background 0.3s, transform 0.2s;
      cursor: pointer;
  }

  .btn-teal-pill:hover {
      /* background: var(--teal-dark); */
      transform: translateY(-2px);
  }

  /* ─── COMING SOON BANNER ─────────────────────────── */
  .coming-section {
      position: relative;
      padding: clamp(100px, 10.156vw, 190px) 0;
      text-align: center;
      overflow: hidden;
  }

  .coming-bg {
      position: absolute;
      inset: 0;
      background: rgb(6 6 10 / 95%);
      z-index: 0;
  }

  .coming-bg img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.6;
  }
  
 

  .coming-content {
      position: relative;
      z-index: 1;
  }

  .coming-content h2 {
      /*font-size: clamp(1.8rem, 2.5vw, 2.4rem);*/
      color: #fff;
      /*margin-bottom: 1rem;*/
      /*font-weight: 800;*/
  }

  .coming-content p {
      /*font-size: 1rem;*/
      color: #FFFFFF;
      margin: 0 auto 2rem;
      line-height: 1.75;
  }

  .btn-outline-pill {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      color: var(--teal);
      border-radius: 50px;
      font-weight: 500;
      background: #FFF;
      font-size: 0.9rem;
      padding: 0.8rem 3rem;
      text-decoration: none;
      transition: background 0.3s, transform 0.2s;
  }

  .btn-outline-pill:hover {
      background: var(--teal);
      color: #fff;
      transform: translateY(-2px);
  }

  /* ─── FOOTER ─────────────────────────────────────── */
  footer {
      background: var(--teal);
      padding: 3.5rem 0 0;
  }

  .footer-brand .the {
      font-size: 0.58rem;
      font-weight: 700;
      letter-spacing: 0.2em;
      color: rgba(255, 255, 255, 0.6);
      text-transform: uppercase;
  }

  .footer-brand .kanodia {
      font-size: 1.1rem;
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.3px;
  }

  .footer-brand .company {
      font-size: 0.5rem;
      letter-spacing: 0.22em;
      color: rgba(255, 255, 255, 0.5);
      text-transform: uppercase;
  }

  .footer-initiative {
      font-size: 0.95rem;
      color: #fff;
      margin-top: 1rem;
      font-weight: 400;
  }

  .footer-tagline {
      font-size: 0.95rem;
      color: #FFFFFF;
      margin-top: 0.25rem;
  }

  .footer-col-title {
      font-size: 0.95rem;
      font-weight: 800;
      color: #fff;
      margin-bottom: 0.2rem;
  }

  .footer-link {
      /* display: block; */
      font-size: 0.95rem;
      color: #FFFFFF;
      margin-bottom: 1rem;
      text-decoration: none;
      transition: color 0.2s;
      font-weight: 400;
  }
  
@media screen and (min-width: 1700px) {
    .footer-link,  .footer-col-title,  .footer-tagline, .footer-initiative{
        font-size:1.1rem;
    }
      
  }

  .footer-link:hover {
      color: #fff;
  }

  .footer-bottom {
      position: relative;
      margin-top: 1rem;
      /* border-top: 1px solid #FFF; */
      padding: 1.25rem 0;
      display: flex;
      justify-content: space-between;
  }

  .footer-bottom::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100vw;
      /* full viewport width */
      height: 1px;
      background: #fff;
  }

  .footer-bottom p {
      font-size: 0.8rem;
      color: #FFFFFF;
      margin: 0;
      font-weight: 400;
  }

  .footer-tagline-bottom {
      font-size: 0.8rem;
      font-weight: 400;
      color: #FFFFFF;
  }

  /* ─── PLACEHOLDER IMAGES ──────────────────────────── */
  .img-placeholder {
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #D1D5DB 0%, #E5E7EB 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 2.5rem;
      color: #9CA3AF;
  }

  .quote-img {
      width: 60px !important;
      height: auto;
  }

  .founder-img {
      position: relative;
      z-index: 3;
  }

  .booths-image img {
      width: 100%;
      border-radius: 16px;
      transition: opacity 0.3s ease;
      position: relative;
      z-index: 5;
      aspect-ratio: 9/6;
  }

  .tab-content-panel {
      display: none;
  }

  .tab-content-panel.active {
      display: block;
  }

  .overlay-btn {
      position: absolute;
      bottom: -10%;
      left: 5%;
      z-index: 10;
      white-space: nowrap;
      border-radius: 12px;
  }

  /* .booths-section {
      overflow-x: hidden;
  } */

  .tab-content-panel ul {
      padding: 0;
      margin: 0;
      margin-bottom: 3vw;
      list-style: none;
  }

  .tab-content-panel ul li {
      margin-bottom: 5px;
      /* optional spacing */
  }


  .custom-list li {
      position: relative;
      padding-left: 30px;
  }

  .custom-list li::before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 18px;
      height: 18px;
      background-image: url("../images/favicon.png");
      background-size: contain;
      background-repeat: no-repeat;
  }

  .tab-content-panel p {
      font-size: clamp(16px,1.146vw,22px);
      color: var(--black);
      width: 70%;
      /* margin-bottom: clamp(50px, 5.208vw, 100px); */
  }

  /* ─── RESPONSIVE ─────────────────────────────────── */
  @media (max-width: 991px) {

      .desktop-block {
          display: none;

      }

      .hero {
          grid-template-columns: 1fr;
      }

      .hero-left {
          padding: 7rem 2rem 4rem;
      }

      .teams-inner {
          grid-template-columns: 1fr;
      }

      .teams-left {
          /*padding: 3.5rem 2rem;*/
      }

      /* .partner-logos {
          gap: 1.5rem;
          flex-wrap: wrap;
          flex-direction: column;
      } */

      .btn-connect {
          width: max-content;
      }

      .nav-link-item {
          font-size: 15px;
      }

      .poly-dots {
          display: none;
      }

      .left-poly-dots {
          display: none;
      }

      .upper-side-poly-dots {
          display: none;
      }

      .hero-watermark img {
          width: 130px;
          height: auto;
      }

      .teams-inner {
          flex-direction: column-reverse;
          /* 🔥 image comes first */
      }

      .teams-left,
      .teams-right {
          width: 100%;
          margin: 0;
          /*padding: 20px;*/
          top:auto;
      }

      /* reset absolute positioning */
      .teams-image {
          position: relative;
          top: auto;
          right: auto;
          transform: none;
      }

      /* .teams-right {
          min-height: auto;
      } */

      .teams-image img {
          width: 100%;
          height: auto;
          border-radius: 12px;
      }

      /* spacing tweak */
      .teams-left {
          padding-top: 10px;
      }

      .btn-outline-round {
          width: max-content;
          text-align: center;
          /* better for mobile */
      }

      .teams-right {
          /*margin-top: -100px;*/
          position:relative;
          height:100%;
      }

      .teams-right img {
          height: 300px;
          /*aspect-ratio:2/1*/
      }

      /*.teams-left {*/
      /*    padding-top: 0 !important;*/
      /*}*/

      /*.scale-section {*/
      /*    margin-bottom: 70px*/
      /*}*/

      .carbon-note {
          width: 100%;
      }

      .petal-bottom-image {
          display: none;
      }

      .petal-top-image {
          display: none;
      }

      .experience-section h2 {
          text-align: center;
      }

      .experience-section p:first-of-type {
          font-size: 16px;
          text-align: center;
          margin: 0 auto;
          width: 100%;
      }

      .experience-section p {
          text-align: center;
          margin-top: 20px;
      }

      .experience-section .link-white {
          display: flex;
          justify-content: center;
          align-items: center;
          width: max-content;
          margin: 0 auto;
          font-size: 17px;
      }

      .mobile-block {
          display: block;
          position: relative !important;
          left: 0;
          top: 0;
          width: 100%;
          padding: 1rem;
          margin-top: 0;
      }

      .quote-author {
          display: flex;
          justify-content: center;
          align-items: center;
          margin: 0 auto;
          margin-top: 30px;
      }

      .quote-author-name {
          font-size: 19px;
          letter-spacing: -0.1px;
      }

      .quote-author-title {
          font-size: 16px;
      }

      .petal-top-image {
          position: absolute;
          bottom: 0;
          left: 5%;
          display: block;
          width: 100%;
          height: auto;
      }

      .founder-wrap {
    
          margin-top: 20px;
          margin-left:auto;
          margin-right:auto;
      }

      .booths-section h2 {
          margin-top: 60px;
      }

      /* .partner-divider {
          width: 70%;
          height: 1px;
      } */

      .partner-bar-text {
          font-size: 18px;
          text-align: center;
      }

      .partner-bar {
          padding-bottom: 50px;
      }

      footer .hero-watermark img {
          display: none;
      }

      .carbon-section {
          padding-top: 4.5rem;
          padding-bottom: 5.5rem;
      }

      #mobileToggle img {
          width: 30px;
          height: auto;
      }

      .nav-logo img {
          max-width: 210px;
      }

      .hero-scroll {
          left: 2rem;
      }

      .hero-left {
          min-height: 98vh;
      }

      .light-petal-icon {
          display: none;
      }

      .booths-section {
        overflow-x: hidden;
      }

      /* .bannerTxt{
        position: relative;
      } */

  }

  @media (max-width: 767px) {
      .hero-left {
          padding: 6.5rem 1.5rem 3.5rem;
      }

      .proven-section,
      .booths-section,
      .aligned-section,
      .scale-section,
      .contact-section {
          padding: 4rem 0;
      }

      .carbon-card {
          padding: 2rem 1.5rem;
      }

      /*.teams-left {*/
      /*    padding: 3rem 1.5rem;*/
      /*}*/
  }

  @media (min-width:992px) {

      .footer-logo {
          width: 18.677vw;
          height: auto;
      }

  

      .upper-side-poly-dots {
          position: absolute;
          top: 0px;
          left: 0;
          width: 31.354vw;
          opacity: 1;
          pointer-events: none;
      }

    
     

      .hero-watermark img {
          width: clamp(50px, 11.719vw, 225px);
          height: auto;
      }

      .hero-right img {
          width: 100%;
          height: 100vh;
      }

      .experience-section img {
          width: 35.625vw;
          height: auto;
      }

      .teams-image img {
          height: 100%;
      }

      .btn-outline-round {
          width: max-content
      }

      /*.teams-left {*/
      /*    padding-top: 5.2vw;*/
      /*    padding-right: 6.5vw;*/
      /*    padding-left: 4.5vw;*/
      /*    padding-bottom: 1.3vw*/
      /*}*/

      /*.teams-right {*/
      /*    margin-right: 4.842vw;*/
      /*}*/

      

      .teams-left .italic {
          font-size: 1.29vw;
          line-height: 1.3;
      }

      

      .teams-left .hero-watermark img {
          width: 14vw;
          height: auto;
          opacity: 0.7;
      }

      /* .carbon-card {
          margin-inline: 14vw;
      } */

    

      .logo-icon svg {
          width: 11.598vw;
          height: auto;
      }

   

      .petal-top-image {
          position: absolute;
          top: 5%;
          right: 4%;
          width: 25vw !important;
          opacity: 0.7;
          z-index: 1;
          /* lower than founder image */
          pointer-events: none;
      }

      .founder-wrap {
          position: relative;
          z-index: 3;
      }

      .desktop-block {
          display: block;
      }

      .mobile-block {
          display: none;
      }

      footer .hero-watermark {
          position: absolute;
          bottom: -24%;
          left: 33%;
          width: max-content;
      }

      footer .hero-watermark img {
          width: 19vw;
          height: auto;
          opacity: 0.4;
      }

      .hero-left {
          padding-left: 10vw;
      }

      .booths-section {
          overflow-x: visible;
      }

      /* .teams-image {
          transform: translateY(-8%)
      } */

      /*.footer-col-title {*/
      /*    margin-top: 2.1vw;*/
      /*}*/

      .capability-card {
          height: 14.271vw;
      }



      /* .tab-italic {
          padding-bottom: 2vw;
      } */

      .booths-section h2 {
          margin-top: 0.8vw;
      }

      .booths-image .btn-amber {
          font-size: 1.463vw;
      }

      .proven-img img {
          width: 100%;
          height: auto;
      }

 

      .carbon-box-1 {
          position: relative;
      }

      /* .carbon-box-1::before {
          content: "";
          position: absolute;
          top: -6%;
          bottom: 25%;
          right: -12px;
          transform: translateX(-50%);
          width: 0.5px;
          background: #0D837A;
      } */

    

      .scale-section .hero-watermark {
          position: absolute;
          top: 0;
          right: 10%;
      }

      /* .bannerTxt {
          position: absolute;
          top: 50%;
          left: 0;
          transform: translateY(-50%);
          width: 100%;
          z-index: 1;
      } */

      .light-petal-icon {
          position: absolute;
          top: 0;
          left: 50%;
          transform: translateX(-50%);
          z-index: 0;
          width: clamp(150px, 14.063vw, 270px);
          z-index: -1;
          /* background: red; */
          /* lower layer */
      }

      .scale-content .light-petal-icon {
          top: -48%;
          left: 0%;
          z-index: 0;
          transform:translateX(0);
          /* lower layer */
      }

      .card-icon-2 {
          width: 4vw;
          height: 4vw;
      }

  }

  @media (min-width:1200px) {
     

      .booths-image img {
          position: relative;
          /* transform: translateY(3vw); */
          /* 👈 move OUTSIDE (upwards) */
          z-index: 5;
      }

  }



.logo-icon img, .logo-icon svg {width: clamp(80px, 10.417vw, 200px);}

.logo-icon {display: block;}

.proven-images-left, .proven-images-right { width: clamp(200px, 23.958vw, 460px);}

.title {font-size: clamp(22px, 2.396vw, 45px); font-weight: 900;}


.provenTxtWrp {margin-top: clamp(20px, 2.083vw, 40px);}
.provenTxtWrp > * {margin-bottom: clamp(15px, 1.302vw, 25px);} 
.provenTxtWrp > *:last-child {margin-bottom: 0;}

.card-icon {
          width:clamp(40px, 2.604vw, 50px);
          height: auto;
      }


    .dot-bg {
    

      background: url(../images/dotBg.png) repeat center;
      background-size: cover;
  }

  .booths-section { position: relative; padding: clamp(50px, 5.208vw, 100px) 0 0 0 ; background: rgba(230, 242, 223, 0.5);}

   .booths-section:before { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; background: var(--white); height: clamp(30px, 4vw, 54.64px);}


   .tabContentBox {padding-bottom: clamp(30px, 6vw, 81.96px)}
 
  .booths-image {padding:0 0 clamp(10px, 0.781vw, 15px) clamp(35px, 3.646vw, 70px); position: relative;}


  .boothCta {background: #E89D1B; line-height: 1; border-radius: clamp(10px, 1.042vw, 20px); color: inherit; text-decoration: none; color: var(--white); padding: clamp(20px, 1.823vw, 35px); position: absolute; bottom: 0; left: 0; z-index: 5; font-size: clamp(20px, 1.563vw, 30px); font-weight: 900;}

  .tealVrLine {width: 1px;height: 100%;background: var(--teal);display: block;position: absolute;left: 50%;transform: translateX(-50%);}


  .hero {position: relative;}




  /* .bannerTxt {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;} */


    .bannerTxt:before {content: ''; position: absolute; top: 0; left: 0; width: 50%; height: 100%; background: url(../images/Hero-Banner-Linear-Gradient.png) no-repeat center; background-size: 100% 100%;  z-index: -1;}

    @media(max-width:768.99px){
  .bannerTxt {position: relative; width: 100%;}
  .bannerTxt:before {width: 100%;}
    }

    @media(max-width:575.99px){
        .tealVrLine {display: none;}
    }
    
    .teams-left .hero-watermark {
          position: absolute;
          top: -20%;
          left: 0;
          width: max-content;
          height: max-content;
      }
      
      
        @media(max-width:991.99px){
       .teams-section::before {top:100px}
         .teams-left {padding-top:50px}
    }
    
    
    .poly-dots {
          position: absolute;
          top: 0px;
          right: 0;
          width: clamp(300px, 31.25vw, 600px);
          opacity: 1;
          pointer-events: none;
          /* avoids blocking clicks */
      }

      .upper-side-poly-dots {
          position: absolute;
          top: 0px;
          left: 0;
          width: clamp(300px, 31.25vw, 600px);
          opacity: 1;
          pointer-events: none;
      }

      .left-poly-dots {
          position: absolute;
          bottom: 0px;
          left: 0;
          width: 31.354vw;
          opacity: 1;
          pointer-events: none;
          /* avoids blocking clicks */
      }
      
      .founder-wrap {width:clamp(300px, 25vw, 480px)}
      
         .experience-section .watermark {
          position: absolute;
          top: 0;
          left: 50%;
          width: clamp(200px, 25vw, 500px);
          opacity: 0.7;
transform: translateX(-50%);      }
      
      .experience-section .watermark img {width:100%}
      
      @media(max-width:991.99px){
          .quote-block {position: relative;
        bottom: auto;
        margin: 20px auto 0 auto;
        right: auto;}
          /*.founder-img {border:1px solid rgb(227 215 180 / 30%); border-radius:15px}*/
      }