/* =====================================================
   AVALON – TRUSTED BY (ISOLATED & SAFE)
===================================================== */

.wht{color:#fff !important;}
.ylo{color: #fbbf24 !important}

.av-trusted{
  background: url("https://www.avalontec.com/wp-content/uploads/sites/8/2026/images/bg2.jpg") bottom / cover no-repeat;
  padding: 64px 20px;
  position: relative;
}

.av-trusted::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(10,40,90,.55), rgba(10,40,90,.75));
  z-index:0;
}

.av-trusted-wrap{
  max-width:1360px;
  margin:0 auto;
  position:relative;
  z-index:1;
}


/* GRID */
.av-trusted-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:22px;
}

/* CARD */
.av-trusted-card{
  position:relative;
  height:260px;
  border-radius:20px;
  overflow:hidden;
  background:#000;
  box-shadow:0 18px 40px rgba(0,0,0,.25);
  transform: translateZ(0);
}

/* IMAGE */
.av-card-img{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform: scale(1.05);              /* base zoom */
  transition: transform 1.3s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}

/* HOVER ZOOM (APPLE-LIKE) */
.av-trusted-card:hover .av-card-img{
  transform: scale(1.4);
	filter: brightness(1.05) saturate(1.05);
}

/* OVERLAY */
.av-card-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:20px;
  background: linear-gradient(237deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, .75));
  color:#fff;
}

/* TAG */
.av-card-tag{
  position:absolute;
  top:14px;
  left:14px;
  background: none;
/*  backdrop-filter: blur(6px);*/
  padding:6px 12px;
  border-radius:14px;
  font-size: 17px;
  font-weight:600;
  letter-spacing:.4px;
  text-transform:capitalize;
  color:#fff;
  width:100%;
  line-height: 25px;	
}

/* TEXT */
.av-card-overlay p{
	font-size: 13px !important;
  color: #fff !important;
  line-height: 1.6 !important;
  max-width: 240px;
  text-align: left;
  margin:0;
  opacity:.92;
}

/* CARD LINK RESET */
.av-trusted-link{
  display:block;
  text-decoration:none;
  color:inherit;
}

/* Ensure full card is clickable */
.av-trusted-link:focus-visible .av-trusted-card{
  outline:2px solid rgba(255,255,255,.6);
  outline-offset:4px;
}	
		
/* REFLECTION EFFECT */
.av-trusted-card::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 38%,
    rgba(255,255,255,.08) 50%,
    rgba(255,255,255,0) 62%
  );
  transform: translateX(-60%) translateY(20%);
  opacity:0;
  pointer-events:none;
  transition:
    transform 1.4s cubic-bezier(.22,.61,.36,1),
    opacity .6s ease;
}
.av-trusted-card:hover::after{
  transform: translateX(60%) translateY(-20%);
  opacity:1;
}
		

/* --------------------
   CANVAS
-------------------- */
#verticalNetwork{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:30%;
  pointer-events:none;
  opacity:0;
  transition: opacity 1s ease;
}

.vertical-ind.is-in #verticalNetwork{
  opacity:1;
}		

/* ================= MOBILE ================= */




@media (max-width: 1100px){
  .av-trusted-grid{
    grid-template-columns: repeat(2,1fr);
  }
	
/* MOBILE SCROLL-ACTIVE STATE */
.av-trusted-card.is-active .av-card-img{
  transform: scale(1.18);
}

.av-trusted-card.is-active::after{
  transform: translateX(60%) translateY(-20%);
  opacity:1;
}	
	
}

@media (max-width: 640px){
  .av-trusted{
    padding:50px 16px;
  }

  .av-trusted-grid{
    grid-template-columns: 1fr;
  }

  .av-trusted-card{
    height:220px;
  }

  .av-card-overlay p{
    font-size:13px;
  }
}