/* Окно «Залиш заявку» (_EnrollModal) 0.27.0 — утверждённый прототип ~/LookFactory-prototype-enroll-0.27.0 (в стиле «Контакти»).
   Обёртка .course-details (фон, открытие — courses.js), диалог .em-dialog; классы em-*. Форма лендинга (_EnrollForm) не затронута. */
.course-details.em-modal{background:rgba(10,12,13,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.em-modal .em-dialog{--em-line:#d3c8ba;--em-brown:#6e604f;--em-serif:"Cormorant Garamond",Georgia,serif;--em-sans:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(620px,calc(100% - 36px));max-height:calc(100dvh - 36px);overflow:auto;
  background:#f3eee6;color:#252729;border:1px solid #eee4d5;border-radius:0;box-shadow:0 30px 80px rgba(0,0,0,.45);padding:38px 40px 36px;font:15px/1.55 var(--em-sans);text-align:left}
.em-modal .em-dialog *,.em-modal .em-dialog *::before,.em-modal .em-dialog *::after{box-sizing:border-box}
.em-modal .em-close{position:absolute;top:16px;right:16px;width:42px;height:42px;border:1px solid var(--em-line);background:#fffdfa;font-size:22px;line-height:1;cursor:pointer;color:#3a3a36;padding:0;border-radius:0}
.em-modal .em-close:hover{border-color:#97806a}
.em-modal .em-kicker{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:#987a5c}
.em-modal .em-kicker::before{content:"";width:26px;height:1px;background:currentColor}
.em-modal .em-title{font:400 46px/1 var(--em-serif);letter-spacing:-.03em;margin:14px 44px 10px 0;color:#222}
.em-modal .em-sub{margin:0 0 24px;color:#6b665e;font-size:15px;line-height:1.6;padding-bottom:20px;border-bottom:1px solid #ded8ce}
.em-modal .em-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.em-modal .em-f{display:flex;flex-direction:column;gap:7px;min-width:0}
.em-modal .em-full{grid-column:1/-1}
.em-modal .em-f>label,.em-modal .em-via legend{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--em-brown);margin:0}
.em-modal .em-f input,.em-modal .em-f select,.em-modal .em-f textarea{width:100%;min-height:50px;border:1px solid var(--em-line);background:#fffdfa;color:#252729;padding:12px 14px;font:15px var(--em-sans);border-radius:0;box-shadow:none}
.em-modal .em-f select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#88725c 50%),linear-gradient(135deg,#88725c 50%,transparent 50%);background-position:calc(100% - 18px) 22px,calc(100% - 13px) 22px;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.em-modal .em-f textarea{min-height:96px;resize:vertical}
.em-modal .em-f input:focus,.em-modal .em-f select:focus,.em-modal .em-f textarea:focus{border-color:#95765a;background:#fff;outline:none}
.em-modal .em-f input::placeholder,.em-modal .em-f textarea::placeholder{color:#8f877c}
.em-modal .em-f .iti{display:block;width:100%}
.em-modal .iti__selected-country{background:#f6f1ea;border-right:1px solid var(--em-line)}
.em-modal .iti__selected-country-primary{padding:0 8px 0 12px}
.em-modal .iti__selected-dial-code{color:#4f493f;margin-left:4px;margin-right:12px}
.em-modal .iti__dropdown-content{background:#fffdfa;border:1px solid var(--em-line)}
.em-modal .iti__country-name{color:#252729}
.em-modal .iti__search-input{min-height:44px;padding-left:36px}
.em-modal .phone-error{font-size:12.5px;color:#a2432f;margin-top:6px}
.em-modal .em-via{border:0;margin:0;padding:0;min-width:0}
.em-modal .em-via legend{padding:0;margin-bottom:8px;float:none;width:auto}
.em-modal .em-via-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.em-modal .em-via label{position:relative;cursor:pointer;margin:0}
.em-modal .em-via input{position:absolute;opacity:0;width:1px;height:1px}
.em-modal .em-via span{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 6px;border:1px solid var(--em-line);background:#fffdfa;color:#4f493f;font-size:14px;transition:background .18s,border-color .18s,color .18s}
.em-modal .em-via label:hover span{border-color:#99846b}
.em-modal .em-via input:checked+span{background:#262c2e;border-color:#262c2e;color:#fff}
.em-modal .em-via input:focus-visible+span{outline:2px solid #987d61;outline-offset:2px}
.em-modal .enroll-form-status{margin:0;padding:12px 14px;border:1px solid #c9a58f;background:#fbefe9;color:#7a3a28;font-size:14px;line-height:1.5;border-radius:0}
.em-modal .enroll-form-status[hidden]{display:none}
.em-modal .em-end{grid-column:1/-1;display:flex;justify-content:flex-end;margin-top:4px}
.em-modal .em-send{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-height:52px;padding:12px 20px;background:#262c2e;border:1px solid #262c2e;color:#fff;font-size:13.5px;font-weight:650;cursor:pointer;border-radius:0}
.em-modal .em-send:hover{background:#41494b}
.em-modal .em-send:disabled{opacity:.7;cursor:default}
/* «Дякую!» после отправки (courses.js заменяет форму блоком .enroll-form-success) */
.em-modal .enroll-form-success{grid-column:1/-1;text-align:center;padding:24px 4px 6px}
.em-modal .enroll-form-success h3{font:400 52px/1 var(--em-serif);margin:6px 0 12px;color:#222}
.em-modal .enroll-form-success p{color:#5f5a53;margin:0 0 24px}
.em-modal .enroll-form-success .em-send{justify-content:center;min-height:52px;padding:12px 28px;background:#262c2e;border:1px solid #262c2e;color:#fff;font-size:13.5px;font-weight:650;border-radius:0}
@media(max-width:560px){
  .em-modal .em-dialog{left:0;top:0;transform:none;width:100%;max-height:100dvh;min-height:100dvh;padding:28px 18px 26px;border:0}
  .em-modal .em-title{font-size:38px}
  .em-modal .em-form{grid-template-columns:1fr}
  .em-modal .em-send{width:100%}
  .em-modal .em-close{top:12px;right:12px}
  .em-modal .em-f input,.em-modal .em-f select,.em-modal .em-f textarea{font-size:16px} /* iOS не увеличивает страницу при вводе */
}
/* «Формат навчання» (0.28.0) — как «Де тобі зручно?», 2 варианта с ценой; виден только у курсов с выбором формата */
.em-modal .em-format .em-via-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.em-modal .em-format span{flex-direction:column;gap:2px;line-height:1.25}
.em-modal .em-format span small{font-size:12px;opacity:.8}
.em-modal .em-format[hidden]{display:none}
