/* Nuvii Smart Home — website forms. Matches the site's own styling. */

.nv-form{display:block}
.nv-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:end}
.nv-field{margin-bottom:14px;text-align:left}
.nv-field label{display:block;font-size:13px;font-weight:600;color:var(--slate);margin-bottom:6px;letter-spacing:.01em}
.nv-field .nv-opt{font-weight:500;color:var(--grey)}

.nv-field input,
.nv-field select,
.nv-field textarea{
  width:100%;
  font-family:inherit;
  font-size:15.5px;
  color:var(--ink);
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:13px 15px;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
  -webkit-appearance:none;appearance:none;
}
.nv-field textarea{min-height:90px;resize:vertical;line-height:1.55}
.nv-field select{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B7480' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;cursor:pointer;
}
.nv-field input::placeholder,
.nv-field textarea::placeholder{color:#9AA3AE}

.nv-field input:focus,
.nv-field select:focus,
.nv-field textarea:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(21,119,194,.15);
}

.nv-field.nv-bad input,
.nv-field.nv-bad select,
.nv-field.nv-bad textarea{border-color:var(--coral);background:var(--coral-soft)}
.nv-err{display:none;font-size:12.5px;color:var(--coral-ink);margin-top:5px;font-weight:600}
.nv-field.nv-bad .nv-err{display:block}

/* the trap field bots fill in and people never see */
.nv-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.nv-submit{
  width:100%;justify-content:center;margin-top:6px;
  background:var(--blue);color:#fff;border:none;cursor:pointer;
  font-family:inherit;font-weight:600;font-size:16px;
  border-radius:999px;padding:16px 26px;
  display:inline-flex;align-items:center;gap:10px;
  box-shadow:0 12px 24px -12px rgba(21,119,194,.6);
  transition:all .4s var(--ease);touch-action:manipulation;
}
.nv-submit:hover{background:var(--blue-dark)}
.nv-submit[disabled]{opacity:.65;cursor:default}

.nv-fine{font-size:12.5px;color:var(--grey);text-align:center;margin-top:14px;line-height:1.55}
.nv-fine a{color:var(--blue)}

.nv-refnote{
  display:none;align-items:center;gap:9px;
  background:var(--cloud);border:1px solid var(--line);border-radius:12px;
  padding:11px 14px;margin-bottom:16px;
  font-size:13.5px;color:var(--slate);
}
.nv-refnote.on{display:flex}
.nv-refnote b{color:var(--ink)}

/* the thank-you panel that replaces the form */
.nv-done{display:none;text-align:center;padding:26px 8px 14px}
.nv-done.on{display:block}
.nv-done .nv-tick{
  width:56px;height:56px;border-radius:50%;
  background:rgba(31,169,113,.12);color:var(--green);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
}
.nv-done h4{font-size:21px;color:var(--ink);margin-bottom:8px}
.nv-done p{font-size:15px;color:var(--slate);line-height:1.6;max-width:330px;margin:0 auto}
.nv-done .nv-call{margin-top:18px;font-size:14.5px;color:var(--grey)}
.nv-done .nv-call a{color:var(--blue);font-weight:600}

.nv-fail{
  display:none;margin-top:14px;padding:13px 15px;border-radius:12px;
  background:var(--coral-soft);border:1px solid rgba(240,120,92,.35);
  font-size:14px;color:var(--coral-ink);line-height:1.55;
}
.nv-fail.on{display:block}
.nv-fail a{color:var(--coral-ink);font-weight:700}

@media(max-width:620px){
  .nv-row{grid-template-columns:1fr;gap:0}
}