/* TraceXis — shared footer, social links and form validation styles (all pages) */
footer.sf{--sfb:#03080F;--sfl:#152B50;--sfw:#EEF4FF;--sfm:#7494B8;--sfd:#3D5878;--sfi:#6BBAFF;--sfa:#2B87FF;
  position:relative;z-index:1;background:var(--sfb);border-top:1px solid var(--sfl);color:var(--sfm);padding:52px 0 26px;font-family:'Space Grotesk','Arimo',Arial,sans-serif}
.sf-in{max-width:1180px;margin:0 auto;padding:0 32px}
.sf-top{display:grid;grid-template-columns:minmax(230px,1.25fr) minmax(0,2fr) minmax(170px,.9fr);gap:40px;align-items:start}
.sf-brand img{height:40px;width:auto;display:block;filter:drop-shadow(0 2px 8px rgba(43,135,255,.28))}
.sf-brand p{font-size:13px;line-height:1.65;color:var(--sfd);margin:14px 0 12px;max-width:290px}
.sf-contact{display:flex;flex-direction:column;gap:7px}
.sf-contact a{color:var(--sfi);font-family:'IBM Plex Mono','Cousine',monospace;font-size:12.5px;text-decoration:none}
.sf-contact a:hover{color:var(--sfw)}
.sf-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
footer.sf h5{font-family:'IBM Plex Mono','Cousine',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sfd);margin:0 0 14px;font-weight:500}
.sf-links a{display:block;font-size:13.5px;color:var(--sfm);text-decoration:none;margin-bottom:10px;transition:color .2s}
.sf-links a:hover{color:var(--sfw)}
.sf-soc{display:flex;flex-direction:column;gap:9px}
.sf-soc a{display:flex;align-items:center;gap:10px;color:var(--sfm);text-decoration:none;font-size:13px;transition:color .2s}
.sf-soc a span.i{width:34px;height:34px;border:1px solid var(--sfl);border-radius:50%;display:grid;place-items:center;flex:none;transition:border-color .2s,background .2s}
.sf-soc svg{width:15px;height:15px;fill:currentColor}
.sf-soc a:hover{color:var(--sfw)}.sf-soc a:hover span.i{background:rgba(43,135,255,.12)}
.sf-soc a.yt:hover span.i{border-color:#FF3B3B}.sf-soc a.ig:hover span.i{border-color:#E1306C}.sf-soc a.ln:hover span.i{border-color:#0A66C2}.sf-soc a.wa:hover span.i{border-color:#25D366}
.sf-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--sfl);margin-top:38px;padding-top:18px;font-family:'IBM Plex Mono','Cousine',monospace;font-size:11.5px;color:var(--sfd)}
.sf-bottom b{color:var(--sfw);font-weight:500}.sf-bottom b i{color:var(--sfa);font-style:normal}
.sf-note{font-family:'IBM Plex Mono','Cousine',monospace;font-size:11px;color:rgba(116,148,184,.6);margin:12px 0 0;line-height:1.6}
.sf-note a{color:var(--sfi)}
@media (max-width:980px){.sf-top{grid-template-columns:1fr 1fr}.sf-links{grid-column:1/-1;order:3}}
@media (max-width:680px){
  footer.sf{padding:38px 0 120px}
  .sf-in{padding:0 16px}
  .sf-top{grid-template-columns:1fr;gap:24px;text-align:center}
  .sf-brand img{margin:0 auto}.sf-brand p{margin:12px auto}.sf-contact{align-items:center}
  .sf-links{gap:8px;text-align:left;background:rgba(14,30,56,.35);border:1px solid var(--sfl);border-radius:14px;padding:16px 12px}
  .sf-links a{font-size:12.5px;margin-bottom:9px}
  footer.sf h5{font-size:9.5px;letter-spacing:.1em;margin-bottom:10px}
  .sf-follow{order:2}
  .sf-soc{flex-direction:row;justify-content:center;gap:12px}
  .sf-soc a .t{display:none}
  .sf-soc a span.i{width:44px;height:44px}.sf-soc svg{width:18px;height:18px}
  .sf-bottom{justify-content:center;text-align:center;margin-top:24px}
  .sf-note{text-align:center}
}
@media (max-width:360px){.sf-links{padding:14px 8px}.sf-links a{font-size:11.5px}}

/* form validation */
.fld .v-err{display:block;color:#ff7a85;font-size:12px;margin-top:6px;font-family:'IBM Plex Mono','Cousine',monospace}
.fld .v-err[hidden]{display:none}
.fld input.v-bad,.fld textarea.v-bad,.fld select.v-bad{border-color:#ff5c6a!important;box-shadow:0 0 0 3px rgba(255,92,106,.15)}
.v-count{display:block;text-align:right;font-size:11px;color:#3D5878;margin-top:4px;font-family:'IBM Plex Mono','Cousine',monospace}
.ph-wrap{display:flex;align-items:stretch}.ph-wrap .ph-cc{display:grid;place-items:center;padding:0 12px;border:1px solid #152B50;border-right:0;border-radius:8px 0 0 8px;color:#7494B8;font-family:'IBM Plex Mono',monospace;font-size:13px;background:rgba(14,30,56,.5)}
.ph-wrap input{border-radius:0 8px 8px 0!important;flex:1;min-width:0}

/* simple WhatsApp button (pages without the full chat widget) */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:90;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px rgba(37,211,102,.45);transition:transform .2s}
.wa-float:hover{transform:scale(1.08)}.wa-float svg{width:30px;height:30px;fill:#fff}
.wa-float::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(37,211,102,.5);animation:wapulse 2s infinite}
@keyframes wapulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.3);opacity:0}}
body:has(#waPop.open) .game-float{opacity:0;pointer-events:none;transition:opacity .2s}
