@import url('election.css');
.home-page { max-width: 1180px; margin: auto; }
.home-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.home-eyebrow { font-size: .68rem; color: var(--muted); letter-spacing: 1px; }
.home-heading h1 { margin-top: 4px; font-size: 1.85rem; letter-spacing: -.6px; }
.home-heading nav { display: flex; gap: 9px; white-space: nowrap; color: var(--green); font-size: .8rem; padding-bottom: 5px; }
.home-heading nav span { color: var(--muted); }
.home-layout { display: grid; grid-template-columns: minmax(0, 1fr) 232px; grid-template-areas: 'elections side' 'issues side' 'recent side'; gap: 30px 26px; align-items: start; }
.home-layout > * { min-width: 0; }
.home-elections { grid-area: elections; }
.home-election-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.home-election { background: #f6f8f4; border: 1px solid #e2e8df; border-radius: 12px; padding: 17px; }
.home-election > header { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding-bottom: 12px; }
.home-election h2 { font-size: 1.4rem; letter-spacing: -.5px; }
.home-election h2 span { color: var(--green); font-size: .8rem; vertical-align: middle; }
.home-election time { color: var(--green-dark); text-align: right; font-size: .85rem; white-space: nowrap; }
.home-election time > span { display: block; color: var(--muted); font-size: .65rem; }
.home-office { display: flex; align-items: center; gap: 6px; min-height: 59px; border-top: 1px solid #dfe6dc; }
.home-office:hover { color: var(--green); }
.home-office-name { flex: 1; min-width: 0; font-size: .88rem; font-weight: 600; line-height: 1.4; }
.home-office-name small { display: block; color: var(--muted); font-size: .69rem; font-weight: 400; margin-top: 3px; }
.home-portraits { display: flex; padding-left: 4px; }
.home-portraits img, .home-portraits > span { width: 26px; height: 32px; object-fit: cover; object-position: center 25%; border-radius: 7px; border: 2px solid #f6f8f4; margin-left: -5px; }
.home-portraits > span { display: grid; place-items: center; color: var(--green); background: #e0ece4; font-size: .5rem; }
.home-office-count { font-size: .8rem; white-space: nowrap; font-weight: 600; }
.home-office-count > span { margin-left: 3px; color: var(--green); }
.home-office-empty > span:last-child { max-width: 55%; font-size: .72rem; color: var(--muted); }
.home-election footer { display: flex; justify-content: space-between; gap: 8px; padding-top: 9px; border-top: 1px solid #dfe6dc; font-size: .69rem; color: var(--muted); }
.home-election footer a:first-child { color: var(--green); }
.home-province { display: flex; align-items: center; gap: 16px; padding: 14px 17px; margin-top: 14px; border: 1px solid var(--line); border-radius: 10px; }
.home-province-name { display: grid; gap: 1px; }
.home-province-name strong { font-size: 1.03rem; }
.home-province-detail { margin-left: auto; color: var(--muted); font-size: .77rem; text-align: right; }
.home-province-detail small { display: block; margin-top: 2px; }
.home-province > span:last-child { color: var(--green); }
.home-issues { grid-area: issues; }
.home-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.home-section-heading h2 { font-size: 1.15rem; }
.home-section-heading > a, .home-section-heading > span { font-size: .73rem; color: var(--muted); }
.home-section-heading > a { color: var(--green); }
.home-topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.home-topic { border: 1px solid var(--line); border-radius: 10px; padding: 13px; display: flex; flex-direction: column; }
.home-topic h3 { font-size: .94rem; line-height: 1.55; flex: 1; }
.home-topic h3 a { display: block; position: relative; padding-right: 16px; }
.home-topic h3 span { color: var(--green); position: absolute; right: 0; top: 0; }
.home-topic p { color: var(--muted); font-size: .67rem; margin-top: 7px; }
.home-topic nav { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.home-topic nav a { color: var(--green); background: #edf5f0; border-radius: 5px; padding: 3px 6px; font-size: .65rem; }
.home-topic nav a:hover { background: #dceee3; }
.home-side { grid-area: side; position: sticky; top: 24px; }
.home-find { border: 1px solid var(--line); background: #fafbf9; border-radius: 11px; padding: 17px; scroll-margin-top: 20px; }
.home-find .home-section-heading { margin-bottom: 12px; }
.home-find form { display: grid; gap: 7px; }
.home-find label { font-size: .72rem; color: var(--muted); }
.home-find input, .home-find select { min-width: 0; width: 100%; min-height: 39px; border: 1px solid #d8e0d5; border-radius: 6px; padding: 8px; font: inherit; font-size: .76rem; color: var(--ink); background: #fff; }
.home-find select { margin-bottom: 4px; }
.home-find input:focus, .home-find select:focus { outline: 2px solid #91b6a9; outline-offset: 1px; }
.home-find button { display: flex; justify-content: space-between; align-items: center; border: 0; border-radius: 6px; background: var(--green); color: #fff; min-height: 40px; padding: 8px 12px; font-size: .8rem; font-weight: 600; }
.home-find button:hover { background: var(--green-dark); }
.home-person-cities { margin-top: 15px; border-top: 1px solid var(--line); }
.home-person-cities a { display: flex; justify-content: space-between; gap: 8px; padding-top: 10px; font-size: .77rem; }
.home-person-cities a span { color: var(--muted); font-size: .69rem; }
.home-tools { margin-top: 16px; }
.home-tools > a { display: flex; align-items: center; gap: 10px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.home-tools svg { color: var(--green); width: 18px; }
.home-tools strong { display: block; font-size: .8rem; font-weight: 600; }
.home-tools small { display: block; color: var(--muted); font-size: .68rem; margin-top: 2px; }
.home-tools > a > span:last-child { margin-left: auto; color: var(--muted); font-size: .8rem; }
.home-recent { grid-area: recent; }
.home-updates article { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 17px 0; border-top: 1px solid var(--line); }
.home-update-photo img, .home-update-photo > span { display: block; width: 38px; height: 46px; border-radius: 7px; object-fit: cover; object-position: center 25%; }
.home-update-photo > span { display: grid; place-items: center; background: var(--wash); color: var(--green); font-size: .75rem; }
.home-update-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 12px; font-size: .73rem; color: var(--muted); margin-bottom: 4px; }
.home-update-meta > a { color: var(--green); font-weight: 600; }
.home-update-meta time { margin-left: auto; font-variant-numeric: tabular-nums; font-size: .69rem; }
.home-updates h3 { font-size: 1rem; line-height: 1.5; }
.home-updates p { color: #52645b; font-size: .82rem; line-height: 1.8; margin-top: 5px; }
.home-updates small { display: block; font-size: .68rem; color: var(--muted); line-height: 1.6; margin-top: 7px; }
.home-empty { font-size: .82rem; color: var(--muted); }
.home-empty a { color: var(--green); }
@media (max-width: 1190px) {
  .home-layout { grid-template-columns: minmax(0, 1fr) 212px; gap: 26px 20px; }
  .home-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-election { padding: 14px; }
  .home-election h2 { font-size: 1.2rem; }
  .home-portraits { display: none; }
}
@media (max-width: 1000px) {
  .home-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'elections' 'issues' 'side' 'recent'; }
  .home-side { position: static; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
  .home-tools { margin-top: 0; }
  .home-portraits { display: flex; }
  .home-topic-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .home-heading { align-items: start; flex-direction: column; gap: 6px; margin-bottom: 19px; }
  .home-heading h1 { font-size: 1.65rem; }
  .home-heading nav { font-size: .73rem; padding: 0; }
  .home-layout { row-gap: 26px; }
  .home-election-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .home-election { padding: 14px 16px; }
  .home-election h2 { font-size: 1.4rem; }
  .home-office { min-height: 54px; }
  .home-portraits img, .home-portraits > span { width: 28px; height: 34px; }
  .home-province { padding: 12px 14px; gap: 10px; margin-top: 12px; }
  .home-province-detail { font-size: .7rem; }
  .home-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .home-topic { padding: 12px; }
  .home-topic h3 { font-size: .9rem; }
  .home-topic p { font-size: .65rem; }
  .home-topic nav a { font-size: .68rem; padding: 4px 7px; }
  .home-side { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .home-find { padding: 16px; }
  .home-find input, .home-find select { font-size: .875rem; min-height: 42px; }
  .home-tools > a { min-height: 54px; }
  .home-updates article { gap: 10px; }
  .home-updates h3 { font-size: .97rem; }
  .home-update-meta time { margin-left: 0; }
}

.home-election-section { margin-top: 28px; }
.home-election h3 { font-size: 1.35rem; letter-spacing: -.4px; }
.home-election h3 span { color: var(--green); font-size: .8rem; }
.home-election-phase { color: var(--green-dark); font-size: .79rem; line-height: 1.6; padding-bottom: 10px; }
.home-election-structure { color: var(--muted); font-size: .8rem; padding: 8px 0 16px; }
.election-directory-note { margin-top: 28px; line-height: 1.8; }
.home-find + .home-find { margin-top: 14px; }
@media (max-width: 600px) {
 .home-section-heading { flex-wrap: wrap; }
 .home-section-heading h2 { font-size: 1.05rem; }
 .home-heading nav { white-space: normal; flex-wrap: wrap; }
 .home-election h3 { font-size: 1.3rem; }
 .home-election-section { margin-top: 24px; }
}

.home-public-events { margin-bottom: 28px; }
.home-public-events article { padding: 14px 0; border-top: 1px solid var(--line); }
.home-public-events h3 { font-size: 1rem; line-height: 1.6; margin: 4px 0; }
.home-public-events article > p:not(.home-eyebrow) { font-size: .82rem; color: #52645b; line-height: 1.8; }
.home-public-events small { display: block; color: var(--muted); font-size: .7rem; margin-top: 5px; }
