:root {
      --background: #080C16;
      --foreground: #ffffff;
      --card: #0b111e;
      --card-foreground: #020817;
      --primary: #00d5ff;
      --primary-foreground: #ffffff;
      --muted-foreground: #94a3b8;
      --border: #20283c;
      --bg-secondary: #0b111e;
      --primary-rgb: 37, 196, 217;
      --warning-rgb: 150, 99, 15;
      --warning: #fbbf24;
      /* Pappu */
      --bg-dark: #0b111e;
      --card-bg: #111827;
      --text-gray: #9ca3af;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      background-color: var(--background);
      color: var(--foreground);
      overflow-x: hidden;
      font-family: "Inter", sans-serif;
      font-size: 1rem;
      position: relative;
    }

    img {
      max-width: 100%;
    }

    /* Header Styling */
    .navbar-custom {
      background-color: #090d16;
      backdrop-filter: blur(8px);
      border-bottom: 1px solid var(--border);
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1030;
      padding: 1rem 0;
    }

    .navbar-center-logo {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
    }

    .navbar-logo {
      height: 1.5rem;
      width: auto;
    }

    /* Button Styling */
    .btn-custom-primary {
      background-color: var(--primary);
      color: var(--card-foreground);
      border: none;
      font-weight: 600;
      height: 56px;
      border-radius: 12px;
      padding: 0 2.5rem;
      box-shadow: 0 4px 20px rgba(var(--primary-rgb), 0.25);
      transition: all linear 0.5s !important;
    }

    .btn-custom-primary i {
      transition: all linear 0.2s !important;
    }

    .btn-custom-primary:hover {
      background-color: var(--primary);
      box-shadow: 0 6px 30px rgba(var(--primary-rgb), 0.4);
      transform: translateY(-2px);
      color: var(--card-foreground);
    }

    .btn-custom-secondary {
      background-color: transparent;
      color: var(--primary);
      border: 1px solid rgba(var(--primary-rgb), 0.5);
      font-weight: 600;
      height: 56px;
      border-radius: 12px;
      padding: 0 2.5rem;
      transition: all 0.3s;
    }

    .btn-custom-secondary:hover {
      background-color: rgba(var(--primary-rgb), 0.1);
      border-color: var(--primary);
      color: var(--primary);
    }

    .btn-client-login {
      background-color: transparent;
      color: var(--primary);
      border: 1px solid rgba(var(--primary-rgb), 0.5);
      font-weight: 600;
      height: 36px;
      border-radius: 6px;
      padding: 0 1rem;
      font-size: 0.875rem;
      transition: all 0.3s;
    }

    .btn-client-login:hover {
      background-color: rgba(var(--primary-rgb), 0.1);
      border-color: var(--primary);
      color: var(--primary);
    }
    .reWorkBtn {
      margin-right: 15px;
      background-color: var(--primary);
      color: var(--card);
    }
    .reWorkBtn:hover {
      background-color: rgba(var(--primary-rgb), 0.1);
    }

    /* Background Effects */
    .bg-grid {
      /* background-image:
        linear-gradient(to right, rgba(var(--primary-rgb), 0.02) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(var(--primary-rgb), 0.02) 1px, transparent 1px); 
      background-size: 4rem 4rem;*/
      background-color: var(--bg-secondary);
    }

    .bg-gradient-radial {
      background: radial-gradient(circle, var(--tw-gradient-stops));
    }

    /* Custom Utilities */
    .text-primary {
      color: var(--primary) !important;
    }

    .text-muted-foreground {
      color: var(--foreground) !important;
    }

    .text-foreground {
      color: var(--foreground) !important;
    }

    .bg-background {
      background-color: var(--background) !important;
    }

    .bg-secondary {
      background-color: var(--bg-secondary) !important;
    }

    .bg-card {
      background-color: var(--card) !important;
    }

    .bg-card-main .bg-card {
      background-color: var(--card) !important;
    }

    .border-border {
      border-color: var(--border) !important;
    }

    .border-primary-20 {
      border-color: rgba(var(--primary-rgb), 0.2) !important;
    }

    .border-primary-50 {
      border-color: rgba(var(--primary-rgb), 0.5) !important;
    }

    .bg-primary-3 {
      background-color: rgba(var(--primary-rgb), 0.03) !important;
    }

    .bg-primary-5 {
      background-color: rgba(var(--primary-rgb), 0.05) !important;
    }

    .bg-primary-10 {
      background-color: rgba(var(--primary-rgb), 0.1) !important;
    }

    .bg-primary-15 {
      background-color: rgba(var(--primary-rgb), 0.15) !important;
    }

    .bg-primary-20 {
      background-color: rgba(var(--primary-rgb), 0.2) !important;
    }




    .primary-bg {
      background-color: var(--primary) !important;
    }

    .uppercase {
      text-transform: uppercase;
    }

    .logoH {
      height: 1.5rem;
      width: auto;
    }

    .logoF {
      height: 1.25rem;
      width: auto;
    }

    .container {
      max-width: 1440px;
    }

    .container-full {
      max-width: 100%;
    }

    a:hover {
      text-decoration: none !important;
    }

    .w-6 {
      width: 6rem;
    }

    .max-w-xl {
      max-width: 36rem;
    }

    .my-1 {
      margin-top: .25rem;
      margin-bottom: .25rem;
    }

    .-ml-4 {
      margin-left: -1rem;
    }

    .-mt-4 {
      margin-top: -1rem;
    }

    .mb-1 {
      margin-bottom: .25rem;
    }

    .mb-10 {
      margin-bottom: 2.5rem;
    }

    .mb-12 {
      margin-bottom: 3rem;
    }

    .mb-16 {
      margin-bottom: 4rem;
    }

    .mb-2 {
      margin-bottom: .5rem;
    }

    .mb-20 {
      margin-bottom: 5rem;
    }

    .mb-3 {
      margin-bottom: .75rem;
    }

    .mb-4 {
      margin-bottom: 1rem;
    }

    .mb-6 {
      margin-bottom: 1.5rem;
    }

    .mb-7 {
      margin-bottom: 1.75rem;
    }

    .mb-8 {
      margin-bottom: 2rem;
    }

    .mb-9 {
      margin-bottom: 2.25rem;
    }

    .ml-1 {
      margin-left: .25rem;
    }

    .ml-2 {
      margin-left: .5rem;
    }

    .ml-auto {
      margin-left: auto;
    }

    .mr-2 {
      margin-right: .5rem;
    }

    .mt-0\.5 {
      margin-top: .125rem
    }

    .mt-1\.5 {
      margin-top: .375rem
    }

    .mt-10 {
      margin-top: 2.5rem
    }

    .mt-12 {
      margin-top: 3rem
    }

    .mt-14 {
      margin-top: 3.5rem
    }

    .mt-16 {
      margin-top: 4rem
    }

    .mt-2 {
      margin-top: .5rem
    }

    .mt-2\.5 {
      margin-top: .625rem
    }

    .mt-20 {
      margin-top: 5rem
    }

    .mt-24 {
      margin-top: 6rem
    }

    .mt-4 {
      margin-top: 1rem
    }

    .mt-6 {
      margin-top: 1.5rem
    }

    .mt-8 {
      margin-top: 2rem
    }

    .mt-auto {
      margin-top: auto
    }

    .block {
      display: block
    }

    .inline-block {
      display: inline-block
    }

    .inline {
      display: inline
    }

    .flex {
      display: flex
    }

    .inline-flex {
      display: inline-flex
    }

    .table {
      display: table
    }

    .grid {
      display: grid
    }

    .hidden {
      display: none
    }

    .aspect-\[4\/5\] {
      aspect-ratio: 4/5
    }

    .aspect-square {
      aspect-ratio: 1 / 1
    }

    .aspect-video {
      aspect-ratio: 16 / 9
    }

    .size-4 {
      width: 1rem;
      height: 1rem
    }

    .h-1\.5 {
      height: .375rem
    }

    .h-10 {
      height: 2.5rem
    }

    .h-11 {
      height: 2.75rem
    }

    .h-12 {
      height: 3rem
    }

    .h-14 {
      height: 3.5rem
    }

    .h-16 {
      height: 4rem
    }

    .h-2 {
      height: .5rem
    }

    .h-2\.5 {
      height: .625rem
    }

    .h-20 {
      height: 5rem
    }

    .h-28 {
      height: 7rem
    }

    .h-3 {
      height: .75rem
    }

    .h-3\.5 {
      height: .875rem
    }

    .h-4 {
      height: 1rem
    }

    .h-40 {
      height: 10rem
    }

    .h-5 {
      height: 1.25rem
    }

    .h-6 {
      height: 1.5rem
    }

    .h-64 {
      height: 16rem
    }

    .h-7 {
      height: 1.75rem
    }

    .h-8 {
      height: 2rem
    }

    .h-9 {
      height: 2.25rem
    }

    .h-96 {
      height: 24rem
    }

    .h-\[1px\] {
      height: 1px
    }

    .h-\[500px\] {
      height: 500px
    }

    .h-\[60\%\] {
      height: 60%
    }

    .h-\[600px\] {
      height: 600px
    }

    .h-\[700px\] {
      height: 700px
    }

    .h-\[var\(--radix-navigation-menu-viewport-height\)\] {
      height: var(--radix-navigation-menu-viewport-height)
    }

    .h-\[var\(--radix-select-trigger-height\)\] {
      height: var(--radix-select-trigger-height)
    }

    .h-auto {
      height: auto
    }

    .h-full {
      height: 100%
    }

    .h-px {
      height: 1px
    }

    .h-svh {
      height: 100svh
    }

    .max-h-96 {
      max-height: 24rem
    }

    .max-h-\[300px\] {
      max-height: 300px
    }

    .max-h-\[90vh\] {
      max-height: 90vh
    }

    .max-h-screen {
      max-height: 100vh
    }

    .min-h-0 {
      min-height: 0px
    }

    .min-h-\[400px\] {
      min-height: 400px
    }

    .min-h-\[80px\] {
      min-height: 80px
    }

    .min-h-screen {
      min-height: 100vh
    }

    .min-h-svh {
      min-height: 100svh
    }

    .w-0 {
      width: 0px
    }

    .w-1 {
      width: .25rem
    }

    .w-1\.5 {
      width: .375rem
    }

    .w-1\/3 {
      width: 33.333333%
    }

    .w-10 {
      width: 2.5rem
    }

    .w-11 {
      width: 2.75rem
    }

    .w-12 {
      width: 3rem
    }

    .w-14 {
      width: 3.5rem
    }

    .w-16 {
      width: 4rem
    }

    .w-2 {
      width: .5rem
    }

    .w-2\.5 {
      width: .625rem
    }

    .w-20 {
      width: 5rem
    }

    .w-24 {
      width: 6rem
    }

    .w-28 {
      width: 7rem
    }

    .w-3 {
      width: .75rem
    }

    .w-3\.5 {
      width: .875rem
    }

    .w-3\/4 {
      width: 75%
    }

    .w-32 {
      width: 8rem
    }

    .w-4 {
      width: 1rem
    }

    .w-5 {
      width: 1.25rem
    }

    .w-6 {
      width: 1.5rem
    }

    .w-64 {
      width: 16rem
    }

    .w-7 {
      width: 1.75rem
    }

    .w-72 {
      width: 18rem
    }

    .w-8 {
      width: 2rem
    }

    .w-9 {
      width: 2.25rem
    }

    .w-96 {
      width: 24rem
    }

    .w-auto {
      width: auto
    }

    .w-full {
      width: 100%
    }

    .w-max {
      width: -moz-max-content;
      width: max-content
    }

    .w-px {
      width: 1px
    }

    .min-w-0 {
      min-width: 0px
    }

    .min-w-5 {
      min-width: 1.25rem
    }

    .min-w-\[12rem\] {
      min-width: 12rem
    }

    .min-w-\[8rem\] {
      min-width: 8rem
    }

    .min-w-\[var\(--radix-select-trigger-width\)\] {
      min-width: var(--radix-select-trigger-width)
    }

    .max-w-2xl {
      max-width: 42rem
    }

    .max-w-3xl {
      max-width: 48rem
    }

    .max-w-4xl {
      max-width: 56rem
    }

    .max-w-5xl {
      max-width: 64rem
    }

    .max-w-\[--skeleton-width\] {
      max-width: var(--skeleton-width)
    }

    .max-w-\[200px\] {
      max-width: 200px
    }

    .max-w-lg {
      max-width: 32rem
    }

    .max-w-max {
      max-width: -moz-max-content;
      max-width: max-content
    }

    .max-w-md {
      max-width: 28rem
    }

    .max-w-xl {
      max-width: 36rem
    }

    .max-w-xs {
      max-width: 20rem
    }

    .mid-wid {
      width: 50%;
      margin-left: auto;
      margin-right: auto;
    }

    .flex-1 {
      flex: 1 1 0%
    }

    .flex-shrink-0,
    .shrink-0 {
      flex-shrink: 0
    }

    .grow {
      flex-grow: 1
    }

    .grow-0 {
      flex-grow: 0
    }

    .basis-full {
      flex-basis: 100%
    }

    .caption-bottom {
      caption-side: bottom
    }

    .border-collapse {
      border-collapse: collapse
    }

    .p-0 {
      padding: 0
    }

    .p-1 {
      padding: .25rem
    }

    .p-12 {
      padding: 3rem
    }

    .p-2 {
      padding: .5rem
    }

    .p-2\.5 {
      padding: .625rem
    }

    .p-3 {
      padding: .75rem
    }

    .p-4 {
      padding: 1rem
    }

    .p-5 {
      padding: 1.25rem
    }

    .p-6 {
      padding: 1.5rem
    }

    .p-8 {
      padding: 2rem
    }

    .p-\[1px\] {
      padding: 1px
    }

    .px-1 {
      padding-left: .25rem;
      padding-right: .25rem
    }

    .px-10 {
      padding-left: 2.5rem;
      padding-right: 2.5rem
    }

    .px-2 {
      padding-left: .5rem;
      padding-right: .5rem
    }

    .px-2\.5 {
      padding-left: .625rem;
      padding-right: .625rem
    }

    .px-3 {
      padding-left: .75rem;
      padding-right: .75rem
    }

    .px-4 {
      padding-left: 1rem;
      padding-right: 1rem
    }

    .px-5 {
      padding-left: 1.25rem;
      padding-right: 1.25rem
    }

    .px-6 {
      padding-left: 1.5rem;
      padding-right: 1.5rem
    }

    .px-7 {
      padding-left: 2rem;
      padding-right: 2rem
    }

    .px-8 {
      padding-left: 2.5rem;
      padding-right: 2.5rem
    }

    .px-9 {
      padding-left: 3rem;
      padding-right: 3rem
    }

    .px-10 {
      padding-left: 3.5rem;
      padding-right: 3.5rem
    }

    .px-11 {
      padding-left: 4rem;
      padding-right: 4rem
    }

    .px-12 {
      padding-left: 5rem;
      padding-right: 5rem
    }

    .py-0\.5 {
      padding-top: .125rem;
      padding-bottom: .125rem
    }

    .py-1 {
      padding-top: .25rem;
      padding-bottom: .25rem
    }

    .py-1\.5 {
      padding-top: .375rem;
      padding-bottom: .375rem
    }

    .py-12 {
      padding-top: 3rem;
      padding-bottom: 3rem
    }

    .py-2 {
      padding-top: .5rem;
      padding-bottom: .5rem
    }

    .py-2\.5 {
      padding-top: .625rem;
      padding-bottom: .625rem
    }

    .py-20 {
      padding-top: 5rem;
      padding-bottom: 5rem
    }

    .py-24 {
      padding-top: 6rem;
      padding-bottom: 6rem
    }

    .py-3 {
      padding-top: .75rem;
      padding-bottom: .75rem
    }

    .py-32 {
      padding-top: 8rem;
      padding-bottom: 8rem
    }

    .py-4 {
      padding-top: 1rem;
      padding-bottom: 1rem
    }

    .py-6 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem
    }

    .py-8 {
      padding-top: 2.5rem;
      padding-bottom: 2.5rem
    }

    .pb-24 {
      padding-bottom: 6rem
    }

    .pb-3 {
      padding-bottom: .75rem
    }

    .pb-4 {
      padding-bottom: 1rem
    }

    .pl-2\.5 {
      padding-left: .625rem
    }

    .pl-4 {
      padding-left: 1rem
    }

    .pl-8 {
      padding-left: 2rem
    }

    .pr-12 {
      padding-right: 3rem
    }

    .pr-2 {
      padding-right: .5rem
    }

    .pr-2\.5 {
      padding-right: .625rem
    }

    .pr-8 {
      padding-right: 2rem
    }

    .pt-0 {
      padding-top: 0
    }

    .pt-1 {
      padding-top: .25rem
    }

    .pt-10 {
      padding-top: 2.5rem
    }

    .pt-16 {
      padding-top: 4rem
    }

    .pt-2 {
      padding-top: .5rem
    }

    .pt-3 {
      padding-top: .75rem
    }

    .pt-4 {
      padding-top: 1rem
    }

    .pt-6 {
      padding-top: 1.5rem
    }

    .letter-spacing1 {
      letter-spacing: .15em;
    }

    .fs-3 {
      font-size: 1rem !important;
    }

    .fs-4 {
      font-size: 1.5rem !important;
    }

    .fs-5 {
      font-size: 1.15rem !important;
    }

    .fs-6 {
      font-size: 0.875rem !important;
    }

    .fs-7 {
      font-size: 1.75rem !important;
    }

    .min-h-screen {
      min-height: 100vh;
    }

    .items-center {
      align-items: center;
    }

    .border-top {
      border-top: 1px solid var(--border) !important;
    }

    /* Section Styling */
    .section-min-height {
      min-height: 100vh;
      display: flex;
      align-items: center;
      border-top: 1px solid var(--border);
      position: relative;
      overflow: hidden;
    }

    .section-min-height-8 {
      min-height: 60vh;
      display: flex;
      align-items: center;
      border-top: 1px solid var(--border);
      position: relative;
      overflow: hidden;
    }

    /* Animation */
    .animate-fade-in-up {
      animation: fadeInUp 0.6s ease-out forwards;

    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(20px);
      }

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

    /* Image Placeholder */
    .image-placeholder {
      background-color: rgba(var(--primary-rgb), 0.1);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: var(--primary);
      font-size: 1.5rem;
    }

    /* Header Dropdown Menu */
    .dropdown-content {
      opacity: 0;
      visibility: hidden;
      transform: translateY(-10px);
      transition: all 0.3s ease-in-out;
      position: absolute;
      background-color: #0b1120;
      min-width: 260px;
      border: 1px solid #1e293b;
      border-radius: 12px;
      margin-top: 10px;
      padding: 10px 0;
      z-index: 1000;
    }

    .dropdown-content.show {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }

    .sub-menu-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      background-color: rgba(255, 255, 255, 0.02);
    }

    .sub-menu-content.show-sub {
      max-height: 500px;
    }

    .arrow-icon,
    .sub-arrow {
      transition: transform 0.3s ease;
    }

    .rotate {
      transform: rotate(180deg);
    }

    .sub-menu-content.show-sub {
      margin: 6px 0;
      padding: 6px 0;
    }

    .dropdown-content a,
    .sub-menu-toggle {
      color: #a5adc1;
      padding: 8px 20px;
      text-decoration: none;
      display: block;
      cursor: pointer;
      transition: background 0.2s ease;
      font-size: 14px;
      margin: 0 8px;
      border-radius: 6px;
    }

    .sub-menu-content.show-sub a {
      padding: 8px 30px;
      margin: 0 8px;
      border-radius: 6px;
    }

    .dropdown-content a:hover,
    .sub-menu-toggle:hover {
      background-color: #1e293b;
      color: #fff;

    }

    /* Header End */


    /* .card-custom {
      background-color: #080c16 !important;
    } */

    .card-custom2 {
      background-color: var(--card) !important;
    }

    .sectionGap {
      padding: 10% 5%;
    }

    button#menuBtn {
      outline: none;
    }

    .mt-p {
      margin-top: 50px;
    }

    .glow-overlay {
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background: #080c16ba;
    }

    .glow-overlay-section {
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background: #0b111ebf;
    }

    .glow {
      inset: 0;
      z-index: 3;
      pointer-events: none;

      background: radial-gradient(circle at center, rgb(0 200 255 / 0%) 0%, rgb(0 200 255 / 0%) 30%, rgba(0, 0, 0, 0.55) 70%, rgba(0, 0, 0, 0.80) 100%);
    }

    .float-smooth {
      animation: floatSmooth 4s ease-in-out infinite;
    }

    @keyframes floatSmooth {

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

      50% {
        transform: translateY(-8px);
      }
    }


    .bg-grid {
      background-image: linear-gradient(hsl(222 30% 18% / .5) 1px, transparent 1px), linear-gradient(90deg, hsl(222 30% 18% / .5) 1px, transparent 1px);
      background-size: 80px 80px;
    }

    .navbar-center-logo {
      order: 0 !important;
    }

    /* Blur Effects */
    .blur-2xl {
      filter: blur(40px);
    }

    .blur-3xl {
      filter: blur(64px);
    }

    /* Custom Badge */
    .badge-custom {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      font-size: 0.75rem;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      border: 1px solid rgba(var(--primary-rgb), 0.2);
      border-radius: 9999px;
      padding: 0.375rem 1rem;
      background-color: rgba(var(--primary-rgb), 0.05);
      color: var(--primary);
    }

    /* Custom Card */
    .card-custom {
      background-color: var(--card);
      border: 1px solid var(--border);
      border-radius: 10px;
      transition: all 0.3s;
    }

    .card-custom:hover {
      border-color: rgba(var(--primary-rgb), 0.3);
      transform: translateY(-2px);
    }

    #partcipants .card-custom span {
      font-size: 1rem;
    }

    #partcipants .card-custom i {
      font-size: 1.2rem;
    }

    /* Custom Grid Item */
    .grid-item-custom {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.75rem;
      padding: 1.5rem;
      background-color: var(--card);
      border: 1px solid var(--border);
      border-radius: 12px;
      transition: all 0.3s;
    }

    .grid-item-custom:hover {
      border-color: rgba(var(--primary-rgb), 0.3);
      transform: translateY(-2px);
    }

    /* Typography Overrides */
    #homePage h1 {
      font-size: 100px !important;
    }
    .billingH1 {
      font-size: 45px !important;
    }
    h1 {
      font-size: 60px;
      font-weight: 600;
      line-height: 1.1;
      letter-spacing: -0.025em;
    }

    h2 {
      font-size: clamp(1.5rem, 3vw, 2.25rem);
      font-weight: 600;
      line-height: 1.1;
      letter-spacing: -0.025em;
    }

    .lead {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }

    .lead-xl {
      font-size: 1.5rem;
      line-height: 2rem;
    }

    .text-md {
      font-size: 0.75rem;
      line-height: 1rem;
      font-weight: 700;
      letter-spacing: 1px;
    }

     .text-lg {
      font-size: 1.125rem;
      line-height: 1.75rem;
    }

    .text-3xl {
      font-size: 3rem;
      line-height: 1.1;
    }

    /* Custom Positioning */
    .center-absolute {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    /* Footer Styling */
    .footer-custom {
      background-color: var(--card);
      border-top: 1px solid var(--border);
    }

    .footer-custom .bi-linkedin:hover {
      color: var(--foreground);
    }

    .footer-logo {
      height: 1.25rem;
      width: auto;
    }

    .footer-link {
      color: var(--muted-foreground);
      font-size: 0.875rem;
      text-decoration: none;
      transition: color 0.3s;
    }

    .footer-link:hover {
      color: var(--foreground);
    }

    .footer-heading {
      font-weight: 500;
      color: var(--foreground);
      font-size: 0.875rem;
      margin-bottom: 1rem;
    }

    footer .fIcon {
      color: #94a3b8;
      transition: 0.5s;
    }

    footer .fIcon:hover {
      color: #fff;
    }

    /* Responsive adjustments for blur circles */
    @media (max-width: 768px) {
      body {
        font-size: 0.9rem;
      }

      .blur-circle {
        width: 90vw !important;
        height: 90vw !important;
      }

      .navbar-center-logo {
        position: static;
        transform: none;
        order: 2;
        text-align: center;
        flex: 1;
      }

      .navbar-collapse {
        order: 3;
        width: 100%;
        margin-top: 1rem;
      }

      /* text */
      /* .lead {
        font-size: 1rem;
        line-height: 1.5rem;
      } */

      .lead-xl {
        font-size: 1.2rem;
        line-height: 1.5rem;
      }

      .text-lg {
        font-size: 1.1rem;
        line-height: 1.5rem;
      }

      /* Btn */
      .btn-custom-primary,
      .btn-custom-secondary {
        font-size: 0.9rem;
        padding: 0 1rem;
      }

      .section-min-height-8 {
        min-height: 50vh;
      }
    }

    /* Menu Button */
    .menu-button {
      color: var(--muted-foreground);
      font-weight: 500;
      font-size: 1rem;
      transition: color 0.3s;
      border: none;
      background: transparent;
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }

    .menu-button .bi-list {
      font-size: 1.5rem;
    }

    .menu-button:hover {
      color: var(--foreground);
    }

    /* Logo container for better centering */
    .logo-container {
      display: flex;
      justify-content: center;
      width: 100%;
    }


    /* Blur Effects */
    .blur-2xl {
      filter: blur(40px);
    }

    .blur-3xl {
      filter: blur(64px);
    }


    /* Book popup css st */
    /* Modal Dark Background & Main Scroll Handler */

    body.modal-open {
      overflow: hidden !important;
    }


    #book-demo-modal {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #0f1729;
      z-index: 999999;
      display: none;
      overflow-y: auto;
      backdrop-filter: blur(10px);
      -webkit-overflow-scrolling: touch;
    }

    /* Scroll Area Layout */
    .modal-scroll-area {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      min-height: 100%;
      padding: 60px 15px;
    }

    /* Form Card Details */
    .custom-modal-dialog {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 40px 0;
    }

    .book-card::before {
      pointer-events: none !important;
    }

    .custom-modal-dialog {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100vh;
      padding: 20px;
    }

    .book-card {
      background: #0a1128;
      width: 100%;
      max-width: 650px;
      border-radius: 15px;
      padding: 30px;
      max-height: 80vh;
      overflow-y: auto;
      position: relative;
      z-index: 100;

      /* Safari smooth momentum scrolling */
      -webkit-overflow-scrolling: touch;
    }

    /* Optional: Scrollbar design to make it look clean */
    .book-card::-webkit-scrollbar {
      width: 6px;
    }

    .book-card::-webkit-scrollbar-track {
      background: transparent;
    }

    .book-card::-webkit-scrollbar-thumb {
      background: #3b82f6;
      /* Tomar theme color dite paro */
      border-radius: 10px;
    }

    /* Scrollbar Customize */
    .book-card::-webkit-scrollbar {
      width: 8px;
    }

    .book-card::-webkit-scrollbar-track {
      background: rgba(255, 255, 255, 0.02);
      border-radius: 10px;
      margin: 10px 0;
    }


    .book-card::-webkit-scrollbar-thumb {
      background: #0dcaf0;
      border-radius: 10px;
      border: 2px solid #0a1128;
    }

    .book-card::-webkit-scrollbar-thumb:hover {
      background: #0aa2c0;
    }

    .book-card {
      scrollbar-width: thin;
      scrollbar-color: #0dcaf0 transparent;
    }

    /* Book popup css nd */



    /* Login */

    /* Login Page Specific Styles */
    .login-container {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 2rem 1rem;
      padding: 20px;
      background-color: #0f1729;
    }

    .login-card {
      background-color: #1b2334;
      backdrop-filter: blur(10px);
      border: 1px solid rgba(var(--border), 0.3);
      border-radius: 16px;
      padding: 2.5rem;
      width: 100%;
      max-width: 440px;
      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
      position: relative;
      overflow: hidden;
    }

    .login-card::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(var(--primary-rgb), 0.05) 0%, transparent 70%);
      z-index: -1;
    }

    .back-button {
      color: var(--muted-foreground);
      background: transparent;
      border: none;
      display: flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.5rem 0;
      margin-bottom: 1.5rem;
      transition: color 0.3s;
      font-size: 0.875rem;
    }

    .back-button:hover {
      color: var(--foreground);
    }

    .login-logo {
      height: 2rem;
      width: auto;
      margin-bottom: 2rem;
    }
    #homePage h1.login-title {
      font-size: 2rem !important;
    }
    .login-title {
      font-size: 2rem !important;
      font-weight: 600;
      margin-bottom: 0.5rem;
      letter-spacing: -0.020em;
    }

    .login-subtitle {
      color: var(--muted-foreground);
      font-size: 0.875rem;
      margin-bottom: 2rem;
    }

    .form-label {
      font-size: 0.875rem;
      font-weight: 500;
      color: var(--muted-foreground);
      margin-bottom: 0.5rem;
      display: block;
    }

    .form-control-custom {
      background-color: #272e3e !important;
      border: 1px solid var(--border);
      color: #7d818b !important;
      border-radius: 10px;
      padding: 0.875rem 1rem;
      font-size: 1rem;
      transition: all 0.3s;
      height: 56px;
    }

    .form-control-custom:focus {
      background-color: rgba(var(--primary-rgb), 0.08);
      border-color: rgba(var(--primary-rgb), 0.5);
      box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.1);
      color: var(--foreground);
    }

    .form-control-custom::placeholder {
      color: rgba(var(--muted-foreground), 0.6);
    }

    .password-toggle {
      position: absolute;
      right: 1rem;
      top: 50%;
      transform: translateY(-50%);
      background: transparent;
      border: none;
      color: var(--muted-foreground);
      padding: 0.25rem;
      transition: color 0.3s;
    }

    .password-toggle:hover {
      color: var(--primary);
    }

    .login-button {
      background-color: var(--primary);
      color: var(--card-foreground);
      border: none;
      font-weight: 600;
      height: 56px;
      border-radius: 12px;
      padding: 0 2.5rem;
      width: 100%;
      box-shadow: 0 4px 20px rgba(var(--primary-rgb), 0.25);
      transition: all 0.3s;
      font-size: 1rem;
    }

    .login-button:hover {
      background-color: var(--primary);
      box-shadow: 0 6px 30px rgba(var(--primary-rgb), 0.4);
      transform: translateY(-2px);
    }

    .forgot-link {
      color: var(--muted-foreground);
      font-size: 0.875rem;
      text-align: center;
      display: block;
      margin-top: 1.5rem;
      transition: color 0.3s;
      text-decoration: none;
    }

    .forgot-link:hover {
      color: var(--primary);
    }

    .security-notice {
      color: rgba(var(--muted-foreground), 0.7);
      font-size: 0.75rem;
      text-align: center;
      margin-top: 1.5rem;
    }

    /* Animation */
    .animate-fade-in {
      animation: fadeIn 0.6s ease-out forwards;
    }

    @keyframes fadeIn {
      from {
        opacity: 0;
      }

      to {
        opacity: 1;
      }
    }

    /* Home page css st */
    .section-hero {
      min-height: 100vh;
      display: flex;
      align-items: center;
      position: relative;
      overflow: hidden;
    }

    .section-hero h3 {
      font-weight: 400 !important;
    }

    .bg-grid {
      background-image:
        linear-gradient(to right, rgba(var(--primary-rgb), 0.1) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(var(--primary-rgb), 0.1) 1px, transparent 1px);
      background-size: 4rem 4rem;
      position: absolute;
      inset: 0;
      opacity: 0.3;
    }

    .gradient-radial {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 700px;
      height: 700px;
      background: radial-gradient(circle, rgba(var(--primary-rgb), 0.15) 0%, rgba(var(--primary-rgb), 0.05) 40%, transparent 70%);
      border-radius: 50%;
      filter: blur(60px);
    }

    .text-primary-custom {
      color: var(--primary);
    }

    .bg-primary-custom {
      background-color: rgba(var(--primary-rgb), 0.1);
    }

    .border-primary-custom {
      border-color: rgba(var(--primary-rgb), 0.6) !important;
    }

    .border-left-primary {
      border-left: 2px solid rgba(var(--primary-rgb), 0.4) !important;
    }

    .btn-primary-custom {
      background-color: var(--primary);
      color: var(--card);
      border: none;
      padding: 1rem 2.5rem;
      font-weight: 600;
      border-radius: 12px;
      transition: all 0.3s;
      box-shadow: 0 4px 20px rgba(var(--primary-rgb), 0.25);
    }

    .btn-primary-custom:hover {
      background-color: var(--primary);
      color: var(--card);
      box-shadow: 0 6px 30px rgba(var(--primary-rgb), 0.4);
    }

    .btn-outline-primary-custom {
      background-color: transparent;
      color: var(--primary);
      border: 1px solid rgba(var(--primary-rgb), 0.5);
      padding: 1rem 2.5rem;
      font-weight: 600;
      border-radius: 12px;
      transition: all 0.3s;
    }

    .btn-outline-primary-custom:hover {
      background-color: rgba(var(--primary-rgb), 0.1);
      border-color: var(--primary);
      color: var(--primary);
    }

    #homePage .card-custom {
      background-color: #080c16;
    }

    .card-custom {
      background-color: var(--card);
      border: 1px solid var(--border);
      border-radius: 8px;
    }

    .border-custom {
      border-color: var(--border) !important;
    }

    .badge-custom {
      background-color: rgba(var(--primary-rgb), 0.05);
      border: 1px solid rgba(var(--primary-rgb), 0.2);
      color: var(--primary);
      font-weight: 500;
      font-size: 0.875rem;
      letter-spacing: 0.1em;
      padding: 0.375rem 1rem;
      border-radius: 50px;
    }

    .logo-blur {
      position: absolute;
      width: 120px;
      height: 120px;
      background-color: rgba(var(--primary-rgb), 0.2);
      border-radius: 50%;
      filter: blur(40px);
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    .shadow-glow {
      box-shadow: 0 0 20px rgba(var(--primary-rgb), 0.15), 0 0 40px rgba(var(--primary-rgb), 0.08);
    }

    .opacity-animate {
      opacity: 1;
      transform: none;
    }

    .tracking-wider {
      letter-spacing: 0.1em;
    }

    .text-muted-custom {
      color: var(--foreground);
    }


    .bg-gradient-section {
      background: linear-gradient(to bottom, rgba(var(--primary-rgb), 0.03) 0%, transparent 50%);
    }

    .whitespace-nowrap {
      white-space: nowrap;
    }

    .text-warning {
      color: var(--warning);
    }


    .border-warning {
      border-color: rgba(var(--warning-rgb)) !important;
    }

    .border-dashed-sm {
      border-top: dashed 1px #343c4c;
      width: 80%;
      margin: 0 auto;
    }

    .border-dashed-sm-h {
      border-left: dashed 1px #343c4c;
    }

    .border-dashed-sm-all {
      border: dashed 1px #343c4c;
    }

    .border-t {
      border-top-width: 1px;
    }


    @media (max-width: 768px) {
      .whitespace-nowrap {
        white-space: normal;
      }

      .gradient-radial {
        width: 400px;
        height: 400px;
      }

      .px-12 {
        padding-left: 2rem;
        padding-right: 2rem
      }
    }

    /* Home page css nd */



    /* ...Team Page... */
    /* Modal Background Overlay */

    .section-team {
      padding-top: 6rem;
      padding-bottom: 6rem;
      position: relative;
      overflow: hidden;
    }



    .team-member-card {
      display: flex;
      align-items: center;
      gap: 1.5rem;
      padding: 1rem;
      border-radius: 1rem;
      border: 2px solid rgba(var(--primary-rgb), 0.2);
      background-color: rgba(var(--card), 0.5) !important;
      transition: all 0.3s ease;
      cursor: pointer;
      backdrop-filter: blur(8px);
    }

    .team-member-card:hover {
      border-color: rgba(var(--primary-rgb), 0.5);
      background-color: var(--card);
      transform: translateY(-2px);
    }

    .team-member-card:hover .team-member-name {
      color: var(--primary);
    }

    .team-member-image {
      width: 6rem;
      height: 7rem;
      object-fit: cover;
      object-position: top;
      border-radius: 0.75rem;
      flex-shrink: 0;
      transition: transform 0.3s ease;
    }

    .team-member-card:hover .team-member-image {
      transform: scale(1.05);
    }

    .team-member-name {
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--foreground);
      transition: color 0.3s ease;
    }

    .team-member-role {
      color: rgba(var(--primary-rgb), 0.8);
      font-weight: 500;
      font-size: 0.875rem;
    }

    .read-bio-link {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      color: var(--primary);
      font-size: 0.875rem;
      font-weight: 500;
      text-decoration: none;
    }

    .read-bio-link i {
      transition: transform 0.3s ease;
    }

    .team-member-card:hover .read-bio-link i {
      transform: translateX(4px);
    }



    /* My */
    .modal-overlay {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgb(0 0 0 / 51%);
      backdrop-filter: blur(10px);
      z-index: 9999;
    }

    /* Modal Box Design */

    .modal-content-custom {
      background-color: #0f172a;
      padding: 30px;
      width: 90%;
      max-width: 900px;
      border-radius: 20px;
      border: 1px solid #1e293b;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -45%);
      overflow: hidden;
    }

    .close-btn {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 40px;
      width: 40px;
      position: absolute;
      right: 20px;
      top: 15px;
      font-size: 28px;
      cursor: pointer;
      color: var(--text-gray);
      transition: all linear 0.1s;
      z-index: 9999999;
    }

    .close-btn:hover {
      background-color: #ffffff29;
      backdrop-filter: blur(4px);
      box-shadow: 0px 0px 5px #ffffff5b;
      border-radius: 9999px;
      scale: 0.9;
    }

    .member-name {
      font-weight: 700;
      margin-bottom: 5px;
    }

    .member-title {
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1px;
    }

    .member-bio p {
      color: var(--text-gray);
      line-height: 1.6;
      font-size: 0.95rem;
      margin-bottom: 1.5rem;
    }

    .image-wrapper img {
      width: 100%;
      filter: grayscale(20%);
    }

    .modal-overlay {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.9);
      backdrop-filter: blur(8px);
      z-index: 9999;
    }


    .modal-bio-scroll {
      max-height: 500px;
      overflow-y: auto;
      padding-right: 15px;
      color: #9ca3af;
      line-height: 1.8;
      font-size: 1rem;
      white-space: pre-wrap;
    }

    /*(Chrome, Edge, Safari) */
    .modal-bio-scroll::-webkit-scrollbar {
      width: 6px;
    }

    .modal-bio-scroll::-webkit-scrollbar-track {
      background: #1e293b;
      border-radius: 10px;
    }

    .modal-bio-scroll::-webkit-scrollbar-thumb {
      background: #3b82f6;
      border-radius: 10px;
    }

    @media (max-width:1280px) {
      .modal-content-custom {
        background-color: #0f172a;
        /* margin: 10% auto; */
      }
    }

    @media (max-width:1024px) {
      .text-3xl {
        font-size: 2.5rem;
      }

      .px-12 {
        padding-left: 3rem;
        padding-right: 3rem
      }
    }

    @media (max-width:768px) {
      .text-3xl {
        font-size: 2rem;
      }

      .btn-custom-primary {
        justify-content: center;
      }

      .section-min-height {
        min-height: 60vh;
      }

      img#modalImg {
        width: 100px !important;
      }

      .modal-bio-scroll {
        max-height: 270px;
        line-height: 1.5;
      }

      .section-team {
        padding-top: 8rem;
        padding-bottom: 8rem;
      }

      .modal-content-custom {
        padding: 20px;
      }

    }



    /* .........Legal & Procurement....... */
    /* Legal Page Specific Styles */
    .sectionGapSmall {
      padding: 5%;
    }

    .comparison-table {
      background-color: var(--card);
      border-radius: 12px;
      overflow: hidden;
      border: 1px solid var(--border);
    }

    .comparison-table .row {
      margin: 0;
      border-bottom: 1px solid var(--border);
    }

    .comparison-table .row:last-child {
      border-bottom: none;
    }

    .comparison-table .col {
      padding: 1rem 1.5rem;
      display: flex;
      align-items: center;
    }

    .comparison-table .row:nth-child(odd) .col {
      background-color: var(--background);
    }

    .comparison-table .row:first-child .col {
      background-color: rgba(var(--primary-rgb), 0.1);
      font-weight: 600;
    }

    .form-control-custom {
      background-color: var(--background);
      border: 1px solid var(--border);
      color: var(--foreground);
      border-radius: 8px;
      padding: 0.75rem 1rem;
    }

    .form-control-custom:focus {
      background-color: var(--background);
      border-color: var(--primary);
      color: var(--foreground);
      box-shadow: 0 0 0 0.25rem rgba(var(--primary-rgb), 0.25);
    }

    .form-check-custom {
      border: 2px solid var(--border);
      border-radius: 8px;
      padding: 1rem;
      transition: all 0.3s;
      cursor: pointer;
    }

    .form-check-custom:hover {
      border-color: rgba(var(--primary-rgb), 0.5);
    }

    .form-check-custom.active {
      border-color: var(--primary);
      background-color: rgba(var(--primary-rgb), 0.05);
    }

    .accordion-custom {
      background-color: #0b111c;
      border: 1px solid var(--border);
      border-radius: 8px;
      margin-bottom: 0.5rem;
    }

    .accordion-button-custom {
      background-color: transparent;
      color: var(--foreground);
      font-weight: 600;
      padding: 1rem 1.5rem;
      border: none;
      width: 100%;
      text-align: left;
      display: flex;
      justify-content: space-between;
      align-items: center;
      transition: all 0.3s;
    }

    /* .accordion-button-custom:hover {
      background-color: rgba(var(--primary-rgb), 0.05);
    } */

    /* .accordion-button-custom:not(.collapsed) {
      background-color: rgba(var(--primary-rgb), 0.08);
    } */

    /* .accordion-button-custom::after {
      content: '\F282';
      font-family: 'bootstrap-icons';
      font-size: 1rem;
      transition: transform 0.3s;
    } */

    /* .accordion-button-custom:not(.collapsed)::after {
      transform: rotate(180deg);
    } */

    .accordion-body-custom {
      padding: 1rem 1.5rem;
      color: var(--muted-foreground);
      /* border-top: 1px solid var(--border); */
    }



    /* My */

    .comparison-card {
      background-color: #0b111e;
      border-radius: 12px;
      border: 1px solid #1f2937;
      overflow: hidden;
      margin: 20px 0;
    }


    .table-header {
      background-color: #1d394f;
      border-bottom: 1px solid #1f2937;
    }

    .header-text {
      color: #ffffff;
      font-weight: 600;
      font-size: 1rem;
    }


    .table-row {
      border-bottom: 1px solid #080c16;
      transition: background-color 0.2s;
    }

    .table-row:last-child {
      border-bottom: none;
    }


    .table-row {
      background-color: #080c16;
      border-bottom: 1px solid #20283c;
    }


    .label-text {
      color: #9ca3af;
      font-size: 0.95rem;
    }

    .value-text {
      color: #ffffff;
      font-weight: 600;
      font-size: 0.95rem;
    }


    .border-secondary {
      border-color: #1f2937 !important;
    }

    .accordion-body-custom span {
      font-size: 0.8rem;
      color: hsl(215deg 20% 65%) !important;
      margin-bottom: 5px;
    }

    /* .....Resources..... */

    /* Resources Page Specific Styles */
    .resources-hero {
      min-height: 80vh;
      padding-top: 6rem;
      padding-bottom: 6rem;
    }

    .resource-section {
      padding-top: 4rem;
      padding-bottom: 4rem;
    }

    .resource-card {
      background-color: var(--card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 1.5rem;
      transition: all 0.3s;
      height: 100%;
    }

    .resource-card:hover {
      border-color: rgba(var(--primary-rgb), 0.5);
      transform: translateY(-4px);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    }

    .resource-icon-container {
      width: 3rem;
      height: 3rem;
      border-radius: 10px;
      background-color: rgba(var(--primary-rgb), 0.1);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .resource-download-link {
      color: var(--primary);
      font-size: 0.875rem;
      font-weight: 600;
      opacity: 0;
      transition: opacity 0.3s;
      margin-top: auto;
    }

    .resource-card:hover .resource-download-link {
      opacity: 1;
    }

    .demo-cta-section {
      background: #131c314f;
      border: 1px solid rgba(var(--primary-rgb), 0.2);
      border-radius: 16px;
      padding: 3rem;
      margin-top: 4rem;
    }

    /* Responsive adjustments */
    @media (max-width: 768px) {
      .blur-circle {
        width: 90vw !important;
        height: 90vw !important;
      }

      .navbar-center-logo {
        position: static;
        transform: none;
        order: 2;
        text-align: center;
        flex: 1;
      }

      .navbar-collapse {
        order: 3;
        width: 100%;
        margin-top: 1rem;
      }

      .resources-hero {
        min-height: 60vh;
        padding-top: 4rem;
        padding-bottom: 4rem;
      }

      .demo-cta-section {
        padding: 2rem 1.5rem;
      }
    }

    /* ...Pricing... */


    /* Pricing Specific Styles */
    .bg-gradient-blue-soft {
      background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.05) 0%, rgba(var(--primary-rgb), 0.02) 100%);
    }

    .pricing-highlight {
      display: inline-flex;
      align-items: center;
      gap: 1rem;
      padding: 1.1rem;
      border-radius: 16px;
      background-color: rgba(var(--primary-rgb), 0.1);
      border: 1px solid rgba(var(--primary-rgb), 0.2);
    }

    .pricing-percentage {
      font-size: 3rem;
      font-weight: 700;
      color: var(--primary);
      line-height: 1;
    }

    .pricing-icon-box {
      width: 4rem;
      height: 4rem;
      border-radius: 12px;
      background-color: rgba(var(--primary-rgb), 0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 1rem;
    }

    .pricing-icon-box .bi {
      font-size: 1.75rem;
      color: var(--primary);
    }

    /* Section Styling */
    .section-pricing {
      padding-top: 6rem;
      padding-bottom: 6rem;
      position: relative;
      overflow: hidden;
    }


    /* Responsive adjustments */
    @media (max-width: 768px) {
      .pricing-highlight {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
      }

      .section-pricing {
        padding-top: 8rem;
        padding-bottom: 8rem;
      }

      .pricing-percentage {
        font-size: 2.5rem;
      }
    }

    /* Careers page specific styles */
    .pt-16 {
      padding-top: 4rem;
    }


    .pb-24 {
      padding-bottom: 6rem;
    }

    .space-y-4>*+* {
      margin-top: 1rem;
    }

    .rounded-2xl {
      border-radius: 1rem;
    }

    .rounded-full {
      border-radius: 9999px;
    }

    .font-display {
      font-family: "Inter", sans-serif;
    }

    /* .text-3xl {
      font-size: 1.875rem;
      line-height: 2.25rem;
    } */

    .text-4xl {
      font-size: 2.25rem;
      line-height: 2.5rem;
    }

    .text-5xl {
      font-size: 3rem;
      line-height: 1;
    }

    .text-6xl {
      font-size: 3.75rem;
      line-height: 1;
    }

    .tracking-wider {
      letter-spacing: 0.05em;
    }

    .max-w-2xl {
      max-width: 42rem;
    }

    .max-w-3xl {
      max-width: 48rem;
    }

    .max-w-4xl {
      max-width: 56rem;
    }

    .h-11 {
      height: 2.75rem;
    }

    .gap-2 {
      gap: 0.5rem;
    }

    .gap-3 {
      gap: 0.75rem;
    }

    .gap-4 {
      gap: 1rem;
    }

    /* Custom job listing card */
    .job-card {
      background-color: var(--card);
      border: 1px solid var(--border);
      border-radius: 1rem;
      padding: 1.5rem;
      transition: all 0.3s;
      text-decoration: none;
      display: block;
    }

    .job-card:hover {
      border-color: rgba(var(--primary-rgb), 0.3);
      transform: translateY(-2px);
      text-decoration: none;
    }

    .job-card:hover h5 {
      color: var(--primary) !important;
    }

    .job-card .btn-view-role {
      border: 1px solid rgba(var(--primary-rgb), 0.5);
      background-color: transparent;
      color: var(--primary);
      border-radius: 0.75rem;
      padding: 0.5rem 1.5rem;
      font-weight: 600;
      transition: all 0.3s;
    }

    .job-card:hover .btn-view-role {
      border-color: var(--primary);
      background-color: rgba(var(--primary-rgb), 0.1);
    }

    /*...... 2/11/2026 ........*/
    /* Custom Class */
    .gradient-custom {
      background: linear-gradient(160deg, #081622 20%, #0000002c 50%, #081f2c 100%);
    }

    /* Custom Class 2 */
    .gradient-custom2 {
      background: linear-gradient(160deg, #0b111e 30%, #0f1524 50%, #0b111f 100%);
    }

    /* Custom Class participents */
    .gradient-custom-participents {
      background: linear-gradient(160deg, #081521 20%, #080c16 50%, #080c16 100%);
    }

    /* Section Styling */
    .section-min-container {
      min-height: 500px;
      display: flex;
      align-items: center;
      border-top: 1px solid var(--border);
      position: relative;
      overflow: hidden;
    }

    /*  */
    .form-check-input {
      border-color: hsl(190deg 100% 50%);
      background-color: transparent;
    }

    .resource-card h3 {
      transition: 0.5s;
    }

    .resource-card:hover h3 {
      color: var(--primary) !important;
    }

    .resource-card:hover h6 {
      color: var(--primary) !important;
    }

    .resource-card .more {
      color: var(--primary) !important;
      text-decoration: none;
      transition: 0.5s;
    }

    .resource-card .more i {
      font-size: 1.4rem;
    }

    .glow-custom-overlay {
      position: absolute;
      height: 400px;
      width: 400px;
      border-radius: 999px;
      background-color: #00d5ff1e;
      top: 0;
      right: 0;
      z-index: 0;
      filter: blur(100px);
    }

    .center-absolute-right {
      top: 50%;
      right: 0;
      transform: translate(-50%, -50%);
    }

    .back-link {
      text-decoration: none !important;
    }

    .back-link:hover {
      color: var(--primary) !important;
    }

    .back-link i {
      transition: all linear 0.3s !important;
    }

    .back-link:hover i {
      transform: translateX(-5px);

    }

    @media (max-width:1600px) {
      .modal-bio-scroll {
        max-height: 380px;
      }
    }

    @media (max-width:1366px) {}

    @media (max-width:768px) {
      .flex-col768 {
        flex-direction: column !important;
      }

      .section-hero {
        padding: 5rem 0;
      }

      .btn-outline-primary-custom,
      .btn-primary-custom {
        WHITE-SPACE: NOWRAP;
        FONT-SIZE: 0.875rem;
      }

      .modal-bio-scroll {
        max-height: 180px;
      }

      .py-24 {
        padding-top: 3rem;
        padding-bottom: 3rem;
      }

      .section-pricing {
        padding-top: 4rem;
        padding-bottom: 4rem;
      }

      .pricing-highlight span {
        text-align: center !important;
      }

      #menuBtn span {
        display: none;
      }

      #menuBtn .bi-chevron-down {
        display: none;
      }

      .menuBtn span {
        font-size: 1rem !important;
      }

      .mid-wid {
        width: 100%;
      }
    }

     @media (max-width:575px) {
    .reWorkBtn {
        color: transparent;
        font-size: 0;
        background-image: url('../img/re-work.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: 25px;
        height: 25px;
        display: inline-block;
        border: none;
        background-color: transparent;
        margin-right: 0px !important;
      }
      .reWorkBtn:hover {
        background-color: transparent !important;
      }
    #clientLoginBtn {
        color: transparent;
        font-size: 0;
        background-image: url('../img/login-client.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: 25px;
        height: 25px;
        display: inline-block;
        border: none;
        background-color: transparent;
      }
    }

    @media (max-width:480px) {
      .display-4 {
        font-size: 1.8rem !important;
      }

      .fs-5 {
        font-size: 1rem !important;
      }

      #pricing .card-custom {
        padding: 25px !important;
      }

      #pricing .card-custom i {
        font-size: 17px;
      }

      .lead {
        font-size: 1rem;
        line-height: 1.3rem;
      }

      .section-team {
        padding-top: 3rem;
        padding-bottom: 3rem;
      }

      .logoH {
        height: 1rem;
      }

      .navbar-custom {
        padding: 0.5rem 0;
      }

      .btn-client-login {
        padding: 0 0.5rem;
      }

      .read-bio-link span {
        white-space: nowrap;
      }

      /* .team-member-card {
        flex-wrap: wrap;
      } */

      /* .team-member-card {
        gap: 0;
      } */

      /* .teamImgSec {
        padding-right: 20px;
      }

      .teamDesSec {
        padding-right: 10px;
      }

      .teamBioSec {
        padding-top: 5px;
      } */

      .login-card {
        border-radius: 10px;
        padding: 1.5rem;
      }

      .login-container {
        padding: 10px;
      }

      .modal-bio-scroll {
        max-height: 240px;
      }
    }

    #pricing .card-custom span {
      text-align: left !important;
    }

    .accordion-body-custom .accordion-body-main-point {
      position: relative;
    }

    .accordion-body-custom .round-ball {
      height: 8px;
      width: 8px;
      position: absolute;
      top: 5px;
    }

    .accordion-body-custom .text-foreground {
      padding-left: 20px;
    }

    .left-text {
      text-align: left;
    }

    .shareBox {
      display: flex;
      gap: 20px;
      align-items: center;
    }

    .shareIconBox {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }

    .shareBox .shareIconBox a {
      border: solid 1px #b6b5b5;
      border-radius: 50%;
      width: 36px;
      height: 36px;
      line-height: 32px;
      text-align: center;
      color: #b6b5b5;
      transition: 0.5s;
    }

    .shareBox .shareIconBox a:hover {
      color: #00d5ff;
      border-color: #00d5ff;
    }

    .z-2 {
      z-index: 2 !important;
    }

    .z-3 {
      z-index: 3 !important;
    }

    .ex-in-box {
      width: 17%;
    }

    @media (max-width:1440px) {
     #homePage h1 {
        font-size: 85px !important;
      }
      h1 {
        font-size: 50px;
      }
    }

    @media (max-width:1400px) {
      .ex-in-box {
        width: 16%;
      }
    }

    @media (max-width: 1400px) {
      .ex-in-box {
        width: 16.5%;
        font-size: 0.8rem !important;
      }

    }

    @media (max-width: 1200px) {
      .ex-in-box {
        width: 15%;
      }

      #homePage h1 {
        font-size: 75px !important;
      }
    }

    @media (max-width: 1024px) {
      #homePage h1 {
        font-size: 60px !important;
      }
    .billingH1 {
      font-size: 40px !important;
    }
     h1 {
        font-size: 45px;
      }

      .section-hero h3 br {
        display: none;
      }
    }

    @media (max-width: 767px) {
      .ex-in-box {
        width: auto;
      }

       #homePage h1 {
        font-size: 50px !important;
      }
   .billingH1 {
      font-size: 36px !important;
    }
      h1 {
        font-size: 40px;
      }
    }

    @media (max-width: 480px) {
       #homePage h1 {
        font-size: 40px !important;
      }
      .billingH1 {
      font-size: 30px !important;
    }
       h1 {
        font-size: 35px;
      }
    }

    /* Crucial for perfect Safari compatibility with Lenis */
    .lenis.lenis-smooth [data-lenis-prevent] {
      overscroll-behavior: contain;
    }