* {
    /* padding: 0; */
    margin: 0;
}
a {
    text-decoration: none !important;
}
p{
    margin: 0px !important;
}

body, h1, h2, h3, h4, h5, h6, p, ul, ol {
  margin: 0;
  /* padding: 0; */
}

@font-face {
    font-family: "dm sans medium";
    src: url(../fonts/DMSans-Bold.ttf);
}
@font-face {
    font-family: "dm sans bold";
    src: url(../fonts/DMSans-Bold.ttf);
}

@font-face {
    font-family: "poopins medium";
    src: url(../fonts/Poppins-Medium.ttf);
}
@font-face {
    font-family:"poopins semibold" ;
    src: url(../fonts/Poppins-Regular.ttf);
}
.main {
    width: 100%;
    min-height: 100vh;
    background-image: url("../../assets/images/background.png");
    background-position: 70% center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.content-holder {
     width: 100%;
     min-height: 100vh;
     display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.content {
  padding-left: 90px !important;
  display: flex;
  justify-content: space-between;
  align-items: top;
  /* border: 1px solid black; */
  /* min-height: 100vh; */
}
.logo {
      padding:45px 0px 55px 0px !important;
}
.ai-logo {
    padding-bottom: 45px !important;
}
.title h1 {
    color: #fff;
    font-family: "dm sans medium";
    font-size: 40px;
    text-transform: uppercase;
    margin: 0px;
}
.title {
        padding-bottom: 40px !important;
}
.details-section {
    padding-left: 45px !important;
    max-width: 895px;
}
.compliance-details-section {
    max-width: 970px !important;
}
.details {
     list-style-image: url("../images/li-stlye-icon.png");
}
.client-details {
    display: flex;
    max-width: 100% !important;
    gap: 80px;
}
.client-details .details .details-holder .list-text {
    padding-bottom:32px !important;
}
.details-holder {
    display: flex;
}
.list-text {
      color: #fff;
    font-family: "poopins medium";
    font-size: 28px;
    padding-left: 17px !important;
    padding-bottom:38px !important;
}
.ai-details-holder .list-text {
        padding-bottom:15px !important;
}
.list-img {
    margin-top: 6px;
}
.details li {
    color: #fff;
    font-family: "poopins medium";
    font-size: 28px;
    padding-left: 8px !important;
    padding-bottom:35px !important;
}

.right-side {
    /* border: 1px solid black; */
  /* height: 100vh; */
  /* display: flex; */
  /* align-items: end; */
  padding-top: 160px;
}
.first-link p {
   font-family: "dm sans bold";
   color: white;
   font-size: 27px;

}
.content-link-holder {
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.first-link {
   /* padding: 7px 20px; */
   position: relative;
   height: 48px;
   width: 72px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-top: 1px solid #f7dfbe;
   border-left: 1px solid #f7dfbe;
   border-bottom: 1px solid #f7dfbe;
   border-right: none;
   border-radius: 7px 0px 0px 7px;
   cursor: pointer;
   background-color:rgba(255, 255, 255, 0.1);
   box-shadow: 1px 1px 5px rgb(172, 169, 169);

}


.active {
    background-color: #000 !important;
    border: 1px solid black !important;
}
.mobile-active {
    background-color: #fff !important;
    color: #fff !important;
}
.mobile-active p {
    color: #000 !important;
}
.offcanvas-header {
     background-color: #000 !important;
      /* background-image: url("../../assets/images/background.png") !important; */
     /* background-position: 100% center !important; */
}
a .first-link.active:hover p {
  color: #fff !important;
}

.first-link:hover {
  background-color: #fff !important;
}
.active:hover {
    background-color: #000 !important;
}
.link-selected {
      background-color: #000 !important;
}
.link-selected:hover a p {
    color: #fff !important;
}
.first-link:hover p {
  color: #000 !important;
}
.lower-section {
    display: flex;
    justify-content: space-between;
    padding:70px 25px 50px 90px !important;
}
.ai-lower-section  {
          padding:70px 25px 50px 90px !important;
}
.client-lower-section {
        padding:0px 90px 40px 90px !important;
}
.left-link p a {
      font-family: "poopins medium";
      font-size: 18px;
      color: #f89d24;
      text-decoration: none;
}

.right-link a {
    font-family: "poopins medium";
      font-size: 18px;
      color: #fff;
      letter-spacing: 1px;
      text-decoration: none;
}
.right-link p {
    color: white;
     font-family: "poopins medium";
      font-size: 18px;
}

.first-link {
  position: relative;
  height: 48px;
  width: 72px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #f7dfbe;
  border-left: 1px solid #f7dfbe;
  border-bottom: 1px solid #f7dfbe;
  border-right: none;
  border-radius: 7px 0px 0px 7px;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.1);
  box-shadow: 1px 1px 5px rgb(172, 169, 169);
}
.first-link a {
    text-decoration: none;
    display: flex;
    gap: 10px;
}

/* Tooltip Image Container */
.first-link::after {
  content: attr(data-label);
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  
  /* Size + background */
  background: url('../images/hover-arrow.png') no-repeat center center;
  background-size: 100% 100%; /* stretch to fit text */
  
  /* Dynamic sizing */
  padding: 0px 25px 0px 15px !important;
  min-height: 50px;
  max-width: 240px;           /* optional max */
  width: auto;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;

  /* Text styles */
  font-size: 18px;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  color: #000;

  /* Animation */
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

/* Show on hover */
.first-link:hover::after {
  opacity: 1;
}

.mobile-menu {
    background-color: #000;
}
.mobile-logo img {
    max-width: 170px;
    width: 100%;
    height: auto;
    margin-left: 20px
}
.mobile-menu {
    display: none;
    width: 100%;
}
.menu-icon img {
    width: 25px;
  filter: invert(1) brightness(2);
  margin-right: 20px;
  cursor: pointer;
}
.offcanvas-body {
    background: black;
    
}

.offcanvas .btn-close {
  filter: invert(1) brightness(200%) !important;
  padding-right: 10px !important;
}