/* JIL.ai -- holder election portal. Form controls and the printable
   execution copy. Loaded only by election.html, so none of this weighs on
   the marketing pages.
   Property of JIL Sovereign Holdings, LLC (WY). Author: Jeffrey Mendonca (TX). */

/* ---- fieldsets ---- */
.elect .fs{
  border:1px solid var(--line-2);border-radius:14px;background:var(--deep-2);
  padding:26px 26px 28px;margin:0 0 20px;min-width:0
}
.elect legend{
  font-family:var(--fd);font-size:22px;color:var(--ice);
  display:flex;align-items:center;gap:11px;padding:0 10px;margin-inline-start:-10px
}
.elect legend .n{
  font-family:var(--fm);font-size:12px;font-weight:600;color:var(--void);
  background:linear-gradient(180deg,var(--gold-lit),var(--gold));
  width:24px;height:24px;border-radius:6px;display:grid;place-items:center
}
.fs-lede{font-size:14.5px;color:var(--mist);margin:10px 0 22px;max-width:66ch}

/* ---- fields ---- */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
@media(max-width:640px){.grid2,.grid3{grid-template-columns:1fr}}

.fld{display:block;min-width:0}
.fld + .fld{margin-top:18px}
.grid2 .fld + .fld,.grid3 .fld + .fld{margin-top:0}
.lab{
  display:block;font-size:12px;font-weight:600;letter-spacing:.11em;
  text-transform:uppercase;color:var(--dim);margin-bottom:7px
}
.lab .req{color:var(--gold-lit);font-weight:600}
.elect input[type=text],.elect input[type=email],.elect input[type=tel],.elect textarea{
  width:100%;background:var(--void);color:var(--ice);
  border:1px solid var(--line-2);border-radius:8px;
  padding:12px 13px;font-family:var(--fb);font-size:15px;line-height:1.5;
  transition:border-color .18s,box-shadow .18s
}
.elect input.mono{font-family:var(--fm);font-size:14px;letter-spacing:.01em}
.elect textarea{resize:vertical;min-height:76px}
.elect input[type=text]::placeholder,.elect input[type=email]::placeholder,.elect input[type=tel]::placeholder,.elect textarea::placeholder{color:var(--dim);opacity:.75}
.elect input[type=text]:focus,.elect input[type=email]:focus,.elect input[type=tel]:focus,.elect textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-glow)
}
.elect input.ro{color:var(--mist);background:var(--deep);cursor:default}
.elect .miss{border-color:#E2564D;box-shadow:0 0 0 3px rgba(226,86,77,.16)}
.hint{display:block;font-size:13px;color:var(--dim);margin-top:7px;line-height:1.5}
.hint.center{text-align:center}
.lnk{color:var(--gold-lit);border-bottom:1px solid var(--line);transition:border-color .18s}
.lnk:hover{border-bottom-color:var(--gold-lit)}
.btn.sm{font-size:13.5px;padding:9px 16px}

/* ---- election options ---- */
.opt{
  display:flex;gap:14px;align-items:flex-start;cursor:pointer;
  border:1px solid var(--line-2);border-radius:12px;background:var(--deep);
  padding:18px 20px;margin-bottom:12px;transition:border-color .18s,background .18s
}
.opt:hover{border-color:var(--line)}
.opt:has(input:checked){border-color:var(--gold);background:rgba(212,175,55,.06)}
.opt:has(input:focus-visible){box-shadow:0 0 0 3px var(--gold-glow)}
.opt input[type=radio]{
  appearance:none;-webkit-appearance:none;flex:0 0 auto;
  width:19px;height:19px;margin:3px 0 0;border-radius:50%;
  border:2px solid var(--dim);background:var(--void);cursor:pointer;transition:border-color .18s
}
.opt input[type=radio]:checked{border-color:var(--gold);box-shadow:inset 0 0 0 4px var(--gold)}
.opt-body{display:block;min-width:0}
.opt-t{display:block;font-weight:600;font-size:15.5px;color:var(--ice);margin-bottom:5px}
.opt-d{display:block;font-size:14px;color:var(--mist);line-height:1.65}

/* ---- acknowledgments ---- */
.ack{
  display:flex;gap:13px;align-items:flex-start;cursor:pointer;
  font-size:14px;line-height:1.65;color:var(--mist);
  padding:13px 0;border-top:1px solid var(--line-2)
}
.ack:first-of-type{border-top:0}
.ack b{color:var(--ice)}
.ack input[type=checkbox]{
  appearance:none;-webkit-appearance:none;flex:0 0 auto;
  width:19px;height:19px;margin:2px 0 0;border-radius:5px;
  border:2px solid var(--dim);background:var(--void);cursor:pointer;
  transition:border-color .18s,background .18s
}
.ack input[type=checkbox]:checked{
  border-color:var(--mint);background:var(--mint);
  /* checkmark, drawn rather than shipped as an image */
  background-image:linear-gradient(45deg,transparent 44%,var(--void) 44%,var(--void) 56%,transparent 56%),
                   linear-gradient(-45deg,transparent 44%,var(--void) 44%,var(--void) 56%,transparent 56%);
  background-size:11px 3px,7px 3px;background-position:6px 9px,2.5px 8px;background-repeat:no-repeat
}
.ack input[type=checkbox]:focus-visible{outline:2px solid var(--mint);outline-offset:2px}

/* ---- submit ---- */
.btn.wide{width:100%;justify-content:center;margin-top:8px}
.btn:disabled{
  background:var(--deep-2);color:var(--dim);border:1px solid var(--line-2);
  box-shadow:none;cursor:not-allowed
}
.btn:disabled:hover{transform:none}
.err{
  color:#F0A19A;background:rgba(226,86,77,.09);border:1px solid rgba(226,86,77,.32);
  border-inline-start:3px solid #E2564D;border-radius:10px;
  padding:14px 16px;font-size:14.5px;margin:0 0 16px
}

/* ---- execution copy ---- */
.exec-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 26px}
.doc{
  border:1px solid var(--line);border-radius:14px;background:var(--deep-2);
  padding:38px 40px;font-size:15px;line-height:1.7;color:var(--mist)
}
@media(max-width:640px){.doc{padding:26px 22px}}
.doc h2{font-family:var(--fd);font-size:27px;color:var(--ice);margin:0 0 4px;line-height:1.15}
.doc .doc-sub{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lit);margin:0 0 26px}
.doc h3{
  font-family:var(--fb);font-size:12px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dim);
  margin:30px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line-2)
}
.doc dl{display:grid;grid-template-columns:minmax(0,15em) minmax(0,1fr);gap:9px 22px;margin:0}
@media(max-width:560px){.doc dl{grid-template-columns:1fr;gap:2px 0}.doc dd{margin-bottom:12px}}
.doc dt{font-size:13px;color:var(--dim)}
.doc dd{margin:0;color:var(--ice);overflow-wrap:anywhere}
.doc .elected{
  border:1px solid var(--line);border-inline-start:3px solid var(--gold);
  background:rgba(212,175,55,.05);border-radius:10px;padding:16px 18px
}
.doc .elected b{display:block;color:var(--ice);font-size:16px;margin-bottom:6px}
.doc ol{margin:0;padding-inline-start:20px}
.doc ol li{margin-bottom:11px}
.doc ol li b{color:var(--ice)}
.doc .sig{
  display:grid;grid-template-columns:1fr 1fr;gap:26px;
  margin-top:26px;padding-top:22px;border-top:1px solid var(--line-2)
}
@media(max-width:560px){.doc .sig{grid-template-columns:1fr}}
.doc .sig .v{
  font-family:var(--fd);font-size:23px;color:var(--ice);
  border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:7px
}
.doc .sig .k{font-size:12px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}
.doc .foot{margin-top:26px;padding-top:18px;border-top:1px solid var(--line-2);font-size:13px;color:var(--dim)}

/* ---- print: the execution copy only, on paper, in ink ---- */
@media print{
  .no-print,header,footer,.hero,#election-form,.jil-lang,
  [id^=debbie],[class^=debbie],[class*=" debbie"]{display:none !important}
  html,body{background:#fff !important;color:#000 !important}
  .band{padding:0 !important;border:0 !important}
  .wrap{max-width:none !important;padding:0 !important}
  .doc{
    border:0 !important;border-radius:0 !important;background:#fff !important;
    color:#000 !important;padding:0 !important;font-size:11.5pt;line-height:1.55
  }
  .doc h2,.doc dd,.doc .sig .v,.doc ol li b,.doc .elected b{color:#000 !important}
  .doc .doc-sub{color:#444 !important}
  .doc h3{color:#000 !important;border-bottom:1px solid #999 !important}
  .doc dt,.doc .sig .k,.doc .foot{color:#444 !important}
  .doc .elected{background:#f4f4f4 !important;border:1px solid #999 !important;border-inline-start:3px solid #000 !important}
  .doc h3,.doc .sig{break-inside:avoid;page-break-inside:avoid}
}

/* Section 3 — the Release and Settlement Agreement text. Set narrower and
   quieter than the form fields around it: it is a document to read, not a
   control to operate. Scrolls on its own so six clauses cannot push the
   signature block off the screen, but stays fully printable. */
.legal-terms{
  max-height:340px;overflow-y:auto;
  background:rgba(0,0,0,.16);
  border:1px solid var(--line,#243046);border-radius:10px;
  padding:18px 20px;margin-top:6px;
  font-size:14px;line-height:1.62;
}
.legal-terms h4{
  margin:18px 0 6px;font-size:13px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;
  color:var(--ice,#cfe3ff);
}
.legal-terms h4:first-child{margin-top:0}
.legal-terms p{margin:0 0 10px}
.legal-terms .fine{font-size:13px;color:var(--dim,#9fb0c9)}
@media print{.legal-terms{max-height:none;overflow:visible;border-color:#999}}

/* Bridges the notice tile and the first fieldset. Sits at the page's reading
   width, quieter than a field label but not as faint as a hint, and carries
   the vertical rhythm that was previously an empty gap. */
.page-lede{
  margin:18px 2px 22px;
  font-size:15px;line-height:1.66;
  color:var(--dim,#9fb0c9);
}
.page-lede b{color:var(--ice,#cfe3ff);font-weight:700}
.page-lede br{content:"";display:block;margin-top:9px}
