/* Shared mockup helpers: placeholders, lightbox, reveal */
.ph {
  outline: 2px dashed #e0339b;
  outline-offset: 2px;
  background: rgba(224, 51, 155, .08);
  border-radius: 2px;
}
.ph-off .ph { outline: 0; background: none; }
.ph-toggle {
  position: fixed; left: 12px; bottom: 12px; z-index: 90;
  font: 600 12px/1 system-ui, sans-serif; letter-spacing: .01em;
  padding: 9px 12px; border-radius: 99px; border: 0; cursor: pointer;
  background: #e0339b; color: #fff; box-shadow: 0 4px 16px rgba(0,0,0,.2);
}
@media (max-width: 760px) { .ph-toggle { bottom: 76px; } }

.lb { border: 0; padding: 0; background: transparent; max-width: min(1100px, 94vw); max-height: 92vh; overflow: visible; }
.lb::backdrop { background: rgba(10, 8, 6, .86); }
.lb img { display: block; max-width: 100%; max-height: 82vh; margin: 0 auto; border-radius: 4px; }
.lb p { color: #f3eee6; font: 15px/1.4 system-ui, sans-serif; text-align: center; margin: 12px 0 0; }
.lb-x {
  position: absolute; top: -44px; right: 0; width: 38px; height: 38px; border-radius: 50%;
  border: 0; background: rgba(255,255,255,.14); color: #fff; font-size: 24px; cursor: pointer;
}

.js .rv { opacity: 0; transform: translateY(18px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.js .rv.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js .rv { opacity: 1; transform: none; transition: none; } }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
form.sent .form-fields { display: none; }