:root {
  color-scheme: light;
  font-family: Arial, Helvetica, sans-serif;
  color: #123852;
  background: #fff;
  --green: #00b900;
}
* { box-sizing: border-box; }
body { margin: 0; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid #ffdf64; outline-offset: 4px; }
.hero { background: #0742f5 url('assets/background.png') center / cover no-repeat; overflow: hidden; }
.scene { position: relative; width: 100%; max-width: 1920px; aspect-ratio: 1600 / 773; margin: 0 auto; }
.topbar { position: absolute; z-index: 3; top: 4.14%; left: 20.94%; right: 21.38%; display: flex; align-items: flex-start; justify-content: space-between; }
.brand { width: 20.95%; }
.sales { display: inline-flex; align-items: center; justify-content: center; gap: .32em; padding: .2em .55em; border-radius: .5em; background: #00aa00; color: #fff; font-weight: 700; font-size: clamp(10px, 1.0625vw, 20px); line-height: 1.15; text-decoration: none; white-space: nowrap; transition: background .15s; }
.sales img { width: 1.15em; height: 1.15em; }
.sales:hover, .submit:hover { background: #008e00; }
.building { position: absolute; z-index: 0; left: 16.06%; bottom: 0; width: 48.44%; }
.headline { position: absolute; z-index: 1; top: 10.22%; left: 44.25%; width: 32.864583%; margin: 0; }
.headline img { width: 100%; }
.quote-card { position: absolute; z-index: 2; top: 47%; left: 51.41%; width: 20%; padding: 1.8125% 1.9375% 1.625%; border-radius: 1.3125vw; background: #fff; }
.quote-card:has(.form-status:not([hidden])) { transform: translateY(-36px); }
.quote-card h2 { margin: 0 0 1.2em; font-size: clamp(12px, 1.125vw, 21.6px); font-weight: 800; line-height: 1.2; text-align: center; text-transform: uppercase; }
.field { margin-bottom: .6875vw; }
.field label { display: block; margin-bottom: .2em; font-size: clamp(9px, .8125vw, 15.6px); font-weight: 800; line-height: 1.1; text-transform: uppercase; }
.field input, .field select, .field textarea { display: block; width: 100%; min-width: 0; height: 1.9375vw; max-height: 37.2px; padding: .2em .5em; border: 1px solid #4e6a76; border-radius: .5625vw; background: #fff; color: #123852; font-size: clamp(10px, .9375vw, 18px); line-height: 1.2; }
.field textarea { resize: vertical; min-height: 1.9375vw; }
.last-field { margin-bottom: 1vw; }
.submit { display: block; width: 100%; min-height: 1.9375vw; padding: .6em .5em; border: 0; border-radius: .5vw; background: var(--green); color: #fff; cursor: pointer; font-size: clamp(10px, .75vw, 14.4px); line-height: 1; font-weight: 800; text-transform: uppercase; transition: background .15s; }
.submit:disabled { opacity: .65; cursor: wait; }
.website-field { display: none; }
.form-status { margin: 12px 0 0; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.form-status[data-state="error"] { color: #a52222; }
.form-status[data-state="success"] { color: #17662d; }
.footer { display: flex; align-items: center; justify-content: center; min-height: 8.875vw; padding: 2vw; background: #fff; }
.footer img { width: 14.44vw; max-width: 277px; }
.floating-whatsapp { position: fixed; z-index: 5; right: 3.875vw; bottom: 21.8vh; width: clamp(54px, 4.4375vw, 78px); border-radius: 50%; transition: transform .15s; }
.floating-whatsapp:hover { transform: translateY(-3px); }
@media (min-width: 1921px) {
  .quote-card { border-radius: 25px; }
  .field { margin-bottom: 13px; }
  .field input, .field select, .field textarea { height: 37px; border-radius: 10px; }
  .field textarea { min-height: 37px; }
  .last-field { margin-bottom: 19px; }
  .submit { min-height: 37px; border-radius: 10px; }
}
@media (max-width: 1100px) {
  .scene { aspect-ratio: auto; min-height: 920px; padding: 24px 20px 90px; }
  .topbar { position: relative; inset: auto; align-items: center; gap: 15px; max-width: 700px; margin: 0 auto; }
  .brand { width: 145px; flex-shrink: 0; }
  .sales { font-size: 11px; padding: 8px; flex-wrap: wrap; column-gap: 4px; row-gap: 2px; max-width: 155px; }
  .headline { position: relative; inset: auto; width: 100%; max-width: 460px; margin: 42px auto 44px; }
  .quote-card { position: relative; inset: auto; width: min(100%, 330px); margin: 0 auto; padding: 28px 24px; border-radius: 22px; }
  .quote-card:has(.form-status:not([hidden])) { transform: none; }
  .quote-card h2 { margin-bottom: 24px; font-size: clamp(16px, 4.4vw, 19px); }
  .field { margin-bottom: 15px; }
  .field label { margin-bottom: 6px; font-size: 12px; }
  .field input, .field select, .field textarea { height: 42px; max-height: none; border-radius: 9px; font-size: 16px; }
  .field textarea { min-height: 42px; }
  .last-field { margin-bottom: 20px; }
  .submit { min-height: 44px; border-radius: 8px; font-size: 13px; }
  .building { left: -115px; width: 600px; max-width: none; }
  .footer { min-height: 126px; padding: 25px; }
  .footer img { width: 210px; }
  .floating-whatsapp { right: 16px; bottom: max(18px, env(safe-area-inset-bottom)); width: 62px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }