/* ===============================
   FOOTER — Pinterest Premium Light (your site)
   Clean + bold, glassy cards, subtle gradients
   NO underline, NO after/before on links
=============================== */

.site-footer{
  /* uses your global accents: --a --b --c, font vars */
  --ft-ink: rgba(18,25,33,.92);
  --ft-muted: rgba(18,25,33,.62);

  --ft-card: rgba(255,255,255,.62);
  --ft-card2: rgba(255,255,255,.52);
  --ft-brd: rgba(16,24,40,.10);
  --ft-brd2: rgba(16,24,40,.14);

  --ft-shadow: 0 14px 40px rgba(16,24,40,.10);
  --ft-shadow2: 0 20px 60px rgba(16,24,40,.12);

  margin-top: 56px;
  padding: 34px 0 22px;
  background: transparent; /* keep monolithic page background */
  color: var(--ft-muted);
  font-family: var(--font, "Inter", system-ui, -apple-system, "Segoe UI", sans-serif);
  position: relative;
}

/* Soft top divider + glow (inside footer only, page bg stays continuous) */
/* .site-footer::before{
  content:"";
  position:absolute;
  left: 0; right: 0; top: 0;
  height: 1px;
  background: rgba(16,24,40,.10);
  opacity: .85;
}
.site-footer::after{
  content:"";
  position:absolute;
  inset:-40% -10% auto -10%;
  height: 240px;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 25%, rgba(43,110,243,.12), transparent 60%),
    radial-gradient(circle at 82% 30%, rgba(255,77,141,.10), transparent 62%),
    radial-gradient(circle at 55% 80%, rgba(122,92,255,.08), transparent 60%);
  mix-blend-mode: multiply;
} */

/* container */
.site-footer .container{
  max-width: var(--content-max-fg47);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Layout */
.footer-row{
  display:grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 26px;
  align-items:flex-start;
  margin-bottom: 20px;
}

/* “glass panel” blocks (apply to columns if you wrap them, but safe as-is) */
.footer-main,
.footer-contacts,
.footer-links{
  background: linear-gradient(180deg, var(--ft-card), var(--ft-card2));
  border: 1px solid var(--ft-brd);
  border-radius: 26px;
  padding: 18px 18px;
  box-shadow: var(--ft-shadow);
  backdrop-filter: blur(10px);
}

/* Brand */
.footer-main{
  display:flex;
  flex-direction:column;
  gap: 10px;
  list-style:none;
  margin: 0;
}

.footer-main .logo{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  gap: 6px;
  text-decoration:none;

  color: var(--ft-ink);
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: .82rem;
  font-family: var(--font2, "Space Grotesk", var(--font));
}

.footer-main .logo img{
  max-width: 150px;
  height:auto;
  margin-bottom: 0;
  filter: saturate(1.02) contrast(1.02);
}

/* Text inside main */
.footer-main p,
.footer-main .micro{
  margin: 0;
  color: var(--ft-muted);
  line-height: 1.65;
}

/* Links & Address (NO underline) */
.site-footer a,
.site-footer address{
  color: var(--ft-muted);
  text-decoration:none;
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .14em;
  padding: 2px 0;
  text-transform: uppercase;
  transition:
    color .18s ease,
    transform .18s ease,
    opacity .18s ease,
    filter .18s ease;
}

.site-footer address{
  font-style: normal;
  text-transform: none;         /* addresses look better readable */
  letter-spacing: normal;
  font-weight: 600;
  font-size: 13px;
  color: rgba(18,25,33,.70);
}

/* Hover — clean “editorial” (no underline, no pseudo-lines) */
.site-footer a:hover{
  color: rgba(18,25,33,.92);
  transform: translateY(-1px);
  filter: saturate(1.06);
  opacity: .95;
}

/* Social */
.footer-social{
  display:flex;
  gap: 10px;
  list-style:none;
  margin: 10px 0 0;
  padding: 0;
}

.footer-social a{
  display:grid;
  place-items:center;
  width: 36px;
  height: 36px;
  border-radius: 999px;

  background: rgba(255,255,255,.72);
  border: 1px solid rgba(16,24,40,.12);
  color: var(--ft-ink);

  box-shadow: 0 12px 30px rgba(16,24,40,.10);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease,
    color .18s ease;
}

/* Social hover — gradient glow */
.footer-social a:hover{
  background: linear-gradient(135deg, rgba(43,110,243,.18), rgba(255,77,141,.14));
  border-color: rgba(43,110,243,.22);
  transform: translateY(-1px) scale(1.06);
  box-shadow: 0 18px 46px rgba(43,110,243,.14);
}

/* Contacts & Links lists */
.footer-contacts,
.footer-links{
  list-style:none;
  margin: 0;
  padding: 18px 18px;
  display:flex;
  flex-direction:column;
  gap: 10px;
  align-items:flex-start;
  font-size: 13px;
}

/* Bottom */
.footer-bottom{
  text-align:center;
  padding-top: 14px;
  margin-top: 8px;
  border-top: 1px solid rgba(16,24,40,.10);
  font-size: 11.5px;
  color: var(--ft-muted);
}

.footer-bottom p{ margin: 0; }

.footer-bottom p span{
  background: linear-gradient(90deg, var(--a), var(--c), var(--b));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 900;
}

/* Responsive */
@media (max-width: 900px){
  .footer-row{
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
}

@media (max-width: 640px){
  .footer-row{
    grid-template-columns: 1fr;
    gap: 14px;
    text-align: left;
  }

  .footer-main,
  .footer-contacts,
  .footer-links{
    padding: 16px;
    border-radius: 22px;
  }

  .footer-main{ align-items:flex-start; }
  .footer-social{ justify-content:flex-start; }

  .site-footer{
    margin-top: 40px;
    padding: 26px 0 18px;
  }
}
