
@font-face {
    font-family: 'proxima_novabold';
    src: url('../fonts/proximanova-bold-webfont.woff2') format('woff2'),
         url('../fonts/proximanova-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'proxima_novalight';
    src: url('../fonts/proximanova-light-webfont.woff2') format('woff2'),
         url('../fonts/proximanova-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'proxima_novaregular';
    src: url('../fonts/proximanova-regular-webfont.woff2') format('woff2'),
         url('../fonts/proximanova-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'proxima_nova_condensedSBd';
    src: url('../fonts/proximanovacond-semibold-webfont.woff2') format('woff2'),
         url('../fonts/proximanovacond-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.font-weight-light{font-family: 'proxima_novalight';}

body{font-family: 'proxima_novaregular';font-size: 1em;color: #0a0a14;}
h5{font-family: 'proxima_novaregular';}

h1,h6,b,h4 {font-family: 'proxima_novabold';}


 .miliya-bg.portfolio-item,.trans-bg,  .tweet-bg { border-radius:10px;
}



 .miliya-bg {
            /* Using the gradient from your Miliya assets */
            /*background:#ffe9e3;*/
            
          border:1px solid #ffe9e3; 
              transition: background 0.5s ease;
           
        }
        
        .miliya-bg:hover{ }
        

        .trans-bg {
            /* Using the gradient from your Miliya assets */
           /*background: #ddefff;*/
           
          border:1px solid #ddefff;
          

        }
        
         .trans-bg:hover{
             
             /*border:1px solid #ddefff;*/
               /*background: none; */
         }
        .tweet-bg{ 
            /*background: #daf5f0; */
        border:1px solid #daf5f0;}
        
        .trans-bg:hover {transition: background 0.5s ease;}
        
        
      .miliya-bg.portfolio-item, .trans-bg.portfolio-item, .tweet-bg.portfolio-item {height: 100%; }
        
    .miliya-bg a  ,  .trans-bg a   ,.tweet-bg a {display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;}
    
    .trans-bg a  img{
        height:28px;
    }
    
    
    
    

h4{font-size: 1.2em;}
.ap-box{
  /* border:1px solid #fff; border-radius:6px; */
      background: #0000001a;
}
.br-10{border-radius: 20px;}
.ap-smalltext{ font-size: 18px;}
.ap-head h2{ line-height: 48px;font-family: 'proxima_novaregular';}

.ap-shadow{box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -webkit-box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -moz-box-shadow: 0 15px 10px -10px rgba(33,43,59,.2);
    transform: translate(0,-1px);}

.ap-head h2 a , .ap-smalltext a, a.cbtn, a.ap-link{
    color: inherit;
    white-space: nowrap;
    position: relative;
    z-index: 10;
    text-decoration: none;
}

.ap-head h2 a:hover::before , .ap-smalltext a:hover::before, a.cbtn:hover::before, a.ap-link:hover::before, .ap-cbtn a.btn:hover::before{
    height: 100%;
    bottom: 0;
}
.carousel-indicators li{background-color: #212121;}
.ap-context p{line-height: 30px;}

.ap-head h2 a::before {
    content: '';
    width: 100%;
    height: 15px;
    background: #ffee00;

    /* background: #ffd9dc; */

    /* background: #d2e2fd; */
    /* Blue */
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
    border-radius: 2px;
    transform: rotate(
-1deg
);
    transition: all .2s;
}

.ap-smalltext a::before, a.cbtn::before, a.ap-link::before {
    content: '';
    width: 100%;
    height: 7px;
    /* background: #ffee00; */
        background: #d2e2fd;
    position: absolute;
    left: 0;
    bottom: 3px;
    z-index: -1;
    border-radius: 2px;
    transform: rotate(
-1deg
);
    transition: all .2s;
}
.ap-box2{
  border-radius:6px;border:1px solid #eee;
  box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -webkit-box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -moz-box-shadow: 0 15px 10px -10px rgba(33, 43, 59, .2);
    transform: translate(0, -1px);}


.emoji{height: 18px;}
.market a.cbtn::before {  background: #ffd5fb; }
.about-s a.cbtn::before { background: #ffee00; }
.risk a.cbtn::before {  background: #c4ffcd; }

a.ap-link::before{background: #ffee00;}

.card{border:none;-webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;}





.parallax {
  background-image:  url('../img/abin-home.JPG'); /* Optional */

    min-height: 66vh;
  background-attachment: fixed;
background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  overflow: hidden;
  border-radius: 6px;
}


.portfolio-item img {
  transition: transform 0.3s ease;
  border-radius: 6px;
}
.portfolio-item:hover img {
  transform: scale(1.05);
}





  /* .risk.card:hover .card-body{background: #8fd7981c; }
  .market.card:hover .card-body{    background: #ffbf0017;}
  .zero.card:hover .card-body{    background: #141c4c0a;} */


.card-body{border: 1px solid transparent;}

.card-body b{text-transform: uppercase;
    color: #00000065;
    font-size: .75rem;
    letter-spacing: 1px;}
.card:hover .card-body, .card.risk .card-body{border: 1px solid#f7f7f7;}
/* .bg{background: #f7f7f7;} */

.card-text{margin-bottom: 0;
    line-height: 30px;
    font-size: 1.1rem;}
.card-title, h5{font-size: 1.1rem;
    font-family: proxima_novabold;}
.navbar-light .navbar-toggler{border: none;}

.card .bd-placeholder-img img{filter: grayscale(100%); width: 100%; cursor: pointer; transition: all .5s ease;}
.card:hover .bd-placeholder-img img, .cactive .card.risk .bd-placeholder-img img{filter: grayscale(0%); transition: all .5s ease;}




.card:hover, .cactive .card.risk {box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -webkit-box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -moz-box-shadow: 0 15px 10px -10px rgba(33,43,59,.2);
    transform: translate(0,-1px);}
.card .bd-placeholder-img{box-shadow: 1px 0px 4px 2px rgb(0 0 0 / 0%); transition: all  .2s;
}
.card:hover .bd-placeholder-img{
  /* box-shadow: 1px 0px 4px 2px rgb(0 0 0 / 10%); transition: all  .2s; */}


  .ap-footer-link a{ color: #212121; font-size: 1.5rem;}
  .sticky-top.ap-inner{ background:none;}

.sticky-top{background: #fff;}
.bd-placeholder-img{ position: relative;}
.bd-placeholder-img span{ position: absolute; top:8px; right:8px;z-index: 999; font-size: 18px; color: #fff; opacity: 0;transition: all  1s;}
.card:hover .bd-placeholder-img span{opacity: 1;}

#case-content{ height: 100vh;}

.nav.nav-pills{    justify-content: center;
    /*border-bottom: 1px solid #eeee;*/
}

.ap-cbtn a.btn::before{
    content: '';
    width: 100%;
    height: 5px;
    background: #ffee00;
    background: #d2e2fd;
    position: absolute;
    left: 0;
    bottom: 13px;
    z-index: -1;
    border-radius: 2px;
    transform: rotate( -2deg );
    transition: all .2s;
}

.nav-link{padding: 0.25rem 1rem;  border: 1px solid #fff;}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
   /*color: #212121;*/
    background-color: #f4f4f4;
    border: 1px solid #eee;
    border-radius: 32px;
    }

.hero-sec{
  min-height: 85vh;
}



/* For large Mac screens (e.g., 27" iMac, ultra-wide monitors) */
@media screen and (min-width: 1920px) {
  .hero-sec{
    min-height: 25vh;
  }

  #case-study{
    min-height: 35vh!important;
  }

}




    .sticky-fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1030; /* above navbar */
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}





.btn-more{padding:8px 16px;border:1px solid #fff; border-radius:24px; cursor: pointer;color:#fff;}
.btn-more:hover{background: #ffffff; color:#000000;text-decoration: none;}


.cp-shadow{box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -webkit-box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -moz-box-shadow: 0 15px 10px -10px rgba(33,43,59,.2);
    transform: translate(0, -1px);}

.cp-ts{font-size: 0.75rem;}
.cp-bb{border-bottom: 1px solid #eee;}
.cp-cl-img{background: #eee;margin-right: 16px; width: 72px;
    height: 72px;
    border-radius: 82px;
    margin-top: 6px;
}
.cp-cl-img img{  width: 72px;
    height: 72px;
    border-radius: 82px;

}

.cp-display-5{font-size:1.5rem; margin-bottom: 0px; margin-top: 10px;}

.timeline {
  position: relative;
  margin: 50px auto;
  padding-left: 20px;
  /*max-width: 700px;*/
  border-left: 2px solid #eee;
}

.timeline-item {
  position: relative;
  margin-bottom: 40px;
  padding-left: 20px;
}

.timeline-dot {
  position: absolute;
  left: -30px;
  top: 10px;
  width: 20px;
  height: 20px;
  background-color: #183774; /* Indigo-600 */
  border-radius: 50%;
  border: 3px solid white;
  box-shadow: 0 0 0 3px #eee;
}

.timeline-content h3 {
  margin: 0;
  font-size: 1rem;
  color: #666;
}

.timeline-content h4 {
  margin: 5px 0 10px;
  font-size: 1.2rem;
  color: #111;
}

.timeline-content p {
  margin: 0;
  font-size: 1rem;
  color: #444;
  line-height: 1.5;
}




.sec-bg{
    color: #fff;
    background: linear-gradient(-45deg, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;}

   .nav-pills .nav-link.active, .nav-pills .show>.nav-link, .nav-link{border:2px solid transparent;  border-radius: 100px;
    padding: 8px 20px;}

    .nav-link.active{;transition: all .3s ease !important;


    border: 2px solid rgba(255, 88, 52, 1)!important;
    color: rgba(255, 88, 52, 1)!important;
    background-color:transparent!important;


    }
     .nav-link.active:hover{background: linear-gradient(343deg, rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%); color: #fff!important; border:2px solid #FF5D29; }

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}









.sticky-header {
      z-index: 1020; /* Higher than default content */
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);

    }


.plant {

      animation: sway 3s ease-in-out infinite;
      transform-origin: bottom center;
    }



@keyframes sway {
      0%, 100% { transform: rotate(0deg); }
      50% { transform: rotate(2deg); }
    }



.cp-pp{
transition: border-radius 0.5s ease;
  overflow: hidden;
   border-radius:  10px 0px 100px 0px;
   min-height: 60vh;
}

.cp-pp img {
    filter: grayscale(0%);
    border-radius: 100px 0px 100px 0px;


      display: block;



    }


.cp-pp:hover{ border-radius: 0px 100px 0px 100px; transition: all 0.5s ease;}

.cp-pp:hover img{
    filter: grayscale(0%);

      border-radius: 0px 100px 0px 100px;
        transition: all 0.5s ease;
}

/*
.bd-placeholder-img img, .card hover .bd-placeholder-img.middle  img{

border-radius:50px 0px;


}

.bd-placeholder-img.middle  img, .card hover .bd-placeholder-img img{

border-radius:0px 50px;
  transition: all 0.5s ease;

}

*/

/*#case-study{height:100vh}*/


.btn.btn-primary{ border-radius: 100px;padding: 8px 20px; border: 2px solid transparent;
    color: #fff;
    background: linear-gradient(343deg,rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%); transition: all .5s ease !important;



  }
.btn.btn-primary:hover{color: #fff; background: linear-gradient(343deg,rgba(250, 97, 62, 1) 0%, rgba(214, 11, 65, 1) 100%); }

.smooth-bg{ transition: all .5s ease !important; }
.smooth-bg:hover{background-color: #FF5D29 !important;}

.card .bd-placeholder-img img
{
     border-radius: 6px 6px 0 0;
}









@keyframes zoomInOut {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}







    @media (min-width: 990px) and (max-width: 1200px) {

  .coffee-cup{
     top: 10px!important;
    left: 80px!important;

  }
}



    @media (min-width: 768px) and (max-width: 990px) {

  .coffee-cup{
    display: none;

  }
}




@media only screen and (max-width: 990px) {
.cp-pp {
   }

}


@media only screen and (max-width: 768px) {

.coffee-cup, .person-container img{
    display: none!important;

  }


  .parallax {

        background-image: url(../img/abin-home.jpg);


   background-size: contain;
        min-height: 280px;
        background-attachment: local;
        background-position: bottom;
  }

  .cp-pp {

    display: none!important;}

  #case-study{ height: inherit; }

  .wz-img img{width: 100%; height: inherit!important;}

    .ap-head h2{padding-top: 1rem!important;}

.card .bd-placeholder-img img{filter:none;}

.ap-head{height: 100vh; margin:auto auto;}

}

.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
    color: #e7073f;
}



.horizontal-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #f0f0f0;
  z-index: 9999;
  overflow: hidden;
  display: none; /* Initially hidden */
}

.horizontal-loader .bar {
  width: 0%;
  height: 100%;
  background: linear-gradient(343deg, rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%);
  animation: loadBar 1.5s ease-in-out infinite;
}

@keyframes loadBar {
  0% {
    left: -100%;
    width: 0%;
  }
  50% {
    left: 0;
    width: 100%;
  }
  100% {
    left: 100%;
    width: 100%;
  }
}


.coffee-cup {
  position: absolute;
width: 30px;
    height: 80px;
    left: 80px;
    top: 40px;
}

.cup {

}


.contact-form{    box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -webkit-box-shadow: 0 15px 10px -10px rgb(33 43 59 / 20%);
    -moz-box-shadow: 0 15px 10px -10px rgba(33,43,59,.2);
    background: #ffffffd4;
    border: 1px solid #f7f7f7;}

.steam {
  position: absolute;    bottom: 00px;
    width: 1px;
    height: 33px;
    background: rgb(0 0 0 / 80%);
  border-radius: 50%;
  animation: rise 2s linear infinite;
}

.steam1 { left: 5px; animation-delay: 0s; filter: blur(2px); }
.steam2 { left: 15px; animation-delay: 1s; filter: blur(2px);}
.steam3 { left: 20px; animation-delay: 2s; filter: blur(2px);}
.steam4 { left: 35px; animation-delay: 3s;filter: blur(2px); }

@keyframes rise {
  0% {
    transform: translateY(0) scaleX(1);
    opacity: 0;
  }
  25% {
    opacity: 0.5;
  }
  50% {
    transform: translateY(-20px) scaleX(1.2);
    opacity: 0.3;
  }
  100% {
    transform: translateY(-60px) scaleX(1.4);
    opacity: 0;
  }
}

h1 {letter-spacing: -0.06em;
    font-size: 4rem;}

    h2 {letter-spacing: -0.06em; font-family: 'proxima_novabold';
    font-size: 2rem;}

.ap-footer-link a:hover{
    color:rgb(255 44 96);
}

.navbar-brand:hover, .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
     cursor: pointer!important;  }

.person-container{
display:flex !important;
    align-items: end;}


    .btn-light{    border: 2px solid transparent;
    padding: 8px 20px;
    border-radius: 100px;}


.modal-footer{border-top: none;
    padding-top: 0px;}

    .modal-header{    border-bottom: none;
    padding-bottom: 0px;}

    .whitehr{border-color: #ffffff21;
    }

    .gr-bg{color: #fff;
    background: linear-gradient(120deg, rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%);}

    .product-over:hover{    background: #00000010;transition: all .5s ease !important;  border-radius: 6px;}

    .product-over:{ transition: all .5s ease !important;}

    .bg-dark {
    background-color: #343a405c !important;
}

 @media (min-width: 990px){
#case-study{min-height: 100vh;}
}


.awe-timeline {
      position: relative;
      margin: 0 auto;
      padding: 2rem 0;
      /*max-width: 900px;*/
    }
    .awe-timeline::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 4px;
      /*background: #0d6efd;*/

      background: #eee;
      transform: translateX(-50%);
    }
    .awe-timeline-item {
      position: relative;
      width: 50%;
      padding: 2rem;
    }
    .awe-timeline-item.left {
      left: 0;
      text-align: left;
    }
    .awe-timeline-item.right {
      left: 50%;
      text-align: left;
    }
    .awe-timeline-item::after {
      content: "";
      position: absolute;
      top: 2.5rem;
      width: 20px;
      height: 20px;
      /*background: #0d6efd;*/
      background: #eee;
      border-radius: 50%;
      z-index: 1;
      animation: pulse 2s infinite;
    }
    .awe-timeline-item.left::after {
      right: -10px;
    }

    .awe-timeline-card {
      background: white;
      border-radius: 10px;
      padding: 1rem;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);

      transition: all 0.6s ease;
    }
.awe-timeline-badge {
  position: absolute;
  top: 1rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  background-color: #0d6efd;
  color: white;
  font-size: 0.75rem;
  padding: 0.3rem 0.6rem;
  border-radius: 10px;
}

.awe-timeline-year {
  position: absolute;
top: 0rem;

  z-index: 3;

  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  padding: 4px 8px;
  border-radius: 12px;
}



.awe-timeline-card:hover {
  transform: translateY(0) scale(1.03)!important;
  box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}



    .awe-timeline-item.awe-visible .awe-timeline-card {
      opacity: 1;
      transform: translateY(0);
    }
    .awe-timeline-date {
      font-weight: bold;
      margin-bottom: 0.5rem;
      font-size: 0.9rem;
      color: #6c757d;
    }
    @keyframes pulse {
      0% {
        box-shadow: 0 0 0 0 rgba(255, 88, 52, .6);
      }
      70% {
        box-shadow: 0 0 0 10px rgba(255, 88, 52, 0);
      }
      100% {
        box-shadow: 0 0 0 0 rgba(255, 88, 52, 0);
      }
    }
    @media (max-width: 767px) {

      #timeline-line,.awe-timeline::before {
        left: 10px;
      }
      .awe-timeline-item,
      .awe-timeline-item.left,
      .awe-timeline-item.right {
        width: 100%;
        left: 0;
        text-align: left;
        padding-left: 2.5rem;
      }
      .awe-timeline-item::after {
        left: 0;
      }
    }


    @media (min-width: 768px){


.awe-timeline-item.right .awe-timeline-year
{
left: 0;
    transform: translateX(-50%);
 }

.awe-timeline-item.left .awe-timeline-year
{
right: 0;
    transform: translateX(50%);
 }

   .awe-timeline-item.right::after {
      left: -10px;
    }

    }


    .awe-timeline-card-icon{border-radius: 6px;}

    .font-weight-bold{
font-family: 'proxima_novabold';

    }


   .awe-timeline .cp-cl-img img, .awe-timeline .cp-cl-img {
    width:54px;
    height: 54px;
    border-radius: 82px;
    margin-top: 0px
}

.domy-bg    {background: linear-gradient(120deg, #81b73a, #e7ba28);}
.alten-bg {
    background: linear-gradient(131deg, #ed1c25, #fff204);
}

.archer-bg{background: linear-gradient(120deg, #183774, #63c1f9);}
.now-bg{    background: linear-gradient(154deg, #042d42, #63d84f);}

.awe-company-info{
    position: relative;
    left: 120%;
    top: -69px;
}


.awe-timeline-item.aos-init.aos-animate::after{ background: linear-gradient(343deg, rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%); }

.awe-timeline{overflow: hidden;}
.timeline-line {
      position: absolute;
      top: 0;
      left: 50%;
      width: 4px;
      background: linear-gradient(343deg, rgba(255, 88, 52, 1) 0%, rgba(255, 42, 98, 1) 100%);
      transform: translateX(-50%);
      z-index: 0;
      height: 0;
      transition: height 0.3s ease-out; /* 👈 smooth animation */
    }


/*.awe-timeline.aos-init.aos-animate::before{background: red;}*/



.contact-plant{position: absolute;
    left: -160px;
    z-index: -9;
    max-width: 270px;}

    .contact-person{max-height: 440px;}


    .cs-bubble{padding: 8px;
    border-radius: 20px;

    display: inline-block;
    margin-right: 8px;
    vertical-align: middle; }
    .cs-bubble.green{ background: #8fd89b;}

    .cs-bubble.purple{ background: #ffd5fb;}

    .cs-bubble.red{background: #c95359}


.ur-contain .media svg{color: #c95359;}
.persona{border-radius: 100%;
    border: 6px solid #fff;
    height: 84px;}

    .alert-success {
    background-color: #d4eddaa3;}

    .alert-primary {

    background-color: #cce5ff91;

}

.carousel-inner{ min-height: 70vh; }



.scroll-container {
      height: 100vh;
      overflow-y: scroll;
      scroll-snap-type: y mandatory;
    }

    .scroll-section {
      scroll-snap-align: start;
      min-height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;

    }

.cs-page-title{
  /* background: -webkit-linear-gradient(#f22158, #ff5834); */
  
  color:#f22158;
 
  }

  .cs-page-title:hover{
  animation: none;



  }


  @keyframes textShine {
      0% {
          background-position: 0% 50%;
      }
      100% {
          background-position: 100% 50%;
      }
  }

.cs-kii {padding-left: 0px;}
.cs-kii li{     list-style: none;
 
        background: #eef7f0;
    padding: 6px 12px;
    margin-left: 0px;
    border-left: 3px solid #d8ecdd;
    border-radius: 3px;
    margin-bottom: 6px;}

    .section-1 { background: #fff; }
    .section-2 { background: #d4edda; }
    .section-3 { background: #fff; }
    .section-4 { background: #f7f7f7; }

    .bg-trans{    background: #0000004a;}
