/* ---------- site header ---------- */
.site-header{background:var(--navy);position:relative;z-index:50}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  padding-block:var(--sp-2)}
.site-header__logo img{width:clamp(150px,17vw,208px)}
.nav{display:flex;align-items:center;gap:clamp(10px,1.5vw,26px)}
.nav a{font-family:var(--font-display);font-weight:600;font-size:var(--step--1);
  color:#fff;text-decoration:none;padding:6px 2px;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{color:var(--mint);border-bottom-color:var(--mint)}
.nav .btn{padding:11px 20px}
.nav-toggle{display:none;background:none;border:2px solid rgba(255,255,255,.45);color:#fff;
  border-radius:10px;padding:9px 13px;font-family:var(--font-display);font-weight:700;font-size:14px}
@media (max-width:980px){
  .nav-toggle{display:block}
  .nav{position:absolute;top:100%;left:0;right:0;background:var(--navy);flex-direction:column;
    align-items:stretch;gap:0;padding:var(--sp-2) var(--sp-3) var(--sp-4);
    border-top:1px solid rgba(255,255,255,.14)}
  .nav[hidden]{display:none}
  .nav a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .nav .btn{margin-top:var(--sp-2);text-align:center}
}

/* ---------- hero ---------- */
.hero{background:var(--hero-gradient);overflow:hidden}
.hero__inner{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;
  gap:clamp(4px,2vw,40px);min-height:clamp(480px,74svh,720px)}
.hero__copy{flex:1 1 330px;min-width:0}
.hero__inner > picture{display:block;flex:0 1 auto;min-width:0}
.hero__copy{padding-block:clamp(36px,6vw,72px) clamp(28px,4vw,56px);align-self:center}
.hero h1{color:var(--navy-deep);margin-bottom:var(--sp-2)}
.hero__office{font-family:var(--font-display);font-weight:700;font-size:var(--step-1);
  color:var(--navy-deep);margin:0 0 var(--sp-2)}
.hero__ward{font-family:var(--font-display);font-weight:500;font-size:var(--step-1);
  color:var(--teal-deep);margin:0 0 var(--sp-4)}
.hero__photo{max-height:clamp(380px,72svh,700px);width:auto;align-self:end}
@media (max-width:900px){
  .hero__inner{gap:0}
  .hero__copy{flex:1 1 100%}
  .hero__photo{max-height:46svh;margin-inline:auto}
  .hero__copy{padding-bottom:var(--sp-3)}
}

/* ---------- intro with portrait ---------- */
.split{display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,64px);align-items:center}
.split > *{flex:1 1 310px;min-width:0}
.split > picture{display:block}
.split__media img{border-radius:var(--radius);box-shadow:var(--shadow)}

/* ---------- priority cards ---------- */
.card--priority{border-top:5px solid var(--teal)}
.card--priority .card__msg{font-family:var(--font-display);font-weight:600;
  color:var(--teal-deep);font-size:var(--step--1);margin-bottom:var(--sp-2)}

/* ---------- vote strip ---------- */
.vote{background:var(--navy);color:#fff}
.vote__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.vote__date{font-family:var(--font-display);font-weight:800;font-size:var(--step-3);color:#fff;margin:0}
.vote p{color:rgba(255,255,255,.8);margin:0}

/* ---------- footer ---------- */
.site-footer{background:var(--navy);color:rgba(255,255,255,.75);padding-block:var(--sp-6) var(--sp-4)}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--mint);text-decoration:underline}
.site-footer__grid{display:flex;flex-wrap:wrap;gap:var(--sp-5)}
.site-footer__grid > *{flex:1 1 215px;min-width:0}
.site-footer h3{color:#fff;font-size:var(--step--1);text-transform:uppercase;letter-spacing:.12em;margin-bottom:var(--sp-2)}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:10px;font-size:var(--step--1)}
.site-footer__logo img{width:190px;margin-bottom:var(--sp-3)}
.site-footer__legal{border-top:1px solid rgba(255,255,255,.16);margin-top:var(--sp-5);
  padding-top:var(--sp-3);font-size:13px;display:flex;flex-wrap:wrap;gap:var(--sp-3);justify-content:space-between}

/* ---------- photo placeholders ----------
   Branded, obviously provisional, and correctly proportioned so swapping in a
   real photograph later does not change any layout. Each one names the shot. */
.ph{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;margin:0;padding:var(--sp-4);text-align:center;
  background:
    repeating-linear-gradient(45deg,transparent 0 12px,rgba(31,175,170,.045) 12px 24px),
    var(--aqua);
  border:2px dashed rgba(31,175,170,.55);border-radius:var(--radius);
  min-height:clamp(220px,28vw,320px);overflow:hidden;
}
.ph::before{
  content:"";width:clamp(34px,4vw,50px);height:clamp(34px,4vw,50px);flex:none;
  background:url("../img/check-mark.png") center/contain no-repeat;opacity:.55;
}
.ph__label{font-family:var(--font-display);font-weight:700;font-size:var(--step--1);
  color:var(--teal-deep);line-height:1.25;margin:0;max-width:30ch}
.ph__hint{font-size:13px;line-height:1.45;color:var(--ink-soft);margin:0;max-width:36ch}
.ph__tag{
  position:absolute;top:10px;left:10px;font-family:var(--font-display);font-weight:800;
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  background:var(--teal);color:var(--navy);padding:4px 9px;border-radius:var(--radius-pill);
}
.ph--wide{min-height:clamp(200px,26vw,300px)}
.ph--banner{min-height:clamp(160px,18vw,240px)}
.ph--portrait{min-height:clamp(320px,38vw,460px)}
.ph--square{min-height:clamp(260px,30vw,360px)}
.ph--tall{min-height:clamp(340px,42vw,500px)}
.section--navy .ph{background:rgba(255,255,255,.05);border-color:rgba(0,226,178,.45)}
.section--navy .ph__label{color:var(--mint)}
.section--navy .ph__hint{color:rgba(255,255,255,.6)}

/* ---------- updates / event cards ---------- */
.card--update{padding:0;overflow:hidden}
.card--update .ph{border:0;border-radius:0;min-height:clamp(180px,20vw,230px)}
.card--update__body{padding:var(--sp-3) var(--sp-4) var(--sp-4);display:flex;flex-direction:column;flex:1}
.card__date{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--teal-deep);margin:0 0 var(--sp-1)}

/* ---------- media band ---------- */
.band{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.band > *{flex:1 1 200px;min-width:0}

/* ---------- priorities page ---------- */
.jump{position:relative;z-index:20;background:var(--white);
  border-bottom:1px solid var(--aqua-line);padding-block:var(--sp-2)}
.jump ul{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-3);list-style:none;margin:0;padding:0}
.jump a{font-family:var(--font-display);font-weight:600;font-size:var(--step--1);
  text-decoration:none;color:var(--navy-deep);padding:7px 0;border-bottom:2px solid transparent}
.jump a:hover{color:var(--teal-deep);border-bottom-color:var(--teal)}
.priority{scroll-margin-top:150px}
.priority__head{display:flex;align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-2)}
.priority__num{font-family:var(--font-display);font-weight:800;font-size:var(--step-4);
  color:var(--teal);line-height:1;flex:none}
.priority__summary{font-family:var(--font-display);font-weight:600;font-size:var(--step-2);
  color:var(--teal-deep);margin:0 0 var(--sp-4);max-width:34ch}
.checklist{list-style:none;margin:0 0 var(--sp-4);padding:0;max-width:var(--measure)}
.checklist li{position:relative;padding-left:34px;margin-bottom:12px;font-size:var(--step--1)}
.checklist li::before{content:"";position:absolute;left:0;top:3px;width:19px;height:19px;
  background:url("../img/check-mark.png") center/contain no-repeat}
.limits{background:var(--aqua);border-radius:var(--radius);padding:var(--sp-3) var(--sp-4);
  margin:0 0 var(--sp-4);max-width:var(--measure)}
.limits h3,.limits h4{margin-bottom:var(--sp-1);color:var(--navy-deep);font-size:var(--step-1)}
.limits p{font-size:var(--step--1);color:var(--ink-soft);margin:0}
.msg{border-left:5px solid var(--teal);padding:var(--sp-2) 0 var(--sp-2) var(--sp-3);margin:0}
.msg span{display:block;font-family:var(--font-display);font-weight:800;font-size:12px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
.msg strong{font-family:var(--font-display);font-size:var(--step-1);color:var(--navy-deep);font-weight:700}

/* ---------- forms ---------- */
.form{max-width:640px;background:var(--white);border:1px solid var(--aqua-line);
  border-radius:var(--radius);padding:var(--sp-4)}
.section--aqua .form{box-shadow:var(--shadow)}
.field{margin-bottom:var(--sp-3)}
.field label{display:block;font-family:var(--font-display);font-weight:600;
  font-size:var(--step--1);color:var(--navy-deep);margin-bottom:6px}
.field .hint{font-size:13px;color:var(--ink-soft);margin:0 0 6px}
.field input,.field textarea,.field select{
  width:100%;font-family:var(--font-body);font-size:var(--step-0);color:var(--ink);
  padding:12px 14px;border:2px solid var(--aqua-line);border-radius:10px;background:var(--white)}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--teal)}
.field textarea{min-height:130px;resize:vertical}
.req{color:#B3261E}
.checks{display:flex;flex-direction:column;gap:10px;margin-bottom:var(--sp-3)}
.check{display:flex;gap:11px;align-items:flex-start;font-size:var(--step--1)}
.check input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--teal)}
.consent{border-top:1px solid var(--aqua-line);padding-top:var(--sp-3);margin-top:var(--sp-3)}
.form__note{font-size:13px;color:var(--ink-soft);margin:var(--sp-3) 0 0}

/* ---------- notice banner ---------- */
.notice{background:var(--navy);color:#fff;padding:var(--sp-3) 0}
.notice p{margin:0;font-size:var(--step--1);color:rgba(255,255,255,.88);max-width:none}
.notice strong{color:var(--mint)}

/* ---------- definition rows ---------- */
.rows{border-top:1px solid var(--aqua-line);margin:0 0 var(--sp-4);max-width:var(--measure)}
.rows>div{display:flex;flex-wrap:wrap;gap:var(--sp-3);
  padding:var(--sp-3) 0;border-bottom:1px solid var(--aqua-line)}
.rows dt{flex:0 0 clamp(140px,22%,190px)}
.rows dd{flex:1 1 260px;min-width:0}
.rows dt{font-family:var(--font-display);font-weight:700;color:var(--navy-deep);font-size:var(--step--1)}
.rows dd{margin:0;font-size:var(--step--1)}
@media (max-width:620px){.rows>div{gap:4px}.rows dt{flex:1 1 100%}}
.reviewed{font-size:13px;color:var(--ink-soft);font-style:italic}

/* ---------- policy / long-form pages ---------- */
.prose{max-width:74ch}
.prose h2{font-size:var(--step-2);margin-top:var(--sp-6)}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:var(--step-1);margin-top:var(--sp-4)}
.prose ul{padding-left:0;list-style:none;margin:0 0 var(--sp-3);max-width:var(--measure)}
.prose ul li{position:relative;padding-left:22px;margin-bottom:9px}
.prose ul li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;
  border-radius:50%;background:var(--teal)}
.prose .rows{margin-top:var(--sp-3)}

/* ---------- project status ---------- */
.status{display:inline-block;font-family:var(--font-display);font-weight:800;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:var(--radius-pill);
  border:2px solid;white-space:nowrap}
.status--proposed{color:#7A5A00;border-color:#D9A800;background:#FFF6DC}
.status--approved{color:#0B5E8A;border-color:#2C8FC9;background:#E4F2FA}
.status--funded{color:#0A5C4E;border-color:#1E9E85;background:#E3F6F1}
.status--construction{color:#8A3A0B;border-color:#D2691E;background:#FCEEE3}
.status--complete{color:#2B5E12;border-color:#5C9E33;background:#EDF7E5}
.status-key{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 var(--sp-4)}
.project{border:1px solid var(--aqua-line);border-radius:var(--radius);padding:var(--sp-4);
  background:var(--white);margin-bottom:var(--sp-3);max-width:var(--measure)}
.project__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-2)}
.project h3{margin:0;font-size:var(--step-1)}
.project p{font-size:var(--step--1);margin-bottom:var(--sp-2)}
.project p:last-child{margin-bottom:0}

/* ---------- responsibility split ---------- */
.who{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.who__col{flex:1 1 280px;min-width:0}
.who__col{border-radius:var(--radius);padding:var(--sp-4);border:1px solid var(--aqua-line)}
.who__col--city{background:var(--aqua)}
.who__col--region{background:#F4F7FA}
.who__col h3{font-size:var(--step-1)}
.who__col ul{list-style:none;margin:0;padding:0}
.who__col li{position:relative;padding-left:20px;margin-bottom:8px;font-size:var(--step--1)}
.who__col li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;
  border-radius:50%;background:var(--teal)}

/* ---------- events ---------- */
.event{display:flex;flex-wrap:wrap;gap:var(--sp-4);align-items:flex-start;
  border:1px solid var(--aqua-line);border-radius:var(--radius);padding:var(--sp-4);
  background:var(--white);margin-bottom:var(--sp-3)}
.event__date{flex:0 0 auto;background:var(--navy);color:#fff;border-radius:var(--radius);padding:var(--sp-2) var(--sp-3);
  text-align:center;min-width:92px}
.event__date .m{display:block;font-family:var(--font-display);font-weight:700;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.event__date .d{display:block;font-family:var(--font-display);font-weight:800;font-size:var(--step-3);line-height:1.1}
.event h3{margin-bottom:var(--sp-2);font-size:var(--step-1)}
.event__meta{list-style:none;margin:0 0 var(--sp-2);padding:0;font-size:var(--step--1)}
.event__meta li{margin-bottom:5px}
.event__meta b{font-family:var(--font-display);font-weight:700;color:var(--navy-deep);
  display:inline-block;min-width:104px}
.event > div:last-child{flex:1 1 260px;min-width:0}

.empty{border:2px dashed var(--aqua-line);border-radius:var(--radius);
  padding:var(--sp-5);text-align:center;background:var(--aqua)}
.empty h3{margin-bottom:var(--sp-2)}
.empty p{margin-inline:auto}

/* ---------- do-not-publish banner ---------- */
.stop{background:#8A1C13;color:#fff;padding:var(--sp-4) 0;border-bottom:5px solid #FFD166}
.stop h2{color:#fff;font-size:var(--step-2);margin-bottom:var(--sp-2)}
.stop p{color:rgba(255,255,255,.92);margin-bottom:var(--sp-2);max-width:72ch}
.stop p:last-child{margin-bottom:0}
.stop strong{color:#FFD166}
.stop ul{list-style:none;margin:var(--sp-2) 0 0;padding:0;max-width:72ch}
.stop li{position:relative;padding-left:22px;margin-bottom:8px;font-size:var(--step--1);
  color:rgba(255,255,255,.92)}
.stop li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;
  border-radius:50%;background:#FFD166}

/* ---------- WPForms, restyled to match the campaign design ---------- */
.form .wpforms-container,
.form .wpforms-container-full{margin:0!important;padding:0!important}
.form .wpforms-form{margin:0}
.form .wpforms-head-container{display:none}          /* title/description come from the page */
.form .wpforms-field{padding:0 0 var(--sp-3)!important;max-width:none!important}
.form .wpforms-field-label{
  display:block!important;font-family:var(--font-display)!important;font-weight:600!important;
  font-size:var(--step--1)!important;color:var(--navy-deep)!important;margin:0 0 6px!important}
.form .wpforms-field-sublabel,
.form .wpforms-field-description{
  font-size:13px!important;color:var(--ink-soft)!important;margin:0 0 6px!important;font-style:normal!important}
.form .wpforms-field-description{margin:6px 0 0!important}
.form .wpforms-required-label{color:#B3261E!important}
.form input[type=text],.form input[type=email],.form input[type=tel],
.form input[type=url],.form input[type=number],.form textarea,.form select{
  width:100%!important;font-family:var(--font-body)!important;font-size:var(--step-0)!important;
  color:var(--ink)!important;padding:12px 14px!important;border:2px solid var(--aqua-line)!important;
  border-radius:10px!important;background:var(--white)!important;box-shadow:none!important;height:auto!important}
.form input:focus,.form textarea:focus,.form select:focus{
  outline:none!important;border-color:var(--teal)!important}
.form textarea{min-height:130px!important;resize:vertical}
.form ul.wpforms-field-required,.form .wpforms-field-checkbox ul,.form .wpforms-field-radio ul{
  list-style:none!important;margin:0!important;padding:0!important;
  display:flex;flex-direction:column;gap:10px}
.form .wpforms-field-checkbox li,.form .wpforms-field-radio li{
  display:flex!important;gap:11px;align-items:flex-start;font-size:var(--step--1);margin:0!important}
.form .wpforms-field-checkbox input,.form .wpforms-field-radio input{
  width:20px!important;height:20px!important;flex:none;margin:2px 0 0!important;accent-color:var(--teal)}
.form .wpforms-field-checkbox label,.form .wpforms-field-radio label{
  font-family:var(--font-body)!important;font-weight:400!important;font-size:var(--step--1)!important;
  color:var(--ink)!important;margin:0!important;display:inline!important}
.form .wpforms-submit-container{padding:0!important;margin-top:var(--sp-2)}
.form button.wpforms-submit,.form .wpforms-submit{
  display:inline-block!important;font-family:var(--font-display)!important;font-weight:700!important;
  font-size:var(--step--1)!important;letter-spacing:.02em!important;background:var(--teal)!important;
  color:var(--navy)!important;border:0!important;border-radius:var(--radius-pill)!important;
  padding:15px 30px!important;cursor:pointer;transition:background .15s ease,transform .15s ease;
  text-transform:none!important;width:auto!important}
.form button.wpforms-submit:hover{background:var(--teal-dark)!important;transform:translateY(-2px)}
.form .wpforms-error{color:#B3261E!important;font-size:13px!important;font-family:var(--font-body)!important}
.form input.wpforms-error,.form textarea.wpforms-error,.form select.wpforms-error{
  border-color:#B3261E!important}
.form .wpforms-confirmation-container-full,
.form div[class*="wpforms-confirmation"]{
  background:var(--aqua)!important;border:2px solid var(--teal)!important;
  border-radius:var(--radius)!important;padding:var(--sp-4)!important;margin:0!important;color:var(--ink)!important}
.form .wpforms-confirmation-container-full p{margin-bottom:var(--sp-2)}
.form .wpforms-confirmation-container-full p:last-child{margin-bottom:0}

/* Priorities cards — the explainer paragraphs get a wider measure than the site
   default (68ch), but stay short of the full card width, which would run to 107
   characters a line. Targets the card body (the middle of header/body/footer)
   structurally, because Elementor does not render custom classes on these
   containers. The default measure still applies everywhere else, including
   inside the two-up columns, where the text is already narrower than the cap. */
.page-id-158 article.e-con > div.e-con:nth-child(2) > .elementor-widget-text-editor p{
  max-width:90ch}