/* SavyBytes footer + floating WhatsApp button.
   Palette: #A74FE6 purple, #4EE68D green, #E6AE4E amber, #7D6191 mauve. */

.sb-footer{position:relative;isolation:isolate;margin-top:110px;padding:84px 0 28px;color:#b4bbe6;font-family:Figtree,Arial,sans-serif;
  background:
    radial-gradient(720px 340px at 10% 0%,rgba(167,79,230,.22),transparent 70%),
    radial-gradient(620px 320px at 92% 8%,rgba(78,230,141,.13),transparent 70%),
    linear-gradient(180deg,rgba(7,8,32,0),#070820 16%,#04030d 100%)}
.sb-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#A74FE6 25%,#4EE68D 55%,#E6AE4E 80%,transparent)}

/* back-to-top arrow: sits on the top edge of the footer */
.sb-footer .sb-top{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);width:58px;height:58px;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#031026;background:linear-gradient(135deg,#4EE68D,#E6AE4E);box-shadow:0 10px 30px rgba(78,230,141,.35),0 0 0 7px rgba(4,3,13,.65);transition:transform .25s,box-shadow .25s}
.sb-footer .sb-top:hover{transform:translate(-50%,calc(-50% - 5px));box-shadow:0 16px 40px rgba(78,230,141,.5),0 0 0 7px rgba(4,3,13,.65)}
.sb-footer .sb-top:hover svg{animation:sb-nudge .6s ease-in-out infinite alternate}
@keyframes sb-nudge{to{transform:translateY(-3px)}}

.sb-footer__grid{display:grid;grid-template-columns:1.35fr .8fr 1.1fr 1.3fr;gap:48px;align-items:start}

/* brand column */
.sb-footer .sb-brand{display:inline-flex;background:#f6f6fb;border-radius:12px;padding:6px 14px;box-shadow:0 4px 18px rgba(167,79,230,.25)}
.sb-footer .sb-brand img{display:block;height:36px;width:auto;max-width:none}
.sb-tag{margin:18px 0 22px;line-height:1.65;max-width:34ch;font-size:.95rem}
.sb-social{list-style:none;margin:0;padding:0;display:flex;gap:12px}
.sb-footer .sb-social__a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:#e6e9ff;background:rgba(255,255,255,.05);border:1px solid rgba(160,180,255,.28);transition:transform .25s,background .25s,color .25s,border-color .25s,box-shadow .25s}
.sb-footer .sb-social__a:hover{transform:translateY(-4px);color:#031026;background:linear-gradient(135deg,#4EE68D,#E6AE4E);border-color:transparent;box-shadow:0 10px 26px rgba(78,230,141,.35)}

/* headings + link lists */
.sb-h{position:relative;margin:0 0 20px;padding-bottom:12px;font:700 .8rem/1 Rajdhani,Figtree,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#4EE68D}
.sb-h::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2px;border-radius:2px;background:linear-gradient(90deg,#A74FE6,#E6AE4E)}
.sb-list{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.sb-footer .sb-link{position:relative;color:#b4bbe6;text-decoration:none;font-size:.95rem;transition:color .2s,padding-left .2s}
.sb-footer .sb-link:hover{color:#fff;padding-left:6px}

/* contact column */
.sb-contact{font-style:normal;display:grid;gap:16px}
.sb-footer .sb-item{display:flex;gap:14px;align-items:flex-start;color:#b4bbe6;text-decoration:none;line-height:1.55;font-size:.95rem}
.sb-footer a.sb-item:hover .sb-item__txt{color:#fff}
.sb-item__ico{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;color:#4EE68D;background:rgba(78,230,141,.1);border:1px solid rgba(78,230,141,.25)}
.sb-item__txt{padding-top:6px;transition:color .2s}
.sb-item__txt .sb-link:hover{padding-left:0}
.sb-footer .sb-chat{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:12px 18px;border-radius:999px;color:#fff;text-decoration:none;font-weight:700;font-size:.9rem;background:rgba(37,211,102,.14);border:1px solid rgba(37,211,102,.55);transition:background .25s,transform .25s,box-shadow .25s}
.sb-footer .sb-chat:hover{background:#25D366;color:#04210f;transform:translateY(-2px);box-shadow:0 10px 26px rgba(37,211,102,.35)}

/* phone numbers + email bounce in during the build animation (transforms need a box) */
.sb-footer [data-jump]{display:inline-block}

/* Build animation: spotlight stage where the numbers are shown BIG (created by app.js, only exists while building) */
#footer-stage{position:fixed;inset:0;z-index:64;pointer-events:none;display:none}
body.is-transforming #footer-stage{display:block}
.fj-scrim{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 46%,rgba(4,3,13,.9),rgba(4,3,13,.6) 55%,rgba(4,3,13,0) 100%)}
.fj-chip{--pill:1;position:absolute;left:0;top:0;opacity:0;white-space:nowrap;padding:.35em .8em;border-radius:.6em;font:500 40px/1.15 Figtree,Arial,sans-serif;letter-spacing:.01em;color:#fff;
  background:rgba(8,10,36,calc(.88*var(--pill)));border:1px solid rgba(78,230,141,calc(.75*var(--pill)));box-shadow:0 0 calc(34px*var(--pill)) rgba(78,230,141,calc(.5*var(--pill)))}

.fj-chip--d{padding:.12em .3em;border-radius:.4em;min-width:.9em;text-align:center}

/* bottom bar */
.sb-footer__bar{display:flex;justify-content:space-between;gap:12px 32px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid rgba(160,180,255,.16);font-size:.85rem;color:#8d96c0}
.sb-footer__bar p{margin:0}

/* floating WhatsApp button: logo only, gentle bounce */
.sb-wa{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:80;display:none;align-items:center;justify-content:center;width:58px;height:58px;padding:0;border-radius:50%;color:#fff;text-decoration:none;background:#25D366;box-shadow:0 10px 30px rgba(37,211,102,.45),0 4px 12px rgba(0,0,0,.35);transition:transform .25s,box-shadow .25s,opacity .4s,visibility .4s;animation:sb-bounce 2.2s ease-in-out infinite}
body[data-view="online"] .sb-wa{display:inline-flex}
/* hidden while the transformation runs (the developer stands in the same corner) */
body.is-transforming .sb-wa,body.is-locked .sb-wa{opacity:0;visibility:hidden;pointer-events:none}
.sb-wa:hover{transform:scale(1.08);box-shadow:0 16px 40px rgba(37,211,102,.55),0 4px 12px rgba(0,0,0,.35);animation-play-state:paused}
.sb-wa__ring{position:absolute;inset:0;border-radius:inherit;border:2px solid #25D366;pointer-events:none;animation:sb-ping 2.4s ease-out infinite}
/* the text label is never shown, even if an older footer.php still outputs it */
.sb-wa__label{display:none!important}
/* bounce uses the separate "translate" property so it never fights the hover transform */
@keyframes sb-bounce{0%,100%{translate:0 0}12%{translate:0 -9px}24%{translate:0 0}34%{translate:0 -4px}44%{translate:0 0}}
@keyframes sb-ping{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.35);opacity:0}}

/* phone digits: hidden until the footer animation lands them */
.sb-footer .sb-dg{display:inline-block;opacity:0;position:relative;z-index:90;will-change:transform}
.sb-footer .sb-dg.is-in{opacity:1}

@media (max-width:1000px){
  .sb-footer__grid{grid-template-columns:1fr 1fr;gap:40px}
}
@media (max-width:620px){
  .sb-footer{padding-top:76px}
  .sb-footer__grid{grid-template-columns:1fr;gap:34px}
  .sb-footer__bar{padding-right:76px}              /* keep text clear of the WhatsApp button */
}