/* votefrisbie.com landing pages (/bills, /vote, /medical) — 2026-10-11 */
:root{
  --navy:#0A3161; --deep:#0C1F3D; --red:#B31942; --red-dk:#8F1435;
  --mist:#E3EBFF; --gold:#FBC63F; --paper:#FBFAF6; --ink:#1d2a3d; --muted:#4a5568;
  --green:#2E7D32;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:'Open Sans',Arial,sans-serif;font-weight:400;font-style:normal;color:var(--ink);background:#fff;line-height:1.55}
img{max-width:100%;display:block}
a{color:var(--navy)}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
.hd,.kick,.btn,.card h3,.sec-h,.vote-block h2,.chip{font-family:'Barlow Condensed','Arial Narrow',sans-serif}

/* top bar */
.top{background:#fff;border-bottom:4px solid var(--red)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.top img{height:40px;width:auto}
.top a.donate{font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:15px;color:#fff;background:var(--red);padding:7px 14px;border-radius:4px;text-decoration:none}

/* hero */
.hero{background:var(--navy);color:#fff;padding:22px 0 28px;position:relative;overflow:hidden}
.hero .kick{font-weight:700;font-size:22px;line-height:1.1;color:var(--mist);margin-bottom:8px}
.hero h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-style:italic;text-transform:uppercase;font-size:clamp(38px,10.5vw,68px);line-height:.94;letter-spacing:-.2px}
.hero h1 span{color:var(--gold)}
.hero .sub{margin-top:12px;font-size:17px;color:var(--mist);max-width:560px}
.chip{display:inline-block;margin-top:16px;background:var(--red);color:#fff;border-radius:6px;padding:8px 14px 9px;font-weight:900;font-size:clamp(22px,6.4vw,34px);line-height:1.02;letter-spacing:.3px}
.chip em{font-style:normal;font-weight:700}
.hero-grid{display:grid;gap:26px;align-items:center}
@media(min-width:820px){
  .hero{padding:48px 0 52px}
  .hero-grid{grid-template-columns:1.25fr 1fr}
  .hero .kick{font-size:28px}
}

/* bill graphic (from the Drop 2 mailer, side A) */
.billfig{position:relative;width:min(300px,82vw);margin:6px auto 4px;aspect-ratio:282/304}
.billfig .sheet{position:absolute;inset:0;border-radius:3px;box-shadow:0 4px 12px rgba(0,0,0,.35)}
.billfig .s1{background:#E6E3DA;transform:rotate(7deg) translate(6%,4%)}
.billfig .s2{background:#ECE9E1;transform:rotate(-9deg) translate(-4%,3%)}
.bill{position:absolute;inset:0;background:var(--paper);transform:rotate(-3deg);box-shadow:0 8px 20px rgba(0,0,0,.4);border-radius:3px;overflow:hidden;color:#2b3648;font-size:10px}
.bill .band{background:#33415A;color:#fff;padding:8px 12px 7px;display:flex;justify-content:space-between;align-items:center;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;letter-spacing:.8px}
.bill .band svg{width:17px;height:17px}
.bill .meta{display:flex;justify-content:space-between;padding:5px 12px 0;font-size:7px;letter-spacing:.5px;color:#6b7686;font-weight:600}
.bill .body{padding:4px 12px 0}
.bill .chart{display:flex;align-items:flex-end;gap:6px;height:60px;padding-top:6px;border-bottom:1.5px solid #2b3648}
.bill .c{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.bill .b{width:100%;background:#C3CBD7;border-radius:2px 2px 0 0}
.bill .c.hi .b{background:var(--red)}
.bill .c.gb .b{background:transparent;border:2px dashed var(--green);border-bottom:none}
.bill .c.gb .arr{color:var(--green);font-size:10px;line-height:1;margin-bottom:2px}
.bill .yrs{display:flex;gap:6px;font-size:6.6px;color:#6b7686;font-weight:700;margin-top:2px}
.bill .yrs span{flex:1;text-align:center}
.bill .yrs .g{color:var(--green)}
.bill .li{display:flex;justify-content:space-between;font-size:9.4px;padding:4px 0;border-bottom:1px dotted #b8bfca}
.bill .li .up{color:var(--red);font-weight:700}
.bill .li.cr{background:rgba(251,198,63,.55);margin:4px -6px 0;padding:5px 6px;border-bottom:none;border-radius:2px;font-weight:700;color:#1d2a3d}
.bill .li .dn{color:var(--green);font-weight:800;font-family:'Barlow Condensed',sans-serif;font-size:13px}
.bill .stub{position:absolute;left:0;right:0;bottom:0;height:15%;border-top:1.5px dashed #9aa3b1}
.billfig .scrawl{position:absolute;left:36%;bottom:-6%;transform:rotate(-7deg);font-family:'Barlow Condensed',sans-serif;font-style:italic;font-weight:900;color:var(--red);font-size:38px;white-space:nowrap;line-height:1;padding:8px 14px;border:3.4px solid var(--red);border-radius:50%;background:rgba(251,250,246,.9)}
.billfig .scrawl small{font-size:16px;font-weight:800}

/* hero photo (/medical) */
.hero-photo{border-radius:10px;overflow:hidden;border:4px solid #fff;box-shadow:0 10px 26px rgba(0,0,0,.35)}
.hero-photo img{width:100%;height:auto}

/* note from Steve */
.note{padding:34px 0 8px}
.note blockquote{border-left:5px solid var(--red);padding:2px 0 2px 18px;max-width:640px;font-size:18px;color:var(--navy)}
.note blockquote p{margin-bottom:12px}
.note .sig{width:140px;margin:2px 0 0 12px}
.note .sig-name{font-weight:700;color:var(--navy);margin-left:18px}

/* sections and cards */
.sec{padding:30px 0 36px}
.sec-h{font-weight:900;font-style:italic;text-transform:uppercase;color:var(--navy);font-size:clamp(30px,8vw,46px);line-height:.98;margin-bottom:6px}
.sec-h span{color:var(--red)}
.rule{width:84px;height:4px;background:var(--red);margin:10px 0 22px}
.cards{display:grid;gap:14px}
@media(min-width:700px){.cards{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.cards.three{grid-template-columns:1fr 1fr 1fr}}
.card{border:2px solid var(--navy);border-radius:10px;padding:18px 18px 20px;background:#fff}
.card.fill{background:var(--navy);color:var(--mist)}
.card h3{font-weight:900;font-style:italic;text-transform:uppercase;font-size:28px;line-height:1;color:var(--navy);margin-bottom:8px}
.card h3 span{color:var(--red);display:block}
.card.fill h3{color:#fff}
.card.fill h3 span{color:var(--gold)}
.card p{font-size:16px}
.card.link{background:var(--mist);border-color:var(--mist);text-decoration:none;color:var(--ink);display:block}
.card.link .more{display:inline-block;margin-top:10px;font-weight:700;color:var(--red)}

/* vote block */
.vote-block{background:var(--red);color:#fff;padding:30px 0 34px;text-align:center}
.vote-block h2{font-weight:900;font-style:italic;text-transform:uppercase;font-size:clamp(30px,8.4vw,48px);line-height:.98}
.vote-block .btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.btn{display:inline-block;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;font-size:18px;text-decoration:none;padding:13px 22px;border-radius:6px;min-width:200px;text-align:center}
.btn.white{background:#fff;color:var(--red)}
.btn.navy{background:var(--navy);color:#fff}
.btn.line{border:2px solid #fff;color:#fff}

/* /vote steps */
.steps{display:grid;gap:16px}
@media(min-width:880px){.steps{grid-template-columns:1fr 1fr 1fr}}
.step{border-radius:10px;border:2px solid var(--navy);overflow:hidden;background:#fff}
.step .n{background:var(--navy);color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:900;font-style:italic;text-transform:uppercase;font-size:26px;line-height:1.05;padding:12px 16px}
.step .n b{color:var(--gold);margin-right:6px}
.step ul{list-style:none;padding:14px 16px 16px}
.step li{padding:6px 0 6px 22px;position:relative;font-size:16px}
.step li:before{content:"";position:absolute;left:2px;top:14px;width:10px;height:10px;background:var(--red);border-radius:2px}
.step .go{display:inline-block;margin:0 16px 18px;font-weight:700;color:var(--red)}
.deadline{background:var(--gold);color:var(--deep);border-radius:8px;padding:12px 16px;margin-top:16px;font-weight:700;font-size:17px}
.deadline b{font-weight:800}
.ask{padding:26px 0 30px;text-align:center}
.ask p{font-size:20px;color:var(--navy);font-weight:700}
.ask p span{font-weight:400}

/* footer */
.foot{background:var(--deep);color:rgba(255,255,255,.75);padding:26px 0 30px;text-align:center;font-size:13px}
.foot .disc{display:inline-block;border:1px solid rgba(255,255,255,.4);padding:8px 12px;line-height:1.5;color:#fff}
.foot nav{margin-top:12px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.foot a{color:var(--mist)}