/* =========================================================================
   kaido-forms.css (audit v8 item 7, 6 Nov 2026): one form component for every
   non-LP form on kaidolab.com (contact, systems review, e-invoicing, readiness
   tool, industry and compare pages, platform and solution guide boxes, guide
   pages, home guide band).
   Opt in with class="kform" on the <form>:
     kform--primary  copper submit (the form is the page's main action)
     (default)       ink submit (secondary form on the page)
     kform--dark     the form sits on a dark band
   Parts: .kf-field (label above control), .kf-row (two columns from 640px),
   .kf-hp (honeypot, visually hidden), .kf-note, .kf-msg (inline error, added by
   kaido-tracking.js). Linked right after the shared header on every page with a
   form, so it loads after the page's own <head> CSS.
   ========================================================================= */
:root{--kf-ink:#0A0B0D;--kf-text:#2B2925;--kf-muted:#5E5A53;--kf-line:#CFC8BC;--kf-line-h:#9E978B;
  --kf-copper:#C94208;--kf-copper-h:#A33606;--kf-err:#8A2E05;--kf-err-bg:#FFF1EA;--kf-radius:10px}

:where(form.kform){margin:0}
/* v9: no margin at this specificity, so a component that places the form (.leadbox, .lead-form, guide bands) keeps its own spacing */
:root body form.kform{position:relative;display:block;text-align:start}
:root body form.kform .kf-field{display:flex !important;flex-direction:column;gap:6px;margin:0 0 14px !important;min-width:0;padding:0;border:0}
:root body form.kform .kf-row{display:grid;grid-template-columns:1fr;gap:0 14px}
@media (min-width:640px){:root body form.kform .kf-row{grid-template-columns:1fr 1fr}}
:root body form.kform .kf-row>.kf-field{margin-bottom:14px !important}

/* label above the control */
:root body form.kform .kf-field>label,:root body form.kform label.kf-label{display:block !important;margin:0 !important;padding:0;
  font-size:14px !important;font-weight:600 !important;line-height:1.35 !important;color:var(--kf-ink) !important;letter-spacing:0 !important;text-transform:none !important}
:root body form.kform .kf-field>label .kf-opt,:root body form.kform .kf-field>label .k-opt,:root body form.kform .kf-field>label .opt{font-weight:400;color:var(--kf-muted)}
:root body form.kform .kf-field>label .kf-req{color:var(--kf-copper);font-weight:600}

/* 48px controls, one select style */
/* :where() keeps this base rule at low specificity so the state rules below (focus, invalid, textarea, select) win */
:root body form.kform :where(input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea){
  display:block;width:100% !important;max-width:100%;box-sizing:border-box !important;height:48px !important;min-height:48px;margin:0 !important;
  padding:0 14px !important;border:1px solid var(--kf-line) !important;border-radius:var(--kf-radius) !important;background-color:#fff !important;
  color:var(--kf-ink) !important;font:inherit;font-size:16px !important;line-height:1.3 !important;box-shadow:none !important;outline:none;
  -webkit-appearance:none;appearance:none;transition:border-color .15s ease,box-shadow .15s ease}
:root body form.kform textarea{height:auto !important;min-height:112px;padding:12px 14px !important;resize:vertical}
:root body form.kform select{padding-inline-end:42px !important;cursor:pointer;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%230A0B0D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;background-position:right 16px center !important;background-size:12px 8px !important}
html[dir="rtl"] body form.kform select{background-position:left 16px center !important;padding:0 14px 0 42px !important}
:root body form.kform :is(input,select,textarea)::placeholder{color:#8C867C;opacity:1}
:root body form.kform :is(input:not([type=hidden]),select,textarea):hover{border-color:var(--kf-line-h) !important}

/* visible focus: 2px copper ring with offset */
:root body form.kform :is(input:not([type=hidden]),select,textarea):focus-visible,
:root body form.kform :is(input:not([type=hidden]),select,textarea):focus{border-color:var(--kf-ink) !important;outline:2px solid var(--kf-copper) !important;outline-offset:2px !important}
:root body form.kform button[type=submit]:focus-visible{outline:2px solid var(--kf-copper) !important;outline-offset:2px !important}

/* errors */
:root body form.kform :is(input,select,textarea)[aria-invalid="true"]{border-color:var(--kf-copper) !important;background-color:#FFFBF8 !important}
:root body form.kform .kf-msg{display:block;margin:6px 0 0 !important;font-size:13px !important;line-height:1.4 !important;color:var(--kf-err) !important;font-weight:500}
:root body form.kform .kf-field>.kf-msg{margin-top:0 !important}
:root body form.kform .kf-err{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--kf-err-bg);color:var(--kf-err);font-size:14px;line-height:1.5}

/* submit: ink by default, copper when the form is the page's main action */
:root body form.kform button[type=submit]{display:inline-flex !important;align-items:center;justify-content:center;gap:8px;width:100% !important;min-height:52px !important;height:auto !important;
  margin:6px 0 0 !important;padding:0 22px !important;border-radius:12px !important;border:1.5px solid var(--kf-ink) !important;background:var(--kf-ink) !important;color:#fff !important;
  font-size:16px !important;font-weight:600 !important;line-height:1.2 !important;letter-spacing:0 !important;text-transform:none !important;box-shadow:none !important;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}
:root body form.kform button[type=submit]:hover{background:#26282C !important;border-color:#26282C !important}
:root body form.kform.kform--primary button[type=submit]{background:var(--kf-copper) !important;border-color:var(--kf-copper) !important;color:#fff !important}
:root body form.kform.kform--primary button[type=submit]:hover{background:var(--kf-copper-h) !important;border-color:var(--kf-copper-h) !important}
:root body form.kform button[type=submit][disabled]{opacity:.7;cursor:progress}
:root body form.kform :is(.kf-note,.k-form-note,.form-note){margin:10px 0 0 !important;font-size:13px !important;line-height:1.5 !important;color:var(--kf-muted) !important}

/* honeypot: out of sight, out of tab order, out of the accessibility tree */
:root body .kf-hp{position:absolute !important;width:1px !important;height:1px !important;margin:-1px !important;padding:0 !important;border:0 !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important}

/* RTL: phone and email stay left-to-right, aligned to the start edge */
html[dir="rtl"] body form.kform :is(input[type=tel],input[type=email]){direction:ltr;text-align:right}

/* dark band variant (home guide band) */
:root body form.kform.kform--dark .kf-field>label{color:#fff !important}
:root body form.kform.kform--dark :is(input:not([type=hidden]),select,textarea){background-color:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.34) !important;color:#fff !important}
:root body form.kform.kform--dark :is(input,select,textarea)::placeholder{color:rgba(255,255,255,.6)}
:root body form.kform.kform--dark :is(input:not([type=hidden]),select,textarea):is(:focus,:focus-visible){border-color:#fff !important;outline:2px solid #FF9A3C !important;outline-offset:2px !important}
:root body form.kform.kform--dark button[type=submit]{background:#fff !important;border-color:#fff !important;color:var(--kf-ink) !important}
:root body form.kform.kform--dark button[type=submit]:hover{background:#F4F0EA !important;border-color:#F4F0EA !important}
:root body form.kform.kform--dark button[type=submit]:focus-visible{outline-color:#FF9A3C !important}
:root body form.kform.kform--dark :is(input,select,textarea)[aria-invalid="true"]{border-color:#FF9A3C !important;background-color:rgba(255,154,60,.08) !important}
:root body form.kform.kform--dark .kf-msg{color:#FFC59A !important}

/* compact inline row (guide boxes): fields stack on phones, sit in one row on wide screens */
@media (min-width:900px){
  :root body form.kform .kf-inline{display:grid;grid-template-columns:1fr 1fr auto;gap:0 12px;align-items:start}
  :root body form.kform .kf-inline>button[type=submit]{width:auto !important;margin-top:26px !important;white-space:nowrap}
}

/* context: guide boxes on platform and solution pages, home closing band, industry/compare cards */
:root body form.kform.leadbox .lead2-stack{margin-top:12px}
:root body form.kform.leadbox button[type=submit]{margin-top:2px !important}
:root body .close-r form.kform{margin-top:18px}
:root body .close-r form.kform .kf-row{grid-template-columns:1fr}
:root body .close-r form.kform .kf-field{margin-bottom:12px !important}