/* Site-wide quality, accessibility, and responsive enhancements */
:root { --nav-height: 64px; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
img { max-width: 100%; height: auto; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #f5a623;
  outline-offset: 3px;
}
.skip-link {
  position: fixed; left: 12px; top: -60px; z-index: 2000;
  background: #fff; color: #1b3a6e; padding: 10px 14px;
  border: 2px solid #1b3a6e; border-radius: 4px; font-weight: 700;
}
.skip-link:focus { top: 10px; }

.mobile-nav-toggle {
  display: none; border: 0; background: transparent; color: #1b3a6e;
  font-size: 28px; line-height: 1; cursor: pointer; padding: 6px 8px;
}
.form-status {
  margin-top: 14px; padding: 12px 14px; border-radius: 4px;
  background: #eef4fb; border: 1px solid #c8d8ed; color: #17345f;
  font-size: 14px; line-height: 1.5;
}
.notice-box {
  background:#fff8e8; border:1px solid #efd28d; color:#5c4718;
  padding:14px 16px; border-radius:6px; line-height:1.55; margin-top:16px;
}

@media (max-width: 980px) {
  nav { padding: 12px 18px !important; min-height: var(--nav-height); }
  .mobile-nav-toggle { display: block; }
  .nav-links {
    display: none !important; position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; border-top: 1px solid #eee; border-bottom: 1px solid #ddd;
    padding: 14px 18px 18px; flex-direction: column !important; align-items: stretch !important;
    gap: 4px !important; box-shadow: 0 12px 24px rgba(0,0,0,.08);
  }
  .nav-links.is-open { display: flex !important; }
  .nav-links a { padding: 11px 8px; width: 100%; }
  .nav-donate { text-align:center; margin-top:6px; }
  .page-hero { margin-top: var(--nav-height) !important; padding: 54px 24px !important; }
  .page-hero h1 { font-size: clamp(36px, 8vw, 48px) !important; }
  section { padding: 56px 24px !important; }
  footer { padding: 42px 24px 24px !important; }
  .footer-top { grid-template-columns: 1fr !important; gap: 28px !important; }
  .contact-grid, .involve-grid, .donate-grid, .about-grid, .bio-inner, .donate-inner, .about-hero {
    grid-template-columns: 1fr !important; gap: 34px !important;
  }
  .rules-grid, .mission-grid, .boards-grid { grid-template-columns: 1fr !important; }
  .issues-grid { grid-template-columns: 1fr !important; }
  .ways-grid, .impact-grid { grid-template-columns: 1fr !important; }
  .form-row { grid-template-columns: 1fr !important; }
  .cta-band { padding: 44px 24px !important; }
  .btn-outline, .btn-outline-white { margin-left: 0 !important; margin-top: 10px; }
  .section-heading { font-size: clamp(30px, 7vw, 38px) !important; }
}

@media (max-width: 640px) {
  .nav-logo-text { font-size: 18px !important; }
  .nav-logo-box { font-size: 9px !important; letter-spacing: 1.4px !important; padding: 3px 7px !important; }
  .form-card, .donate-widget { padding: 24px !important; }
  .amounts-grid, .donate-amounts { grid-template-columns: repeat(2,1fr) !important; }
  .hero { grid-template-columns: 1fr !important; padding: 56px 22px 42px !important; gap: 30px !important; min-height: auto !important; }
  .hero-logo-large .name-line { font-size: clamp(44px, 14vw, 64px) !important; }
  .hero-taglines p { font-size: clamp(22px, 7vw, 28px) !important; }
  .hero-photo { min-height: 390px !important; margin: 0 !important; }
  .hero-photo img { max-height: none !important; }
  .contact-bar { padding: 12px 22px !important; flex-wrap: wrap; gap: 10px 20px !important; }
  .quick-bar { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}
/* Language switcher (i18n.js) */
html.i18n-pending body { opacity: 0; }
.lang-switch {
  display: inline-flex; margin-left: auto; margin-right: 22px;
  border: 1.5px solid #1b3a6e; border-radius: 999px; overflow: hidden; flex: 0 0 auto;
}
.lang-switch button {
  border: 0; background: #fff; color: #1b3a6e; cursor: pointer;
  font: 700 12px/1 'Helvetica Neue', Arial, sans-serif; letter-spacing: 1px;
  padding: 7px 10px; min-width: 38px; min-height: 32px;
}
.lang-switch button + button { border-left: 1px solid #c9d3e3; }
.lang-switch button[aria-pressed="true"] { background: #1b3a6e; color: #fff; }
.lang-switch button:hover:not([aria-pressed="true"]) { background: #fff6e6; }
@media (max-width: 1180px) and (min-width: 981px) {
  .nav-links { gap: 18px !important; }
  .nav-links a { font-size: 13px !important; letter-spacing: .5px !important; }
  .lang-switch { margin-right: 14px; }
}
@media (max-width: 980px) {
  .lang-switch { margin-right: 6px; }
  .lang-switch button { min-height: 36px; padding: 8px 10px; }
}
@media (max-width: 380px) {
  .lang-switch button { min-width: 32px; padding: 8px 7px; font-size: 11px; }
  .nav-logo-box { display: none !important; }
}

/* Phone readability fixes */
body { overflow-wrap: break-word; }
@media (max-width: 980px) {
  .tl-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
  .tl-card { padding: 22px 20px !important; }
  .issue-sec { padding: 44px 22px !important; }
  .issue-inner { grid-template-columns: 1fr !important; gap: 14px !important; }
  .issue-label { position: static !important; }
  .issue-label .number { font-size: 52px !important; }
  .issue-label h2 { font-size: 24px !important; }
  .issue-body p { font-size: 16px !important; }
  .issue-body ul li { font-size: 16px !important; }
}
@media (max-width: 640px) {
  body { -webkit-text-size-adjust: 100%; }
  p, li { font-size: max(15px, 1em); line-height: 1.6; }
  .footer-brand p, .footer-col a { font-size: 15px !important; }
  .footer-bottom { font-size: 13px !important; line-height: 1.7; color: rgba(255,255,255,0.5) !important; }
  .footer-col a { padding: 6px 0; margin-bottom: 2px !important; }
  .form-helper, #result .small, .vbm-note, .voter-tools-card p, .consent-wrap label { font-size: 14px !important; }
  .sticky-text { font-size: 12px !important; }
  .sticky-text strong { font-size: 13px !important; }
}