/* Shared site chrome: full footer, cookie banner, WhatsApp CTA.
   Loaded on every page. The homepage already styles the footer inline;
   these rules are written to match it so both render identically. */

/* ---------- footer ---------- */
body > footer{
  border-top:1px dashed rgba(255,255,255,.2);
  padding:clamp(40px,6vh,72px) var(--pad,clamp(20px,4.5vw,72px)) 0;
  background:#0E0E0E;color:#fff;
}
body > footer .fwrap{
  max-width:1180px;margin:0 auto;display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(24px,4vw,56px);
}
body > footer .fbrand img{height:24px;width:auto}
body > footer .fbrand p{color:rgba(255,255,255,.64);font-size:.9rem;margin-top:1em;max-width:22em}
body > footer .ftag{
  display:block;margin-top:1.4em;font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.4);
}
body > footer .fcol{display:flex;flex-direction:column;gap:.7em;align-items:flex-start}
body > footer .fh{
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.64rem;
  letter-spacing:.18em;text-transform:uppercase;color:#CFFF04;margin-bottom:.4em;
}
body > footer .fcol a{color:rgba(255,255,255,.64);font-size:.92rem;text-decoration:none;transition:color .3s}
body > footer .fcol a:hover{color:#fff}
body > footer .fbase{
  max-width:1180px;margin:clamp(36px,5vh,56px) auto 0;
  padding:clamp(16px,2.5vh,24px) 0;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:.78rem;color:rgba(255,255,255,.4);
}
body > footer .fbase a{color:inherit;text-decoration:none}
body > footer .fbase a:hover{color:#fff}
body > footer .fmono{
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;
}
@media(max-width:860px){body > footer .fwrap{grid-template-columns:1fr 1fr}}
@media(max-width:520px){body > footer .fwrap{grid-template-columns:1fr}}

/* ---------- footer social icons (IGBS hover-glow treatment) ---------- */
.fsocials{display:flex;gap:10px;flex-wrap:wrap;margin-top:.3em}
.social-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.72);
  text-decoration:none;
  transition:box-shadow .25s ease,transform .25s ease,border-color .25s ease,color .25s ease;
}
.social-icon svg{width:17px;height:17px;display:block}
.social-icon:hover{transform:translateY(-3px) scale(1.12);color:#fff}
.social-icon[data-col="whatsapp"]:hover{box-shadow:0 0 14px 3px #25D366,0 0 28px 4px rgba(37,211,102,.35);border-color:#25D366}
.social-icon[data-col="instagram"]:hover{box-shadow:0 0 14px 3px #E1306C,0 0 28px 4px rgba(225,48,108,.35);border-color:#E1306C}
.social-icon[data-col="linkedin"]:hover{box-shadow:0 0 14px 3px #0A66C2,0 0 28px 4px rgba(10,102,194,.35);border-color:#0A66C2}
.social-icon[data-col="facebook"]:hover{box-shadow:0 0 14px 3px #1877F2,0 0 28px 4px rgba(24,119,242,.35);border-color:#1877F2}
@media(prefers-reduced-motion:reduce){.social-icon:hover{transform:none}}

/* ---------- floating WhatsApp FAB (matches the IGBS build) ---------- */
.wa-fab{
  position:fixed;right:28px;bottom:28px;z-index:300;
  display:flex;align-items:center;justify-content:center;
  width:54px;height:54px;border-radius:50%;
  background:#25d366;color:#fff;text-decoration:none;
  box-shadow:0 8px 32px rgba(37,211,102,.42);
  opacity:0;pointer-events:none;
  transition:transform .2s,box-shadow .2s,opacity .35s;
}
.wa-fab.on{opacity:1;pointer-events:auto}
.wa-fab:hover{transform:translateY(-3px) scale(1.08);box-shadow:0 12px 40px rgba(37,211,102,.56)}
.wa-fab svg{width:26px;height:26px;display:block}
/* RTL keeps it on the same side as IGBS */
html.ar .wa-fab{right:auto;left:28px}
@media(max-width:520px){
  .wa-fab{right:18px;bottom:18px}
  html.ar .wa-fab{right:auto;left:18px}
}
@media(prefers-reduced-motion:reduce){.wa-fab{transition:opacity .35s}}

/* ---------- cookie banner ---------- */
.ck{
  position:fixed;inset-inline:16px;inset-block-end:16px;z-index:320;
  max-width:520px;margin-inline:auto;
  background:#151515;color:#fff;border:1px solid rgba(255,255,255,.14);
  border-radius:16px;padding:20px 22px;
  box-shadow:0 18px 50px rgba(0,0,0,.55);
  font-family:'Inter',system-ui,sans-serif;
  transform:translateY(18px);opacity:0;pointer-events:none;
  transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1);
}
.ck.on{opacity:1;transform:none;pointer-events:auto}
.ck p{font-size:.88rem;line-height:1.55;color:rgba(255,255,255,.72);margin:0 0 14px}
.ck a{color:#CFFF04}
.ck .ckrow{display:flex;gap:10px;flex-wrap:wrap}
.ck button{
  border-radius:999px;padding:.6em 1.3em;cursor:pointer;border:0;
  font-family:'Inter',system-ui,sans-serif;font-weight:600;font-size:.85rem;
  transition:background .25s,border-color .25s,color .25s;
}
.ck .ck-yes{background:#fff;color:#0E0E0E}
.ck .ck-yes:hover{background:#CFFF04}
.ck .ck-no{background:none;border:1px solid rgba(255,255,255,.2);color:#fff}
.ck .ck-no:hover{border-color:#fff}
@media(max-width:520px){.ck{inset-inline:10px;inset-block-end:84px;padding:18px}}
@media(prefers-reduced-motion:reduce){.ck{transition:none}}