/* ===== Self-hosted webfonts (2026-08-04) ==============================
   Replaces the render-blocking cross-origin Google Fonts stylesheet, the only
   render-blocking resource on the page. Bytes fetched directly from Google on
   2026-08-04; unicode-range values are Google's own, verbatim.
   Google serves ONE variable file per family+subset and declares a separate
   @font-face per weight pointing at that same file (verified: identical md5 for
   Cormorant w400/600/700 and Jost w300-600), so a single weight RANGE per file
   is correct and does not cause synthetic bolding.
   ==================================================================== */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400 700;font-display:swap;src:url('cormorant-garamond-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400 700;font-display:swap;src:url('cormorant-garamond-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Jost';font-style:normal;font-weight:300 600;font-display:swap;src:url('jost-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Jost';font-style:normal;font-weight:300 600;font-display:swap;src:url('jost-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}


/* =============================================
   DESIGN TOKENS
   ============================================= */
:root {
  --navy:       #1a3252;
  --navy-mid:   #1a3252;
  --navy-light: #2d4f7a;
  --gold:       #c49a3c;
  --gold-dark:  #8a6a1f;   /* gold for TEXT ON LIGHT: 4.60:1 on cream */
  --gold-light: #dbb96a;
  --cream:      #f7f4ef;
  --white:      #ffffff;
  --text:       #1a1a2e;
  --text-muted: #556080;
  --border:     rgba(196,154,60,0.25);
  --shadow:     0 4px 24px rgba(13,27,46,0.12);
  --radius:     4px;
  --nav-h:      56px;
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-sans:  'Jost', system-ui, sans-serif;
  --transition: 0.22s cubic-bezier(0.4,0,0.2,1);
}

/* =============================================
   RESET & BASE
   ============================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 17px; background: var(--cream); }

body {
  font-family: var(--font-sans);
  font-weight: 400;
  background: var(--cream);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

main {
  display: flow-root;
  width: 100%;
}

/* HORIZONTAL SCROLL GUARD */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}
footer ~ iframe,
footer ~ .skiptranslate,
footer ~ :not(script):not(style) {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

/* =============================================
   HEADER
   ============================================= */
.site-header {
  background: transparent;
  padding: 28px 40px 24px;
  text-align: center;
  position: relative;
}

.header-rule {
  width: 60px;
  height: 2px;
  background: var(--gold);
  margin: 0 auto 18px;
}

.header-name {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.02em;
  line-height: 1.15;
}

.header-title {
  font-family: var(--font-sans);
  font-size: clamp(0.8rem, 1.4vw, 1rem);
  color: var(--white);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 10px;
  line-height: 1.7;
}

.header-rule-bottom {
  width: 60px;
  height: 1px;
  background: rgba(196,154,60,0.4);
  margin: 20px auto 0;
}

/* =============================================
   NAVIGATION
   ============================================= */
.nav-wrapper {
  background: #203c60;
  border-bottom: 1px solid var(--border);
}

/* Outer container: stacks both rows vertically */
.nav-inner {
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  margin: 0 auto;
}

/* Each row is its own centered flex bar */
.nav-row {
  display: flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  min-height: var(--nav-h);
  padding: 0 16px;
}

/* Thin gold divider between rows */
.nav-row + .nav-row {
  border-top: 1px solid rgba(196,154,60,0.18);
}

/* Top-level nav items */
.nav-item {
  position: relative;
}

/* Shared style for ALL top-level nav items (buttons and links) */
.nav-link,
.nav-link-ext {
  /* reset button defaults */
  appearance: none;
  -webkit-appearance: none;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;

  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  height: var(--nav-h);
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  cursor: pointer;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color var(--transition), border-color var(--transition);
}

.nav-link svg {
  width: 10px;
  height: 10px;
  fill: currentColor;
  opacity: 0.55;
  transition: transform var(--transition);
  flex-shrink: 0;
}

.nav-item:hover > .nav-link,
.nav-item:hover > .nav-link-ext,
.nav-item:focus-within > .nav-link,
.nav-item:focus-within > .nav-link-ext {
  color: var(--gold-light);
  border-bottom-color: var(--gold);
}

.nav-item:hover > .nav-link svg,
.nav-item:focus-within > .nav-link svg {
  transform: rotate(180deg);
}

/* Direct anchor hover (NDC item lives directly as <a> in nav) */
.nav-link-ext:hover {
  color: var(--gold-light);
  border-bottom-color: var(--gold);
}

/* Dropdown panels */
.dropdown,
.subdrop {
  list-style: none;
}

.dropdown {
  position: absolute;
  top: calc(var(--nav-h) - 1px);
  left: 0;
  min-width: 240px;
  /* Hardcoded fully-opaque navy - no variable that could resolve transparent */
  background-color: #152a43;
  border: 1px solid rgba(196,154,60,0.25);
  border-top: 2px solid #c49a3c;
  box-shadow: 0 16px 48px rgba(0,0,0,0.75);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
  border-radius: 0 0 var(--radius) var(--radius);
  z-index: 9999;
}

.nav-item:hover > .dropdown,
.nav-item:focus-within > .dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.dropdown a {
  display: block;
  padding: 10px 18px;
  font-size: 0.82rem;
  font-weight: 400;
  color: rgba(255,255,255,0.78);
  letter-spacing: 0.02em;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid transparent;
  transition: color var(--transition), background var(--transition), border-color var(--transition);
  line-height: 1.4;
}

.dropdown a:last-child { border-bottom: none; }

.dropdown a:hover {
  color: var(--gold-light);
  background: rgba(196,154,60,0.08);
  border-left-color: var(--gold);
}

/* Nested dropdowns */
.dropdown .has-sub {
  position: relative;
}

.dropdown .has-sub > a::after {
  content: '\203A';
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 1rem;
  opacity: 0.5;
}

/* Level-2 subdrop - overflow MUST be visible so level-3 panels aren't clipped */
.dropdown .has-sub > .subdrop {
  position: absolute;
  left: 100%;
  top: 0;
  min-width: 240px;
  overflow: visible;
  background: #0f2235 !important;
  border: 1px solid rgba(196,154,60,0.25) !important;
  border-left: 2px solid #c49a3c !important;
  box-shadow: 8px 8px 40px rgba(0,0,0,0.75);
  opacity: 0;
  visibility: hidden;
  transform: translateX(-6px);
  transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
  border-radius: var(--radius);
  z-index: 10000;
}

/* Force L2 color - overrides any other rule */
@media (min-width: 769px) {
  .dropdown .has-sub > .subdrop {
    background: #0f2235 !important;
  }
}

/* Level-3 subdrop */
.subdrop .has-sub > .subdrop {
  position: absolute;
  left: 100%;
  top: 0;
  min-width: 240px;
  overflow: visible;
  background: #060e1a !important;
  border: 1px solid rgba(196,154,60,0.25);
  border-left: 2px solid #c49a3c;
  box-shadow: 12px 12px 48px rgba(0,0,0,0.8);
  opacity: 0;
  visibility: hidden;
  transform: translateX(-6px);
  transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
  border-radius: var(--radius);
  z-index: 10001;
}

.dropdown .has-sub:hover > .subdrop,
.dropdown .has-sub:focus-within > .subdrop {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.subdrop .has-sub:hover > .subdrop,
.subdrop .has-sub:focus-within > .subdrop {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

/* Arrow indicators */
.dropdown .has-sub > a::after,
.subdrop .has-sub > a::after {
  content: "\203A";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 1rem;
  opacity: 0.5;
}

.subdrop .has-sub {
  position: relative;
}

/* Mobile toggle */
.nav-toggle {
  display: none;
  background: none;
  border: 1px solid rgba(196,154,60,0.4);
  color: var(--gold-light);
  cursor: pointer;
  padding: 8px 12px;
  border-radius: var(--radius);
  font-size: 1.2rem;
  margin: 10px auto;
}

/* =============================================
   HERO / BANNER
   ============================================= */
.hero {
  width: 100%;
  line-height: 0;
  position: relative;
}

.hero img {
  width: 100%;
  display: block;
  object-fit: cover;
  max-height: 480px;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.28);
  pointer-events: none;
}

/* Gold divider stripe */
.stripe {
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

/* =============================================
   QUICK LINKS CARDS
   ============================================= */
.quicklinks {
  max-width: 1280px;
  margin: 48px auto 0;
  padding: 0 48px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.ql-card {
  background: var(--white);
  border: 1px solid rgba(13,27,46,0.1);
  border-top: 3px solid var(--gold);
  border-radius: var(--radius);
  padding: 24px 20px;
  box-shadow: var(--shadow);
  transition: transform var(--transition), box-shadow var(--transition);
}

.ql-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 32px rgba(13,27,46,0.16);
}

.ql-card-icon {
  font-size: 1.6rem;
  margin-bottom: 12px;
  text-align: center;
}

.ql-card-title {
  font-family: var(--font-serif);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
  text-align: center;
}

.ql-card-links {
  list-style: none;
}

.ql-card-links li {
  margin-bottom: 6px;
}

.ql-card-links a {
  font-size: 0.82rem;
  color: var(--text-muted);
  display: flex;
  align-items: flex-start;
  gap: 6px;
  transition: color var(--transition);
  line-height: 1.35;
}

.ql-card-links a::before {
  content: '\203A';
  color: var(--gold);
  flex-shrink: 0;
  font-size: 1rem;
  line-height: 1.2;
}

.ql-card-links a:hover { color: var(--navy); }

/* =============================================
   SECTION SEPARATOR
   ============================================= */
.section-label {
  text-align: center;
  padding: 48px 20px 0;
}

.section-label h2 {
  font-family: var(--font-serif);
  font-size: 1.9rem;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: 0.02em;
}

.section-label .rule {
  width: 40px;
  height: 2px;
  background: var(--gold);
  margin: 10px auto 0;
}

/* =============================================
   PAYMENT INFO BAND
   ============================================= */
.payment-band {
  max-width: 1280px;
  margin: 40px auto;
  padding: 0 48px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.pay-card {
  background: var(--navy);
  border-radius: var(--radius);
  padding: 28px 24px;
  box-shadow: var(--shadow);
  border-bottom: 3px solid var(--gold);
  text-align: center;
}

.pay-card-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.8);
  margin-bottom: 10px;
}

.pay-card-title {
  font-family: var(--font-serif);
  font-size: 1.2rem;
  color: var(--white);
  margin-bottom: 14px;
}

.pay-card address {
  font-style: normal;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  line-height: 1.8;
  margin-bottom: 0;
}

.pay-card .pay-btn:first-of-type {
  margin-top: 20px;
}

.pay-btn {
  display: inline-block;
  padding: 9px 20px;
  background: var(--gold);
  color: var(--navy);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: var(--radius);
  transition: background var(--transition), transform var(--transition);
}

.pay-btn:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
}

.pay-btn + .pay-btn { margin-top: 8px; display: inline-block; }

/* =============================================
   FOOTER
   ============================================= */
footer {
  background: var(--navy);
  border-top: 3px solid var(--gold);
  flex-shrink: 0;
  margin-top: 0;
  padding: 22px 48px 18px;
}

.footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(300px, 1.05fr) minmax(250px, 0.9fr) minmax(140px, 0.55fr) minmax(400px, 1.6fr);
  gap: 24px;
  align-items: start;
  text-align: center;
}
.footer-brand {
  font-family: var(--font-serif);
  font-size: 1rem;
  color: rgba(255,255,255,0.66);
  line-height: 1.7;
  text-align: center;
}
.footer-brand strong {
  display: block;
  font-family: var(--font-serif);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 4px;
}
.footer-rule { display:none; }
.footer-hours { text-align:center; }
.footer-contact { text-align:center; }
.footer-hours-title, .footer-contact-title {
  font-family: var(--font-serif);
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--white);
  margin-bottom: 10px;
}
.footer-hours-rule, .footer-contact-rule { display:none; }
.footer-hours-row { display:flex; align-items:center; justify-content:center; gap:8px; font-size:0.82rem; color:rgba(255,255,255,0.6); margin-bottom:6px; white-space:nowrap; }
.footer-hours-row a { color: inherit; text-decoration: none; transition: color var(--transition); }
.footer-hours-row a:hover, .footer-hours-row a:focus-visible { color: var(--gold-light); outline: none; }
.footer-contact-download { margin-top: 0; }
.ficon { font-size:0.9rem; flex-shrink:0; }
@media(max-width:960px){ .footer-inner { grid-template-columns:1fr 1fr; gap:24px; text-align:center; } }
@media(max-width:600px){ .footer-inner { grid-template-columns:1fr; text-align:center; } }


.rec-date-row {
  font-size: 0.85rem;
  color: var(--navy);
  font-weight: 500;
  padding: 7px 0;
  border-bottom: 1px solid rgba(13,27,46,0.07);
}
.rec-date-row:last-child { border-bottom: none; }


.county-vertical { max-width: 1100px; margin: 24px auto 0; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.county-vertical .card { padding: 28px 32px; }
.county-vertical .card h3 { font-family: var(--font-serif); font-size: 1.6rem; font-weight: 700; color: var(--navy); }
.county-vertical .card .card-icon { font-size: 2.2rem; }

/* Announcement slider */
.hero-announcements {
  position: relative;
  z-index: 2;
  background: rgba(13,27,46,0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-top: 1px solid rgba(196,154,60,0.3);
  padding: 10px 48px 8px;
  text-align: center;
}
.hero-ann-slide { display: none; font-size: 0.92rem; color: rgba(255,255,255,0.88); letter-spacing: 0.02em; line-height: 1.5; min-height: 20px; }
.hero-ann-slide.active { display: block; }
.hero-ann-tag { display: inline-block; background: var(--gold); color: var(--navy); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 2px 8px; border-radius: 2px; margin-right: 8px; vertical-align: middle; }
.hero-ann-dots { display: flex; justify-content: center; gap: 6px; margin-top: 8px; }
.hero-ann-dot { width: 7px; height: 7px; border-radius: 50%; border: 1px solid rgba(196,154,60,0.5); background: transparent; cursor: pointer; padding: 0; transition: background var(--transition), border-color var(--transition); }
.hero-ann-dot.active { background: var(--gold); border-color: var(--gold); }
@media(max-width:768px){ .hero-announcements { padding: 10px 20px 8px; } }

@media(max-width:700px){ .county-vertical { max-width: 1100px; margin: 24px auto 0; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; } }
@media(max-width:700px){ .two-col-county { grid-template-columns: 1fr; } }

/* =============================================
   LANGUAGE BAR
   ============================================= */
.goog-te-banner-frame,
.skiptranslate {
  display: none !important;
}
body {
  top: 0 !important;
}
.goog-te-gadget {
  display: none !important;
}

/* =============================================
   ACCESSIBILITY
   ============================================= */

/* =============================================
   RESPONSIVE
   ============================================= */
@media (max-width: 768px) {
  .site-header { padding: 20px 20px 14px; }
  .nav-toggle { display: block; }
  .nav-inner { display: none; flex-direction: column; }
  .nav-inner.open { display: flex; }
  .nav-row {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    min-height: unset;
    border-top: none !important;
  }
  .nav-item { width: 100%; }
  .nav-link,
  .nav-link-ext {
    height: auto;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    border-left: none;
    border-right: none;
    border-top: none;
    width: 100%;
    justify-content: space-between;
  }
  .dropdown {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    border-left: 3px solid var(--gold);
    border-radius: 0;
    background: rgba(255,255,255,0.04);
    display: none;
  }
  .nav-item.open > .dropdown { display: block; }
  .nav-item.open > .nav-link { color: var(--gold-light); }
  .dropdown .has-sub > .subdrop {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    border-left: 3px solid rgba(196,154,60,0.3);
    background: rgba(255,255,255,0.04);
    display: none;
  }
  .dropdown .has-sub.open > .subdrop { display: block; }
  .quicklinks { padding: 0 24px; gap: 14px; }
  .payment-band { padding: 0 24px; }
  .page-wrap { margin: 28px auto 24px; padding: 0 20px; }
  .page-banner { padding: 24px 20px 20px; }
  footer { padding: 22px 20px 18px; }
  .footer-disclaimer { border-left: none; padding-left: 0; border-top: 1px solid var(--border); padding-top: 16px; }
}
@media (max-width: 700px) {
  .county-vertical,
  .two-col-county {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
}



/* =============================================
   FOOTER BRAND WIDTH FIX
   ============================================= */
.footer-brand {
  min-width: 300px;
  white-space: nowrap;
}
@media (max-width: 600px) {
  .footer-brand {
    min-width: 0;
    white-space: normal;
  }
}



.faq-item { border: 1px solid rgba(13,27,46,0.1); border-radius: var(--radius); margin-bottom: 8px; background: var(--white); overflow: hidden; }
.faq-q { width: 100%; background: var(--navy); border: none; padding: 14px 20px; text-align: left; font-family: var(--font-sans); font-size: 0.9rem; font-weight: 600; color: var(--white); cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; transition: background var(--transition), color var(--transition); }
.faq-q:hover,.faq-q:focus-visible { background: var(--navy-light); color: #e3c67e; }
.faq-q.open { background: var(--navy); border-bottom: 2px solid var(--gold); }
.faq-q svg { width: 16px; height: 16px; fill: currentColor; flex-shrink: 0; transition: transform 0.2s; }
.faq-q.open svg { transform: rotate(180deg); }
.faq-heading { margin: 0; font: inherit; display: block; }
.faq-a { display: none; padding: 16px 20px; font-size: 0.88rem; color: var(--text); line-height: 1.8; border-top: 1px solid rgba(13,27,46,0.08); }
.faq-a.open { display: block; }
.faq-a a { color: var(--navy); text-decoration: underline; }
.faq-a ul { margin: 10px 0 0 22px; padding: 0; }
.page-wrap { max-width: 1000px; margin: 36px auto 24px; padding: 0 40px; }
.faq-chat-image { text-align: center; margin: 0 auto 28px; }
.faq-chat-image::after { content: ''; display: block; width: 40px; height: 2px; background: var(--gold); margin: 12px auto 0; }
.faq-section-body { max-width: 900px; margin: 0 auto; }
.page-top-hero { background: repeating-linear-gradient(-45deg,transparent,transparent 40px,rgba(196,154,60,0.03) 40px,rgba(196,154,60,0.03) 41px), linear-gradient(rgba(26,50,82,0.45),rgba(26,50,82,0.45)), url('bg.jpg'); background-size: auto,auto,cover; background-position: center,center,center bottom; }
.page-banner { background: transparent; padding: 36px 40px 32px; position: relative; }
.page-banner-inner { max-width: 1100px; margin: 0 auto; text-align: center; }
.page-banner-rule { width: 40px; height: 2px; background: var(--gold); margin: 0 auto 14px; }
.page-banner h1 { font-family: var(--font-serif); font-size: clamp(1.6rem,3vw,2.4rem); font-weight: 700; color: var(--white); }
.page-banner p { font-size: 0.8rem; font-weight: 700; color: var(--white); letter-spacing: 0.1em; text-transform: uppercase; margin-top: 8px; }
.page-banner-stripe { height: 3px; background: linear-gradient(90deg,transparent,var(--gold),transparent); }
.site-header { background: transparent; padding: 28px 40px 24px; text-align: center; }
.site-header > * { position: relative; z-index: 1; }

/* =============================================
   LANGUAGE BAR
   ============================================= */
.lang-bar {
  background: #0f1e32;
  border-bottom: 1px solid rgba(196,154,60,0.2);
  padding: 7px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  z-index: 1001;
  position: relative;
  text-align: center;
}
.lang-bar-notice {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.72);
  letter-spacing: 0.02em;
  text-align: center;
  width: 100%;
  white-space: normal;
  max-width: 1000px;
}
.lang-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-shrink: 0;
}
.lang-btn {
  background: none;
  border: 1px solid rgba(196,154,60,0.35);
  color: rgba(255,255,255,0.7);
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 3px;
  cursor: pointer;
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.lang-btn:hover,
.lang-btn.active {
  background: rgba(196,154,60,0.15);
  color: var(--gold-light);
  border-color: var(--gold);
}
.goog-te-banner-frame,
.skiptranslate {
  display: none !important;
}
body {
  top: 0 !important;
}
.goog-te-gadget {
  display: none !important;
}

/* =============================================
   ACCESSIBILITY
   ============================================= */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  background: var(--gold);
  color: var(--navy);
  padding: 10px 20px;
  font-weight: 700;
  font-size: 0.9rem;
  z-index: 99999;
  text-decoration: none;
  border-radius: 0 0 4px 0;
  transition: top 0s;
}
.skip-link:focus {
  top: 0;
  outline: 3px solid var(--navy);
  outline-offset: 2px;
}
:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  border-radius: 2px;
}


/* =============================================
   FOOTER DISCLAIMER PANEL
   ============================================= */
.footer-disclaimer {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.75;
  color: rgba(255,255,255,0.66);
  text-align: left;
  border-left: 1px solid rgba(196,154,60,0.32);
  border-right: none;
  padding: 2px 24px 0;
  margin: 0;
}
.footer-disclaimer strong {
  display: block;
  font-family: var(--font-sans);
  font-size: 0.88rem;
  font-weight: 700;
  color: rgba(255,255,255,0.72);
  text-align: center;
  margin-bottom: 12px;
}
.footer-disclaimer span {
  font-family: var(--font-sans);
  margin-top: 12px;
}
.footer-disclaimer a {
  font-family: var(--font-sans);
  color: rgba(255,255,255,0.62) !important;
  font-size: 0.75rem !important;
  font-weight: 400;
}
.footer-disclaimer a:hover {
  color: var(--gold-light) !important;
}
@media (max-width: 1000px) {
  .footer-disclaimer {
    border-left: none;
    border-right: none;
    border-top: 1px solid rgba(196,154,60,0.32);
    padding: 20px 0 0;
    text-align: center;
  }
}

/* =============================================
   FOOTER COLUMN SEPARATORS & ALIGNMENT
   ============================================= */
.footer-inner {
  align-items: stretch;
  column-gap: 18px;
}
.footer-brand,
.footer-hours,
.footer-contact,
.footer-disclaimer {
  border-left: 1px solid rgba(196,154,60,0.32);
  border-right: none;
  padding: 2px 24px 0;
  min-height: 0;
  margin: 0;
}
.footer-brand {
  white-space: nowrap;
}
.footer-disclaimer {
  border-right: 1px solid rgba(196,154,60,0.32);
}
.footer-brand strong,
.footer-hours-title,
.footer-contact-title,
.footer-disclaimer strong {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  margin: 0 0 12px;
  font-size: 1rem;
  line-height: 1.2;
}
.footer-brand strong,
.footer-hours-title,
.footer-contact-title {
  font-family: var(--font-serif);
  color: var(--white);
}
.footer-disclaimer strong {
  font-family: var(--font-sans);
  color: rgba(255,255,255,0.72);
}
.footer-hours-row:first-of-type {
  margin-top: 0;
}
.footer-disclaimer span {
  margin-top: 14px;
}
@media (max-width: 1000px) {
  .footer-brand,
  .footer-hours,
  .footer-contact,
  .footer-disclaimer {
    border-left: none;
    border-right: none;
    min-height: 0;
    padding: 18px 0 0;
  }
  .footer-hours,
  .footer-contact,
  .footer-disclaimer {
    border-top: 1px solid rgba(196,154,60,0.32);
  }
}
@media (max-width: 600px) {
  .footer-brand {
    white-space: normal;
  }
}
/* Consistent viewport and footer alignment */
html {
  min-height: 100%;
  background: var(--cream);
}
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main {
  flex: 0 0 auto;
}
footer {
  margin-top: auto;
}
.footer-inner {
  column-gap: 0;
  justify-items: stretch;
}
.footer-brand,
.footer-hours,
.footer-contact,
.footer-disclaimer {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2px 28px 0;
  text-align: center;
}
.footer-hours-row {
  width: fit-content;
  max-width: 100%;
}
.footer-hours-row span {
  color: rgba(255,255,255,0.72);
}
/* Mobile footer section rhythm */
@media (max-width: 600px) {
  .footer-hours,
  .footer-contact,
  .footer-disclaimer {
    padding-top: 24px;
  }
}

/* Site-wide hero notice and spacing consistency */
:root {
  --section-gap: 36px;
}
footer .footer-hours-row a {
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  transition: color var(--transition);
}
footer .footer-hours-row a:hover,
footer .footer-hours-row a:focus-visible {
  color: var(--gold-light);
  outline: none;
}
footer .footer-contact-download {
  margin-top: 0;
}
/* Translation-aware footer spacing */
.footer-brand span {
  display: block;
}
html[data-site-lang="es"] footer,
html[data-site-lang="ht"] footer,
html.translated-ltr footer {
  padding-top: 16px;
  padding-bottom: 11px;
}
html[data-site-lang="es"] footer .footer-inner,
html[data-site-lang="ht"] footer .footer-inner,
html.translated-ltr footer .footer-inner {
  grid-template-columns: minmax(290px, 0.95fr) minmax(315px, 1.02fr) minmax(195px, 0.66fr) minmax(450px, 1.55fr);
  gap: 10px;
}
html[data-site-lang="es"] footer .footer-brand,
html[data-site-lang="ht"] footer .footer-brand,
html.translated-ltr footer .footer-brand {
  row-gap: 3px;
  line-height: 1.2;
  white-space: normal;
  padding-left: 4px;
  padding-right: 4px;
}
html[data-site-lang="es"] footer .footer-brand strong,
html[data-site-lang="ht"] footer .footer-brand strong,
html.translated-ltr footer .footer-brand strong {
  margin-bottom: 4px;
}
html[data-site-lang="es"] footer .footer-brand span,
html[data-site-lang="ht"] footer .footer-brand span,
html.translated-ltr footer .footer-brand span {
  font-size: 0.93rem;
  line-height: 1.2;
}
html[data-site-lang="es"] footer .footer-hours-title,
html[data-site-lang="ht"] footer .footer-hours-title,
html[data-site-lang="es"] footer .footer-contact-title,
html[data-site-lang="ht"] footer .footer-contact-title,
html[data-site-lang="es"] footer .footer-disclaimer strong,
html[data-site-lang="ht"] footer .footer-disclaimer strong,
html.translated-ltr footer .footer-hours-title,
html.translated-ltr footer .footer-contact-title,
html.translated-ltr footer .footer-disclaimer strong {
  font-size: 1rem;
  margin-bottom: 6px;
}
html[data-site-lang="es"] footer .footer-hours,
html[data-site-lang="ht"] footer .footer-hours,
html.translated-ltr footer .footer-hours {
  padding-left: 22px;
  padding-right: 22px;
}
html[data-site-lang="es"] footer .footer-contact,
html[data-site-lang="ht"] footer .footer-contact,
html.translated-ltr footer .footer-contact {
  padding-left: 18px;
  padding-right: 18px;
}
html[data-site-lang="es"] footer .footer-hours-row,
html[data-site-lang="ht"] footer .footer-hours-row,
html.translated-ltr footer .footer-hours-row {
  width: auto;
  max-width: 100%;
  font-size: 0.78rem;
  line-height: 1.25;
  margin-bottom: 4px;
}
html[data-site-lang="es"] footer .footer-hours .footer-hours-row,
html[data-site-lang="ht"] footer .footer-hours .footer-hours-row,
html.translated-ltr footer .footer-hours .footer-hours-row {
  white-space: nowrap;
}
html[data-site-lang="es"] footer .footer-hours-row span:not(.ficon),
html[data-site-lang="ht"] footer .footer-hours-row span:not(.ficon),
html.translated-ltr footer .footer-hours-row span:not(.ficon) {
  min-width: 0;
}
html[data-site-lang="es"] footer .footer-contact .footer-hours-row,
html[data-site-lang="ht"] footer .footer-contact .footer-hours-row,
html.translated-ltr footer .footer-contact .footer-hours-row {
  width: auto;
  white-space: nowrap;
}
html[data-site-lang="es"] footer .footer-contact a,
html[data-site-lang="ht"] footer .footer-contact a,
html.translated-ltr footer .footer-contact a {
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}
html[data-site-lang="es"] footer .footer-disclaimer,
html[data-site-lang="ht"] footer .footer-disclaimer,
html.translated-ltr footer .footer-disclaimer {
  font-size: 0.78rem;
  line-height: 1.34;
  padding-left: 14px;
  padding-right: 14px;
}
html[data-site-lang="es"] footer .footer-nav,
html[data-site-lang="ht"] footer .footer-nav,
html.translated-ltr footer .footer-nav {
  margin-top: 13px;
  padding-top: 11px;
}
html[data-site-lang="es"] footer .last-updated,
html[data-site-lang="ht"] footer .last-updated,
html.translated-ltr footer .last-updated {
  margin-top: 6px;
}
@media (max-width: 960px) {
  html[data-site-lang="es"] footer .footer-inner,
  html[data-site-lang="ht"] footer .footer-inner,
  html.translated-ltr footer .footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  html[data-site-lang="es"] footer .footer-hours .footer-hours-row,
  html[data-site-lang="ht"] footer .footer-hours .footer-hours-row,
  html.translated-ltr footer .footer-hours .footer-hours-row {
    white-space: normal;
  }
}
@media (max-width: 600px) {
  html[data-site-lang="es"] footer .footer-inner,
  html[data-site-lang="ht"] footer .footer-inner,
  html.translated-ltr footer .footer-inner {
    grid-template-columns: 1fr;
  }
  html[data-site-lang="es"] footer .footer-brand,
  html[data-site-lang="ht"] footer .footer-brand,
  html[data-site-lang="es"] footer .footer-hours,
  html[data-site-lang="ht"] footer .footer-hours,
  html[data-site-lang="es"] footer .footer-contact,
  html[data-site-lang="ht"] footer .footer-contact,
  html.translated-ltr footer .footer-brand,
  html.translated-ltr footer .footer-hours,
  html.translated-ltr footer .footer-contact {
    padding-left: 18px;
    padding-right: 18px;
  }
}
.hero,
.page-top-hero {
  border-bottom: 3px solid var(--gold);
}
.page-top-hero {
  position: relative;
  min-height: clamp(520px, 52vw, 860px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background:
    linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35)),
    url('bg.jpg') center 50% / cover no-repeat;
}
.page-top-hero .site-header,
.page-top-hero .page-banner,
.hero .page-banner {
  position: relative;
  z-index: 3;
}
.page-top-hero .site-header {
  background: transparent;
  padding: 28px 40px 24px;
}
.page-top-hero .page-banner,
.hero .page-banner {
  margin-top: auto;
  padding: 0;
  background: transparent;
}
.page-top-hero .page-banner h1,
.hero .page-banner h1 {
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.02em;
  line-height: 1.2;
  max-width: 100%;
  text-align: center;
  overflow-wrap: break-word;
  text-shadow: 0 2px 16px rgba(0,0,0,0.32);
}
.page-top-hero .page-banner-stripe,
.hero .page-banner-stripe {
  display: none;
}
.page-top-hero .page-banner-inner,
.hero .page-banner-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px clamp(24px, 4vw, 46px) 18px;
  border: 1px solid rgba(196,154,60,0.42);
  border-left: 0;
  border-right: 0;
  border-top: 3px solid var(--gold);
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.08), rgba(255,255,255,0) 36%),
    rgba(13,27,46,0.54);
  box-shadow: 0 12px 35px rgba(0,0,0,0.18);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.page-top-hero .page-banner-rule,
.hero .page-banner-rule {
  width: 40px;
  height: 2px;
  background: var(--gold);
  margin: 0 auto 12px;
}
.page-top-hero .page-banner h1,
.hero .page-banner h1 {
  margin: 0;
}
.back-to-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 9998;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(196,154,60,0.55);
  border-top: 3px solid var(--gold);
  border-radius: var(--radius);
  background: rgba(13,27,46,0.92);
  color: var(--white);
  box-shadow: 0 12px 30px rgba(13,27,46,0.22);
  font-family: var(--font-sans);
  font-size: 1.35rem;
  font-weight: 800;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity var(--transition), transform var(--transition), visibility var(--transition), background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.back-to-top.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.back-to-top:hover,
.back-to-top:focus-visible {
  background: rgba(13,27,46,0.98);
  color: var(--gold);
  border-color: var(--gold);
  box-shadow: 0 14px 34px rgba(13,27,46,0.28);
  outline: none;
}
@media (max-width: 600px) {
  .back-to-top {
    right: 16px;
    bottom: 16px;
    width: 42px;
    height: 42px;
  }
  .back-to-top.over-footer {
    bottom: 78px;
  }
}
.hero .hero-announcements.hero-notice,
.page-top-hero .hero-announcements.hero-notice {
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  z-index: 2;
  width: min(1040px, 75vw);
  max-width: calc(100% - 48px);
  margin: 0;
  padding: 18px clamp(24px, 6vw, 86px) 16px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(196,154,60,0.42);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 14% 20%, rgba(219,185,106,0.16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,0.09), rgba(255,255,255,0) 40%),
    rgba(13,27,46,0.68);
  box-shadow: 0 18px 48px rgba(0,0,0,0.24), inset 0 0 0 1px rgba(255,255,255,0.07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  text-align: center;
  overflow: hidden;
  isolation: isolate;
}
.hero-announcements.hero-notice::before {
  content: '';
  position: absolute;
  inset: 8px;
  z-index: 0;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: calc(var(--radius) - 1px);
  pointer-events: none;
}
.hero-announcements.hero-notice::after {
  content: none;
  display: none;
}
.hero-announcements.hero-notice .hero-ann-track {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  min-height: 120px;
  margin: 0 auto;
  overflow: hidden;
}
.hero-announcements.hero-notice .hero-ann-slide {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 0;
  color: rgba(255,255,255,0.96);
  font-size: clamp(0.92rem, 1.15vw, 1.1rem);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0;
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.58s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.58s ease;
  pointer-events: none;
}
.hero-announcements.hero-notice .hero-ann-slide.active {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}
.hero-announcements.hero-notice .hero-ann-slide.leaving {
  opacity: 0;
  transform: translateX(-100%);
}
.hero-announcements.hero-notice .hero-ann-tag {
  flex: 0 0 auto;
  margin-right: 0;
  padding: 7px 16px;
  font-size: 0.82rem;
}
.hero-announcements.hero-notice .hero-ann-dots {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 10px;
}
.hero-announcements.hero-notice .hero-ann-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.6);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
}
.hero-announcements.hero-notice .hero-ann-dot:hover,
.hero-announcements.hero-notice .hero-ann-dot:focus-visible {
  border-color: var(--gold-light);
  transform: scale(1.15);
}
.hero-announcements.hero-notice .hero-ann-dot.active {
  background: var(--gold);
  border-color: var(--gold);
}
main > .page-wrap {
  margin-top: var(--section-gap);
  margin-bottom: var(--section-gap);
}
main > .section-label:first-child {
  padding-top: var(--section-gap);
}
main > .page-wrap > .section-label:first-child {
  padding-top: 0;
  margin-top: 0;
}.holiday-year-body {
  padding-top: 18px;
  padding-bottom: 18px;
}
.acc-body {
  padding-bottom: 18px;
}
.hearing-table th,
.holiday-table th {
  color: var(--white) !important;
}
.tab-bar {
  row-gap: 8px;
}
@media (max-width: 1100px) {
  .tab-bar {
    display: grid;
    grid-template-columns: repeat(6, max-content);
    justify-content: center;
  }
}
@media (max-width: 768px) {
  .hero .hero-announcements.hero-notice,
  .page-top-hero .hero-announcements.hero-notice {
    width: calc(100% - 40px);
    max-width: none;
  }
}
@media (max-width: 700px) {
  .tab-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .tab-btn {
    text-align: center;
  }
}
@media (max-width: 520px) {
  .hero,
.page-top-hero {
    min-height: 396px;
  }
  .header-name {
    font-size: clamp(1.65rem, 8vw, 2.05rem);
  }
  .header-title {
    max-width: calc(100vw - 32px);
    margin-left: auto;
    margin-right: auto;
    font-size: 0.56rem;
    letter-spacing: 0.01em;
    line-height: 1.45;
    overflow-wrap: break-word;
  }
  .page-top-hero .site-header {
    padding: 22px 20px 14px;
  }
  .page-top-hero .page-banner,
  .hero .page-banner {
    padding: 0;
  }
  .page-top-hero .page-banner-inner,
  .hero .page-banner-inner {
    padding: 14px 18px 16px;
  }
  .page-top-hero .page-banner h1,
  .hero .page-banner h1 {
    font-size: clamp(1.15rem, 5.5vw, 1.35rem);
  }
  .hero .hero-announcements.hero-notice,
  .page-top-hero .hero-announcements.hero-notice {
    padding: 14px 18px 12px;
  }
  .hero-announcements.hero-notice::after {
    display: none;
  }
  .hero-announcements.hero-notice .hero-ann-track {
    min-height: 210px;
  }
  .hero-announcements.hero-notice .hero-ann-slide {
    flex-direction: column;
    gap: 10px;
    font-size: 1rem;
  }
  .hero-announcements.hero-notice .hero-ann-slide span {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
  }
  .tab-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-announcements.hero-notice .hero-ann-slide {
    transition: none;
  }
}

/* Mobile full-width hero title band */
.page-top-hero > .page-banner,
.hero > .page-banner {
  width: 100%;
  max-width: none;
  align-self: stretch;
  box-sizing: border-box;
}
.page-top-hero > .page-banner > .page-banner-inner,
.hero > .page-banner > .page-banner-inner {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .page-top-hero > .page-banner,
  .hero > .page-banner {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .page-top-hero > .page-banner > .page-banner-inner,
  .hero > .page-banner > .page-banner-inner {
    border-radius: 0;
  }
}


/* Encoding-safe FAQ title icons */
.page-title-icon {
  display: inline-block;
  margin-right: 0.32em;
  font-family:  Segoe UI Emoji, Apple Color Emoji, Noto Color Emoji, sans-serif;
  font-size: 0.82em;
  line-height: 1;
  vertical-align: 0.03em;
}
.page-title-icon::before { display: inline-block; }
.page-title-icon-attorney::before { content: "\2696\FE0F"; }
.page-title-icon-creditor::before { content: "\1F3E6"; }
.page-title-icon-debtor::before { content: "\1F4CB"; }

/* Breadcrumb navigation */
.breadcrumbs {
  background: var(--cream);
  border-top: 1px solid rgba(196,154,60,0.18);
}
.breadcrumbs ol {
  max-width: 1100px;
  margin: 0 auto;
  padding: 12px 24px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  list-style: none;
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.breadcrumbs li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.breadcrumbs li + li::before {
  content: "\203A";
  color: var(--gold-dark);
  font-size: 0.95rem;
  line-height: 1;
}
.breadcrumbs a {
  color: var(--navy);
  transition: color var(--transition);
}
.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
  color: var(--gold-dark);
}
.breadcrumbs [aria-current="page"] {
  color: var(--navy);
  font-weight: 700;
}
@media (max-width: 520px) {
  .breadcrumbs ol {
    justify-content: flex-start;
    padding: 10px 18px 0;
    font-size: 0.68rem;
    gap: 6px;
  }
  .breadcrumbs li {
    gap: 6px;
  }
}

/* Site search, footer navigation, and page metadata */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.site-search {
  max-width: 520px;
  margin: 0 auto 14px;
  padding: 0 16px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  position: relative;
}
.site-search-input {
  width: 100%;
  border: 1px solid rgba(196,154,60,0.45);
  border-radius: var(--radius);
  background: rgba(255,255,255,0.08);
  color: var(--white);
  font-family: var(--font-sans);
  font-size: 0.82rem;
  padding: 8px 10px;
}
.site-search-input::placeholder { color: rgba(255,255,255,0.66); }
.site-search-input:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
  background: rgba(255,255,255,0.12);
}
.site-search-button {
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  background: var(--gold);
  color: var(--navy);
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 8px 12px;
  text-transform: uppercase;
  transition: background var(--transition), color var(--transition), transform var(--transition);
}
.site-search-button:hover,
.site-search-button:focus-visible {
  background: var(--gold-light);
  color: var(--navy);
  transform: translateY(-1px);
}
.site-search-results {
  grid-column: 1 / -1;
  background: #10243a;
  border: 1px solid rgba(196,154,60,0.35);
  border-top: 2px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: 0 14px 32px rgba(0,0,0,0.28);
  padding: 6px;
  position: absolute;
  top: 100%;
  left: 16px;
  right: 16px;
  max-height: 60vh;
  overflow-y: auto;
  z-index: 10001;
}
.site-search-results a,
.site-search-empty {
  display: block;
  border-radius: 2px;
  color: rgba(255,255,255,0.82);
  font-size: 0.8rem;
  padding: 8px 10px;
}
.site-search-results a:hover,
.site-search-results a:focus-visible {
  background: rgba(196,154,60,0.12);
  color: var(--gold-light);
}
.site-search-empty { color: rgba(255,255,255,0.66); }
.dropdown .submenu-toggle {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  display: block;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid transparent;
  color: rgba(255,255,255,0.78);
  cursor: pointer;
  font: inherit;
  letter-spacing: 0.02em;
  line-height: 1.4;
  padding: 10px 18px;
  position: relative;
  text-align: left;
  transition: color var(--transition), background var(--transition), border-color var(--transition);
}
.dropdown .submenu-toggle:hover,
.dropdown .submenu-toggle:focus-visible {
  color: var(--gold-light);
  background: rgba(196,154,60,0.08);
  border-left-color: var(--gold);
  outline: none;
}
.dropdown .has-sub > .submenu-toggle::after,
.subdrop .has-sub > .submenu-toggle::after {
  content: "\203A";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 1rem;
  opacity: 0.5;
}
.dropdown .has-sub.open > .subdrop,
.subdrop .has-sub.open > .subdrop {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 14px;
}
.footer-nav a {
  color: rgba(255,255,255,0.66);
  font-family: var(--font-sans);
  font-size: 0.74rem;
  transition: color var(--transition);
}
.footer-nav a:hover,
.footer-nav a:focus-visible {
  color: var(--gold-light);
  outline: none;
}
.footer-nav {
  max-width: 1280px;
  margin: 18px auto 0;
  padding-top: 14px;
  border-top: 1px solid rgba(196,154,60,0.22);
}
.last-updated {
  max-width: 1280px;
  margin: 8px auto 0;
  padding: 0 24px;
  color: rgba(255,255,255,0.72);
  font-family: var(--font-sans);
  font-size: 0.72rem;
  text-align: center;
}
@media (max-width: 700px) {
  .site-search {
    grid-template-columns: 1fr;
    margin-bottom: 12px;
  }
  .site-search-button { width: 100%; }
}
/* Breathing room above in-page anchor targets (nav is not sticky) */
.page-banner[id],
.page-wrap[id] { scroll-margin-top: 24px; }
@media (max-width: 768px) {
  .page-banner[id],
  .page-wrap[id] { scroll-margin-top: 16px; }
}

/* Standalone trustee branding */
body > .site-header {
  background: var(--navy);
  border-bottom: 3px solid var(--gold);
  box-shadow: 0 2px 16px rgba(0,0,0,0.2);
  padding: 28px 40px 24px;
}
body > .site-header .header-title {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 520px) {
  body > .site-header {
    padding: 22px 16px 18px;
  }
  body > .site-header .header-name {
    font-size: clamp(1.45rem, 7vw, 1.9rem);
    overflow-wrap: break-word;
  }
}


/* ===== Responsive audit fixes (2026-07-15) — mobile / tablet ===== */

/* Footer 4-col grid min-widths overflow between ~961px and the collapse point,
   and body{overflow-x:hidden} clips the right "Disclaimer" column. Trim the
   oversized disclaimer track and collapse to 2 columns before it overflows. */
/* Footer: the 4-col grid overflows the 601-1280px band; collapse to 2 columns
   there, bounded >=601px so phones keep the existing 1-column layout. Translated
   (es/ht) footers get a slimmer 4-col ONLY on true desktop (>=1281px) - an
   unconditional rule would clobber the existing <=600px 1-col and overflow phones. */
@media (min-width: 1281px) {
  html[data-site-lang="es"] footer .footer-inner,
  html[data-site-lang="ht"] footer .footer-inner,
  html.translated-ltr footer .footer-inner {
    grid-template-columns: minmax(290px,0.95fr) minmax(315px,1.02fr) minmax(195px,0.66fr) minmax(300px,1.55fr);
  }
}
@media (min-width: 601px) and (max-width: 1280px) {
  .footer-inner,
  html[data-site-lang="es"] footer .footer-inner,
  html[data-site-lang="ht"] footer .footer-inner,
  html.translated-ltr footer .footer-inner { grid-template-columns: 1fr 1fr; }
  .footer-brand { white-space: normal; }
  .footer-brand, .footer-hours, .footer-contact, .footer-disclaimer { border-left: none; border-right: none; }
}

/* Ultra-narrow phones (e.g. Galaxy Z Fold folded ~280px): tighten footer padding + wrap hours. */
@media (max-width: 400px) {
  .footer-brand, .footer-hours, .footer-contact, .footer-disclaimer { min-width: 0; padding-left: 12px; padding-right: 12px; }
  .footer-hours-row { white-space: normal; }
}

/* iOS Safari auto-zooms when focusing an input whose font is < 16px. */
.site-search-input { font-size: 16px; }

/* Sub-label on the XFA Chapter 13 Plan court form (Chrome/Edge can't render it inline; Firefox can). */
.reader-note { display: block; padding-left: 21px; margin-top: 1px; font-size: 0.68rem; font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--gold-light); opacity: 0.9; }

/* Let the desktop nav's second row wrap instead of clipping just above 768px. */
.nav-row { flex-wrap: wrap; }

/* Touch targets >= 44px on touch / mobile widths. */
@media (max-width: 768px) {
  .lang-btn { min-height: 44px; padding-top: 9px; padding-bottom: 9px; }
  .lang-buttons { gap: 10px; flex-wrap: wrap; }
  .nav-toggle { min-height: 44px; min-width: 44px; }
  .site-search-input, .site-search-button { min-height: 44px; }
  .dropdown a, .subdrop a { min-height: 44px; display: flex; align-items: center; }
  .tab-btn { min-height: 44px; }
  /* inline min-width:300px on this dropdown overflows narrow phones */
  #nav-court-calendars-menu { min-width: 0 !important; }
  /* inline padding:0 40px + page-wrap padding overflows small phones */
  .useful-link-grid { padding-left: 0 !important; padding-right: 0 !important; }
  /* recover text width at the deepest FAQ nesting level */
  .faq-parent > .faq-a { padding-left: 12px; padding-right: 12px; }
}

/* Holiday table (not stacked): let long dates wrap on very narrow phones. */
@media (max-width: 520px) {
  .holiday-table td:first-child { white-space: normal; }
}

/* Show FULL judge names (not just the CAP/SMG abbreviation) on mobile date cards. */
@media (max-width: 500px) {
  .judge-label .judge-full { display: inline !important; }
  .judge-label .judge-short { display: none !important; }
}

/* ===== Nav flyout fix (2026-08-04) =============================================
   Nested submenus used to fly out sideways at `left:100%`. Measured room to the
   right of the "Case Information & Instructions" dropdown: 102px at 912, 158px at
   1024, 226px at 1160 -- against a 240px panel. A level-3 panel needed ~1700px of
   viewport before it cleared the right edge, so it was off-screen even on ordinary
   desktops. Because html and body are both overflow-x:hidden and the document is
   never horizontally scrollable, 26 court-document links (Chapter 13 Plan LF-31,
   both Dismissal Orders, all 10 Mortgage Modification documents) could not be
   reached at all between roughly 840px and 1160px -- which includes iPad landscape.
   Those links exist nowhere else on the site.

   Fix: stack nested submenus inside the dropdown panel instead of flying out. The
   panel is absolutely positioned at a known place and only ~240-300px wide, so a
   stacked child always fits regardless of viewport. This matches what the <=768px
   hamburger nav already does, so behaviour is now consistent at every width.
   ============================================================================== */
@media (min-width: 769px) {
  .dropdown .has-sub > .subdrop,
  .subdrop .has-sub > .subdrop {
    position: static;
    left: auto;
    top: auto;
    min-width: 0;
    width: auto;
    transform: none;
    box-shadow: none;
    border: none !important;
    border-left: 3px solid rgba(196,154,60,0.45) !important;
    border-radius: 0;
    margin: 0 0 0 10px;
    transition: none;
    /* hidden by display so it takes no vertical space until opened; visibility
       alone would reserve the space and leave gaps in the panel */
    display: none;
    opacity: 1;
    visibility: visible;
  }
  /* Nav fix (2026-08-11): nested branches expand on CLICK, not hover.
     Hover-expansion injected ~1,200px of links into a panel capped at 62vh.
     Leaving a branch removed that height synchronously, the panel snapped back
     to ~180px, and the pointer - which had not moved - was left outside
     .nav-item, so :hover went false and the WHOLE menu closed. Because every
     mouse path into the panel crosses "Attorney" (the first item, ~30 links),
     that made BkDocs.us / Creditor / Debtor unreachable by mouse.
     .open is already toggled by the per-page inline handler at every width, so
     this makes desktop behave exactly like the <=768px hamburger nav. */
  .dropdown .has-sub.open > .subdrop,
  .subdrop .has-sub.open > .subdrop {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  /* the caret means "expands below" now, not "opens to the right" */
  .dropdown .has-sub > a::after,
  .subdrop .has-sub > a::after {
    transform: translate(-50%, -50%) rotate(90deg);
  }
  /* a fully expanded branch is tall; keep the panel inside the viewport */
  .dropdown {
    max-height: min(calc(100vh - var(--nav-h) - 16px), 62vh);
    overflow-y: auto;
    overflow-x: hidden;
  }
  /* The caret pointed right while the panel expanded downward. Now it points
     down when collapsed and up when open, so the control reads as a toggle. */
  .dropdown .has-sub > .submenu-toggle::after,
  .subdrop .has-sub > .submenu-toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
  }
  .dropdown .has-sub.open > .submenu-toggle::after,
  .subdrop .has-sub.open > .submenu-toggle::after {
    transform: translate(-50%, -50%) rotate(-90deg);
  }
  /* Hover grace period. site.js adds .nav-hold on mouseleave and drops it
     300ms later, so clipping the panel edge on the way to a far item no longer
     dismisses it. Paired with the branch reset in site.js. */
  .nav-item.nav-hold > .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
}

/* ===== Long-token wrapping in FAQ content (2026-08-04) =======================
   At 320px two .faq-item blocks on Debtor_Information overflowed their box
   (scrollWidth 194 vs clientWidth 170) and were clipped, silently truncating the
   example address "jonathandoe@bellsouth.net" inside the payment instructions --
   a 25-character token with no break opportunity. Email addresses, URLs and case
   numbers all behave this way, so this is applied wherever FAQ content appears
   rather than only to the one question that happened to overflow.
   ============================================================================= */
.faq-item, .faq-q, .faq-a { min-width: 0; }
.faq-a, .faq-a p, .faq-a li, .faq-a td { overflow-wrap: anywhere; word-break: break-word; }
.faq-q { overflow-wrap: anywhere; }

/* ===== Restore the mobile language-bar override (2026-08-04) =================
   These three pages are the only ones with a third <style> block. Block 1 ends with
   the @media (max-width:600px) language-bar override; block 2 then re-declares
   .lang-bar / .lang-bar-notice unconditionally with a copy of the DESKTOP rule.
   Equal specificity, later source order -- so the media query was dead and phones got
   40px desktop padding with 0.68rem text. At 320px the Google Translate legal notice
   ("English is the official version...") wrapped to three lines.
   ============================================================================= */
@media (max-width: 600px) {
  .lang-bar { padding: 6px 16px; }
  .lang-bar-notice { font-size: 0.65rem; line-height: 1.35; }
}

/* ===== Remaining audit items (2026-08-04) ===================================
   1. Identity subtitle was 0.56rem. Against this site's 17px root that is 9.52px --
      the smallest text on the site, on the line naming the office and district, and
      only on phones (<=520px). Raised to 0.66rem (~11.2px). It is uppercase with
      positive letter-spacing, so it stays compact; the existing
      max-width:calc(100vw - 32px) still constrains it.

   2. Landscape. The site had ZERO orientation queries, ZERO max-height queries and
      no dvh/svh units -- every size decision was width-driven. Rotating a phone
      therefore gave a first screen that was ~100% chrome: measured on index.htm at
      844x390, the chrome ended at y=907 in a 390px-tall viewport and the <h1> sat at
      y=852, below the fold. These rules cap the hero and trim the header stack when
      the viewport is short, which is what "landscape phone" actually means.
      Height-driven, so they do not disturb any portrait layout.
   ========================================================================== */
@media (max-width: 520px) {
  .header-title { font-size: 0.66rem; }
}
@media (orientation: landscape) and (max-height: 520px) {
  /* Landscape phones. A 844x390 viewport is WIDE, so it gets the desktop nav; the
     stack was lang 62 + header 150 + nav 169 + hero 74 = 455px of chrome in a 390px
     screen. Everything below tightens SPACING only - no element is hidden, no
     structure changes, and every interactive target stays >= 24px per WCAG 2.5.8. */
  .lang-bar { padding-top: 3px !important; padding-bottom: 3px !important; }
  .lang-bar-notice { margin-bottom: 2px; }
  .lang-buttons { gap: 6px; }

  /* .header-name renders at 34px here, far above any legibility floor, so it is the
     one font that can safely shrink. The identity subtitle keeps its size (it was
     deliberately raised to 11.22px for readability) - only its leading tightens. */
  .site-header { padding-top: 6px !important; padding-bottom: 6px !important; }
  .header-name { font-size: 1.5rem; }
  .header-title { line-height: 1.25; margin-top: 3px; }

  /* Nav: link padding only. 40px -> ~28px, still above the 24px minimum. */
  /* The nav rows are sized by --nav-h (56px). Overriding the VARIABLE rather than
     .nav-row keeps everything derived from it consistent - the dropdown panels are
     positioned with top:calc(var(--nav-h) - 1px), so a raw min-height override would
     leave them floating 22px below the row. 34px still yields links well over the
     24px WCAG 2.5.8 minimum. */
  :root { --nav-h: 34px; }
  .nav-wrapper { padding-top: 3px; padding-bottom: 3px; }
  .nav-inner a, .nav-inner button, .nav-link, .nav-link-ext {
    padding-top: 5px; padding-bottom: 5px;
  }
  /* site-search-row: at <=768px the search form is a GRID that stacks the input above
     the button - 96px tall. In landscape there is plenty of width, so put them side by
     side. Both keep their 44px min-height, so touch targets are unaffected. */
  .site-search { margin-top: 4px; margin-bottom: 4px;
    display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
  .site-search > * { margin-top: 0 !important; margin-bottom: 0 !important; }
  .site-search-input, .site-search-button { padding-top: 5px; padding-bottom: 5px; }

  /* The hero is decorative at this height, but it contains the <h1>, so it is
     capped rather than hidden. */
  .hero, .page-top-hero, .page-banner { min-height: 0 !important; }
  .hero-image-spacer { min-height: 0 !important; }
  .hero { max-height: 14vh; }
}

/* Footer contact targets (2026-08-04). These stacked links measured 22x84 and 20x121 --
   under the 24px WCAG 2.5.8 minimum, passing only via the Spacing exception. Mis-tapping
   the second row dials a FAX line, so the padding is worth the two pixels. Additive: only
   padding changes, nothing moves horizontally. */
.footer-hours-row a,
.footer-contact-download a,
footer .footer-links a,
footer nav a { padding-top: 3px; padding-bottom: 3px; display: inline-block; }

/* Breadcrumb links measured 41x21 - under the 24px WCAG 2.5.8 minimum and NOT inline
   within a sentence, so the exception does not apply. Padding only; the separators and
   layout are untouched. */
.breadcrumb a, .breadcrumbs a, nav[aria-label="Breadcrumb"] a, .crumbs a {
  padding-top: 3px; padding-bottom: 3px; display: inline-block;
}

/* focus-visible restoration (2026-08-06) ---------------------------------
   Four earlier rules set `outline: none` on the footer links and the
   back-to-top button, leaving them to signal focus by text COLOUR alone at
   about 1.05:1 state-to-state. WCAG 2.2 SC 1.4.11 requires 3:1, and a user
   who cannot separate the two golds saw no focus indicator at all.
   gold-light on the navy footer measures 6.88:1.
   Appended at end of file so it follows those rules in source order.        */
.footer-nav a:focus-visible,
footer .footer-hours-row a:focus-visible,
footer .footer-contact-download a:focus-visible,
.back-to-top:focus-visible {
  outline: 3px solid var(--gold-light);
  outline-offset: 2px;
  border-radius: 2px;
}