Первый экран для сайта автосервиса

<section class="vbpav">
  <div class="vbpav-wrap">
    <div class="vbpav-left">
      <h1 class="vbpav-h1">Диагностика <span>за 0 ₽</span>, ремонт по согласованной смете</h1>
      <p class="vbpav-lead">Показываем неисправность на подъёмнике и присылаем фото узла до и после. Не меняем то, что можно починить.</p>

      <ul class="vbpav-facts">
        <li><b>60 мин</b><span>компьютерная и ходовая диагностика</span></li>
        <li><b>2 года</b><span>гарантия на работы и запчасти</span></li>
        <li><b>14 постов</b><span>очередь на запись — до двух дней</span></li>
      </ul>
    </div>

    <div class="vbpav-card">
      <h2 class="vbpav-card__ttl">Записаться на диагностику</h2>
      <form class="vbpav-form t-form js-form-proccess" role="form" action="#" method="POST"
            data-vibeblock-form="true" data-formactiontype="2" data-error-popup="y" data-success-popup="y"
            data-success-callback="vbpavSuccess" data-inputbox=".vbpav-inp, .vbpav-consent-inp" novalidate>
        <input type="hidden" name="formservices[]" value="HASH_EMAIL" class="js-formaction-services">
        <input type="hidden" name="form_source" value="Первый экран — автосервис">
        <div class="vbpav-two">
          <select name="Marka" class="vbpav-inp vbpav-sel" id="vbpav-brands" aria-label="Марка автомобиля"></select>
          <input type="text" name="Model" class="vbpav-inp" placeholder="Модель и год">
        </div>
        <input type="text" name="Problema" class="vbpav-inp" placeholder="Что беспокоит: стук, вибрация, ошибка">
        <div class="vbpav-two">
          <input type="tel" name="Phone" class="vbpav-inp js-tilda-rule js-tilda-mask" data-tilda-req="1"
                 data-tilda-rule="phone" data-tilda-mask="+7 (999) 999-99-99" inputmode="tel" placeholder="+7 (___) ___-__-__">
          <select name="Vremya" class="vbpav-inp vbpav-sel" aria-label="Удобное время">
            <option>Сегодня после 15:00</option>
            <option>Завтра утром</option>
            <option>Завтра вечером</option>
            <option>В выходные</option>
          </select>
        </div>
        <label class="vbpav-consent">
          <input type="checkbox" name="Privacy" value="Da" class="vbpav-consent-inp js-tilda-rule" data-tilda-req="1">
          <span class="vbpav-consent__box"></span>
          <span>Оставляя заявку, вы соглашаетесь с <a href="/policy" target="_blank" rel="noopener">политикой конфиденциальности</a></span>
        </label>
        <button type="submit" class="vbpav-submit t-submit">Записаться бесплатно</button>
      </form>
    </div>
  </div>
</section>

<style>
.vbpav, .vbpav *, .vbpav *::before, .vbpav *::after { box-sizing: border-box; }
.vbpav {
  /* Светлая тема: --bg #fff, --panel #f5f5f5, --ink #17191c, --muted #62676e, --line #e4e6e9 */
  --acc: #ff8a1f; --acc-dark: #e8760f; --bg: #16181b; --panel: #1e2126; --ink: #f0f1f3; --muted: #98a0aa; --line: #2b2f36;
  --f: var(--t-text-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif);
  --fh: var(--t-headline-font, var(--f));
  background: var(--bg); color: var(--ink); font-family: var(--f); padding: clamp(36px, 5vw, 84px) 20px;
}
.vbpav-wrap { max-width: 1240px; margin: 0 auto; padding: 0 clamp(0px, 2vw, 40px);
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(26px, 4vw, 56px); align-items: center; }
.vbpav-h1 { font-family: var(--fh); font-size: clamp(30px, 4.4vw, 54px); line-height: 1.06; font-weight: 700; letter-spacing: -.025em; margin: 0 0 18px; }
.vbpav-h1 span { color: var(--acc); }
.vbpav-lead { font-size: clamp(16px, 1.35vw, 19px); line-height: 1.6; color: var(--muted); margin: 0 0 30px; max-width: 30em; }
.vbpav-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.vbpav-facts li { border-top: 2px solid var(--acc); padding-top: 12px; }
.vbpav-facts b { display: block; font-family: var(--fh); font-size: clamp(19px, 2vw, 25px); font-weight: 700; }
.vbpav-facts span { display: block; font-size: 12.5px; line-height: 1.4; color: var(--muted); margin-top: 6px; }

.vbpav-card { background: var(--panel); border: 1px solid var(--line); border-radius: 22px; padding: clamp(22px, 2.6vw, 32px); }
.vbpav-card__ttl { font-family: var(--fh); font-size: 21px; font-weight: 700; margin: 0 0 18px; }
.vbpav-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.vbpav-inp { width: 100%; height: 52px; padding: 0 15px; margin-bottom: 8px; font: inherit; font-size: 16px;
  -webkit-appearance: none; appearance: none; border: 1px solid var(--line); border-radius: 10px;
  background: rgba(255,255,255,.04); color: var(--ink); }
.vbpav-inp::placeholder { color: #6f7681; }
.vbpav-inp:focus { outline: 2px solid var(--acc); outline-offset: -2px; }
.vbpav-sel { background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 19px) 23px, calc(100% - 13px) 23px; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 38px; }
.vbpav-sel option { background: var(--panel); color: var(--ink); }
.vbpav-consent { display: flex; align-items: flex-start; gap: 9px; margin: 8px 0 16px; cursor: pointer; font-size: 12px; line-height: 1.45; color: var(--muted); }
.vbpav-consent input { position: absolute; opacity: 0; width: 0; height: 0; }
.vbpav-consent__box { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px; border: 1.5px solid #3c424b; border-radius: 5px; position: relative; }
.vbpav-consent input:checked + .vbpav-consent__box { background: var(--acc); border-color: var(--acc); }
.vbpav-consent input:checked + .vbpav-consent__box::after { content: ''; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid #16181b; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.vbpav-consent a, .vbpav-consent a:link, .vbpav-consent a:visited, .vbpav-consent a:hover, .vbpav-consent a:active, .vbpav-consent a:focus { color: var(--ink) !important; text-decoration: underline !important; }
.vbpav-submit { width: 100%; min-height: 56px; border: 0; margin: 0; -webkit-appearance: none; appearance: none; font: inherit; font-size: 16px;
  font-weight: 700; cursor: pointer; border-radius: 10px; background: var(--acc) !important; color: #16181b !important; transition: background .2s ease; }
.vbpav-submit:hover { background: var(--acc-dark) !important; }
.vbpav-done { text-align: center; padding: 28px 6px; }
.vbpav-done b { display: block; font-family: var(--fh); font-size: 20px; margin-bottom: 6px; }
.vbpav-done span { font-size: 14px; color: var(--muted); }

@media (max-width: 900px) { .vbpav-wrap { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .vbpav-h1 { font-size: clamp(25px, 7vw, 33px); } .vbpav-facts { grid-template-columns: minmax(0, 1fr); } .vbpav-two { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .vbpav * { transition: none !important; } }
</style>

<script>
(function () {
  /* ── МАРКИ в выпадающем списке ── */
  var BRANDS = ['Марка автомобиля', 'Lada', 'Kia', 'Hyundai', 'Toyota', 'Volkswagen', 'Skoda', 'Renault',
    'Nissan', 'Ford', 'Chevrolet', 'Mazda', 'Mitsubishi', 'BMW', 'Mercedes-Benz', 'Audi', 'Haval', 'Chery', 'Geely', 'Другая'];

  var roots = document.querySelectorAll('.vbpav');
  for (var i = 0; i < roots.length; i++) init(roots[i]);

  function init(root) {
    if (root.__vb) return; root.__vb = 1;
    var sel = root.querySelector('#vbpav-brands');
    if (sel) {
      sel.innerHTML = BRANDS.map(function (b, i) {
        return '<option' + (i === 0 ? ' value=""' : '') + '>' + b + '<\/option>';
      }).join('');
    }

    var form = root.querySelector('.vbpav-form');
    if (form && !form.__b) {
      form.__b = 1;
      form.addEventListener('submit', function (e) {
        e.preventDefault();
        var btn = form.querySelector('button[type="submit"], .t-submit');
        if (btn && typeof window.t_forms__initBtnClick === 'function') {
          try { window.t_forms__initBtnClick({ target: btn, srcElement: btn, preventDefault: function () {} }); } catch (_) {}
        }
      });
    }
    if (!window.vbpavSuccess) {
      window.vbpavSuccess = function (f) {
        try { f.innerHTML = '<div class="vbpav-done"><b>Записали<\/b><span>Мастер-приёмщик перезвонит и подтвердит время. Диагностика — бесплатно.<\/span><\/div>'; } catch (e) {}
      };
    }
  }
})();
</script>

Вставляется целиком в блок T123 «HTML-код». Внутри уже есть стили и скрипт, подключать ничего не нужно. В форме замените HASH_EMAIL на хеш приёмника из Tilda → Site Settings → Forms.