/* SitePex — footer.css
   Site footer + mobile accordion. Requires base.css. */

/* ---- 16. FOOTER ---- */
.foot{background:var(--ink);color:var(--bone);padding-block:clamp(52px,6vw,74px) 26px;position:relative;overflow:hidden}
.foot::before{content:"";position:absolute;inset:0;background:radial-gradient(46% 60% at 88% -5%,rgba(59,130,246,.14),transparent 60%)}
.foot__in{position:relative;z-index:1}
.foot__cols{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px}
.fcol__head{width:100%;text-align:left;background:none;border:0;font-family:var(--font);font-weight:600;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;cursor:default}
.fplus{display:none}
.fcol__body{display:flex;flex-direction:column}
.fcol__body a{color:var(--bone-dim);font-size:.9rem;padding:6px 0;transition:color .22s,transform .22s}
.fcol__body a:hover{color:#fff;transform:translateX(3px)}

.foot__mid{margin-top:46px;padding-top:26px;border-top:1px solid var(--line-ink);display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap;align-items:flex-start}
.foot__bl{display:flex;flex-direction:column;gap:18px}
.foot__brand .brand{color:#fff}.foot__brand .brand b{color:var(--blue-bright)}
.foot__pay{display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:370px}
.paychip{height:30px;min-width:46px;padding:0 9px;border-radius:7px;background:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--sh-1)}
.paychip svg{height:15px;width:auto;display:block}
.paychip .pt{font-family:var(--font);font-weight:800;font-size:.66rem;letter-spacing:.02em;display:inline-flex}
.pay-more{font-family:var(--font);font-weight:600;font-size:.82rem;color:var(--blue-bright);padding-left:2px}
.foot__br{display:flex;flex-direction:column;gap:18px;align-items:flex-end;text-align:right}
.foot__social{display:flex;gap:10px}
.foot__social a{width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid var(--line-ink);display:grid;place-items:center;transition:background .3s,transform .3s,border-color .3s}
.foot__social a:hover{background:var(--blue);transform:translateY(-3px);border-color:var(--blue)}
.foot__social svg{width:17px;height:17px;color:#fff}
.foot__legal{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:flex-end}
.foot__legal a{color:var(--bone-dim);font-size:.88rem}.foot__legal a:hover{color:#fff}
.foot__bar{margin-top:26px;padding-top:20px;border-top:1px solid var(--line-ink);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;align-items:center;color:var(--bone-dim);font-size:.84rem}


/* ---- responsive ---- */
@media(max-width:1080px){
  .foot__cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 24px}
}
@media(max-width:720px){
  /* footer becomes an accordion */
  .foot__cols{grid-template-columns:1fr;gap:0}
  .fcol{border-bottom:1px solid var(--line-ink)}
  .fcol__head{cursor:pointer;padding:16px 2px;margin-bottom:0}
  .fplus{display:block;position:relative;width:16px;height:16px;flex:none}
  .fplus::before,.fplus::after{content:"";position:absolute;left:50%;top:50%;background:var(--bone-dim);transition:transform .3s}
  .fplus::before{width:14px;height:2px;transform:translate(-50%,-50%)}
  .fplus::after{width:2px;height:14px;transform:translate(-50%,-50%)}
  .fcol.open .fplus::after{transform:translate(-50%,-50%) scaleY(0)}
  .fcol__body{max-height:0;overflow:hidden;transition:max-height .38s var(--ease)}
  .fcol.open .fcol__body{max-height:720px}
  .fcol.open .fcol__body{padding-bottom:14px}
  .foot__mid{flex-direction:column;align-items:stretch;gap:26px}
  .foot__br{align-items:flex-start;text-align:left}
  .foot__legal{justify-content:flex-start}
  .foot__pay{max-width:none}
}
@media(max-width:560px){
  .foot__bar{flex-direction:column;align-items:flex-start;gap:6px}
}

/* ---- currency switcher ---- */
.foot__cur{display:inline-flex;gap:4px;padding:4px;border-radius:var(--r-pill);background:rgba(255,255,255,.06);border:1px solid var(--line-ink)}
.curbtn{padding:6px 14px;border-radius:var(--r-pill);font-family:var(--font);font-weight:600;font-size:.8rem;color:var(--bone-dim);transition:background .25s,color .25s}
.curbtn:hover{color:#fff}
.curbtn.on{background:var(--blue);color:#fff}