/* ГНМЦ · Концепт 4 — модалки, тости, lightbox, cookie */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(6,20,42,.6); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; padding:1.2rem;
  z-index:1100; opacity:0; visibility:hidden; transition:opacity var(--dur-m), visibility var(--dur-m);
}
.modal-backdrop.is-open{ opacity:1; visibility:visible; }
.modal{
  background:#fff; border-radius:var(--radius-l); max-width:560px; width:100%;
  max-height:88vh; overflow-y:auto; box-shadow:var(--shadow-l);
  transform:translateY(30px) scale(.97); opacity:0;
  transition:transform var(--dur-m) var(--ease-out), opacity var(--dur-m) var(--ease-out);
  position:relative;
}
.modal-backdrop.is-open .modal{ transform:none; opacity:1; }
.modal--wide{ max-width:720px; }
.modal-head{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.6rem 1.8rem 0;
}
.modal-head h2{ font-size:1.3rem; margin:0; }
.modal-close{
  width:38px; height:38px; border-radius:50%; border:none; background:var(--grey-100);
  color:var(--grey-600); display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:background var(--dur-s), color var(--dur-s), transform var(--dur-s);
}
.modal-close:hover{ background:var(--red); color:#fff; transform:rotate(90deg); }
.modal-close svg{ width:18px; height:18px; }
.modal-body{ padding:1.4rem 1.8rem 2rem; }

/* мультистеп заявки */
.steps-track{ display:flex; align-items:center; gap:.4rem; margin-bottom:1.6rem; }
.step-dot{
  flex:1; height:5px; border-radius:3px; background:var(--grey-150); position:relative; overflow:hidden;
}
.step-dot::after{
  content:''; position:absolute; inset:0; background:var(--grad-blue); transform:scaleX(0);
  transform-origin:left; transition:transform var(--dur-m) var(--ease-out);
}
.step-dot.is-done::after, .step-dot.is-active::after{ transform:scaleX(1); }
.step-labels{ display:flex; justify-content:space-between; font-size:.72rem; color:var(--grey-600); margin-bottom:1.4rem; font-weight:700; font-family:var(--font-head); text-transform:uppercase; letter-spacing:.03em; }
.step-labels span.is-active{ color:var(--blue-700); }

.step-pane{ display:none; }
.step-pane.is-active{ display:block; animation:step-in .4s var(--ease-out); }
@keyframes step-in{ from{ opacity:0; transform:translateX(14px); } to{ opacity:1; transform:none; } }

.program-pick{ display:grid; gap:.7rem; }
.program-option{
  display:flex; align-items:center; gap:.8rem; border:1.5px solid var(--grey-300); border-radius:var(--radius-s);
  padding:.9em 1.1em; transition:border-color var(--dur-s), background var(--dur-s);
}
.program-option:hover{ border-color:var(--blue-500); background:var(--blue-050); }
.program-option input{ accent-color:var(--blue-600); width:18px; height:18px; }
.program-option span{ font-size:.92rem; font-weight:600; }
.program-option:has(input:checked){ border-color:var(--blue-600); background:var(--blue-050); box-shadow:0 0 0 3px var(--blue-100); }

.modal-actions{ display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-top:1.4rem; }

.confirm-summary{ background:var(--grey-100); border-radius:var(--radius-m); padding:1.2rem 1.4rem; font-size:.88rem; display:grid; gap:.5rem; margin-bottom:1rem; }
.confirm-summary div{ display:flex; justify-content:space-between; gap:1rem; }
.confirm-summary dt{ color:var(--grey-600); }
.confirm-summary dd{ margin:0; font-weight:700; color:var(--ink-soft); text-align:right; }

.success-pane{ text-align:center; padding:1rem 0; }
.success-icon{
  width:78px; height:78px; border-radius:50%; background:#e5f8ec; color:#1a9a52;
  display:flex; align-items:center; justify-content:center; margin:0 auto 1.2rem;
  animation:pop-in .5s var(--ease-out);
}
.success-icon svg{ width:38px; height:38px; }
@keyframes pop-in{ from{ transform:scale(.4); opacity:0; } to{ transform:scale(1); opacity:1; } }

/* тости */
.toast-stack{ position:fixed; top:1.2rem; right:1.2rem; z-index:1300; display:flex; flex-direction:column; gap:.7rem; max-width:min(92vw,360px); }
.toast{
  background:#fff; border-radius:var(--radius-m); box-shadow:var(--shadow-l); padding:1em 1.2em;
  display:flex; align-items:flex-start; gap:.7em; border-left:4px solid var(--blue-600);
  transform:translateX(120%); opacity:0; transition:transform var(--dur-m) var(--ease-out), opacity var(--dur-m);
}
.toast.is-visible{ transform:none; opacity:1; }
.toast svg{ width:20px; height:20px; color:var(--blue-600); flex-shrink:0; margin-top:.1em; }
.toast strong{ display:block; font-size:.88rem; font-family:var(--font-head); }
.toast p{ margin:.2em 0 0; font-size:.82rem; color:var(--grey-600); }
.toast.toast--error{ border-color:var(--red); }
.toast.toast--error svg{ color:var(--red); }

.cookie-toast{
  position:fixed; right:1.2rem; bottom:1.2rem; left:auto; width:min(420px,calc(100vw - 2.4rem)); z-index:1250;
  background:var(--blue-900); color:#fff; border-radius:var(--radius-m); padding:1.3rem 1.4rem;
  box-shadow:var(--shadow-l); display:flex; flex-direction:column; gap:.9rem;
  transform:translateY(140%); transition:transform var(--dur-l) var(--ease-out);
}
.cookie-toast.is-visible{ transform:none; }
.cookie-toast p{ margin:0; font-size:.85rem; opacity:.9; }
.cookie-toast .row{ display:flex; gap:.7rem; flex-wrap:wrap; }

/* швидкий пошук */
.search-modal .modal{ max-width:640px; }
.search-input-wrap{ display:flex; align-items:center; gap:.8rem; border:1.5px solid var(--grey-300); border-radius:var(--radius-s); padding:.4rem .6rem .4rem 1rem; margin-bottom:1rem; }
.search-input-wrap svg{ width:20px; height:20px; color:var(--grey-600); flex-shrink:0; }
.search-input-wrap input{ border:none; outline:none; flex:1; font-size:1rem; padding:.6em 0; }
.search-input-wrap kbd{ background:var(--grey-100); border-radius:6px; padding:.3em .6em; font-size:.75rem; color:var(--grey-600); }
.search-results{ display:flex; flex-direction:column; gap:.2rem; max-height:50vh; overflow-y:auto; }
.search-result{ display:flex; flex-direction:column; gap:.15rem; padding:.8em 1em; border-radius:var(--radius-s); transition:background var(--dur-s); }
.search-result:hover, .search-result.is-focused{ background:var(--blue-050); }
.search-result strong{ font-size:.92rem; color:var(--ink-soft); }
.search-result span{ font-size:.78rem; color:var(--grey-600); }
.search-empty{ text-align:center; padding:2rem 1rem; color:var(--grey-600); font-size:.9rem; }

/* lightbox */
.lightbox{
  position:fixed; inset:0; background:rgba(4,12,24,.94); z-index:1400;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity var(--dur-m), visibility var(--dur-m);
}
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:90vw; max-height:82vh; border-radius:var(--radius-s); box-shadow:0 30px 80px rgba(0,0,0,.5); }
.lightbox-close, .lightbox-nav{
  position:absolute; background:rgba(255,255,255,.12); color:#fff; border:none; border-radius:50%;
  display:flex; align-items:center; justify-content:center; transition:background var(--dur-s);
}
.lightbox-close{ top:1.4rem; right:1.4rem; width:44px; height:44px; }
.lightbox-close:hover{ background:var(--red); }
.lightbox-nav{ top:50%; transform:translateY(-50%); width:52px; height:52px; }
.lightbox-nav:hover{ background:var(--blue-600); }
.lightbox-prev{ left:1.4rem; }
.lightbox-next{ right:1.4rem; }
.lightbox-nav svg, .lightbox-close svg{ width:22px; height:22px; }
.lightbox-caption{ position:absolute; bottom:1.6rem; left:0; right:0; text-align:center; color:#dbe6f7; font-size:.85rem; }
@media (max-width:640px){ .lightbox-nav{ width:42px; height:42px; } .lightbox-prev{ left:.4rem; } .lightbox-next{ right:.4rem; } }

body.modal-open{ overflow:hidden; }
