/* ============================================================================
   proptaxfirststop.com — shared "spine" stylesheet
   Transcribed from the live index page, 2026-07-27. Drop in as-is.
   Change nothing here; put site-specific rules in a second sheet below it.
   ========================================================================== */

:root{
  --blue:#2743D0; --blue-dark:#1B2E9E; --blue-tint:#EEF1FD;
  --gray-900:#1F2430; --gray-600:#5B6472; --gray-400:#9AA3B2;
  --gray-200:#E4E7EC; --gray-100:#F4F5F7;
  --amber:#D97706; --amber-tint:#FDF3E4; --white:#FFFFFF;
  /* secondary literals, kept for parity with the spine */
  --band-border:#D5DCF7; --amber-border:#F3D9A8; --caution-text:#7C4A08;
  --flag-bg:#FFF7E6; --flag-border:#E6A700; --flag-text:#5C4300; --flag-strong:#8A6400;
  --red:#C0362C; --green:#12805C; --green-tint:#E6F5EF;
  --footer-rule:#3a3f4a;
  --shell:980px;
}

*{box-sizing:border-box;}
body{margin:0;background:var(--white);
  font-family:Helvetica,"Helvetica Neue",Arial,sans-serif;
  color:var(--gray-900);-webkit-font-smoothing:antialiased;}
::selection{background:var(--blue-tint);color:var(--blue-dark);}

/* ---------- masthead ---------- */
.masthead{background:var(--white);border-bottom:1px solid var(--gray-200);padding:26px 32px 20px;}
.masthead-inner{max-width:var(--shell);margin:0 auto;display:flex;align-items:baseline;
  justify-content:space-between;flex-wrap:wrap;gap:8px;}
.masthead h1{font-size:24px;font-weight:700;letter-spacing:-0.3px;margin:0;}
.masthead h1 .dot{color:var(--blue);}          /* the brand mark */
.masthead .eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;
  color:var(--blue);font-weight:700;margin:0 0 5px;}
.masthead .tag{font-size:12.5px;color:var(--gray-600);}
.betachip{display:inline-block;vertical-align:middle;margin-left:6px;font-size:10px;
  font-weight:700;letter-spacing:1.5px;color:var(--red);border:1px solid var(--red);
  border-radius:4px;padding:2px 6px;position:relative;top:-3px;}

/* ---------- shell + cards ---------- */
.wrap{max-width:var(--shell);margin:0 auto;padding:26px 32px 90px;}
.card{background:var(--white);border:1px solid var(--gray-200);border-radius:10px;
  padding:26px 28px;margin-bottom:20px;}
.card h2{font-size:18px;font-weight:700;margin:0 0 6px;}
.card .sub{font-size:13.5px;color:var(--gray-600);margin:0 0 18px;line-height:1.55;}

/* ---------- controls ---------- */
input[type=text],select,textarea{font-family:inherit;font-size:15px;padding:13px 15px;
  border:1px solid var(--gray-200);border-radius:8px;background:var(--white);color:var(--gray-900);}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 3px var(--blue-tint);}
button.primary{font-family:inherit;font-size:13.5px;font-weight:700;letter-spacing:.3px;
  background:var(--blue);color:var(--white);border:none;padding:13px 26px;
  border-radius:8px;cursor:pointer;transition:.15s;}
button.primary:hover{background:var(--blue-dark);}
button.primary:disabled{background:var(--gray-400);cursor:default;}
button.ghost{font-family:inherit;font-size:12.5px;font-weight:600;background:var(--white);
  border:1px solid var(--gray-200);color:var(--gray-600);padding:9px 15px;
  border-radius:8px;cursor:pointer;}
button.ghost:hover{border-color:var(--blue);color:var(--blue);}
.searchbox{display:flex;gap:10px;flex-wrap:wrap;}

/* ---------- status / helper text ---------- */
.status{font-size:13px;margin-top:10px;line-height:1.5;font-weight:500;}
.status.ok{color:var(--blue-dark);} .status.miss{color:var(--gray-600);}
.status.working{color:var(--gray-400);}
.hint{font-size:12px;color:var(--gray-400);margin-top:8px;line-height:1.5;}
.pos-note{font-size:11.5px;color:var(--gray-600);margin-top:6px;}
.pos-note a{color:var(--gray-600);}
.verify-line{font-size:11.5px;color:var(--gray-400);margin-top:16px;
  border-top:1px solid var(--gray-100);padding-top:10px;line-height:1.5;}

/* ---------- record block ---------- */
.record{background:var(--white);border:1px solid var(--gray-200);
  border-top:3px solid var(--blue);border-radius:10px;padding:24px 26px 20px;margin-top:6px;}
.record-head{display:flex;justify-content:space-between;align-items:flex-start;
  gap:14px;margin-bottom:14px;flex-wrap:wrap;}
.record-head h3{font-size:21px;font-weight:700;margin:0;}
.record-head .fips{font-size:12px;color:var(--gray-400);margin-top:3px;}
.stamp{font-size:11px;letter-spacing:1px;font-weight:700;text-transform:uppercase;
  color:var(--blue);background:var(--blue-tint);border-radius:6px;padding:6px 12px;white-space:nowrap;}

/* ---------- key/value grid ---------- */
.kv{display:grid;grid-template-columns:190px 1fr;gap:10px 16px;font-size:14px;margin:16px 0;}
.kv dt{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray-400);
  font-weight:700;align-self:start;padding-top:2px;}
.kv dd{margin:0;line-height:1.55;}
.kv a{color:var(--blue);font-weight:700;}

/* ---------- callouts ---------- */
.note-box{border-left:3px solid var(--gray-400);background:var(--gray-100);
  border-radius:0 8px 8px 0;padding:10px 14px;font-size:13px;line-height:1.55;
  margin-top:12px;color:var(--gray-600);}
.note-box.caution{border-left-color:var(--amber);background:var(--amber-tint);color:var(--caution-text);}
.flagrow{display:flex;flex-direction:column;gap:6px;}
.flagchip{display:block;background:var(--flag-bg);border:1px solid var(--flag-border);
  border-left:4px solid var(--flag-border);color:var(--flag-text);padding:6px 10px;
  border-radius:4px;font-size:13px;line-height:1.45;}
.flagchip strong{color:var(--flag-strong);letter-spacing:.02em;}
.methodology-flag{margin-top:16px;padding:13px 15px;background:var(--gray-100);
  border-radius:8px;font-size:12px;line-height:1.6;color:var(--gray-600);}
.chip{font-size:11.5px;font-weight:600;background:var(--gray-100);border:1px solid var(--gray-200);
  padding:4px 11px;border-radius:12px;color:var(--gray-600);}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:13px;}
table th{font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--gray-400);
  text-align:left;font-weight:700;padding:8px 10px;border-bottom:2px solid var(--gray-200);}
table td{padding:9px 10px;border-bottom:1px solid var(--gray-100);vertical-align:top;}
table td.num,table th.num{text-align:right;font-variant-numeric:tabular-nums;}
table tr.subject td{background:var(--blue-tint);font-weight:700;}
code{font-family:ui-monospace,Menlo,monospace;font-size:10.5px;
  background:var(--gray-100);border-radius:4px;padding:1px 5px;}

/* ---------- forms grid ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:14px 18px;}
.form-grid label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;
  color:var(--gray-400);font-weight:700;margin-bottom:6px;}
.form-grid select{width:100%;min-width:0;}

/* ---------- expand / collapse: inline disclosure ---------- */
details.browse{margin-top:16px;}
details.browse summary{font-size:12px;color:var(--gray-400);cursor:pointer;}
details.browse .row{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;}

/* ---------- expand / collapse: sticky footer disclaimer ---------- */
footer.disclaimer{position:sticky;bottom:0;background:var(--gray-900);color:var(--gray-200);
  padding:10px 32px;font-size:11.5px;line-height:1.5;max-height:45vh;overflow:auto;}
footer.disclaimer .wrap2{max-width:var(--shell);margin:0 auto;}
footer.disclaimer b{color:var(--white);}
footer.disclaimer details.dx summary{cursor:pointer;list-style:none;}
footer.disclaimer details.dx summary::-webkit-details-marker{display:none;}
footer.disclaimer .dx-more{color:var(--gray-400);text-decoration:underline;white-space:nowrap;}
footer.disclaimer details.dx[open] .dx-more{display:none;}
footer.disclaimer .dx-body{margin-top:8px;border-top:1px solid var(--footer-rule);padding-top:8px;}
footer.disclaimer .dx-body p{margin:0;font-size:11px;line-height:1.55;color:var(--gray-400);}
footer.disclaimer .dx-body b{color:var(--gray-200);}
footer.disclaimer .dx-date{color:var(--gray-400);}
footer.disclaimer .dx-close{color:var(--white);text-decoration:underline;cursor:pointer;white-space:nowrap;}

/* ---------- breakpoints (the only two) ---------- */
@media(max-width:720px){
  .form-grid{grid-template-columns:1fr 1fr;}
  .kv{grid-template-columns:140px 1fr;}
}
@media(max-width:640px){
  .uw-grid{grid-template-columns:1fr;}
}

/* ============================================================================
   REQUIRED MARKUP for the footer disclosure — copy into the page:

   <footer class="disclaimer">
     <div class="wrap2">
       <details class="dx">
         <summary><b>One-line notice.</b> Short standing text.
           <span class="dx-more">Terms &amp; disclaimer &rsaquo;</span></summary>
         <div class="dx-body">
           <p>Full terms&hellip;
             <span class="dx-date">&copy; 2026 Sitename.</span>
             <span class="dx-close"
               onclick="this.closest('details').removeAttribute('open')">Collapse &lsaquo;</span></p>
         </div>
       </details>
     </div>
   </footer>

   To open it from a link elsewhere on the page:
   <a href="#" onclick="var d=document.querySelector('footer.disclaimer details.dx');
      d.setAttribute('open',''); d.scrollIntoView({block:'end'}); return false;">Terms</a>
   ========================================================================== */