/*
Theme Name: EntityFinder
Theme URI: https://entityfinder.us/
Author: TrueScope LLC
Description: Classic theme for entityfinder.us. Built on US Web Design System
  tokens so the site reads in the same register as the government portals it
  describes, with a distinct palette and a seal-forward page header. Deliberately
  not the USWDS default theme, which is what every competitor ships.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
License: Proprietary
Text Domain: entityfinder
*/

/* ==========================================================================
   Tokens. Values are USWDS system tokens; the pairing is ours.
   ========================================================================== */
:root{
  --navy:      #112F4E;   /* blue-80v   masthead, sidebar rules */
  --primary:   #0B4778;   /* blue-70v   buttons, links */
  --gold:      #FFBE2E;   /* gold-20v   the CTA, and the mark */
  --cool:      #07648D;   /* blue-cool-60v  data tags */
  --cool-wash: #E1F3F8;
  --ground:    #F6F6F2;   /* gray-warm-3 */
  --surface:   #FFFFFF;
  --rule:      #D8D8CF;   /* gray-warm-10 */
  --rule-soft: #ECECE5;
  --ink:       #1B1B1B;
  --ink-soft:  #3D4551;   /* base-dark */
  --ink-faint: #71767A;
  --nav-link:  #A9C4DE;
  --good:      #1A7F37;   /* green-cool-50v */

  --measure: 720px;
  --sidebar: 244px;
  --radius-card: 5px;
  --radius-ctl: 3px;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:"Public Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

/* Identifiers set in mono with tabular figures. Every state page carries file
   numbers, dates, counts and fees, and nothing in this category treats them as
   anything but body copy. */
.ef-num,.ef-mono,table td.num,time{
  font-family:"Roboto Mono","Courier New",monospace;
  font-variant-numeric:tabular-nums;
  font-size:.94em;
}

a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:3px solid var(--gold);outline-offset:2px
}

/* ==========================================================================
   Masthead
   ========================================================================== */
.ef-masthead{background:var(--navy);color:#fff}
.ef-masthead-inner{
  max-width:1040px;margin:0 auto;padding:12px 20px;
  display:flex;align-items:center;gap:14px;
}
.ef-brand{
  display:flex;align-items:center;gap:10px;
  color:#fff;text-decoration:none;font-weight:700;font-size:17px;
  letter-spacing:-.01em;
}
.ef-brand:hover{color:#fff}
.ef-brand img{width:36px;height:36px;display:block}
.ef-brand .tld{color:var(--nav-link);font-weight:600}
.ef-nav{display:flex;gap:20px;margin-left:auto;font-size:14px;font-weight:600}
.ef-nav a{color:var(--nav-link);text-decoration:none}
.ef-nav a:hover{color:#fff;text-decoration:underline}
.ef-cta{
  background:var(--gold);color:var(--ink);text-decoration:none;
  font-weight:700;font-size:13.5px;padding:9px 16px;
  border-radius:var(--radius-ctl);white-space:nowrap;
}
.ef-cta:hover{background:#e5a000;color:var(--ink)}

/* Hamburger. Hidden above the breakpoint, where the real nav is showing.
   44px square so it clears the tap-target minimum: the bars are 18px and the
   rest is padding, which is the usual reason these end up hard to hit. */
.ef-burger{
  display:none;
  width:44px;height:44px;padding:0;margin-left:4px;
  align-items:center;justify-content:center;
  background:transparent;border:1px solid rgba(255,255,255,.35);
  border-radius:var(--radius-ctl);cursor:pointer;
}
.ef-burger:hover{border-color:rgba(255,255,255,.7)}
.ef-burger:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* One element, three bars: the middle is the span, the outer two are its
   pseudo-elements. */
.ef-burger__bars,
.ef-burger__bars::before,
.ef-burger__bars::after{
  display:block;width:18px;height:2px;background:#fff;border-radius:2px;
  transition:transform .18s ease,opacity .18s ease;
}
.ef-burger__bars{position:relative}
.ef-burger__bars::before,
.ef-burger__bars::after{content:"";position:absolute;left:0}
.ef-burger__bars::before{top:-6px}
.ef-burger__bars::after{top:6px}

/* Open state reads as a close control rather than staying an ambiguous
   hamburger, which is the whole point of the animation. */
.ef-burger[aria-expanded="true"] .ef-burger__bars{background:transparent}
.ef-burger[aria-expanded="true"] .ef-burger__bars::before{transform:translateY(6px) rotate(45deg)}
.ef-burger[aria-expanded="true"] .ef-burger__bars::after{transform:translateY(-6px) rotate(-45deg)}

/* The panel is never shown above the breakpoint, whatever the button's state,
   so a stale aria-expanded cannot leak a block under the desktop bar. */
.ef-menu{display:none}
.ef-menu[hidden]{display:none}

/* ==========================================================================
   Layout
   ========================================================================== */
.ef-wrap{max-width:1040px;margin:0 auto;padding:26px 20px 64px}
.ef-cols{display:grid;grid-template-columns:1fr var(--sidebar);gap:28px;
  align-items:start}
.ef-main{min-width:0;max-width:var(--measure)}

.ef-crumb{font-size:13px;margin-bottom:14px;color:var(--ink-soft)}
.ef-crumb a{color:var(--primary)}

/* Seal-forward page header */
.ef-pagehead{display:flex;gap:18px;align-items:flex-start;margin-bottom:6px}
.ef-pagehead .ef-seal{width:68px;height:68px;flex:none}
.ef-eyebrow{
  font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--primary);margin:0 0 6px;
}
.ef-updated{font-size:13px;color:var(--ink-soft);margin:0 0 18px}

h1{font-size:32px;line-height:1.22;font-weight:700;letter-spacing:-.015em;
  margin:0 0 10px;text-wrap:balance}
h2{font-size:23px;line-height:1.3;font-weight:700;letter-spacing:-.01em;
  margin:38px 0 12px;text-wrap:balance}
h3{font-size:18px;line-height:1.35;font-weight:700;margin:26px 0 8px}
p{margin:0 0 16px}
ul,ol{margin:0 0 18px;padding-left:22px}
li{margin-bottom:7px}
strong{font-weight:700}

/* ==========================================================================
   Components
   ========================================================================== */
.ef-hero .ef-lede{font-size:18px;color:var(--ink-soft);margin:0 0 12px}

.ef-notice{
  background:var(--surface);border:1px solid var(--rule);
  border-left:4px solid var(--cool);
  border-radius:0 var(--radius-card) var(--radius-card) 0;
  padding:16px 20px;margin:0 0 24px;
}
.ef-notice p{margin:0 0 10px;font-size:15px}
.ef-notice p:last-child{margin:0}

.ef-office{
  width:100%;border-collapse:collapse;background:var(--surface);
  border:1px solid var(--rule);border-radius:var(--radius-card);
  margin:0 0 18px;font-size:15px;
}
.ef-office th,.ef-office td{
  padding:10px 14px;text-align:left;border-bottom:1px solid var(--rule-soft);
  vertical-align:top;
}
.ef-office tr:last-child th,.ef-office tr:last-child td{border-bottom:0}
.ef-office th{font-weight:600;color:var(--ink-soft);width:34%;white-space:nowrap}
/* A portal URL is one long unbreakable token and will push the table wider
   than the screen if left alone. */
.ef-office td a,.ef-office td{overflow-wrap:anywhere;word-break:break-word}

.ef-seal-figure{margin:0 0 16px}
.ef-seal-figure img{width:96px;height:96px;display:block}

/* Any wide content scrolls inside itself; the page never scrolls sideways. */
.ef-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ef-scroll table{min-width:560px}

table:not(.ef-office){
  width:100%;border-collapse:collapse;font-size:14.5px;background:var(--surface);
  border:1px solid var(--rule);margin:0 0 18px;
}
table:not(.ef-office) th,table:not(.ef-office) td{
  padding:8px 12px;text-align:left;border-bottom:1px solid var(--rule-soft);
}
table:not(.ef-office) thead th{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--ink-faint);border-bottom:1px solid var(--rule);
  background:var(--rule-soft);
}

/* ==========================================================================
   Sidebar
   ========================================================================== */
.ef-side{font-size:14px}
.ef-card{
  background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--radius-card);padding:15px 16px;margin-bottom:16px;
}
.ef-card h2{
  font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-soft);margin:0 0 12px;padding-bottom:9px;
  border-bottom:2px solid var(--navy);
}
.ef-stat{margin-bottom:12px}
.ef-stat:last-child{margin-bottom:0}
.ef-stat b{
  display:block;font-size:10.5px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:2px;
}
.ef-stat span{font-size:16px;font-weight:700}
.ef-tag{
  display:inline-block;background:var(--cool-wash);color:var(--cool);
  font-family:"Roboto Mono",monospace;font-size:11px;font-weight:700;
  letter-spacing:.04em;padding:3px 8px;border-radius:var(--radius-ctl);
}
.ef-card a{display:block;margin-bottom:6px}

/* ==========================================================================
   Footer, carrying the affiliation disclosure in two of its three placements
   ========================================================================== */
.ef-foot-cta{
  background:var(--rule-soft);border-top:1px solid var(--rule);
  padding:26px 20px;text-align:center;
}
.ef-foot-cta p{max-width:52ch;margin:0 auto 14px;color:var(--ink-soft)}

.ef-foot{background:#F0F0EC;border-top:1px solid var(--rule);padding:28px 20px}
.ef-foot-inner{max-width:1040px;margin:0 auto;display:grid;gap:26px;
  grid-template-columns:minmax(260px,1.3fr) repeat(auto-fit,minmax(150px,1fr))}
.ef-foot h3{font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-faint);margin:0 0 10px}
.ef-foot ul{list-style:none;margin:0;padding:0;font-size:14px}
.ef-foot li{margin-bottom:6px}

.ef-disclosure{display:flex;gap:11px;align-items:flex-start}
.ef-disclosure img{width:30px;height:30px;flex:none;margin-top:2px}
.ef-disclosure p{font-size:13.5px;line-height:1.55;color:var(--ink-soft);
  margin:0;max-width:46ch}
.ef-disclosure b{color:var(--ink);display:block;margin-bottom:3px}

.ef-foot-rule{background:var(--navy);color:var(--nav-link);padding:12px 20px}
.ef-foot-rule div{max-width:1040px;margin:0 auto;font-size:12.5px;
  line-height:1.6}
.ef-foot-rule a{color:#fff}

/* Homepage head. Centred, no seal: the seal-forward header identifies a
   specific state's register, which the homepage does not have. */
.ef-home-head{text-align:center;max-width:760px;margin:0 auto 22px}
.ef-home-head h1{margin:0 0 12px;text-wrap:balance}
.ef-home-head .ef-eyebrow{margin-bottom:10px}
.ef-home-head .ef-lede{
  font-size:18px;line-height:1.6;color:var(--ink-soft);
  max-width:58ch;margin:0 auto;
}

/* Homepage trust strip: the third placement of the disclosure.
   A short row of icon-led assurances under the search box, carrying no
   figures. It answers "what does it cost, is the data real, who are you" at a
   glance; a statistics row answered none of those and read as a dashboard. */
.ef-trust{
  list-style:none;margin:0 0 30px;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:10px 28px;
}
.ef-trust li{
  display:flex;align-items:center;gap:8px;margin:0;
  font-size:14.5px;font-weight:600;color:var(--ink-soft);
}
.ef-trust svg{
  width:18px;height:18px;flex:none;color:var(--good);
}
.ef-trust .ef-trust-note{color:var(--ink-faint);font-weight:400}
.ef-trust .ef-trust-note svg{color:var(--cool)}

/* Counts as pills, following the benchmark. Only figures true of every
   search go here -- a partial number invites the reader to subtract. */
.ef-trust-pills{
  display:flex;flex-wrap:wrap;gap:10px;
  justify-content:center;margin:0 0 32px;
}
.ef-pill{
  display:inline-flex;align-items:baseline;gap:7px;
  background:var(--surface);border:1px solid var(--rule);
  border-radius:999px;padding:7px 18px;
  font-size:14px;color:var(--ink-soft);
}
.ef-pill b{
  color:var(--ink);font-weight:700;
  font-family:"Roboto Mono","Courier New",monospace;
  font-variant-numeric:tabular-nums;
}

@media (max-width:600px){
  .ef-trust{gap:9px 20px}
  .ef-trust li{font-size:14px}
  .ef-home-head{margin-bottom:18px}
  .ef-home-head .ef-lede{font-size:16.5px}
}

.screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);
  white-space:nowrap;
}

/* ==========================================================================
   Small screens. The sidebar drops below the article; nothing is hidden.
   ========================================================================== */
@media (max-width:860px){
  .ef-cols{grid-template-columns:1fr}
  .ef-side{max-width:var(--measure)}
  .ef-nav{display:none}
  .ef-burger{display:inline-flex}
  .ef-menu:not([hidden]){
    display:flex;flex-direction:column;
    border-top:1px solid rgba(255,255,255,.18);
    padding:6px 0 10px;
  }
  .ef-menu a{
    color:#fff;text-decoration:none;font-weight:600;font-size:16px;
    padding:13px 20px;
  }
  .ef-menu a:hover,
  .ef-menu a:focus{background:rgba(255,255,255,.09);text-decoration:underline}
  .ef-masthead-inner{gap:10px}
  .ef-brand{font-size:16px}
  .ef-brand img{width:32px;height:32px}
  .ef-cta{margin-left:auto}
  .ef-pagehead{gap:14px}
  .ef-pagehead .ef-seal{width:54px;height:54px}
  h1{font-size:27px}
  h2{font-size:21px}
  .ef-wrap{padding:20px 16px 52px}

  /* The office table measured 445px inside a 390px viewport and was the only
     thing making the page scroll sideways.
     Unwrapping the header cells was not enough on its own: with the default
     table-layout:auto a table sizes to its content regardless of width:100%,
     so a long portal URL still pushed it wide. table-layout:fixed makes the
     declared widths bind and forces the content to wrap inside them. */
  .ef-office{table-layout:fixed;width:100%}
  .ef-office th{white-space:normal;width:38%}
  .ef-office th,.ef-office td{padding:9px 10px;font-size:14px}

  /* The footer grid was the real cause of the sideways scroll, and it was on
     every page rather than only the state pages: minmax(260px,1.3fr) beside
     minmax(150px,1fr) declares a 410px minimum, which does not fit a 350px
     content area. The office table was a second, separate overflow on the
     state pages only, which is why fixing it moved the number without
     resolving anything. */
  .ef-foot-inner{grid-template-columns:1fr;gap:22px}
  .ef-trust{gap:10px 18px}
}

@media (prefers-reduced-motion:reduce){
  .ef-burger__bars,
  .ef-burger__bars::before,
  .ef-burger__bars::after{transition:none}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

@media print{
  .ef-masthead,.ef-side,.ef-foot-cta,.ef-cta,.ef-burger,.ef-menu{display:none}
  body{background:#fff}
}