/* ============================================================
   Justin Middaugh for MN House District 44A — Main Stylesheet
   ============================================================ */

/* ----- RESET & VARIABLES ----- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --navy:#1C3D6E;
  --navy-dk:#132c55;
  --navy-xdk:#0d1e3a;
  --red:#C8102E;
  --red-dk:#a50d25;
  --white:#fff;
  --off:#F3F5F9;
  --text:#111827;
  --muted:#5a6473;
}
html{scroll-behavior:smooth;}
body{font-family:'Source Sans 3',sans-serif;background:#fff;color:var(--text);overflow-x:hidden;}

/* ----- NAV ----- */
nav{
  position:sticky;top:0;z-index:200;
  background:var(--navy);border-bottom:3px solid var(--red);
  height:60px;display:flex;align-items:center;justify-content:space-between;
  padding:0 3rem;
}
.nav-brand{
  font-family:'Barlow Condensed',sans-serif;font-weight:900;
  font-size:1.25rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;
}
.nav-brand span{color:#fff;}
.nav-links{display:flex;align-items:center;gap:1.75rem;}
.nav-links a{
  color:rgba(255,255,255,.76);text-decoration:none;
  font-family:'Barlow Condensed',sans-serif;font-weight:700;
  font-size:.95rem;letter-spacing:.08em;text-transform:uppercase;
  transition:color .15s;
}
.nav-links a:hover{color:#fff;}
.nav-cta{background:var(--red)!important;color:#fff!important;padding:6px 18px;border-radius:4px;}
.nav-cta:hover{background:var(--red-dk)!important;}
.nav-social{display:inline-flex;align-items:center;color:rgba(255,255,255,.76)!important;transition:color .15s;}
.nav-social:hover{color:#fff!important;}
.fsocial{display:inline-flex;align-items:center;gap:.35rem;}

/* ----- BANNER ----- */
.banner-outer {
  background: var(--navy);
  width: 100%;
  line-height: 0;
}
.banner-outer img {
  width: 100%;
  display: block;
}

/* ----- HERO ----- */
.hero{
  background:var(--navy);
  display:grid;grid-template-columns:1fr 1fr;
  min-height:52vh;position:relative;overflow:hidden;
}
.hero-slant{
  position:absolute;top:0;bottom:0;right:0;width:46%;
  background:var(--navy-dk);
  clip-path:polygon(9% 0,100% 0,100% 100%,0 100%);
}
.hero-left{
  padding:3.5rem 2.5rem 3.5rem 4.5rem;
  position:relative;z-index:2;
  display:flex;flex-direction:column;justify-content:center;
}
.pill{
  display:inline-block;background:var(--red);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 14px;border-radius:3px;margin-bottom:1.4rem;width:fit-content;
}
.tagline{font-size:1.05rem;color:rgba(255,255,255,.7);line-height:1.7;max-width:400px;margin-bottom:2.25rem;}
.actions{display:flex;gap:1rem;flex-wrap:wrap;}
.btn-red{
  background:var(--red);color:#fff;font-weight:600;font-size:.97rem;
  padding:13px 32px;border-radius:5px;border:none;cursor:pointer;
  text-decoration:none;display:inline-flex;align-items:center;gap:7px;
  transition:background .2s,transform .2s;font-family:inherit;
}
.btn-red:hover{background:var(--red-dk);transform:translateY(-2px);}
.btn-ghost{
  background:transparent;color:#fff;font-weight:600;font-size:.97rem;
  padding:13px 26px;border-radius:5px;border:2px solid rgba(255,255,255,.3);
  cursor:pointer;text-decoration:none;
  transition:border-color .2s,background .2s;font-family:inherit;
}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.07);}
.hero-right{
  position:relative;z-index:2;
  padding:3.5rem 3rem 3.5rem 2rem;
  display:flex;flex-direction:column;justify-content:center;gap:1.1rem;
}
.icard{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  border-left:4px solid var(--red);border-radius:7px;padding:1.1rem 1.4rem;
}
.icard h4{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;
  font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.38);margin-bottom:.3rem;
}
.icard p{color:#fff;font-size:.92rem;line-height:1.58;}
.site-link{
  color:rgba(255,255,255,.36);font-size:.81rem;text-decoration:none;
  letter-spacing:.04em;margin-top:.2rem;display:inline-block;transition:color .15s;
}
.site-link:hover{color:#fff;}

/* ----- SECTION BASE ----- */
.sec{padding:4.5rem 4.5rem;}
.eyebrow{
  font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:.45rem;
}
.sec-h{
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(1.9rem,3.8vw,2.9rem);font-weight:900;
  text-transform:uppercase;letter-spacing:.04em;color:var(--navy);line-height:1.05;
}
.sec-intro{margin-top:.7rem;color:var(--muted);max-width:490px;line-height:1.7;font-size:.96rem;}

/* ----- ISSUES ----- */
.issues{background:var(--off);}
.ig{margin-top:2.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.1rem;}
.ic{
  background:#fff;border-radius:9px;padding:1.5rem;
  border-top:4px solid var(--navy);
  transition:transform .2s,box-shadow .2s;
}
.ic:nth-child(even){border-color:var(--red);}
.ic:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(27,58,107,.1);}
.ii{font-size:1.55rem;margin-bottom:.55rem;}
.ic h3{font-weight:700;font-size:.95rem;color:var(--navy);margin-bottom:.35rem;}
.ic p{font-size:.85rem;color:var(--muted);line-height:1.63;}

/* ----- ABOUT ----- */
.about{background:var(--navy);display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;}
.about .eyebrow{color:rgba(255,255,255,.42);}
.about .sec-h{color:#fff;}
.about p{color:rgba(255,255,255,.7);line-height:1.75;font-size:.96rem;margin-bottom:.85rem;}
.creds{display:flex;flex-direction:column;gap:.75rem;margin-top:1.2rem;}
.cred{display:flex;align-items:flex-start;gap:.75rem;}
.cb{width:4px;background:var(--red);border-radius:2px;flex-shrink:0;min-height:18px;align-self:stretch;margin-top:2px;}
.cred p{margin:0;font-size:.9rem;color:rgba(255,255,255,.76);line-height:1.52;}
.qblock{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:2.25rem;}
.qmark{font-family:'Barlow Condensed',sans-serif;font-size:4.5rem;font-weight:900;color:var(--red);line-height:.5;margin-bottom:.9rem;display:block;}
.qblock blockquote{font-size:1.08rem;color:#fff;line-height:1.7;font-style:italic;margin-bottom:1.2rem;}
.qcite{font-size:.8rem;color:rgba(255,255,255,.38);font-style:normal;letter-spacing:.04em;}

/* ----- VOLUNTEER ----- */
.volunteer{background:var(--off);}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;margin-top:2.5rem;}
.wlist{display:flex;flex-direction:column;gap:.85rem;}
.wi{background:#fff;border-radius:9px;padding:1.1rem 1.3rem;display:flex;align-items:flex-start;gap:.9rem;border-left:4px solid var(--navy);}
.wi:nth-child(even){border-color:var(--red);}
.wi-icon{font-size:1.35rem;flex-shrink:0;}
.wi h4{font-weight:700;font-size:.91rem;color:var(--navy);margin-bottom:.18rem;}
.wi p{font-size:.83rem;color:var(--muted);line-height:1.53;}
.vform{background:#fff;border-radius:11px;padding:2rem;box-shadow:0 4px 20px rgba(27,58,107,.08);}
.vform h3{font-family:'Barlow Condensed',sans-serif;font-size:1.4rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--navy);margin-bottom:1.4rem;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-bottom:.85rem;}
.fg{display:flex;flex-direction:column;gap:.32rem;margin-bottom:.85rem;}
.fg label{font-size:.72rem;font-weight:700;color:var(--navy);letter-spacing:.07em;text-transform:uppercase;}
.fg input{border:1.5px solid #D1D5DB;border-radius:5px;padding:9px 12px;font-size:.92rem;font-family:inherit;color:var(--text);outline:none;transition:border-color .15s;background:#fff;}
.fg input:focus{border-color:var(--navy);}
.checks{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.3rem;}
.chk{display:flex;align-items:center;gap:.5rem;font-size:.87rem;color:var(--text);cursor:pointer;}
.chk input{width:15px;height:15px;accent-color:var(--navy);cursor:pointer;}
.sbtn{width:100%;background:var(--red);color:#fff;font-weight:700;font-size:.96rem;padding:12px;border-radius:6px;border:none;cursor:pointer;font-family:inherit;transition:background .2s,transform .2s;}
.sbtn:hover{background:var(--red-dk);transform:translateY(-1px);}
.vsuccess{text-align:center;padding:2rem 1rem;}
.vsuccess .ck{font-size:2.25rem;margin-bottom:.45rem;}
.vsuccess h4{font-family:'Barlow Condensed',sans-serif;font-size:1.35rem;font-weight:800;text-transform:uppercase;color:var(--navy);margin-bottom:.35rem;}
.vsuccess p{color:var(--muted);font-size:.88rem;}

/* ----- DONATE ----- */
.donate{background:#fff;text-align:center;}
.donate .sec-h{color:var(--navy);}
.donate .sec-intro{margin:0 auto 2.25rem;text-align:center;}
.amts{display:flex;justify-content:center;gap:.65rem;flex-wrap:wrap;margin-bottom:1.6rem;}
.amt{background:var(--off);color:var(--navy);font-weight:700;font-size:.96rem;padding:10px 22px;border-radius:5px;border:2px solid transparent;cursor:pointer;transition:all .17s;font-family:inherit;}
.amt:hover{border-color:var(--navy);background:#fff;}
.amt.active{background:var(--navy);color:#fff;border-color:var(--navy);}
.dbtn{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;font-weight:700;font-size:1.03rem;padding:15px 46px;border-radius:7px;border:none;cursor:pointer;text-decoration:none;font-family:inherit;transition:background .2s,transform .2s;}
.dbtn:hover{background:var(--red-dk);transform:translateY(-2px);}
.legal{font-size:.7rem;color:#bbb;margin-top:1.3rem;line-height:1.6;}
.legal a{color:#bbb;}

/* ----- FOOTER ----- */
footer{background:var(--navy-xdk);border-top:4px solid var(--red);padding:2rem 4.5rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
.fn{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:1.1rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;}
footer p{color:rgba(255,255,255,.3);font-size:.75rem;margin-top:3px;}
.flinks{display:flex;gap:1.4rem;}
.flinks a{color:rgba(255,255,255,.38);text-decoration:none;font-size:.8rem;font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:color .15s;}
.flinks a:hover{color:#fff;}

/* ----- RESPONSIVE ----- */
@media(max-width:800px){
  .hero{grid-template-columns:1fr;}
  .hero-right,.hero-slant{display:none;}
  .hero-left{padding:3rem 2rem;}
  .sec{padding:3.5rem 2rem;}
  .about,.vgrid{grid-template-columns:1fr;}
  footer{padding:1.75rem 2rem;flex-direction:column;align-items:flex-start;}
  nav{padding:0 1.5rem;}
  .nav-links a:not(.nav-cta){display:none;}
  .frow{grid-template-columns:1fr;}
  .banner-inner{padding:36px 24px 32px;}
  .banner-outer{padding:24px 16px 0;}
}