/* Omni Home — subcontractor signing pages */
:root{
  --ink:#12161A; --ink-soft:#4B5560; --paper:#FBFAF7; --surface:#EEF3F7; --surface-2:#E2EAF1;
  --card:#FFFFFF; --blue:#1C86E0; --on-blue:#FFFFFF; --line:rgba(18,22,26,.12); --line-strong:rgba(18,22,26,.24);
  --danger:#C2362B; --ok:#1E7F4F; --ok-bg:#E6F4EC; --warn:#7A5300;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#F2F4F6; --ink-soft:#AEB8C2; --paper:#0E1113; --surface:#171C21; --surface-2:#1F262C;
    --card:#14191D; --blue:#5CC2FF; --on-blue:#0E1113; --line:rgba(255,255,255,.14); --line-strong:rgba(255,255,255,.28);
    --danger:#FF8A80; --ok:#6FD69C; --ok-bg:#12261B; --warn:#F2C66D;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ink:#F2F4F6; --ink-soft:#AEB8C2; --paper:#0E1113; --surface:#171C21; --surface-2:#1F262C;
  --card:#14191D; --blue:#5CC2FF; --on-blue:#0E1113; --line:rgba(255,255,255,.14); --line-strong:rgba(255,255,255,.28);
  --danger:#FF8A80; --ok:#6FD69C; --ok-bg:#12261B; --warn:#F2C66D;
  color-scheme:dark;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:'Archivo',system-ui,-apple-system,'Segoe UI',Arial,sans-serif; -webkit-font-smoothing:antialiased; line-height:1.55;}
a{color:var(--blue);}
img{max-width:100%; display:block;}
h1,h2,h3{font-weight:800; letter-spacing:-0.01em; text-wrap:balance; margin:0; line-height:1.15;}
.wrap{max-width:820px; margin-inline:auto; padding-inline:16px;}
@media (min-width:640px){ .wrap{padding-inline:24px;} }

header.site{border-bottom:1px solid var(--line); background:var(--paper);}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:14px;}
.brand img{height:48px; width:auto;}
.brand .logo-dark{display:none;}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .brand .logo-light{display:none;}
  :root:not([data-theme="light"]) .brand .logo-dark{display:block;}
}
:root[data-theme="dark"] .brand .logo-light{display:none;}
:root[data-theme="dark"] .brand .logo-dark{display:block;}
header.site .call{font-weight:700; font-size:14px; text-decoration:none; color:var(--ink); white-space:nowrap;}

.hero{padding-block:36px 8px;}
.eyebrow{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); margin-bottom:10px;}
.hero h1{font-size:clamp(28px,5vw,40px);}
.lede{font-size:17px; color:var(--ink-soft); margin:14px 0 0; max-width:62ch;}

.steps{list-style:none; padding:0; margin:24px 0 0; display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); counter-reset:s;}
.steps li{counter-increment:s; background:var(--surface); border-radius:12px; padding:12px 14px; font-size:14px; font-weight:600;}
.steps li::before{content:counter(s); display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--blue); color:var(--on-blue); font-size:12px; font-weight:800; margin-right:8px;}
.have{margin-top:14px; font-size:14px; color:var(--ink-soft);}

section.block{margin-top:36px;}
section.block > h2{font-size:22px; margin-bottom:6px;}
section.block > .sub{color:var(--ink-soft); font-size:15px; margin:0 0 16px;}

/* Agreement text */
.agreement{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px 18px;}
@media (min-width:640px){ .agreement{padding:30px 34px;} }
.agreement h3{font-size:17px; margin:26px 0 8px;}
.agreement h3:first-child{margin-top:0;}
.agreement p, .agreement li{font-size:15px;}
.agreement p{margin:0 0 10px;}
.agreement ul, .agreement ol{margin:0 0 10px; padding-left:22px;}
.agreement li{margin-bottom:6px;}
.agreement .meta{font-size:13px; color:var(--ink-soft); margin-bottom:18px;}
.print-link{background:none; border:none; padding:0; font:inherit; color:var(--blue); font-weight:700; cursor:pointer; font-size:14px;}

/* Form */
fieldset{border:1px solid var(--line); border-radius:16px; padding:20px 16px 8px; margin:0 0 18px; background:var(--card); min-width:0;}
@media (min-width:640px){ fieldset{padding:24px 24px 12px;} }
legend{font-weight:800; font-size:17px; padding:0 8px; margin-left:-8px;}
.fs-note{font-size:14px; color:var(--ink-soft); margin:2px 0 16px;}
.grid{display:grid; gap:0 16px; grid-template-columns:1fr;}
@media (min-width:640px){ .grid.two{grid-template-columns:1fr 1fr;} }
.field{margin-bottom:16px; min-width:0;}
.field > label, .label{display:block; font-weight:700; font-size:14px; margin-bottom:6px;}
.req{color:var(--danger); margin-left:2px;}
.hint{display:block; font-size:13px; color:var(--ink-soft); font-weight:500; margin-top:4px;}
input[type=text], input[type=email], input[type=tel], input[type=date], input[type=number], input[type=url], select, textarea{
  width:100%; font:inherit; font-size:16px; color:var(--ink); background:var(--paper);
  border:1.5px solid var(--line-strong); border-radius:10px; padding:11px 12px; min-height:46px;
}
textarea{min-height:96px; resize:vertical;}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--blue); box-shadow:0 0 0 3px color-mix(in srgb, var(--blue) 22%, transparent);}
input[type=file]{width:100%; font-size:14px; padding:10px; border:1.5px dashed var(--line-strong); border-radius:10px; background:var(--surface); color:var(--ink);}
.checks{display:grid; gap:8px; grid-template-columns:1fr;}
@media (min-width:560px){ .checks.cols{grid-template-columns:1fr 1fr;} }
.check{display:flex; gap:10px; align-items:flex-start; font-size:15px; cursor:pointer;}
.check input{width:20px; height:20px; margin:2px 0 0; flex:none; accent-color:var(--blue);}
.ack{padding:12px 14px; border-radius:10px; background:var(--surface); margin-bottom:10px;}
.radio-row{display:grid; gap:8px; margin-bottom:12px;}
.cond{display:none; margin-top:4px;}
.cond.show{display:block;}
.error-text{color:var(--danger); font-size:13px; font-weight:600; margin-top:6px; display:none;}
.field.invalid .error-text, .error-text.show{display:block;}
.field.invalid input, .field.invalid select, .field.invalid textarea{border-color:var(--danger);}

/* Signature */
.sig-box{position:relative; border:1.5px solid var(--line-strong); border-radius:12px; background:#FFFFFF; height:170px; touch-action:none;}
.sig-box canvas{width:100%; height:100%; display:block; border-radius:12px; cursor:crosshair; touch-action:none;}
.sig-box .baseline{position:absolute; left:18px; right:18px; bottom:42px; border-bottom:1px solid #C9D2DA; pointer-events:none;}
.sig-box .x{position:absolute; left:18px; bottom:46px; font-size:20px; color:#9AA6B1; pointer-events:none; font-weight:700;}
.sig-box .ph{position:absolute; inset:0; display:grid; place-items:center; color:#9AA6B1; font-size:14px; pointer-events:none;}
.sig-tools{display:flex; justify-content:space-between; align-items:center; margin-top:6px; font-size:13px; color:var(--ink-soft);}
.linkbtn{background:none; border:none; color:var(--blue); font:inherit; font-weight:700; cursor:pointer; padding:6px 0;}

.submit-row{margin:8px 0 60px;}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--blue); color:var(--on-blue); font:inherit; font-weight:800; font-size:16px; padding:15px 28px; border-radius:999px; border:none; cursor:pointer; text-decoration:none; min-height:52px;}
.btn.block{width:100%;}
.btn.ghost{background:transparent; color:var(--blue); border:1.5px solid var(--blue);}
.btn[disabled]{opacity:.6; cursor:progress;}
.form-error{display:none; background:color-mix(in srgb, var(--danger) 12%, transparent); color:var(--danger); border-radius:10px; padding:12px 14px; font-weight:600; font-size:14px; margin-bottom:12px;}
.form-error.show{display:block;}
.fine{font-size:13px; color:var(--ink-soft); margin-top:12px;}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

/* Done */
.done{display:none; background:var(--ok-bg); border:1px solid color-mix(in srgb, var(--ok) 40%, transparent); border-radius:16px; padding:24px 20px; margin:30px 0 60px;}
.done.show{display:block;}
.done h2{color:var(--ok); font-size:24px; margin-bottom:8px;}
.done p{margin:0 0 14px;}
.done .actions{display:flex; gap:10px; flex-wrap:wrap;}

/* Signed record (print + after submit) */
.record{display:none; margin-top:20px;}
.record.show{display:block;}
.record table{width:100%; border-collapse:collapse; font-size:14px;}
.record th, .record td{text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top;}
.record th{width:38%; color:var(--ink-soft); font-weight:600;}
.record img.sig{height:80px; width:auto; background:#fff; border:1px solid var(--line); border-radius:8px;}

footer.site{border-top:1px solid var(--line); padding-block:24px; font-size:13px; color:var(--ink-soft);}
footer.site .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}

@media print{
  :root{--ink:#000; --ink-soft:#333; --paper:#fff; --card:#fff; --surface:#fff; --line:#bbb;}
  body{background:#fff; color:#000;}
  header.site .call, .no-print, form, .steps, .have, .done .actions, footer.site{display:none !important;}
  .agreement{border:none; padding:0;}
  .record.show{display:block !important; break-inside:avoid;}
  .done{background:#fff; border:none; padding:0; margin:12px 0;}
  a{color:#000;}
}