/* =========================================
   xWay Footer v4.1 - Unified Link Hover
   ========================================= */

/* ---------- Root & Globals ---------- */
:root {
  --xw-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --xw-color-bg-top: #082E36;
  --xw-color-bg-bottom: #062A2E;
  --xw-color-text: #EAF4F6;
  --xw-color-text-dim: rgba(234, 244, 246, 0.75);
  --xw-color-link: #9FE2F1;
  --xw-color-head: #CDEFF5;
  --xw-color-line: rgba(255, 255, 255, 0.08);
  --xw-color-line-soft: rgba(255, 255, 255, 0.05);
  --xw-max: 1200px;
  --xw-gap: 28px;
  --xw-font-size: 14px;
  --xw-line-height: 1.6;
}

/* ---------- Base Footer ---------- */
.xw-footer {
  background: linear-gradient(180deg, var(--xw-color-bg-top), var(--xw-color-bg-bottom));
  color: var(--xw-color-text);
  font-family: var(--xw-font);
  font-size: var(--xw-font-size);
  line-height: var(--xw-line-height);
}

/* Global link style for ALL footer links (columns + legal) */
.xw-footer a {
  color: var(--xw-color-link);
  text-decoration: none;
  position: relative;
  transition: color .2s ease;
}
.xw-footer a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  height: 2px;
  width: 0;
  background: currentColor;
  border-radius: 2px;
  transition: width .18s ease;
}
.xw-footer a:hover { color: #fff; }
.xw-footer a:hover::after { width: 100%; }

/* ---------- Footer Columns ---------- */
.xw-footer-inner {
  max-width: var(--xw-max);
  margin: 0 auto;
  padding: 44px 20px;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: var(--xw-gap);
}
.xw-col h3 {
  margin: 0 0 12px;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--xw-color-head);
}
.xw-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

/* ---------- Brand & Tagline ---------- */
.xw-logo img { height: 60px; display: block; }
.xw-tagline {
  color: var(--xw-color-text-dim);
  max-width: 36ch;
  margin-top: 10px;
  line-height: var(--xw-line-height);
  font-size: 13px;
}

/* ---------- Social Icons ---------- */
.xw-social { display: flex; gap: 10px; margin-top: 14px; }
.xw-social a{
  display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center;
  border-radius:50%; background: rgba(255,255,255,.04); color:#D7F4F8;
  border:1px solid var(--xw-color-line); transition: all .15s ease;
}
.xw-social a:hover{ transform: translateY(-3px); background: rgba(255,255,255,.12); color:#fff; }

/* ---------- Badges ---------- */
.xw-badges{ display:flex; gap:12px; margin-top:14px; align-items:center; }
.xw-badges img{ height:26px; filter:grayscale(.2) contrast(1.05); opacity:.95; }

/* ---------- Legal Links (Horizontal Bar) ---------- */
.xw-legal-links{
  width:100%; max-width: var(--xw-max);
  margin:0 auto; padding:22px 20px; text-align:center; position:relative;
}
.xw-legal-links::before{
  content:""; display:block; width:90%; height:1px; margin:0 auto 16px;
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%,
                                     rgba(255,255,255,.15) 50%,
                                     rgba(255,255,255,0) 100%);
}
/* inline horizontal list */
.xw-legal-links ul{
  list-style:none; margin:0; padding:0;
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:26px;
}
/* optional size tweak (inherits color + hover from global .xw-footer a) */
.xw-legal-links a{ font-size:13px; }

/* ---------- Footer Bottom ---------- */
.xw-footer-bottom{
  border-top:1px solid var(--xw-color-line-soft);
  padding:18px 20px; background:transparent;
}
.xw-footer-bottom .xw-footer-inner{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;
  gap:12px; max-width: var(--xw-max); margin:0 auto; padding:10px 0;
}
.xw-footer-bottom small{ color: var(--xw-color-text-dim); font-size:12px; }

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .xw-footer-inner{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .xw-footer-inner{ grid-template-columns:1fr; padding:28px 16px; }
  .xw-footer-bottom .xw-footer-inner{ flex-direction:column; text-align:center; gap:6px; }
  .xw-legal-links ul{ flex-direction:column; gap:10px; }
  .xw-legal-links a{ font-size:12.5px; }
}