/* Websites for Business example bar: sits on top of the demo site so
   visitors always know it's a sample and can leave or buy. */
body { padding-bottom: 76px; }

.wfb-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px max(16px, calc((100vw - 1180px) / 2));
  background: #03172f; color: #fff;
  border-top: 3px solid #007fe9;
  box-shadow: 0 -8px 30px rgba(3, 23, 47, .25);
  font: 500 15px/1.3 system-ui, -apple-system, "Segoe UI", sans-serif;
}
.wfb-bar__note { display: flex; align-items: center; gap: 10px; min-width: 0; }
.wfb-bar__badge {
  flex: none; padding: 4px 9px; border-radius: 999px;
  background: #0fb3f1; color: #03172f;
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.wfb-bar__text { color: #cfe0f2; }
.wfb-bar__text strong { color: #fff; }
.wfb-bar__actions { display: flex; gap: 10px; flex: none; }
.wfb-bar__btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 18px; border-radius: 8px;
  font-weight: 600; text-decoration: none; white-space: nowrap;
  transition: background-color .15s ease, transform .15s ease;
}
.wfb-bar__btn:active { transform: scale(.97); }
.wfb-bar__btn--close { color: #fff; border: 2px solid rgba(255, 255, 255, .35); }
.wfb-bar__btn--close:hover { border-color: #fff; }
.wfb-bar__btn--buy { background: #007fe9; color: #fff; border: 2px solid #007fe9; }
.wfb-bar__btn--buy:hover { background: #0fb3f1; border-color: #0fb3f1; }
.wfb-bar__btn:focus-visible { outline: 3px solid #0fb3f1; outline-offset: 2px; }

.wfb-form-note {
  margin: 16px 0 0; padding: 14px 16px; border-radius: 8px;
  background: #e8f5fb; border-left: 4px solid #007fe9; color: #012c68;
}
.wfb-form-note a { color: #007fe9; font-weight: 600; }

@media (max-width: 720px) {
  body { padding-bottom: 116px; }
  .wfb-bar { flex-direction: column; align-items: stretch; gap: 10px; padding: 10px 16px; }
  .wfb-bar__text { font-size: 13px; }
  .wfb-bar__actions { width: 100%; }
  .wfb-bar__btn { flex: 1; justify-content: center; padding: 10px 12px; }
}