/* "Records office" theme (2026-10-17). Loaded last on every page; overrides the Direction B tokens.
   An independent private service's look: navy ink, ivory paper, serif headings, plain sans reading text.
   Deliberately no seals, flags or government styling. */
:root {
  --film: #F5F4EF; --paper: #FAFAF7; --panel: #FFFFFF; --plat: #F3F2EC;
  --ink: #1C2B39; --body: #34404B; --muted: #4D5A66;
  --link: #1E4E79; --link-hover: #123553;
  --sage: #6B7682; --rule-soft: #C9CDD2; --grid: #DDE0E3;
  --rule: 1px solid #B9BEC4;
  --wide: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
body { background: var(--film); color: var(--ink); font-family: var(--serif); font-size: 17px; line-height: 1.6; }
h1, h2, .wordmark, .or-plan-name { font-family: var(--display) !important; font-stretch: 100% !important; letter-spacing: 0 !important; }
h1 { font-weight: 700; }
h2 { font-weight: 700; }
h3, h4, button, .btn, nav, label, legend, th { font-family: var(--wide); font-stretch: 100% !important; letter-spacing: 0; }
table, .num, td { font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }

/* header + independence notice */
.or-indep { background: var(--ink); color: #E9ECEF; font: 13px/1.45 var(--wide); }
.or-indep .or-indep-in { max-width: 1280px; margin: 0 auto; padding: 8px 24px; }
.or-indep a { color: #E9ECEF; }
.site-header { background: #FFFFFF !important; border-bottom: 1px solid var(--rule-soft) !important; }
.site-header nav a, .main-nav a { color: var(--ink); font-weight: 500; text-decoration: none; }
.site-header nav a[aria-current="page"], .main-nav a[aria-current="page"] { border-bottom: 2px solid var(--ink); }
.tagline { color: var(--muted) !important; font-family: var(--wide) !important; font-style: normal !important; }

/* buttons, forms, panels */
.btn, .pm-btn, button.btn { background: var(--ink); color: #FFFFFF; border-radius: 0; font-weight: 600; }
.btn-ghost, .pm-btn-2 { background: #FFFFFF !important; color: var(--ink) !important; border: 1px solid var(--ink) !important; }
input[type=text], input[type=email], input[type=tel], input[type=search], select, textarea { border: 1px solid #6B7682; background: #FFFFFF; border-radius: 0; font-family: var(--wide); }
.card, .pm-card, .sheet, section.sheet { border-color: var(--rule-soft); }
.pm-card { border: 1px solid var(--rule-soft); border-top: 4px solid var(--ink); }
.pm-report-card { border: 1px dashed #6B7682; background: var(--film); }
.pm-disclosure { border-left: 0; background: var(--film); padding: 12px 14px; }
th { color: var(--muted); }
code, .mono, .pid { font-family: var(--mono); }

/* footer */
.site-footer { background: var(--ink); color: #DDE2E7; }
.site-footer a { color: #DDE2E7; }

/* v2: one mark and name everywhere (homepage, state/county pages, landing pages) */
.logo .mark, .logo > svg, .site-header .logo svg { display: none !important; }
.logo::before { content: ""; flex: none; width: 40px; height: 40px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='1' y='1' width='38' height='38' fill='%231C2B39'/%3E%3Cpath d='M11 12h18M11 18h18M11 24h12' stroke='%23F5F4EF' stroke-width='2.4' fill='none'/%3E%3Crect x='25' y='22' width='5' height='5' fill='%23B5832F'/%3E%3C/svg%3E") no-repeat center / contain; }
.logo .wordmark { font-size: 0 !important; letter-spacing: 0 !important; }
.logo .wordmark::after { content: "OnlineRecords.US"; font: 700 22px/1.1 var(--display); color: var(--ink); text-transform: none; }
.logo .tagline { font-size: 0 !important; }
.logo .tagline::after { content: "Deeds, taxes and property records in one report \00B7  Independent service"; font: 400 12px/1.3 var(--wide); color: var(--muted); }
.logo .wordmark::before, .logo .logo-text::before { display: none !important; }
h1::after, h2::after { background-image: none !important; }

/* v3: one nav and one footer on every page */
.site-header .row, .site-header > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 32px; }
.main-nav[data-or-nav] { display: flex; flex-wrap: wrap; gap: 2px 20px; font: 500 15px/1.3 var(--wide); }
.main-nav[data-or-nav] a { color: var(--ink); text-decoration: none; padding: 10px 0; border-bottom: 2px solid transparent; }
.main-nav[data-or-nav] a:hover { border-bottom-color: var(--rule-soft); }
.main-nav[data-or-nav] a[aria-current="page"] { border-bottom-color: var(--ink); }
.main-nav[data-or-nav] a[href="/premium/#pm-signin"] { color: var(--link); }
@media (max-width: 720px) { .main-nav[data-or-nav] { gap: 0 16px; font-size: 14px; } }
.site-footer:has(.ft-grid) { background: var(--ink); color: #DDE2E7; margin-top: 48px; }
.site-footer .ft-grid { max-width: 1280px; margin: 0 auto; padding: 40px 24px; display: grid; grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr)); gap: 28px 32px; }
@media (max-width: 960px) { .site-footer .ft-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .site-footer .ft-brand { grid-column: 1 / -1; } }
.site-footer .ft-brand p { margin: 0 0 10px; font-size: 13px; line-height: 1.55; color: #C9D0D7; }
.site-footer .ft-name { font: 700 20px/1.2 var(--display) !important; color: #FFFFFF !important; }
.site-footer .ft-col { display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.site-footer .ft-h { margin: 0 0 4px; font-weight: 600; color: #FFFFFF; font-size: 13px; }
.site-footer .ft-col a { color: #DDE2E7; text-decoration: none; } .site-footer .ft-col a:hover { text-decoration: underline; }

/* v4: categorized menu (Records / Searches / Membership / Learn) as accessible <details> dropdowns */
.main-nav[data-or-nav="4"] { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font: 500 15px/1.3 var(--wide); }
.main-nav[data-or-nav="4"] > a, .main-nav .nav-grp > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; color: var(--ink); text-decoration: none; cursor: pointer; border-bottom: 2px solid transparent; }
.main-nav .nav-grp { position: relative; }
.main-nav .nav-grp > summary { list-style: none; }
.main-nav .nav-grp > summary::-webkit-details-marker { display: none; }
.main-nav .nav-grp > summary::after { content: ""; width: 7px; height: 7px; margin-left: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.main-nav .nav-grp[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.main-nav .nav-grp.is-here > summary, .main-nav[data-or-nav="4"] > a[aria-current="page"] { border-bottom-color: var(--ink); }
.main-nav .nav-grp > summary:hover, .main-nav[data-or-nav="4"] > a:hover { background: var(--film); }
.main-nav .nav-menu { position: absolute; top: 100%; left: 0; z-index: 30; min-width: 230px; display: flex; flex-direction: column; background: #FFFFFF; border: 1px solid var(--rule-soft); border-top: 3px solid var(--ink); padding: 6px 0; }
.main-nav .nav-menu a { padding: 10px 16px; min-height: 44px; display: flex; align-items: center; color: var(--ink); text-decoration: none; white-space: nowrap; }
.main-nav .nav-menu a:hover, .main-nav .nav-menu a:focus-visible { background: var(--film); }
.main-nav .nav-menu a[aria-current="page"] { font-weight: 600; box-shadow: inset 3px 0 0 var(--ink); }
.main-nav .nav-signin { color: var(--link) !important; font-weight: 600; margin-left: 4px; }
@media (max-width: 760px) {
  .main-nav[data-or-nav="4"] { width: 100%; gap: 0; }
  .main-nav[data-or-nav="4"] > a, .main-nav .nav-grp > summary { padding: 0 10px; font-size: 14px; }
  .main-nav[data-or-nav="4"] { position: relative; }
  .main-nav .nav-grp { position: static; }
  .main-nav .nav-menu { left: 0; right: 0; min-width: 0; box-shadow: 0 8px 16px rgba(28,43,57,.12); }
}
.main-nav .nav-menu a { border-bottom: 0 !important; padding: 8px 16px !important; }

/* v5 (OR simple 01): flat nav */
.main-nav[data-or-nav="5"] { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 22px; font: 500 15px/1.3 var(--wide); }
.main-nav[data-or-nav="5"] a { color: var(--ink); text-decoration: none; padding: 10px 0; border-bottom: 2px solid transparent; }
.main-nav[data-or-nav="5"] a[aria-current="page"] { border-bottom-color: var(--ink); }
.main-nav[data-or-nav="5"] a.nav-signin { color: var(--link); font-weight: 600; }
@media (max-width: 600px) { .main-nav[data-or-nav="5"] { gap: 0 16px; font-size: 14px; } }
/* fix-1017 */
.site-header .main-nav[data-or-nav] a, .site-header .main-nav[data-or-nav] a:hover { color: var(--ink); }
.site-header .main-nav[data-or-nav] a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); }
.site-header .main-nav[data-or-nav] a.nav-signin { color: var(--link); }
/* logo-1017: round house-key badge */
.logo::before { background: var(--or-logo, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19.5' fill='%231C2B39'/%3E%3Ccircle cx='20' cy='20' r='16.6' fill='none' stroke='%23E3E9F0' stroke-opacity='.45' stroke-width='.8'/%3E%3Cg transform='translate%280 2.5%29'%3E%3Cpath d='M8.5 17.2 15 11l6.5 6.2V24h-13z' fill='none' stroke='%23fff' stroke-width='2' stroke-linejoin='round'/%3E%3Crect x='13.2' y='18.6' width='3.6' height='3.6' fill='%23C8372D'/%3E%3Cpath d='M21.5 21h11' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M27.6 21v3.6M31.2 21v2.6' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E")) center / contain no-repeat !important; border-radius: 50%; }
