/* Autopeças Loi – formulário de orçamento passo a passo */
.loi-form{--loi-orange:#FE6416;--loi-orange-2:#FF7A33;--loi-dark:#212429;--loi-muted:#6b7077;--loi-line:#e3e5e8;--loi-bg:#f6f6f7;--loi-green:#4DC400;
  width:100%;max-width:100%;font-family:"Poppins",Sans-serif;color:var(--loi-dark);text-align:left;box-sizing:border-box}
.loi-form *,.loi-form *::before,.loi-form *::after{box-sizing:border-box}

.loi-form__form{margin:0;padding:0;display:block}

/* barra de progresso */
.loi-form__progress{height:6px;background:#EAEAEB;border-radius:99px;overflow:hidden;margin:6px 0 22px}
.loi-form__progress-fill{height:100%;width:0;background-color:var(--loi-green);border-radius:99px;transition:width .35s ease}

/* corpo (altura mínima evita "pulos" entre as etapas) */
.loi-form__body{min-height:292px;display:flex;flex-direction:column;opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease}
.loi-form__body.is-in{opacity:1;transform:none}

.loi-form__head{margin-bottom:18px}
.loi-form__title{margin:0 0 6px;font-family:"Poppins",Sans-serif;font-size:22px;font-weight:600;line-height:1.25;color:var(--loi-dark);outline:none}
.loi-form__sub{margin:0;font-size:14px;line-height:1.45;color:var(--loi-muted)}

/* opções da primeira pergunta */
.loi-form__options{display:flex;flex-direction:column;gap:10px}
.loi-form__opt{appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:58px;padding:0 20px;
  background:#fff;border:1.5px solid var(--loi-line);border-radius:10px;font-family:"Poppins",Sans-serif;font-size:16px;font-weight:500;color:var(--loi-dark);
  cursor:pointer;text-align:left;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease,transform .1s ease}
.loi-form__opt:hover{border-color:var(--loi-orange);background:#fff7f2}
.loi-form__opt:active{transform:scale(.99)}
.loi-form__opt[aria-pressed="true"]{border-color:var(--loi-orange);background:#fff1e8}
.loi-form__opt-arrow{font-size:26px;line-height:1;color:var(--loi-orange);transition:transform .15s ease}
.loi-form__opt:hover .loi-form__opt-arrow{transform:translateX(3px)}

/* campos */
.loi-form__field{margin-bottom:12px}
.loi-form__label{display:block;margin:0 0 6px;font-size:13px;font-weight:500;color:var(--loi-dark)}
.loi-form__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.loi-form__input{display:block;width:100%;height:54px;padding:0 16px;background:#fff;border:1.5px solid var(--loi-line);border-radius:10px;
  font-family:"Poppins",Sans-serif;font-size:16px;color:var(--loi-dark);transition:border-color .15s ease,box-shadow .15s ease;appearance:none;-webkit-appearance:none}
.loi-form__input::placeholder{color:#9a9fa6}
.loi-form__input:focus{outline:none;border-color:var(--loi-orange);box-shadow:0 0 0 3px rgba(254,100,22,.22)}
.loi-form__input.is-invalid{border-color:#d93025;box-shadow:0 0 0 3px rgba(217,48,37,.14)}

.loi-form__error{min-height:20px;margin:2px 0 0;font-size:13px;font-weight:500;color:#d93025}

/* botões */
.loi-form__actions{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:10px}
.loi-form__back{appearance:none;-webkit-appearance:none;background:none;border:0;padding:8px 2px;font-family:"Poppins",Sans-serif;font-size:14px;font-weight:500;color:var(--loi-muted);cursor:pointer}
.loi-form__back:hover{color:var(--loi-dark)}
.loi-form__next{appearance:none;-webkit-appearance:none;flex:1;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 24px;border:0;border-radius:6px;cursor:pointer;
  font-family:"Poppins",Sans-serif;font-size:14px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#fff;
  background-color:var(--loi-orange);background-image:linear-gradient(80deg,var(--loi-orange) 0%,var(--loi-orange-2) 100%);box-shadow:0 0 10px rgba(0,0,0,.18);transition:filter .15s ease,transform .1s ease}
.loi-form__next:hover{filter:brightness(1.06)}
.loi-form__next:active{transform:scale(.99)}
.loi-form__next:disabled{opacity:.75;cursor:default}
.loi-form__next-ico{font-size:16px;line-height:1}
.loi-form__next.is-loading .loi-form__next-ico{display:none}
.loi-form__back:focus-visible,.loi-form__next:focus-visible,.loi-form__opt:focus-visible{outline:3px solid rgba(254,100,22,.45);outline-offset:2px}

.loi-form__legal{margin:12px 0 0;font-size:12px;line-height:1.4;color:var(--loi-muted)}

/* tela final */
.loi-form__ok{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;flex:1;gap:8px;padding:6px 0}
.loi-form__ok-ico{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--loi-orange);color:#fff;font-size:30px;font-weight:700;line-height:1;margin-bottom:6px}
.loi-form__resumo{list-style:none;margin:10px 0 0;padding:14px 16px;width:100%;background:var(--loi-bg);border-radius:10px;font-size:14px;line-height:1.7;color:var(--loi-dark)}

/* campo isca (invisível para pessoas) */
.loi-form__hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

@media (max-width:767px){
  .loi-form__title{font-size:19px}
  .loi-form__body{min-height:268px}
  .loi-form__opt{min-height:54px;padding:0 16px}
}
@media (prefers-reduced-motion:reduce){
  .loi-form__body,.loi-form__progress-fill,.loi-form__opt,.loi-form__opt-arrow,.loi-form__next{transition:none}
}

/* respiro interno do cartão branco que envolve o formulário */
.loi-form{padding:24px 28px 26px}
@media (max-width:767px){.loi-form{padding:18px 18px 20px}}

/* O tema do site pinta todo <button> de rosa no hover/foco; aqui os estados são definidos de forma explícita */
.loi-form .loi-form__next,.loi-form .loi-form__next:hover,.loi-form .loi-form__next:focus,.loi-form .loi-form__next:active{background-color:var(--loi-orange);color:#fff;border:0}
.loi-form .loi-form__back,.loi-form .loi-form__back:hover,.loi-form .loi-form__back:focus,.loi-form .loi-form__back:active{background-color:transparent;border:0;box-shadow:none}
.loi-form .loi-form__back{color:var(--loi-muted)}
.loi-form .loi-form__back:hover,.loi-form .loi-form__back:focus{color:var(--loi-dark)}
.loi-form .loi-form__opt,.loi-form .loi-form__opt:hover,.loi-form .loi-form__opt:focus,.loi-form .loi-form__opt:active{color:var(--loi-dark);border:1.5px solid var(--loi-line);border-radius:10px;background-color:#fff}
.loi-form .loi-form__opt:hover,.loi-form .loi-form__opt:focus{border-color:var(--loi-orange);background-color:#fff7f2}
.loi-form .loi-form__opt[aria-pressed="true"],.loi-form .loi-form__opt[aria-pressed="true"]:hover,.loi-form .loi-form__opt[aria-pressed="true"]:focus{border-color:var(--loi-orange);background-color:#fff1e8}
.loi-form .loi-form__input,.loi-form .loi-form__input:hover,.loi-form .loi-form__input:focus{background-color:#fff;color:var(--loi-dark)}

/* botão nunca ultrapassa o cartão em telas estreitas */
.loi-form .loi-form__next{min-width:0}
.loi-form .loi-form__next-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:767px){.loi-form .loi-form__next{padding:0 14px;letter-spacing:0}}

/* cabeçalho do primeiro passo */
.loi-form__intro{text-align:center;margin:0 0 16px}
.loi-form__intro[hidden]{display:none}
.loi-form .loi-form__intro-title{margin:0 0 10px;font-family:"Poppins",Sans-serif;font-size:26px;font-weight:700;line-height:1.25;color:#0a0908}
.loi-form__intro-sub{margin:0;display:flex;align-items:center;justify-content:center;gap:7px;font-size:15px;line-height:1.4;color:#505051}
.loi-form__clock{flex:none}

/* títulos e subtítulos de cada pergunta centralizados, como na referência */
.loi-form__head{text-align:center}
@media (max-width:767px){.loi-form .loi-form__intro-title{font-size:22px}.loi-form__intro-sub{font-size:14px}}
