/* Shared visual language with the proposed county party website. */
:root {
  --paper:#f7f4ed;
  --white:#fffdf9;
  --ink:#142d36;
  --navy:var(--ink);
  --red:#ac352c;
  --muted:#53636a;
  --line:#d6d8ce;
  --wash:#eaece4;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
  color-scheme:light;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
}
*{box-sizing:border-box}
html{scroll-padding-top:94px}
body{margin:0;font-size:16px;line-height:1.55}
a{color:inherit;text-underline-offset:5px}
a:hover{text-decoration-thickness:2px}
button,select,input{font:inherit}
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:13px 18px;border:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);font-size:14px;font-weight:700;line-height:1.4;text-decoration:none;cursor:pointer}
button:hover,.button:hover{background:var(--ink);color:var(--paper)}
:focus-visible{outline:3px solid var(--red);outline-offset:5px}
button:disabled{opacity:.65;cursor:wait}
[hidden],.js-only[hidden]{display:none!important}
.page{max-width:680px;margin:auto;padding:24px 22px max(40px,env(safe-area-inset-bottom))}
.skip{position:absolute;left:-9999px;z-index:10}
.skip:focus{left:20px;top:12px;padding:12px;background:var(--white)}
.brand{text-decoration:none;color:inherit;display:flex;align-items:center;gap:13px;padding-bottom:25px;border-bottom:1px solid var(--line)}
.brand-icon{position:relative;display:grid;place-items:center;flex:none;width:40px;height:46px;border:1px solid currentColor;font:38px/.8 var(--serif)}
.brand-icon::after{position:absolute;bottom:5px;left:11px;width:17px;height:3px;background:var(--red);content:""}
.brand strong{display:block;font-size:16px;line-height:1.2;letter-spacing:.06em}
.brand .eyebrow{font-size:9px;letter-spacing:.19em;margin:6px 0 0}
.eyebrow{margin:0;color:var(--muted);font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.hero h1{margin:32px 0 20px;color:var(--ink);font:400 clamp(43px,9vw,62px)/1.04 var(--serif);letter-spacing:-.045em}
.hero h1 em{color:var(--red);font-weight:400}
.hero>.eyebrow{color:var(--red)}
.appeal{margin:25px 0 16px;padding:0 0 0 18px;border-left:3px solid var(--red);font-size:18px;line-height:1.5;font-weight:700}
.intro{font-size:15px;line-height:1.65;margin:14px 0;max-width:65ch}
.recommendation-note{font-size:13px;line-height:1.6;color:var(--ink);margin:14px 0}
.source-date,.subtle{font-size:12px;line-height:1.65;color:var(--muted)}
.source-date{margin:16px 0 28px}
.category{margin-top:38px;scroll-margin-top:90px;min-width:0}
.category h2,.section-title{margin:0 0 10px;padding-top:18px;border-top:2px solid var(--red);font:400 32px/1.15 var(--serif);letter-spacing:-.035em;color:var(--ink)}
#save{margin:8px 0 26px;padding:24px;background:var(--wash);border:1px solid var(--line)}
#save h2{border:0;padding:0;font-size:29px}
#save .intro{margin:12px 0 20px;font-size:14px}
.actions{display:grid;grid-template-columns:1fr;gap:10px;margin:18px 0 0}
#save .actions>a,.actions .primary{background:var(--red);border-color:var(--red);color:var(--white)}
#save .actions>a:hover,.actions .primary:hover{background:#8f2922;border-color:#8f2922}
#save #share{background:transparent}
#save #share:hover{background:var(--ink);color:var(--paper)}
.quick-nav{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:8px;padding:12px 0;border-block:1px solid var(--line);background:var(--paper)}
.quick-nav select{flex:1;min-width:0;width:50%;min-height:46px;padding:10px 8px;border:1px solid var(--line);border-radius:0;background:var(--white);color:var(--ink);font-size:14px;font-weight:700}
.quick-nav>a{padding:12px 4px;font-size:13px;white-space:nowrap}
.nav-title,.section-links{display:none}
.office-grid,.date-grid{min-width:0}
.office{min-width:0;margin:0;padding:23px 0;border:0;border-bottom:1px solid var(--line)}
.office legend{float:left;width:100%;margin:0 0 5px;padding:0;font-size:16px;font-weight:700;line-height:1.4;color:var(--ink)}
.office legend+*{clear:both}
.limit{margin:0 0 9px;font-size:12px;color:var(--muted)}
.candidate{display:grid;grid-template-columns:23px minmax(0,1fr);column-gap:12px;row-gap:0;align-items:center;min-height:48px;padding:7px 0;cursor:default}
.candidate .name{font-size:18px;font-weight:700;line-height:1.4;color:var(--red)}
.ballot-oval{flex:none;width:23px;height:15px;border:1.5px solid var(--ink);background:var(--ink);border-radius:50%;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.candidate-note{font-size:13px;line-height:1.5;color:var(--muted)}
.candidate .candidate-note{grid-column:2;margin:5px 0 8px}
.write-in-label{white-space:nowrap;color:var(--red)}
.retention-court{margin-block:28px}
.retention-court h3{font-size:17px;line-height:1.45}
.retention-question{border-top:1px solid var(--line);padding-block:18px}
.retention-question h4{margin:0 0 8px;color:var(--red);font-size:17px}
.retention-question p{margin:7px 0;font-size:14px;line-height:1.65}
.retention-question a{font-size:13px}
.retention>p{max-width:75ch;font-size:14px;line-height:1.65}
.date{padding:24px 0;border-bottom:1px solid var(--line)}
.date h3{margin:0 0 12px;color:var(--red);font-size:12px;font-weight:700;letter-spacing:.1em}
.date p{margin:0 0 18px;line-height:1.65;font-size:15px}
.date a{font-size:13px}
.calendar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.calendar-actions>a{display:inline-flex;align-items:center;min-height:44px;padding:10px 12px}
.status{font-size:13px;line-height:1.5;min-height:20px;margin:8px 0 0}
.error{color:var(--red);font-weight:700}
.empty{padding:20px;background:var(--wash);font-size:15px;line-height:1.5}
details{border-bottom:1px solid var(--line);padding:16px 0}
summary{font-weight:700;cursor:pointer;min-height:28px}
details p,details li{line-height:1.65;font-size:15px}
details ol{padding-left:22px}
footer{margin-top:48px;padding-top:25px;border-top:1px solid var(--ink)}
footer .site-link{font:400 31px/1.2 var(--serif);letter-spacing:-.035em;text-decoration:none}
footer p{font-size:12px;line-height:1.7;color:var(--muted)}
footer>a:last-child{display:inline-block;min-height:44px;padding-block:12px;font-size:13px;font-weight:700}
.sticker-section{margin-top:38px;padding-top:26px;border-top:2px solid var(--red)}
.sticker-section h2{margin:0 0 14px;font:400 32px/1.15 var(--serif);letter-spacing:-.035em}
.sticker-section>p{font-size:15px;line-height:1.65}
.sticker-section h3{margin:24px 0 16px;font-size:18px;line-height:1.4}
.voted-sticker{display:block;width:100%;max-width:380px;height:auto;margin:0 auto}
#sticker-reveal{background:var(--ink);color:var(--paper);width:100%;min-height:52px}
#sticker-reveal:hover{background:var(--red);border-color:var(--red)}
.voted-nav-check{display:none}
@media screen and (min-width:740px){
 .page{max-width:1040px;padding:32px 40px 56px}
 .hero{display:grid;grid-template-columns:1.2fr 1fr;column-gap:52px;align-items:start;margin-bottom:28px}
 .brand{grid-column:1/-1;margin-bottom:32px}
 .hero>.eyebrow{grid-column:1;grid-row:2}
 .hero h1{grid-column:1;grid-row:3/6;font-size:clamp(50px,6vw,70px);margin:16px 0 20px}
 .hero .appeal{grid-column:2;grid-row:2;margin:0 0 14px;font-size:19px}
 .hero .intro{grid-column:2;grid-row:3;margin:0 0 12px}
 .hero .recommendation-note{grid-column:2;grid-row:4;margin:0 0 12px}
 .hero .source-date{grid-column:2;grid-row:5;margin:0}
 .quick-nav select{max-width:360px}
 .office-grid,.date-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:30px;align-items:start}
 .office{height:100%}
 .category{margin-top:42px}
 #save .actions{grid-template-columns:repeat(3,minmax(0,1fr))}
 #save{padding:28px}
 footer{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
 footer>a{grid-column:1/-1}
 .sticker-section{display:grid;grid-template-columns:1fr 1fr;column-gap:32px;align-items:start}
 .sticker-section>h2,.sticker-section>p,#sticker-reveal{grid-column:1}
 #sticker-reveal{max-width:340px}
 #sticker-panel{grid-column:2;grid-row:1/5}
 .sticker-section h3{margin-top:0}
}
@media screen and (min-width:1100px){
 html{scroll-padding-top:28px}
 .page{display:grid;grid-template-columns:176px minmax(0,1fr);column-gap:48px;max-width:1440px;padding:40px 56px 72px}
 .hero{grid-column:1/-1;grid-template-columns:1.2fr 1fr;column-gap:90px;margin-bottom:40px}
 .brand{padding-bottom:30px;margin-bottom:42px}
 .hero h1{font-size:78px}
 .quick-nav{grid-column:1;grid-row:2/9;align-self:start;top:28px;display:block;padding:18px 0 0;border-bottom:0}
 .quick-nav>select,.quick-nav>a{display:none}
 .nav-title{display:block;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:0 0 15px}
 .section-links{display:flex;flex-direction:column;gap:1px}
 .section-links a{display:block;padding:11px 0;font-size:13px;font-weight:700;text-decoration:none;border-bottom:1px solid transparent}
 .section-links a:hover{color:var(--red);border-color:var(--red)}
 .page>section,.page>#candidates,.page>footer,.page>noscript{grid-column:2;min-width:0}
 .office-grid,.date-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:28px}
 .category{scroll-margin-top:0}
 .category h2{font-size:36px}
 .candidate .name{font-size:17px}
 .voted-nav-check{display:inline-block;color:var(--red);vertical-align:-3px;margin-left:4px}
}
@media print{
 :root{--paper:#fff;--ink:#111;--muted:#444;--line:#bbb}
 .page{max-width:none;padding:0}
 .quick-nav,.sticker-section,#save{display:none!important}
 .candidate{min-height:28px}
 .office{break-inside:avoid}
 .category h2{break-after:avoid}
 a{text-decoration:none}
 .hero h1{font-size:36px}
}
@media screen and (max-width:360px){
 .page{padding-inline:18px}
 .hero h1{font-size:40px}
 .brand strong{font-size:15px}
 .brand .eyebrow{font-size:8px}
}

/* Remove the last occupied border in every responsive grid column. */
.office-grid>.office:last-child,.date-grid>.date:last-child{border-bottom:0}
@media screen and (min-width:740px) and (max-width:1099px){
 .office-grid>.office:nth-last-child(-n+2),.date-grid>.date:nth-last-child(-n+2){border-bottom:0}
}
@media screen and (min-width:1100px){
 .office-grid>.office:nth-last-child(-n+3),.date-grid>.date:nth-last-child(-n+3){border-bottom:0}
}