:root {
  --ink: #100d16; --panel: #1b1522; --panel2: #241a2d;
  --purple: #9d6bce; --purple-bright: #c59aff; --green: #b4ff43;
  --muted: #d0c7d7; --line: #493654; --cream: #fff4dc;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--cream); background:
  radial-gradient(ellipse at 50% -10%, #382242 0, transparent 55%), var(--ink);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
}
a { color: var(--purple-bright); }
a:hover { color: var(--green); }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 1rem; top: 1rem; z-index: 10; background: #fff; color: #000; padding: .7rem; }
header { border-bottom: 1px solid var(--line); background: rgba(16,13,22,.94); }
.nav-wrap { max-width: 1160px; margin: auto; padding: 1rem 1.25rem; display:flex; gap:1rem; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.brand { font-family: Georgia, serif; text-decoration:none; color:var(--cream); font-weight:800; font-size:1.25rem; letter-spacing:.03em; }
.brand span { color:var(--green); }
nav { display:flex; flex-wrap:wrap; gap:.4rem; }
nav a { text-decoration:none; color:var(--muted); padding:.45rem .7rem; border-radius:8px; font-size:.94rem; }
nav a[aria-current="page"], nav a:hover { color:var(--cream); background:var(--panel2); }
main { max-width:1160px; margin:auto; padding:2rem 1.25rem 4rem; }
.eyebrow { color:var(--green); text-transform:uppercase; font-size:.78rem; letter-spacing:.18em; font-weight:800; }
h1,h2,h3 { font-family: Georgia, "Times New Roman", serif; line-height:1.15; }
h1 { font-size:clamp(2.4rem, 6vw, 4.7rem); margin:.4rem 0 1rem; letter-spacing:-.035em; }
h2 { font-size:clamp(1.7rem, 4vw, 2.5rem); }
h3 { font-size:1.3rem; }
.lede { max-width:720px; color:var(--muted); font-size:1.12rem; }
.hero { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:2rem; padding:2rem 0 3rem; }
.hero-art { position:relative; }
.hero-art img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center; border-radius:18px; border:1px solid #62476f; box-shadow:0 20px 70px #0009; }
.no-image { min-height:360px; display:grid; place-items:center; text-align:center; padding:2rem; background:linear-gradient(145deg,#281a31,#101014); border:1px solid var(--line); border-radius:18px; color:var(--green); font-family:Georgia,serif; font-size:2rem; }
.actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.5rem; }
.button { display:inline-block; padding:.8rem 1.05rem; border-radius:9px; background:var(--green); color:#17111c; text-decoration:none; font-weight:800; }
.button.secondary { background:transparent; border:1px solid var(--purple); color:var(--cream); }
.section-head { margin:2rem 0 1rem; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.card { background:linear-gradient(145deg,var(--panel2),var(--panel)); border:1px solid var(--line); border-radius:14px; padding:1.25rem; }
.card .symbol { font-size:1.6rem; color:var(--green); }
.card p, .point p { color:var(--muted); }
.page-intro { padding:2rem 0 1.2rem; }
.points { display:grid; gap:.85rem; margin:1.5rem 0 2rem; }
.point { display:grid; grid-template-columns:3.2rem 1fr; gap:1rem; align-items:start; padding:1.15rem; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.number { display:grid; place-items:center; width:2.8rem; height:2.8rem; border-radius:50%; background:#33233f; color:var(--green); font-family:Georgia,serif; font-weight:800; font-size:1.2rem; }
.point h2 { font-size:1.35rem; margin:.15rem 0 .35rem; }
.point p { margin:.25rem 0; }
.note { padding:1rem 1.15rem; border-left:3px solid var(--green); background:#1b2115; color:var(--muted); border-radius:0 8px 8px 0; }
footer { border-top:1px solid var(--line); background:#0b0910; color:var(--muted); }
.footer-wrap { max-width:1160px; margin:auto; padding:1.5rem 1.25rem; display:flex; gap:1rem; justify-content:space-between; flex-wrap:wrap; font-size:.9rem; }
footer p { margin:0; }
@media (max-width: 760px) {
  .nav-wrap { align-items:flex-start; }
  nav { width:100%; }
  nav a { padding:.45rem .55rem; }
  main { padding-top:1rem; }
  .hero { grid-template-columns:1fr; gap:1.5rem; padding-top:1.3rem; }
  .hero-art { order:-1; }
  .hero-art img { aspect-ratio: 4/3; max-height:480px; }
  .grid { grid-template-columns:1fr; }
  .point { grid-template-columns:2.5rem 1fr; gap:.75rem; padding:.9rem; }
  .number { width:2.35rem; height:2.35rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }


/* Shared campaign heading and wide desktop hero */
.site-banner {
  margin: 1.2rem 0 0;
  padding: clamp(1rem, 3vw, 1.8rem);
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(115deg, #24162e, #151019 65%, #202315);
  box-shadow: 0 10px 35px #0005;
}
.site-banner h1 {
  max-width: 1050px;
  margin: 0 auto;
  text-align: center;
  font-size: clamp(1.65rem, 3.8vw, 3.1rem);
  line-height: 1.12;
}
@media (min-width: 761px) {
  .hero-art img { aspect-ratio: 16 / 9; object-position: center 42%; }
}
@media (max-width: 760px) {
  .site-banner { margin-top: .8rem; }
  .site-banner h1 { font-size: clamp(1.55rem, 7vw, 2.3rem); }
  .hero-art img { aspect-ratio: 4 / 3; object-position: center 38%; }
}


/* Full-viewport-width campaign artwork */
.full-bleed-hero {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #09070d;
  line-height: 0;
  overflow: hidden;
}
.full-bleed-hero img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
@media (min-width: 761px) {
  .full-bleed-hero img {
    width: 100%;
    height: auto;
  }
}
@media (max-width: 760px) {
  .full-bleed-hero img {
    width: 100%;
    height: auto;
  }
}


/* Corrected layout: wide campaign banner only on the home page */
.full-bleed-hero {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #09070d;
  line-height: 0;
  overflow: hidden;
}
.full-bleed-hero img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Ballot-box art belongs beside the content, not in place of the banner */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  align-items: center;
  gap: clamp(1.25rem, 3vw, 2.5rem);
}
.hero-art img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 560px;
  object-fit: cover;
  object-position: center;
  border-radius: 14px;
  border: 1px solid #62476f;
  box-shadow: 0 18px 50px #0009;
}
.page-intro.with-ballot {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 270px);
  align-items: center;
  gap: clamp(1rem, 3vw, 2rem);
}
.page-intro.with-ballot .ballot-thumb {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
  border: 1px solid #62476f;
  box-shadow: 0 14px 40px #0008;
}
@media (max-width: 760px) {
  .hero { grid-template-columns: 1fr; }
  .hero-art { order: 2; }
  .hero-art img { aspect-ratio: 1 / 1; max-height: 440px; }
  .page-intro.with-ballot { grid-template-columns: 1fr; }
  .page-intro.with-ballot .ballot-thumb {
    max-width: 320px;
    justify-self: center;
  }
}


/* Voter-page headers are left-aligned; square cauldron artwork sits beside them */
.page-intro.with-ballot {
  text-align: left;
}
.page-intro.with-ballot h1,
.page-intro.with-ballot h2,
.page-intro.with-ballot p {
  text-align: left;
}
.page-intro.with-ballot .ballot-thumb {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
}


/* Align the three voter-page titles to the left edge of the content column */
.page-intro.with-ballot {
  text-align: left !important;
  justify-items: start;
}
.page-intro.with-ballot h1,
.page-intro.with-ballot h2,
.page-intro.with-ballot p {
  text-align: left !important;
  margin-left: 0;
}
.page-intro.with-ballot .ballot-thumb {
  width: 100%;
  max-width: 360px;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  object-position: center;
  justify-self: start;
}
@media (max-width: 760px) {
  .page-intro.with-ballot {
    grid-template-columns: 1fr;
  }
  .page-intro.with-ballot .ballot-thumb {
    width: 100%;
    max-width: 420px;
    justify-self: start;
  }
}


/* Voter pages: headline in the eyebrow position, with a half-width 4:3 image */
.page-intro.with-ballot {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(1.25rem, 3vw, 2.5rem);
  text-align: left !important;
  justify-items: stretch;
}
.page-intro.with-ballot h1,
.page-intro.with-ballot h2,
.page-intro.with-ballot p,
.page-intro.with-ballot .eyebrow {
  text-align: left !important;
  margin-left: 0;
}
.page-intro.with-ballot .ballot-thumb {
  width: 100%;
  max-width: none;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  object-position: center;
  justify-self: stretch;
}
@media (max-width: 760px) {
  .page-intro.with-ballot {
    grid-template-columns: 1fr;
  }
  .page-intro.with-ballot .ballot-thumb {
    width: 100%;
    max-width: 520px;
    justify-self: start;
  }
}


/* Voter-page main heading: large white title spanning the full text column */
.page-intro.with-ballot .voter-page-heading {
  display: block;
  grid-column: 1 / -1;
  width: 100%;
  color: var(--cream);
  text-align: left;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4.5vw, 3.5rem);
  line-height: 1.1;
  margin: 0 0 1rem;
  padding: 0;
}

/* Custom styles */
.float-right {
  float: right;
  margin-left: 20px;   /* Pushes text away from the left side of the image */
  margin-bottom: 10px; /* Pushes text away from the bottom of the image */
  width: 25%;
  height: auto;
}
.large_green_header {
	color:var(--green); 
	text-transform:uppercase; 
	font-size:1.78rem; 
	letter-spacing:.18em; 
	font-weight:800; 
}
.broom_icon {
	width:2.2rem; 
	height:2.2rem;
}