/* ==========================================================
   GLOBAL FOOTER — HOME UI MATCH
   Applies the homepage premium footer layout to every public
   section. Footer-only visual CSS; no page/data/app logic.
   ========================================================== */

/* Always let the shared footer span the real viewport, even if a
   section page uses a constrained wrapper on mobile. */
.premium-footer{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  padding:18px 0 10px!important;
  margin-top:0!important;
  min-height:0!important;
  background:
    radial-gradient(circle at 10% 20%,rgba(56,189,248,.20),transparent 23%),
    radial-gradient(circle at 88% 15%,rgba(99,102,241,.22),transparent 25%),
    linear-gradient(118deg,#06378f 0%,#064bc7 46%,#073fdc 74%,#0738c7 100%)!important;
  border-top:1px solid rgba(126,190,255,.55)!important;
  color:#fff!important;
}

.premium-footer .container{
  width:min(1180px,calc(100% - 32px))!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

.premium-footer .premium-footer-grid{
  display:grid!important;
  grid-template-columns:minmax(260px,1.35fr) repeat(3,minmax(120px,.72fr)) minmax(170px,.86fr)!important;
  gap:16px 22px!important;
  align-items:start!important;
}

.premium-footer-brand{
  display:flex!important;
  gap:11px!important;
  align-items:flex-start!important;
}
.premium-footer-brand img{
  width:60px!important;
  height:60px!important;
  flex:0 0 60px!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.32)!important;
  box-shadow:0 12px 28px rgba(0,24,90,.28)!important;
  object-fit:cover!important;
}
.premium-footer-brand h3{
  margin:0 0 5px!important;
  color:#fff!important;
  font-size:18px!important;
  line-height:1.25!important;
  font-weight:900!important;
  text-shadow:0 1px 2px rgba(0,25,90,.22)!important;
}
.premium-footer h4{
  margin:0 0 8px!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1.25!important;
  font-weight:900!important;
  text-shadow:0 1px 2px rgba(0,25,90,.22)!important;
}
.premium-footer-brand p,
.premium-footer-app p{
  margin:4px 0 7px!important;
  color:#f2f8ff!important;
  font-size:12.5px!important;
  line-height:1.45!important;
  font-weight:600!important;
  opacity:1!important;
}
.premium-footer a:not(.btn){
  display:block!important;
  margin:3px 0!important;
  color:#e8f5ff!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:700!important;
  opacity:1!important;
  text-decoration:none!important;
  text-shadow:0 1px 1px rgba(0,24,85,.12)!important;
  transition:color .18s ease,transform .18s ease!important;
}
.premium-footer a:not(.btn):hover{
  color:#fff!important;
  transform:translateX(2px)!important;
  text-decoration:none!important;
}
.premium-footer .btn.btn-light{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:0 16px!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#0647b7!important;
  border:1px solid rgba(255,255,255,.95)!important;
  font-size:13px!important;
  font-weight:900!important;
  text-shadow:none!important;
  box-shadow:0 10px 24px rgba(0,24,90,.20)!important;
}
.premium-footer .btn.btn-light:hover{
  color:#043a96!important;
  background:#eef9ff!important;
  transform:translateY(-2px)!important;
}
.premium-footer .footer-bottom,
.premium-footer .premium-footer-bottom{
  margin-top:14px!important;
  padding:10px 0 0!important;
  min-height:0!important;
  color:#fff!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:700!important;
  border-top:1px solid rgba(255,255,255,.16)!important;
}
.premium-footer .bcs-total-visits{
  flex:0 0 auto!important;
}
.premium-footer .bcs-footer-copyright{
  color:#cfeaff!important;
}

@media(max-width:1150px){
  .premium-footer .premium-footer-grid{
    grid-template-columns:minmax(240px,1.2fr) repeat(2,minmax(150px,1fr))!important;
    gap:16px 20px!important;
  }
  .premium-footer-brand{grid-row:span 2!important}
}

@media(max-width:760px){
  .premium-footer{
    padding:16px 0 9px!important;
  }
  .premium-footer .container{
    width:calc(100% - 28px)!important;
  }
  .premium-footer .premium-footer-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:15px 16px!important;
  }
  .premium-footer-brand{
    grid-column:1 / -1!important;
    grid-row:auto!important;
    align-items:center!important;
  }
  .premium-footer-app{
    grid-column:1 / -1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    flex-wrap:wrap!important;
    padding-top:2px!important;
  }
  .premium-footer-app h4{
    width:100%!important;
    margin-bottom:2px!important;
  }
  .premium-footer-app p{
    margin:0!important;
    flex:1 1 160px!important;
  }
  .premium-footer .btn.btn-light{
    min-width:135px!important;
  }
  .premium-footer .footer-bottom,
  .premium-footer .premium-footer-bottom{
    margin-top:12px!important;
    padding-top:9px!important;
  }
}

@media(max-width:480px){
  .premium-footer{
    padding:14px 0 8px!important;
  }
  .premium-footer .container{
    width:100%!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }
  /* Same compact phone layout as the Home page: brand full-width,
     Explore/Updates and Legal/App groups use two columns. */
  .premium-footer .premium-footer-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:14px 12px!important;
  }
  .premium-footer-brand,
  .premium-footer-app{
    grid-column:1 / -1!important;
  }
  .premium-footer-brand img{
    width:52px!important;
    height:52px!important;
    flex-basis:52px!important;
  }
  .premium-footer-brand h3{
    font-size:16px!important;
  }
  .premium-footer h4{
    font-size:14px!important;
    margin-bottom:6px!important;
  }
  .premium-footer-brand p,
  .premium-footer-app p,
  .premium-footer a:not(.btn){
    font-size:12px!important;
  }
  .premium-footer-app{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
  }
  .premium-footer-app h4{
    grid-column:1 / -1!important;
  }
  .premium-footer .btn.btn-light{
    min-width:126px!important;
    min-height:36px!important;
    padding:0 13px!important;
    font-size:12.5px!important;
  }
  .premium-footer .footer-bottom,
  .premium-footer .premium-footer-bottom{
    font-size:11.5px!important;
    margin-top:10px!important;
    padding-top:8px!important;
  }
  .premium-footer .bcs-footer-bottom{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:10px!important;
    flex-wrap:wrap!important;
  }
  .premium-footer .bcs-footer-copyright{
    width:100%!important;
    margin-left:0!important;
    text-align:left!important;
  }
}

@media(max-width:350px){
  .premium-footer .premium-footer-grid{
    grid-template-columns:1fr!important;
  }
  .premium-footer-brand,
  .premium-footer-app{
    grid-column:auto!important;
  }
  .premium-footer-app{
    display:block!important;
  }
  .premium-footer .btn.btn-light{
    margin-top:6px!important;
  }
}