/* ===== Site Footer (xft- scoped, white text version) ===== */
.xft{
  --xft-bg:#101a25; 
  --xft-ink:#ffffff;         
  --xft-muted:#d3e0ee;       
  --xft-link:#ffffff;        
  --xft-hover:#9df5da;       
  --xft-accent:#12616E;      /* unified brand color (still used elsewhere if needed) */
  --xft-line:rgba(255,255,255,.12);

  font-family:"Segoe UI", Arial, Helvetica, sans-serif;
  background:var(--xft-bg); 
  color:var(--xft-ink);
  padding:34px 16px 26px;
}
.xft *{box-sizing:border-box}

/* Layout */
.xft .xft-wrap{
  max-width:1100px; margin:0 auto;
  display:grid; align-items:start; gap:22px;
  grid-template-columns:1fr;
  grid-template-areas:
    "brand"
    "services"
    "company";
}
@media (min-width:641px){
  .xft .xft-wrap{
    gap:40px;
    grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:"brand services company";
  }
}

.xft-brand{grid-area:brand}
.xft-services{grid-area:services}
.xft-company{grid-area:company}

/* Text and Logo */
.xft-text{
  margin:14px 0 12px; 
  color:var(--xft-muted);
  line-height:1.7; 
  max-width:520px; 
  font-size:15px;
}
.xft-logo{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;color:inherit;flex-wrap:wrap;
}

/* ---- CHANGED: badge now transparent, no square/gradient/box-shadow ---- */
.xft-badge{
  /* remove colored square */
  background:transparent;
  box-shadow:none;
  border-radius:0;
  /* let the image define size */
  width:auto;
  height:auto;
  padding:0;
  display:inline-flex;
  align-items:center;
}

/* icon size left as-is (kept for SVG fallback) */
.xft-ic{width:20px;height:20px}

/* image inside the badge (your logo.png) */
.xft-badge-img{
  display:block;
  height:80px;          /* tweak to taste */
  width:auto;
  object-fit:contain;
  transform:translateY(-3px);  /* nudge up slightly */
}

.xft-name{font-size:20px;font-weight:800;letter-spacing:.2px}
.xft-accent{color:#9df5da}

/* Headings & Lists */
.xft-head{margin:6px 0 12px;font-size:18px;font-weight:800;color:var(--xft-ink)}
.xft-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.xft-link{
  color:var(--xft-link);
  text-decoration:none;
  transition:color .15s ease,transform .15s ease;
}
.xft-link:hover{color:var(--xft-hover);transform:translateX(2px)}

/* Contact */
.xft-contact{display:grid;gap:8px}
.xft-contact-item{
  display:inline-flex;align-items:flex-start;gap:8px;
  color:var(--xft-link);
}
.xft-contact-item .xft-link:hover{color:var(--xft-hover)}

/* Divider + Bottom */
.xft-sep{
  max-width:1100px;margin:24px auto 16px;
  height:1px;background:var(--xft-line)
}
.xft-bottom{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap
}
.xft-copy,.xft-legal{
  margin:0;color:var(--xft-muted);
  font-size:14px;
}
.xft-dot{opacity:.6}

/* Mobile polish */
@media (max-width:640px){
  .xft{ padding:28px 18px 22px; }
  .xft-wrap{ gap:26px; grid-template-columns:1fr; }

  /* DON'T reapply square on mobile; keep image-driven sizing */
  .xft-badge{ width:auto; height:auto; border-radius:0; }

  .xft-badge-img{ height:55px; transform:translateY(-2px); }
  .xft-name{ font-size:22px; }
  .xft-text{ font-size:15.5px; line-height:1.75; }
  .xft-head{ font-size:20px; margin:18px 0 12px; }
  .xft-list a{ font-size:18px; }
  .xft-sep{ margin:22px auto 14px; }
  .xft-bottom{
    flex-direction:column;align-items:flex-start;gap:8px;
  }
}

/* Sticky Social Bar */
.social-bar {
  position: fixed;
  left: 20px;
  bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  z-index: 1000;
}
.social-bar a {
  display:flex;justify-content:center;align-items:center;
  width:44px;height:44px;border-radius:50%;
  color:#fff;font-size:22px;text-decoration:none;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
}
.social-bar a:hover{transform:scale(1.15)}
.social-bar .facebook{background:#1877f2;}
.social-bar .instagram{background:#e4405f;}
.social-bar .linkedin{background:#0077b5;}
.social-bar .youtube{background:#ff0000;}
.social-bar .pinterest{background:#bd081c;}
.social-bar .twitter{background:#1da1f2;}
.social-bar .chat{background:#12616E;} /* brand color */
@media (max-width:767px){.social-bar{display:none}}
