/* ============================================================
   Scroll-intent enquiry popup (home page)
   Opens once per visit after the reader passes half the page.
   Layout mirrors the two-column admissions popup pattern:
   picture + reassurance on the left, short form on the right.
   ============================================================ */
.ep-overlay {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  background: rgba(20, 27, 52, .62);
  opacity: 0; visibility: hidden;
  transition: opacity .28s ease, visibility .28s;
}
.ep-overlay.open { opacity: 1; visibility: visible; }
@supports (backdrop-filter: blur(3px)) { .ep-overlay.open { backdrop-filter: blur(3px); } }

.ep-box {
  position: relative;
  width: min(880px, 100%);
  max-height: calc(100vh - 48px);
  overflow: hidden auto;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35);
  transform: translateY(16px) scale(.985);
  transition: transform .28s ease;
  font-family: 'Lato', system-ui, sans-serif;
  color: #2B2B2B;
}
.ep-overlay.open .ep-box { transform: none; }

.ep-close {
  position: absolute; right: 12px; top: 12px; z-index: 3;
  width: 34px; height: 34px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .92); color: #2B2B2B;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .18);
  transition: background .2s ease, color .2s ease;
}
.ep-close:hover { background: #E6363E; color: #fff; }

.ep-hint {
  /* sits over the form column, clear of the picture and the close button */
  position: absolute; right: 0; top: 14px; width: 50%;
  z-index: 2; margin: 0; padding: 0 46px 0 14px;
  font-size: 12px; line-height: 16px; color: #E6363E; text-align: center;
}
.ep-grid { display: grid; grid-template-columns: 1fr 1fr; }

/* ── left: picture, headline, reassurance ── */
.ep-left { position: relative; min-height: 420px; display: flex; flex-direction: column; justify-content: flex-end; padding: 26px 24px; color: #fff; background: #2B2B2B; overflow: hidden; }
/* the picture is a real <img> so its path resolves against the page, and it
   can be lazy-loaded like any other image */
.ep-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ep-left::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.62) 52%, rgba(0,0,0,.88) 100%);
}
.ep-left > *:not(.ep-img) { position: relative; z-index: 1; }
.ep-left h2 { margin: 0; font-family: 'Poppins', system-ui, sans-serif; font-weight: 700; font-size: 22px; line-height: 30px; }
.ep-left p { margin: 10px 0 0; font-size: 13.5px; line-height: 20px; color: rgba(255, 255, 255, .9); }
.ep-trust { margin: 18px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.ep-trust li { display: flex; align-items: center; gap: 9px; font-size: 13px; line-height: 18px; }
.ep-trust i { flex: none; color: #46D17F; font-size: 13px; }

/* ── right: the form ── */
.ep-right { padding: 44px 28px 26px; }
.ep-right h3 {
  margin: 0; padding-left: 11px; border-left: 4px solid #E6363E;
  font-family: 'Poppins', system-ui, sans-serif; font-weight: 600; font-size: 19px; line-height: 26px;
}
.ep-right > p { margin: 10px 0 18px; font-size: 13.5px; line-height: 20px; color: #4F576B; }

.ep-form { display: flex; flex-direction: column; gap: 10px; }
.ep-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ep-phone { display: grid; grid-template-columns: 54px 1fr; gap: 6px; }
.ep-field {
  width: 100%; height: 44px; padding: 0 13px;
  border: 1px solid #DDE1E7; border-radius: 8px; background: #fff;
  font: inherit; font-size: 14px; color: #2B2B2B; outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.ep-field::placeholder { color: #9AA1AD; }
.ep-field:focus { border-color: #E6363E; box-shadow: 0 0 0 3px rgba(230, 54, 62, .12); }
.ep-field.bad { border-color: #E6363E; background: #FFF6F6; }
select.ep-field { appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236B7280' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center; padding-right: 32px; }
.ep-cta {
  height: 46px; margin-top: 4px; border: 0; border-radius: 8px;
  background: #E6363E; color: #fff; cursor: pointer;
  font-family: 'Poppins', system-ui, sans-serif; font-weight: 600; font-size: 15px;
  box-shadow: 0 6px 16px rgba(230, 54, 62, .3);
  transition: background .2s ease, transform .2s ease;
}
.ep-cta:hover:not(:disabled) { background: #cf2b33; transform: translateY(-1px); }
.ep-cta:disabled { opacity: .7; cursor: wait; }
.ep-foot { margin: 10px 0 0; font-size: 12px; line-height: 17px; color: #6B7280; text-align: center; }
.ep-msg { margin: 0; min-height: 18px; font-size: 12.5px; line-height: 18px; text-align: center; }
.ep-msg.ok { color: #1D8A4A; } .ep-msg.err { color: #E6363E; }
.ep-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ── done state ── */
.ep-done { padding: 46px 28px; text-align: center; }
.ep-done i { font-size: 44px; color: #1D8A4A; }
.ep-done h3 { margin: 14px 0 8px; font-family: 'Poppins', system-ui, sans-serif; font-weight: 600; font-size: 20px; border: 0; padding: 0; }
.ep-done p { margin: 0; font-size: 14px; line-height: 21px; color: #4F576B; }
.ep-done b { display: block; margin-top: 10px; font-size: 13px; color: #2B2B2B; }

@media (max-width: 760px) {
  .ep-overlay { padding: 12px; align-items: flex-start; }
  .ep-box { max-height: calc(100vh - 24px); }
  .ep-grid { grid-template-columns: 1fr; }
  .ep-left { min-height: 190px; padding: 20px; }
  .ep-left h2 { font-size: 18px; line-height: 25px; }
  .ep-left p, .ep-trust { display: none; }
  .ep-hint { display: none; }
  .ep-right { padding: 20px; }
  .ep-row { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .ep-overlay, .ep-box, .ep-cta { transition: none; }
  .ep-box { transform: none; }
}