/* ============================================================
   Smart Flytt — native service-page quote form
   ------------------------------------------------------------
   Uses the site's existing design tokens, and mirrors the
   homepage calculator's field, chip and button treatment so the
   two forms read as one system.
   ============================================================ */

.quote-form-native{padding:30px 26px 26px;}
@media (max-width:560px){ .quote-form-native{padding:22px 16px 20px;} }

.sq-form{margin:0;}
.sq-group{border:0;padding:0;margin:0 0 26px;}
.sq-group:last-of-type{margin-bottom:18px;}
.sq-group > legend{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:0.68rem;font-weight:700;letter-spacing:0.13em;text-transform:uppercase;
  color:var(--kraft-deep,#A88643);padding:0;margin:0 0 14px;
}

.sq-field{margin:0 0 16px;}
.sq-field:last-child{margin-bottom:0;}
.sq-field > label,
.sq-field .sq-label{
  display:block;margin:0 0 7px;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:0.68rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--ink-soft,#33455f);
}
.sq-field input[type=text],
.sq-field input[type=tel],
.sq-field input[type=email],
.sq-field input[type=number],
.sq-field input[type=date],
.sq-field select,
.sq-field textarea{
  width:100%;padding:12px 14px;font-size:1rem;
  font-family:'Inter',system-ui,sans-serif;color:var(--ink,#13233D);
  background:var(--paper,#F6F2E9);
  border:1px solid var(--line,#DCD2B8);border-radius:var(--r-xs,8px);
}
.sq-field textarea{resize:vertical;font-size:0.95rem;}
.sq-field select{
  /* the browser's own arrow is replaced so the control matches the text
     fields on every platform */
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%2333455f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
  padding-right:38px;cursor:pointer;
  height:calc(1rem * 1.2 + 26px);
}
.sq-field select:invalid{color:var(--ink-soft,#33455f);}

.sq-field input:focus,
.sq-field select:focus,
.sq-field textarea:focus{
  outline:none;border-color:var(--spruce,#2F5D50);
  box-shadow:0 0 0 3px rgba(47,93,80,0.15);
}
.sq-field input::placeholder{color:rgba(51,69,95,0.45);}

.sq-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media (max-width:560px){ .sq-row{grid-template-columns:1fr;gap:0;} }
  /* floor + lift: two compact columns that stack on a phone */
  .sq-row-tight{gap:12px;margin-top:2px;}
  .sq-row-tight .sq-field{margin-bottom:12px;}
  .sq-chips-sm{gap:6px;}
  .sq-chips-sm .sq-chip{min-height:34px;padding:0 12px;font-size:0.84rem;}

/* chips: one treatment for the building radios and the service checkboxes */
.sq-chips{display:flex;flex-wrap:wrap;gap:8px;}
.sq-chips input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.sq-chip{
  display:inline-flex;align-items:center;min-height:var(--btn-h-sm,38px);
  padding:0 15px;border-radius:var(--r-pill,999px);cursor:pointer;
  background:var(--white,#FFFCF6);border:1px solid var(--line,#DCD2B8);
  /* the pages set a global label{font-family:'JetBrains Mono'} for the
     calculator's field labels; a chip is a choice, not a field label */
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:0.88rem;line-height:1.25;color:var(--ink,#13233D);
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.sq-chip:hover{border-color:var(--kraft-deep,#A88643);}
.sq-chips input:checked + .sq-chip{
  background:var(--spruce,#2F5D50);border-color:var(--spruce,#2F5D50);
  color:var(--white,#FFFCF6);font-weight:600;
}
.sq-chips input:focus-visible + .sq-chip{outline:3px solid var(--stamp,#B23A2E);outline-offset:2px;}

/* validation */
.sq-msg{
  margin:6px 0 0;font-size:0.82rem;line-height:1.4;color:var(--stamp,#B23A2E);font-weight:500;
}
.sq-invalid input,
.sq-invalid select,
.sq-invalid textarea{border-color:var(--stamp,#B23A2E);}
.sq-invalid .sq-chip{border-color:var(--stamp,#B23A2E);}

.sq-disclosure,
.quote-form-native .form-privacy{
  margin:0 0 12px;font-size:0.8rem;line-height:1.55;color:var(--ink-soft,#33455f);
}
.sq-disclosure{padding-top:18px;border-top:1px solid var(--line,#DCD2B8);}
.quote-form-native .form-privacy{margin-bottom:18px;}
.quote-form-native .form-privacy a{color:var(--spruce,#2F5D50);}

.sq-submit{width:100%;}
.sq-submit[disabled]{opacity:0.6;cursor:default;}

.sq-status{
  margin:12px 0 0;font-size:0.88rem;line-height:1.5;text-align:center;
}
.sq-status-busy{color:var(--ink-soft,#33455f);}
.sq-status-error{color:var(--stamp,#B23A2E);font-weight:600;}

.sq-done{
  margin:0;padding:22px 20px;border-radius:var(--r-sm,10px);
  background:rgba(47,93,80,0.08);border:1px solid var(--spruce,#2F5D50);
  color:var(--spruce-deep,#20423A);font-size:1rem;line-height:1.6;font-weight:600;
  text-align:center;
}
.sq-done:focus-visible{outline:3px solid var(--stamp,#B23A2E);outline-offset:3px;}

/* the always-available alternatives, under the form */
.sq-alt{margin-top:22px;padding-top:20px;border-top:1px solid var(--line,#DCD2B8);text-align:center;}
.sq-alt-lead{margin:0 0 12px;font-size:0.84rem;color:var(--ink-soft,#33455f);}
.sq-alt-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.sq-alt-actions .btn{min-height:var(--btn-h-sm,38px);padding:0 16px;font-size:0.86rem;}
.btn-wa{background:#25D366;border-color:#25D366;color:#fff;}
.btn-wa:hover{background:#1FB955;border-color:#1FB955;color:#fff;}