/* Switch only this display to none to restore the ordinary site. */
.preview-overlay { display: none; }

.preview-overlay {
  position: fixed; inset: 0; z-index: 2147483647;
  width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; border: 0; padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  align-items: center; justify-content: center; overflow-y: auto;
  color: var(--paper-light); background: #15251fdb;
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  animation: preview-veil .75s ease-out both;
}
.preview-overlay::backdrop { background: transparent; }
html:has(.preview-overlay[open]:not([style*="display: none"])) { overflow: hidden; }
.preview-overlay__content { width: min(100%, 580px); margin-block: auto; text-align: center; padding-block: 32px; }
.preview-overlay__label { color: var(--sage); margin-bottom: 28px; }
.preview-overlay__title { font-size: clamp(42px, 6vw, 68px); line-height: 1.08; }
.preview-overlay__intro { margin: 28px auto 0; max-width: 440px; color: var(--sage); font-size: 14px; line-height: 1.9; }
.preview-overlay__description { margin: 14px auto 0; max-width: 440px; color: var(--sage); font-size: 14px; line-height: 1.9; }
.preview-overlay__cta { margin-top: 32px; background: var(--paper); border-color: var(--paper); color: var(--ink); }
.preview-overlay__cta:hover { background: var(--sage); }
.preview-overlay__phone { display: block; margin-top: 14px; color: var(--sage); font-size: 12px; letter-spacing: .08em; }
.preview-overlay__content > * { animation: preview-enter .65s ease-out both; }
.preview-overlay__title { animation-delay: .06s; }
.preview-overlay__intro, .preview-overlay__description { animation-delay: .12s; }
.preview-overlay__cta, .preview-overlay__phone { animation-delay: .18s; }
@keyframes preview-veil { from { background: #15251f00; backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); } }
@keyframes preview-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .preview-overlay, .preview-overlay__content > * { animation: none; }
  .preview-overlay__cta { transition: none; }
  .preview-overlay__cta:hover { transform: none; }
}
