/* ===============================
   AXENTIX DEDICATED SECTION
================================ */

.ax-dedicated {
  background: #ffff;
  min-height: 0%;
  max-height: fit-content;
  padding: 90px 2%;
}

.ax-dedicated-container {
  max-width: 1300px;
  margin: auto;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: center;
}

.ax-dedicated-left {
  position: relative;
  min-height: 520px;
}

.ax-bg-shape {
  position: absolute;
  width: 260px;
  height: 260px;
  background: #dfe5e7;
  top: 40px;
  right: 40px;
  z-index: 0;
}

.ax-img {
  position: absolute;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0,0,0,0.15);
}

.ax-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ax-img-top {
  width: 420px;
  height: 300px;
  top: 0;
  left: 0;
  z-index: 2;
}

.ax-img-bottom {
  width: 420px;
  height: 280px;
  bottom: 0;
  left: 80px;
  z-index: 3;
}

.ax-dedicated-right {
  padding-left: 40px;   /* moved content little right */
  padding-top: 40px;    /* moved content little bottom */
}

.ax-dedicated-right h2 {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 30px;
  color: #1c2227;
}

.ax-dedicated-right p {
  color: #5b6368;
  line-height: 1.7;
  font-size: 16px;
  margin-bottom: 50px;
}

.ax-stats {
  display: flex;
  align-items: flex-start;
  gap: 70px;
  margin-top: 20px;
  padding-left: 10px;
}

.ax-statt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ax-stattt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ax-count {
  font-size: 72px;
  font-weight: 700;
  line-height: 1;
  color: #1c2227;
  margin-bottom: 18px;
}

.ax-statt span,
.ax-stattt span {
  color: #1c2227;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.5;
}

.ax-divider {
  width: 1px;
  height: 90px;
  background: #012431;
  margin-top: 0.5rem;
}

@media (max-width: 1024px) {
  .ax-dedicated-container {
    grid-template-columns: 1fr;
  }

  .ax-dedicated-left {
    margin-bottom: 2.5rem;
    min-height: 360px;
  }
/* ===============================
   RIGHT SIDE
================================ */
/* ===============================
   RIGHT SIDE
================================ */

.ax-dedicated-right {
  padding-left: 20px;
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* HEADING */
.ax-dedicated-heading {
  font-size: 72px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 20px;
  color: #1c2227;

  /* MOVE LITTLE LEFT + UP */
  margin-left: -30px;
  margin-top: -20px;

  text-align: justify;
  max-width: 620px;
}

/* PARAGRAPH */
.ax-dedicated-right p {
  color: #5b6368;
  line-height: 1.7;
  font-size: 16px;
  margin-bottom: 40px;

  margin-left: -30px;

  text-align: justify;
  max-width: 520px;
}
/* ===============================
   STATS SECTION
================================ */

.ax-stats {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 55px;

  margin-top: 10px;
  margin-left: -10px;
}

/* BOTH STAT BLOCKS */
.ax-statt,
.ax-stattt {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* LEFT SIDE ALIGN */
.ax-statt {
  align-items: flex-end;
  text-align: right;
  min-width: 240px;
}

/* RIGHT SIDE ALIGN */
.ax-stattt {
  align-items: flex-start;
  text-align: left;
  min-width: 240px;
}

/* NUMBER STYLE */
.ax-count {
  font-size: 72px;
  font-weight: 700;
  line-height: 1;
  color: #1c2227;

  margin-bottom: 16px;
  margin-left: 0;
}

/* LABEL TEXT */
.ax-statt span,
.ax-stattt span {
  color: #1c2227;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}

/* CENTER DIVIDER */
.ax-divider {
  width: 1px;
  height: 100px;
  background: #012431;
}

/* RESPONSIVE */
@media (max-width: 768px) {

  .ax-stats {
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: 0;
  }

  .ax-statt,
  .ax-stattt {
    min-width: auto;
    text-align: center;
    align-items: center;
  }

  .ax-count {
    font-size: 52px;
  }

  .ax-divider {
    height: 70px;
  }
}
/* HIGHLIGHT */
.ax-dedicated-right .highlight{
  color: #000000;
  background: #fff300;
  border-radius: 40px;
  padding: 0 6px;
  font-size: 45px;
}
/* Responsive */
@media (max-width: 992px) {

  .ax-dedicated-right {
    padding-left: 0;
    padding-top: 0;
  }

  .ax-dedicated-right h2 {
    font-size: 34px;
    margin-left: 0;
    margin-top: 0;
    text-align: left;
  }

  .ax-dedicated-right p {
    margin-left: 0;
    text-align: left;
  }
}
  .ax-stats {
    gap: 40px;
  }

  .ax-count {
    font-size: 52px;
  }
}

/* IMAGE BASE ANIMATION */
.ax-img{
  transition: transform .8s cubic-bezier(.2,.65,.3,1),
              box-shadow .8s cubic-bezier(.2,.65,.3,1);
  will-change: transform;
}

/* IMAGE HOVER */
.ax-img:hover{
  transform: translateY(-12px) scale(1.03);
  box-shadow: 0 35px 80px rgba(0,0,0,0.25);
}

/* INNER IMAGE SMOOTH ZOOM */
.ax-img img{
  transition: transform 1.2s ease;
}

.ax-img:hover img{
  transform: scale(1.08);
}

/* FLOATING PARALLAX MOTION */
.ax-img-top{
  animation: axFloatTop 7s ease-in-out infinite;
}

.ax-img-bottom{
  animation: axFloatBottom 8s ease-in-out infinite;
}

@keyframes axFloatTop{
  0%,100%{ transform: translateY(0px); }
  50%{ transform: translateY(-18px); }
}

@keyframes axFloatBottom{
  0%,100%{ transform: translateY(0px); }
  50%{ transform: translateY(18px); }
}

/* SCROLL REVEAL (SAFE) */
.ax-img{
  opacity: 0;
  transform: translateY(80px) scale(.95);
}

.ax-img.ax-show{
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: all 1s cubic-bezier(.2,.65,.3,1);
}

/* Dedicated word highlight */
.ax-dedicated-right .highlight{
  color: #000000;
  background: #fff300;
  border-radius: 40px;
  padding: 0 6px;
  font-size: 45px;
}

/* =====================================================
   RESPONSIVE - DEDICATED SECTION
===================================================== */

@media screen and (max-width:992px){

    .ax-dedicated{
        padding:60px 20px;
        overflow:hidden;
    }

    .ax-dedicated-container{
        display:flex;
        flex-direction:column;
        gap:50px;
        align-items:center;
    }

    /* ======================
       IMAGE SECTION
    ======================= */

    .ax-dedicated-left{
        width:100%;
        max-width:520px;
        min-height:420px;
        position:relative;
    }

    .ax-bg-shape{
        width:180px;
        height:180px;
        top:20px;
        right:10px;
    }

    .ax-img-top{
        width:80%;
        max-width:320px;
        height:220px;
        left:0;
        top:0;
    }

    .ax-img-bottom{
        width:80%;
        max-width:320px;
        height:210px;
        left:40px;
        bottom:0;
    }

    /* ======================
       CONTENT
    ======================= */

    .ax-dedicated-right{
        width:100%;
        padding:0;
        text-align:center;
    }

    .ax-dedicated-heading,
    .ax-dedicated-right h2{
        font-size:42px;
        line-height:1.25;
        margin:0 0 20px;
        max-width:100%;
        text-align:center;
    }

    .ax-dedicated-right .highlight{
        font-size:42px;
        padding:0 10px;
    }

    .ax-dedicated-right p{
        margin:0 auto 35px;
        max-width:600px;
        text-align:center;
        font-size:16px;
        line-height:1.8;
    }

    /* ======================
       STATS
    ======================= */

    .ax-stats{
        display:flex;
        justify-content:center;
        align-items:center;
        gap:30px;
        flex-wrap:wrap;
        margin:0;
        padding:-40px;
        margin-left:50px;
    }

    .ax-statt,
    .ax-stattt{
        min-width:170px;
        text-align:center;
        align-items:center;
    }

    .ax-count{
        font-size:54px;
        margin-bottom:10px;
    }

    .ax-statt span,
    .ax-stattt span{
        font-size:16px;
    }

    .ax-divider{
        width:1px;
        height:70px;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media screen and (max-width:768px){

    .ax-dedicated{
        padding:50px 18px;
    }

    .ax-dedicated-left{
        max-width:360px;
        min-height:320px;
    }

    .ax-bg-shape{
        width:130px;
        height:130px;
        top:20px;
        right:0;
    }

    .ax-img-top{
        width:250px;
        height:180px;
        left:0;
    }

    .ax-img-bottom{
        width:250px;
        height:170px;
        left:40px;
    }

    .ax-dedicated-heading,
    .ax-dedicated-right h2{
        font-size:34px;
    }

    .ax-dedicated-right .highlight{
        font-size:34px;
    }

    .ax-dedicated-right p{
        font-size:15px;
    }

    .ax-stats{
        flex-direction:column;
        gap:20px;
    }

    .ax-divider{
        width:80px;
        height:1px;
    }

    .ax-count{
        font-size:46px;
    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media screen and (max-width:480px){

    .ax-dedicated{
        padding:45px 15px;
    }

    .ax-dedicated-left{
        min-height:270px;
        max-width:300px;
    }

    .ax-bg-shape{
        width:200px;
        height:150px;
        margin-left:30px;
        margin-top:20px;
    }

    .ax-img-top{
        width:210px;
        height:150px;
    }

    .ax-img-bottom{
        width:210px;
        height:145px;
        left:30px;
    }

    .ax-dedicated-heading,
    .ax-dedicated-right h2{
        font-size:28px;
    }

    .ax-dedicated-right .highlight{
        font-size:28px;
    }

    .ax-dedicated-right p{
        font-size:14px;
        line-height:1.7;
    }

    .ax-count{
        font-size:38px;
    }

    .ax-statt span,
    .ax-stattt span{
        font-size:14px;
    }

}