#sab-consent{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:10000;
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  max-width:760px;margin:0 auto;padding:16px 20px;border-radius:16px;
  background:linear-gradient(160deg,#071417,#020408);
  border:1px solid rgba(0,229,200,.28);
  box-shadow:0 18px 50px rgba(0,0,0,.55),0 0 32px rgba(0,229,200,.12);
  font-family:'Outfit',sans-serif;
}
.sab-consent-text{margin:0;font-size:14px;line-height:1.6;color:rgba(255,255,255,.72);flex:1;min-width:240px;}
.sab-consent-text a{color:#00E5C8;text-decoration:underline;}
.sab-consent-actions{display:flex;gap:10px;flex-shrink:0;}
.sab-consent-btn{
  padding:10px 22px;border-radius:50px;font-family:'Outfit',sans-serif;
  font-weight:700;font-size:14px;cursor:pointer;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .3s,color .25s,border-color .25s;
}
.sab-consent-primary{border:none;color:#001a18;background:linear-gradient(135deg,#00BFFF,#00F5FF);box-shadow:0 0 18px rgba(0,191,255,.35);}
.sab-consent-primary:hover{transform:translateY(-2px);box-shadow:0 0 28px rgba(0,191,255,.55);}
.sab-consent-ghost{background:transparent;border:1px solid rgba(0,229,200,.28);color:rgba(255,255,255,.6);}
.sab-consent-ghost:hover{transform:translateY(-2px);border-color:#00E5C8;color:#fff;}
.sab-consent-btn:focus-visible{outline:2px solid #00F5FF;outline-offset:2px;}
.sab-consent-btn:active{transform:translateY(0) scale(.99);}
@media(max-width:560px){
  #sab-consent{flex-direction:column;align-items:stretch;}
  .sab-consent-actions{justify-content:stretch;}
  .sab-consent-btn{flex:1;}
}
@media(prefers-reduced-motion:reduce){
  .sab-consent-btn{transition:box-shadow .3s;}
  .sab-consent-btn:hover{transform:none;}
}

/* ── Landing-gate clearance (index.html only) ────────────────────────────
   The banner is fixed/z-index:10000 and must STAY above page content, so we
   cannot move it out of the way. Instead, while it is on screen, the landing
   gate reserves its height (published by consent.js as --sab-consent-h =
   banner height + 32px) so the "Book Demo" CTA is never covered. Without this,
   elementFromPoint at the CTA's centre returned the banner at both 1280x800
   and 390x844 — i.e. the CTA was unclickable on exactly the first visit a cold
   lead would use it. All of this is removed the moment the banner is dismissed;
   these selectors match nothing on the other 12 pages. */
body.sab-consent-open #landing-content{
  box-sizing:border-box;
  padding-bottom:var(--sab-consent-h,120px);
}

/* #landing-content is a full-height flex column with justify-content:center, so
   bottom padding only buys HALF its value in downward clearance and eats the
   top the other half. At 1280x800 the landing content is already ~764px tall,
   so the reservation alone pushed the logo off-screen (measured top:-35px).
   While the banner is up we therefore also tighten the vertical rhythm on short
   desktop viewports — ~118px recovered, which keeps the logo on screen AND
   clears the CTA (verified down to 1366x768, where the landing content already
   filled the viewport edge-to-edge before this change). Mobile (<=768px)
   already has tighter margins of its own and clears on the reservation alone,
   so it is deliberately excluded. No font-size is touched. */
@media (max-height:900px) and (min-width:769px){
  body.sab-consent-open #landing-content .ll{margin-bottom:14px;}     /* 40 */
  body.sab-consent-open #landing-content .l-h1{margin-bottom:12px;}   /* 22 */
  body.sab-consent-open #landing-content .l-sub{margin-bottom:22px;}  /* 64 */
  body.sab-consent-open #landing-content .l-who{margin-bottom:16px;}  /* 32 */
  body.sab-consent-open #landing-content .l-demo{margin-top:16px;}    /* 40 */
}