/* HaarLab Stage 16A - Homepage Conversion & Footer Upgrade */

/* Header phone icon */
.header-phone,
.site-header a[href^="tel"],
.site-header .phone,
.top-phone{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  font-weight:900 !important;
}

.hl-phone-icon{
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#d6b36a;
}

/* Blog homepage: show only first 3 cards */
body.home .blog-grid .blog-card:nth-child(n+4),
.homepage .blog-grid .blog-card:nth-child(n+4),
#blog .blog-grid .blog-card:nth-child(n+4),
section[id*="blog"] .blog-grid .blog-card:nth-child(n+4){
  display:none !important;
}

.hl-blog-more-wrap{
  display:flex;
  justify-content:center;
  margin-top:28px;
}

.hl-blog-more-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 24px;
  border-radius:999px;
  background:#071221;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:900;
  box-shadow:0 18px 45px rgba(7,18,33,.16);
  transition:.25s ease;
}

.hl-blog-more-btn:hover{
  transform:translateY(-2px);
  background:#d6b36a;
  color:#111827 !important;
}

/* Hero trust / analysis mini strip */
.hl-hero-trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

.hl-hero-trust-item{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  color:rgba(255,255,255,.86);
  font-weight:800;
  font-size:13px;
  backdrop-filter:blur(12px);
}

.hl-hero-trust-item i{
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(214,179,106,.18);
  color:#d6b36a;
  font-style:normal;
}

/* Floating actions */
.hl-floating-actions{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.hl-floating-action{
  width:54px;
  height:54px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:0 18px 40px rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.22);
  transition:transform .25s ease, box-shadow .25s ease;
  font-weight:900;
}

.hl-floating-action:hover{
  transform:translateY(-4px) scale(1.04);
  box-shadow:0 22px 55px rgba(0,0,0,.26);
}

.hl-floating-action svg{
  width:25px;
  height:25px;
}

.hl-floating-whatsapp{background:#25D366;}
.hl-floating-instagram{background:linear-gradient(135deg,#feda75,#d62976,#962fbf,#4f5bd5);}
.hl-floating-phone{background:#071221;}
.hl-floating-termin{background:#d6b36a;color:#111827 !important;}

.hl-floating-label{
  position:absolute;
  right:64px;
  min-width:max-content;
  background:#071221;
  color:#fff;
  font-size:12px;
  font-weight:800;
  padding:8px 10px;
  border-radius:999px;
  opacity:0;
  transform:translateX(8px);
  pointer-events:none;
  transition:.2s ease;
}

.hl-floating-action:hover .hl-floating-label{
  opacity:1;
  transform:translateX(0);
}

/* Premium footer */
.hl-premium-footer{
  background:#071221;
  color:#fff;
  position:relative;
  overflow:hidden;
  padding:62px 0 0;
}

.hl-premium-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 0%, rgba(214,179,106,.12), transparent 0 28%, transparent 29%),
    radial-gradient(circle at 90% 80%, rgba(255,255,255,.06), transparent 0 20%, transparent 21%);
  pointer-events:none;
}

.hl-premium-footer .container{
  position:relative;
  z-index:2;
}

.hl-footer-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1.1fr;
  gap:34px;
  padding-bottom:38px;
}

.hl-footer-brand{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.hl-footer-logo{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:#fff;
}

.hl-footer-mark{
  width:46px;
  height:46px;
  border-radius:14px;
  background:#d6b36a;
  color:#071221;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}

.hl-footer-logo strong{
  font-size:26px;
  line-height:1;
  display:block;
}

.hl-footer-logo small{
  color:rgba(255,255,255,.58);
  font-size:12px;
}

.hl-footer-brand p{
  color:rgba(255,255,255,.68);
  line-height:1.75;
  margin:0;
  max-width:390px;
}

.hl-footer-col h3{
  font-size:15px;
  color:#d6b36a;
  text-transform:uppercase;
  letter-spacing:.14em;
  margin:0 0 16px;
}

.hl-footer-col a,
.hl-footer-col span{
  display:block;
  color:rgba(255,255,255,.72);
  text-decoration:none;
  margin:0 0 11px;
  font-size:14px;
  line-height:1.5;
}

.hl-footer-col a:hover{
  color:#d6b36a;
}

.hl-footer-contact-line{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
}

.hl-footer-cta{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border-radius:999px;
  background:#d6b36a;
  color:#111827 !important;
  font-weight:900;
  margin-top:8px !important;
}

.hl-footer-social{
  display:flex;
  gap:10px;
  margin-top:14px;
}

.hl-footer-social a{
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  margin:0;
}

.hl-footer-bottom{
  border-top:1px solid rgba(255,255,255,.10);
  padding:18px 0;
  display:flex;
  justify-content:space-between;
  gap:18px;
  color:rgba(255,255,255,.52);
  font-size:13px;
}

.hl-footer-bottom a{
  color:rgba(255,255,255,.62);
  text-decoration:none;
  margin-left:16px;
}

.hl-footer-bottom a:hover{
  color:#d6b36a;
}

@media(max-width:980px){
  .hl-footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:640px){
  .hl-floating-actions{
    right:14px;
    bottom:14px;
  }
  .hl-floating-action{
    width:50px;
    height:50px;
  }
  .hl-footer-grid{
    grid-template-columns:1fr;
  }
  .hl-footer-bottom{
    flex-direction:column;
  }
  .hl-footer-bottom a{
    margin:0 12px 0 0;
  }
}