/* Блок заявки на главной.

   Что было не так (оценка владельца, FEEDBACK.md): тёмно-синяя плита возникала
   внезапно после светлого сайта, карточки «что будет после» были тусклыми,
   а форма выглядела просто вертикальным списком полей.

   Что сделано: блок стал светлым и попадает в ритм сайта, шаги читаются
   чёрным по белому, а форма разбита на три понятные части с номерами и
   полосой заполнения. */

.wid-apply{
  position:relative;
  overflow:clip;
  padding:clamp(64px,9vw,120px) 20px clamp(56px,8vw,104px);
  background:linear-gradient(180deg,#fff,#f2f7ff 35%,#eef4ff);
  color:#1D1D1F;
  font-family:-apple-system,BlinkMacSystemFont,'Onest','Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wid-apply *,.wid-apply *:before,.wid-apply *:after{box-sizing:border-box}
.wid-apply__halo{position:absolute;z-index:0;top:-18%;left:50%;width:min(1100px,120vw);height:560px;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(31,127,242,.14),rgba(31,127,242,0) 70%);pointer-events:none}
.wid-apply__shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);max-width:1160px;margin:0 auto;align-items:start}

/* ---------- левая колонка ---------- */

.wid-apply__kicker{display:inline-flex;justify-self:start;align-items:center;gap:8px;margin:0 0 14px;padding:7px 14px;border-radius:999px;background:#fff;color:#0a66d1;font-size:14px;font-weight:700;box-shadow:0 6px 18px rgba(31,127,242,.12)}
.wid-apply__kicker i{font-size:17px}
.wid-apply h2{margin:0;font-size:clamp(32px,5.4vw,52px);font-weight:750;letter-spacing:-.045em;line-height:1.03}
.wid-apply__lead{max-width:44ch;margin:16px 0 0;color:#5c6169;font-size:clamp(16px,1.8vw,18px);line-height:1.55}

.wid-apply__after{display:grid;gap:10px;margin:clamp(24px,3vw,34px) 0 0;padding:0;list-style:none;counter-reset:none}
.wid-apply__after li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding:16px 18px;border-radius:22px;background:#fff;box-shadow:0 10px 26px rgba(33,44,62,.06)}
.wid-apply__step-num{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#1D1D1F;color:#fff;font-size:14px;font-weight:800}
.wid-apply__after strong{display:block;font-size:17px;letter-spacing:-.02em}
.wid-apply__after p{margin:5px 0 0;color:#5c6169;font-size:15px;line-height:1.5}

.wid-apply__trust{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;margin-top:12px;padding:16px 18px;border-radius:22px;background:#e6f6ee}
.wid-apply__trust span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:#1f9b64;font-size:20px}
.wid-apply__trust strong{display:block;font-size:16px;letter-spacing:-.02em;color:#145c3b}
.wid-apply__trust p{margin:4px 0 0;color:#2f6d51;font-size:15px;line-height:1.5}
.wid-apply__trust a{color:#145c3b;font-weight:700}

/* ---------- карточка формы ---------- */

.wid-apply__form{padding:clamp(20px,2.6vw,30px);border-radius:34px;background:#fff;box-shadow:0 30px 70px rgba(33,44,62,.12)}
.wid-apply__form-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.wid-apply__form-head h3{margin:0;font-size:clamp(20px,2.4vw,24px);font-weight:750;letter-spacing:-.03em}
.wid-apply__form-head p{margin:4px 0 0;color:#8a8f97;font-size:14px}
.wid-apply__secure{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:#f5f5f7;color:#5c6169;font-size:13px;font-weight:650}
.wid-apply__secure i{color:#1f9b64;font-size:15px}
.wid-apply__progress{height:6px;margin:16px 0 6px;border-radius:9px;background:#eef0f3;overflow:hidden}
.wid-apply__progress i{display:block;width:0;height:100%;border-radius:9px;background:linear-gradient(90deg,#1f7ff2,#4d9cf6);transition:width .45s cubic-bezier(.16,1,.3,1)}

.wid-apply__group{margin-top:22px}
.wid-apply__group-title{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:16px;font-weight:750;letter-spacing:-.02em}
.wid-apply__group-title span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#e8f2ff;color:#0a66d1;font-size:13px;font-weight:800}
.wid-apply__legend{padding:0;color:#8a8f97;font-size:13.5px;font-weight:650}

.wid-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wid-field{display:grid;gap:6px;min-width:0}
.wid-field--wide{grid-column:1/-1}
.wid-field > span{display:flex;align-items:center;gap:6px;color:#5c6169;font-size:14px;font-weight:650}
.wid-field > span b{color:#e5484d}
.wid-field > span em{color:#a0a4ab;font-style:normal;font-size:13px;font-weight:600}
.wid-field input,.wid-field select,.wid-field textarea{width:100%;min-height:52px;padding:13px 16px;border:2px solid #e6e9ee;border-radius:16px;background:#fff;color:#1D1D1F;font:inherit;font-size:16px;transition:border-color .2s ease,box-shadow .2s ease}
.wid-field textarea{min-height:96px;resize:vertical;line-height:1.5}
.wid-field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:20px;padding-right:44px}
.wid-field input::placeholder,.wid-field textarea::placeholder{color:#b3b7bd}
.wid-field input:focus,.wid-field select:focus,.wid-field textarea:focus{outline:none;border-color:#1f7ff2;box-shadow:0 0 0 4px rgba(31,127,242,.14)}
.wid-field small{color:#a0a4ab;font-size:13px;line-height:1.35}
.wid-field.is-invalid input,.wid-field.is-invalid select,.wid-field.is-invalid textarea{border-color:#e5484d;box-shadow:0 0 0 4px rgba(229,72,77,.12)}
.wid-field.is-invalid small{color:#c4262c}

.wid-interest{margin:0 0 10px;padding:0;border:0}
.wid-interest > div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.wid-interest label{display:block;cursor:pointer}
.wid-interest input{position:absolute;opacity:0;pointer-events:none}
.wid-interest span{display:flex;align-items:center;gap:9px;min-height:56px;padding:12px 14px;border:2px solid #e6e9ee;border-radius:18px;color:#5c6169;font-size:15px;font-weight:650;line-height:1.25;transition:border-color .2s ease,background .2s ease,color .2s ease}
.wid-interest span i{flex:none;font-size:19px;color:#a0a4ab;transition:color .2s ease}
.wid-interest input:checked + span{border-color:#1f7ff2;background:#e8f2ff;color:#0a66d1}
.wid-interest input:checked + span i{color:#1f7ff2}
.wid-interest input:focus-visible + span{outline:2px solid #0071E3;outline-offset:2px}

.wid-apply__consent{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;margin-top:20px;cursor:pointer}
.wid-apply__consent input{position:absolute;opacity:0;pointer-events:none}
.wid-apply__consent > span{display:grid;place-items:center;width:26px;height:26px;border:2px solid #d8dde5;border-radius:9px;color:transparent;font-size:14px;transition:background .2s ease,border-color .2s ease,color .2s ease}
.wid-apply__consent input:checked + span{background:#1f7ff2;border-color:#1f7ff2;color:#fff}
.wid-apply__consent input:focus-visible + span{outline:2px solid #0071E3;outline-offset:2px}
.wid-apply__consent small{color:#5c6169;font-size:14px;line-height:1.5}
.wid-apply__consent a{color:#0a66d1;font-weight:650}

.wid-apply__form-error{margin:14px 0 0;padding:12px 14px;border-radius:14px;background:#fff0f0;color:#c4262c;font-size:14.5px;line-height:1.45}
.wid-apply__form-error a{color:inherit;font-weight:750}
.wid-apply__form-error.is-hidden{display:none}

.wid-apply__submit{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:58px;margin-top:18px;padding:0 24px;border:0;border-radius:999px;background:#1f7ff2;color:#fff;font:inherit;font-size:17px;font-weight:750;cursor:pointer;box-shadow:0 18px 36px rgba(31,127,242,.28);transition:transform .35s cubic-bezier(.16,1,.3,1),background .2s ease}
.wid-apply__submit:hover:not(:disabled){background:#0f6fe0;transform:translateY(-2px)}
.wid-apply__submit:disabled{opacity:.7;cursor:progress}
.wid-apply__note{margin:14px 0 0;color:#a0a4ab;font-size:13px;line-height:1.5}

.wid-apply__success{margin-top:18px;padding:22px;border-radius:26px;background:#e6f6ee;color:#145c3b;text-align:center}
.wid-apply__success.is-hidden{display:none}
.wid-apply__success span{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 12px;border-radius:50%;background:#1f9b64;color:#fff;font-size:26px}
.wid-apply__success h3{margin:0;font-size:22px;font-weight:750;letter-spacing:-.02em}
.wid-apply__success p{margin:8px 0 0;color:#2f6d51;font-size:15px;line-height:1.5}
.wid-apply__success a{color:#145c3b;font-weight:700}
.wid-apply__unconfirmed.is-hidden{display:none}

@media (max-width:980px){
  /* На телефоне порядок другой: сначала заголовок, потом форма, а шаги
     «что будет после» — под ней. Иначе человек упирается в поля, не прочитав,
     зачем их заполнять. */
  .wid-apply__shell{grid-template-columns:1fr}
  .wid-apply__copy{display:contents}
  .wid-apply__kicker{order:1;justify-self:start;margin-bottom:10px}
  .wid-apply h2{order:2}
  .wid-apply__lead{order:3;margin-bottom:6px}
  .wid-apply__form{order:4}
  .wid-apply__after{order:5;margin-top:4px}
  .wid-apply__trust{order:6}
}
@media (max-width:640px){
  .wid-form-grid,.wid-interest > div{grid-template-columns:1fr}
  .wid-apply__form{padding:18px;border-radius:28px}
  .wid-apply__secure{display:none}
}
@media (prefers-reduced-motion:reduce){
  .wid-apply__submit,.wid-apply__progress i,.wid-field input,.wid-interest span{transition:none}
}