/* Street Deeds Footer Kit (Portal Footer)
   - Global injection via wp_footer (site-wide or portal-only)
   - Shortcode: [streetdeeds_portal_footer]
*/

:root{
  --sd-primary: #ffd600;
}

.sd-footer{
  margin-top: 28px;
  border-top: 1px solid rgba(255,255,255,.08);
  background: radial-gradient(1200px 520px at 20% -10%, rgba(255,214,0,.14), rgba(0,0,0,0) 55%),
              radial-gradient(900px 420px at 85% 15%, rgba(160,120,255,.12), rgba(0,0,0,0) 60%),
              linear-gradient(180deg, rgba(10,10,14,.55), rgba(10,10,14,.92));
}

.sd-footer__inner{
  max-width: 1280px;
  margin: 0 auto;
  padding: 28px 16px 22px;
}

.sd-footer__top{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 18px;
  align-items: start;
}

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

.sd-footer__brand{
  border-radius: 18px;
  padding: 18px 16px 16px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
}

.sd-footer__brandrow{ display:flex; gap: 12px; align-items:flex-start; }

.sd-footer__dot{
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--sd-primary);
  box-shadow: 0 0 0 6px rgba(255,214,0,.10);
  margin-top: 3px;
  flex: 0 0 auto;
}

.sd-footer__name{ font-weight: 900; letter-spacing: .2px; font-size: 18px; color: rgba(255,255,255,.95); }
.sd-footer__tag{ margin-top: 4px; color: rgba(255,255,255,.70); font-size: 13px; line-height: 1.35; }

.sd-footer__cta{ margin-top: 14px; display:flex; gap: 10px; flex-wrap: wrap; }

.sd-footer__ctaBtn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 10px 12px; border-radius: 999px;
  background: var(--sd-primary);
  color: #0b0b0f !important;
  font-weight: 800;
  text-decoration:none !important;
  border: 1px solid rgba(0,0,0,.35);
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
  min-width: 160px;
}

.sd-footer__ctaBtn:hover{ filter: brightness(.98); transform: translateY(-1px); }

.sd-footer__ctaBtn--ghost{
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.14);
}

.sd-footer__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

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

.sd-footer__card{
  border-radius: 18px;
  padding: 16px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  position: relative;
  overflow:hidden;
}

.sd-footer__card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(700px 300px at 20% 0%, rgba(255,214,0,.12), rgba(0,0,0,0) 55%);
  pointer-events:none;
  opacity:.75;
}

.sd-footer__card > *{ position:relative; }

.sd-footer__cardTitle{
  font-weight: 900;
  font-size: 14px;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  margin-bottom: 10px;
}

.sd-footer__links{ display:grid; gap: 8px; }

.sd-footer__links a{
  color: rgba(255,255,255,.82) !important;
  text-decoration:none !important;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.07);
}

.sd-footer__links a:hover{
  background: rgba(0,0,0,.34);
  border-color: rgba(255,255,255,.12);
}

.sd-footer__pills{ display:flex; flex-wrap: wrap; gap: 10px; }

.sd-footer__pill{
  display:inline-flex; align-items:center; gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.88) !important;
  text-decoration:none !important;
  font-weight: 750;
}

.sd-footer__pill:hover{
  border-color: rgba(255,214,0,.35);
  box-shadow: 0 0 0 6px rgba(255,214,0,.08);
}

.sd-footer__mini{
  margin-top: 10px;
  color: rgba(255,255,255,.68);
  font-size: 12.5px;
  line-height: 1.35;
}

.sd-footer__trending{ display:grid; gap: 8px; }

.sd-footer__trendRow{
  display:flex; align-items:center; justify-content:space-between; gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.88) !important;
  text-decoration:none !important;
}

.sd-footer__trendRow:hover{
  background: rgba(0,0,0,.34);
  border-color: rgba(255,255,255,.12);
}

.sd-footer__trendName{ font-weight: 850; }

.sd-footer__trendMeta{
  display:inline-flex; align-items:center; gap: 6px;
  opacity: .9;
  font-weight: 800;
}

.sd-footer__bolt{ color: var(--sd-primary); }

.sd-footer__trending--empty{
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(0,0,0,.22);
  border: 1px dashed rgba(255,255,255,.12);
}

.sd-footer__emptyLine{ color: rgba(255,255,255,.72); font-size: 13px; padding: 6px 0; }

.sd-footer__bottom{
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.08);
  display:flex;
  justify-content:space-between;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.sd-footer__fine{
  display:flex; gap: 10px; flex-wrap: wrap; align-items:center;
  color: rgba(255,255,255,.70);
  font-size: 12.5px;
}

.sd-footer__fine a{ color: rgba(255,255,255,.78) !important; text-decoration:none !important; }
.sd-footer__fine a:hover{ color: rgba(255,255,255,.92) !important; }
.sd-footer__sep{ opacity: .45; }
.sd-footer__subfine{ color: rgba(255,255,255,.55); font-size: 12.5px; }
/* Faded “streets” strip under the CTA (brand card) */
.sd-footer__ghoststreets{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  opacity: .85;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.sd-footer__ghost{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.55);
  font-weight: 900;
  letter-spacing: .3px;
  font-size: 11.5px;
  text-transform: uppercase;
  box-shadow: 0 12px 30px rgba(0,0,0,.30);
  backdrop-filter: blur(6px);
}
.sd-footer__ghost:nth-child(2){ transform: translateY(2px); opacity: .75; }
.sd-footer__ghost:nth-child(3){ transform: translateY(-1px); opacity: .68; }
.sd-footer__ghost:nth-child(4){ transform: translateY(1px); opacity: .62; }
