/* =========================
   FOOTER PREMIUM FINAL
========================= */

.site-footer{
  position:relative;
  overflow:hidden;
  padding:48px 0 24px;

  background:
    radial-gradient(circle at 12% 20%, rgba(30,136,245,.16), transparent 28%),
    radial-gradient(circle at 88% 0%, rgba(255,200,61,.20), transparent 25%),
    linear-gradient(135deg,#10195f 0%,#151b70 55%,#0c1248 100%);

  color:#fff;
}

/* effet décor */
.site-footer::before{
  content:"";
  position:absolute;
  left:-90px;
  bottom:-120px;
  width:260px;
  height:260px;
  border:6px solid rgba(255,255,255,.08);
  border-radius:50%;
}

/* layout */
.footer-inner{
  position:relative;
  z-index:1;
  display:grid;
  gap:28px;
}

/* =========================
   BRAND
========================= */

.footer-brand{
  display:flex;
  align-items:center;
  gap:16px;
}

.footer-logo{
  width:60px;
  height:60px;
  border-radius:20px;
  display:flex;
  align-items:center;
  justify-content:center;

  background:#fff;
  box-shadow:0 16px 35px rgba(0,0,0,.18);
}

.footer-logo img{
  width:34px;
  height:34px;
  object-fit:contain;
}

.footer-title{
  display:block;
  font-size:1.15rem;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.03em;
  margin-bottom:4px;
}

.footer-brand p{
  margin:0;
  color:#dfe8ff;
}

/* =========================
   INFOS
========================= */

.footer-info{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.footer-info p{
  margin:0;
  padding:15px 18px;

  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);

  backdrop-filter:blur(6px);
}

.footer-info span{
  display:block;
  font-size:.75rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:4px;
  color:rgba(255,255,255,.65);
}

.footer-info strong,
.footer-info a{
  color:#fff;
  font-weight:800;
  text-decoration:none;
}

/* hover léger */
.footer-info a:hover{
  text-decoration:underline;
}

/* =========================
   BOTTOM
========================= */

.footer-bottom{
  margin-top:10px;
  padding-top:20px;

  border-top:1px solid rgba(255,255,255,.12);

  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;

  font-size:.9rem;
  color:#dfe8ff;
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:760px){

  .footer-info{
    grid-template-columns:1fr;
  }

  .footer-brand{
    align-items:flex-start;
  }

  .footer-bottom{
    flex-direction:column;
    gap:6px;
  }

}


/* ==========================
   BACK TO TOP
========================== */

.scroll-top{
  position:fixed;
  right:22px;
  bottom:24px;
  width:54px;
  height:54px;
  border:none;
  border-radius:50%;
  background:linear-gradient(
    135deg,
    #3B82F6,
    #60A5FA
  );
  color:#fff;
  font-size:22px;
  cursor:pointer;
  box-shadow:
    0 12px 30px rgba(59,130,246,.25);
  z-index:9999;

  display:flex;
  align-items:center;
  justify-content:center;

  opacity:0;
  visibility:hidden;
  transform:translateY(16px);
  transition:all .35s ease;
}

/* visible */

.scroll-top.visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.scroll-top:hover{
  transform:translateY(-4px);
}

.scroll-top:active{
  transform:scale(.96);
}

/* mobile */

@media(max-width:768px){

  .scroll-top{
    right:18px;
    bottom:20px;
    width:50px;
    height:50px;
  }

}

.scroll-top{
  backdrop-filter: blur(12px);
}