.supply-bg-strip {
    background: url(/supply-chain-management/img/strip-bg.webp) no-repeat center center;
    background-size: cover;
    padding: 25px 20px;
    text-align: center;
    color: white;
    font-family: Arial, sans-serif;
}
.case-box {
    border: 2px solid #0097a4;
    border-radius: 8px;
    padding: 20px;
    max-width: 550px;
    flex: 1 1 550px;
}
.partner-logo-heroshot {
	right: 0;
	bottom: 0;
}
.takeaways-box {
    background-color: #dbf2f5;
    border-radius: 10px;
    padding: 20px 30px;
    margin: auto;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}
.drawline-orange:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 100%;
    background: #f06627;
    left: -2%;
}
.popular-services-border {
    border: 1px solid #f06627;
}
.services-grid-2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}
.service-box-2 {
    margin-bottom: 10px;
    flex: 1 1 calc(50% - 40px);
    max-width: 290px;
    min-width: 250px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.card-d-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 50px;
}

.card-column {
    margin-bottom: 50px;
    flex: 1 1 calc(50% - 120px);
    max-width: 320px;
    min-width: 250px;
    display: flex;
    flex-direction: column;
    justify-content: left;
    position: relative;
    /* width: 280px; */
    background-color: #fff;
    border-radius: 20px;
    padding: 20px;
    padding-top: 60px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}


.header-tab {
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 10px;
    padding: 10px 20px;
    color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.head-color-one{
      background-color: #0095a2;
}
.head-color-second{
      background-color: #ef5a16;
}
.head-color-third{
      background-color: #005d69;
}
.head-color-fourth{
      background-color: #601f9e;
}
.icon-placeholder {
    font-size: 24px;
}

.card-content h3 {
    color: #000000;
    font-size: 1.2em;
    margin-bottom: 15px;
    text-align: center;
}

/* Decorative line elements */
.design-element-top-left {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 50px;
    height: 150px;

    border-top-left-radius: 25px;
}
.design-element-border-first{
    border-left: 3px solid #0096a3;
    border-top: 3px solid #0096a3;
}
.design-element-border-second{
    border-left: 3px solid #ef5a16;
    border-top: 3px solid #ef5a16;
}
.design-element-border-third{
    border-left: 3px solid #2eaee2;
    border-top: 3px solid #2eaee2;
}
.design-element-border-fourth{
    border-left: 3px solid #9a5df3;
    border-top: 3px solid #9a5df3;
}

.design-element-bottom-right {
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 100px;
    height: 50px;
    border-bottom-right-radius: 25px;
}
.element-bottom-right-one{
 border-right: 3px dotted #0096a3;
    border-bottom: 3px dotted #0096a3;
}
.element-bottom-right-second{
 border-right: 3px dotted #ef5a16;
    border-bottom: 3px dotted #ef5a16;
}
.element-bottom-right-third{
  border-right: 3px dotted #2eaee2;
    border-bottom: 3px dotted #2eaee2;
}
.design-element-right-fourth{
 border-right: 3px dotted #9a5df3;
    border-bottom: 3px dotted #9a5df3;
}

@media (max-width: 1199px) {

    .drawline-orange:before {
        display: none;
    }
    .partner-logo-heroshot {
        display: none;
    }
    .popular-services-border {
        display: none;
    }

}
@media  (min-width:768px){
    .desktop-md-img {
    display: block;
}
    .mobile-md-img {
    display: none;
}

}
@media (min-width:0px) and (max-width:768px){
    .mobile-md-img {
    display: block;
}
.desktop-md-img {
    display: none;
}
.mobile-md-img img{
    width: 80%;
}
.card-column{
        max-width: 90%;
    min-width: 90%;
}
}
@media (min-width:991px) and (max-width:1307px){
  .card-column{
    max-width: 420px;
  }
}