/* =========================================================================
 *  ez-engage.css (v3.70) — maintenance banners + update popup + newsletter
 *  popup. Owned namespace: .ez-eng-* / .ez-maint-*. Mobile-first; reduced-
 *  motion guarded; never causes horizontal overflow.
 * ========================================================================= */

/* ---- Maintenance banners (top of page) ---- */
.ez-maint-bar {
  display: flex; align-items: center; gap: 10px; justify-content: center;
  padding: 10px 16px; font-size: 13.5px; font-weight: 600; line-height: 1.4;
  text-align: center; position: relative; z-index: 60;
}
.ez-maint-bar span { overflow-wrap: anywhere; }
.ez-maint-bar--active { background: linear-gradient(135deg, #7c2d12, #b91c1c); color: #fff; }
.ez-maint-bar--upcoming { background: #fffbeb; color: #92400e; border-bottom: 1px solid #fde68a; }
.ez-maint-x {
  background: rgba(0,0,0,.08); border: none; cursor: pointer; color: inherit;
  width: 26px; height: 26px; border-radius: 8px; display: inline-flex;
  align-items: center; justify-content: center; flex: none; margin-left: 4px;
}
.ez-maint-x:hover { background: rgba(0,0,0,.16); }

/* ---- Shared modal overlay (update + newsletter) ---- */
.ez-eng-overlay {
  position: fixed; inset: 0; z-index: 4800; display: none;
  align-items: center; justify-content: center; padding: 18px;
  background: rgba(15, 23, 42, 0.5); backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.ez-eng-overlay.ez-eng-show { display: flex; animation: ezEngFade .22s ease both; }
@keyframes ezEngFade { from { opacity: 0; } to { opacity: 1; } }
.ez-eng-modal {
  position: relative; width: min(460px, 100%); background: #fff;
  border-radius: 22px; padding: 26px 24px 22px; text-align: center;
  box-shadow: 0 50px 110px -40px rgba(15, 23, 42, 0.6);
  animation: ezEngPop .26s cubic-bezier(.16,1,.3,1) both;
  max-height: calc(100dvh - 36px); overflow-y: auto;
}
@keyframes ezEngPop { from { opacity: 0; transform: scale(.96) translateY(12px); } to { opacity: 1; transform: none; } }
.ez-eng-x {
  position: absolute; top: 12px; right: 12px; width: 34px; height: 34px;
  border-radius: 10px; border: none; background: #f1f5f9; color: #475569;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.ez-eng-x:hover { background: #e2e8f0; color: #0f172a; }
.ez-eng-badge {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px;
  font-weight: 700; padding: 5px 12px; border-radius: 999px; margin-bottom: 12px;
  background: #eef2ff; color: #4338ca;
}
.ez-eng-badge--security { background: #fef2f2; color: #b91c1c; }
.ez-eng-badge--fix { background: #ecfdf5; color: #047857; }
.ez-eng-badge--maintenance { background: #fffbeb; color: #b45309; }
.ez-eng-title { font-weight: 800; font-size: 20px; letter-spacing: -.02em; color: #0f172a; margin: 0 0 6px; }
.ez-eng-sub { color: #64748b; font-size: 14px; line-height: 1.55; margin: 0 0 14px; }
.ez-eng-body { color: #334155; font-size: 14px; line-height: 1.65; text-align: left; white-space: pre-wrap; margin-bottom: 16px; }
.ez-eng-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ez-eng-btn {
  font: inherit; cursor: pointer; border-radius: 11px; padding: 11px 18px;
  font-size: 14px; font-weight: 700; border: 1px solid transparent;
  text-decoration: none; display: inline-flex; align-items: center; justify-content: center;
}
.ez-eng-btn--primary { background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff; }
.ez-eng-btn--primary:hover { filter: brightness(1.05); }
.ez-eng-btn--ghost { background: rgba(99,102,241,.08); color: #4338ca; }

/* ---- Newsletter popup specifics ---- */
.ez-eng-news-ico {
  width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 14px;
  display: flex; align-items: center; justify-content: center; color: #fff;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
}
.ez-eng-news-form { display: flex; gap: 8px; margin: 4px 0 10px; }
.ez-eng-news-form input[type=email] {
  flex: 1; min-width: 0; border: 1px solid #cbd5e1; border-radius: 11px;
  padding: 11px 14px; font-size: 14px; outline: none;
}
.ez-eng-news-form input[type=email]:focus { border-color: #6366f1; box-shadow: 0 0 0 4px rgba(99,102,241,.14); }
.ez-eng-news-skip { background: none; border: none; color: #94a3b8; font-size: 13px; cursor: pointer; }
.ez-eng-news-skip:hover { color: #475569; }

/* ---- Footer newsletter inline form ---- */
.ez-news-inline { display: flex; gap: 8px; margin-top: 10px; max-width: 320px; }
.ez-news-inline input[type=email] {
  flex: 1; min-width: 0; border: 1px solid rgba(99,102,241,.3); border-radius: 10px;
  padding: 9px 12px; font-size: 13.5px; outline: none; background: #fff;
}
.ez-news-inline button { border: none; border-radius: 10px; padding: 9px 14px; font-weight: 700; background: #4f46e5; color: #fff; cursor: pointer; }

body.ez-eng-locked { overflow: hidden; }

@media (max-width: 480px) {
  .ez-eng-overlay { padding: 8px; align-items: flex-end; }
  .ez-eng-modal { width: 100%; border-radius: 18px 18px 0 0; padding: 22px 16px 18px; }
  .ez-eng-news-form { flex-direction: column; }
  .ez-eng-news-form button { width: 100%; }
  .ez-eng-actions { flex-direction: column; }
  .ez-eng-actions .ez-eng-btn { width: 100%; }
  .ez-maint-bar { font-size: 12.5px; padding: 9px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .ez-eng-overlay.ez-eng-show, .ez-eng-modal { animation: none; }
}