/* Ajustes exclusivos da página de cotação. O site.css permanece intacto. */
.quote-form .field select{
  width:100%;
  border:0;
  outline:0;
  padding:8px 28px 17px 0;
  background:transparent;
  color:#fff;
  font-size:18px;
  border-radius:0;
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,rgba(255,255,255,.7) 50%),linear-gradient(135deg,rgba(255,255,255,.7) 50%,transparent 50%);
  background-position:calc(100% - 10px) calc(50% - 2px),calc(100% - 5px) calc(50% - 2px);
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
.quote-form .field select option{color:var(--ink);background:#fff}
.quote-form .field select:disabled{color:rgba(255,255,255,.42);cursor:not-allowed}
.quote-form .field input:user-invalid,
.quote-form .field select:user-invalid{box-shadow:none}


/* CTA do hero — mesmo padrão visual vermelho da Home, destacado à direita. */
.quote-hero > .quote-hero-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(32px,5vw,80px);
  align-items:end;
}
.quote-hero-copy{min-width:0}
.quote-scroll-cta{
  min-width:230px;
  flex-shrink:0;
  gap:12px;
  align-self:end;
  white-space:nowrap;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
}
.quote-scroll-cta span{
  font-size:20px;
  line-height:1;
  transform:translateY(-1px);
}
#formulario-cotacao{scroll-margin-top:72px}

@media(max-width:820px){
  .quote-hero > .quote-hero-layout{
    grid-template-columns:1fr;
    gap:24px;
  }
  .quote-scroll-cta{
    justify-self:start;
    min-width:220px;
  }
}

@media(max-width:640px){
  .quote-scroll-cta{
    width:100%;
    min-width:0;
    justify-self:stretch;
  }
}