/* ─────────────────────────────────────────────────
 * popup.css ─ initial visit popup
 * ───────────────────────────────────────────────── */

.popup-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9500;
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: grid;
  place-items: center;
  padding: var(--gutter);
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s var(--e-out);
}
.popup-backdrop.is-open { opacity: 1; pointer-events: auto; }

.popup-card {
  width: min(520px, 100%);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 50%),
    var(--ink-2);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-xl);
  padding: var(--space-7);
  position: relative;
  transform: translateY(24px) scale(.97);
  opacity: 0;
  transition: opacity .55s var(--e-out), transform .8s var(--e-spring);
}
.popup-backdrop.is-open .popup-card { opacity: 1; transform: none; }

.popup-card__seal {
  position: absolute;
  top: -22px; left: var(--space-6);
  width: 44px; height: 44px;
  display: grid;
  place-items: center;
  background: var(--base);
  border-radius: 6px;
  box-shadow: 0 6px 20px rgba(200,16,46,.45);
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: 22px;
  color: var(--paper);
}
.popup-card__close {
  position: absolute;
  top: 14px; right: 14px;
  width: 36px; height: 36px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 18px;
  color: var(--paper);
  transition: border-color .25s var(--e-out), background-color .25s var(--e-out);
}
.popup-card__close:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.4); }

.popup-card__eyebrow {
  font-family: var(--f-en);
  font-style: italic;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--base-soft);
  margin-top: 8px;
}
.popup-card__title {
  font-family: var(--f-serif);
  font-size: 26px;
  line-height: 1.3;
  margin: 10px 0 14px;
}
.popup-card__body {
  color: rgba(255,255,255,.78);
  line-height: 1.85;
  font-family: var(--f-serif);
}
.popup-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: var(--space-5);
  padding: 12px 22px;
  background: var(--base);
  color: var(--paper);
  border-radius: var(--r-pill);
  font-family: var(--f-ui);
  font-size: 13px;
  letter-spacing: 0.04em;
  transition: background-color .25s var(--e-out), transform .35s var(--e-spring);
}
.popup-card__cta:hover { background: var(--base-strong); transform: translateY(-2px); }