/* Home page (/) only. Ported from the legacy theme's style.css so the two
   agree section by section; see handover/home.md for the measurements.

   Holds every rule for .plu-tracker-card, .plu-endorsement-snapshot and
   .plu-corruption-float. All three appear on this page and nowhere else, so
   they are kept together and in their declaration order: several tie on
   specificity, and splitting them across two files would let load order decide
   the winner instead of declaration order.

   Design tokens and shared components stay in plu.css - see pages/README.md. */


.plu-tracker-card p { color: rgba(0,0,0,.68); font-size: 14px; line-height: 1.7; }
.plu-tracker-card { min-height: 430px; border: 1px solid var(--plu-line); background: #fff; }
.plu-tracker-card { padding: 28px 22px; }
.plu-tracker-card h3 { margin: 0 0 14px; font-size: 21px; line-height: 1.15; }
.plu-endorsement-snapshot { position: relative; display: flex; flex-direction: column; align-items: stretch; overflow: hidden; border-color: #050505; background: #050505; color: #fff; }
.plu-endorsement-snapshot::after { content: '“'; position: absolute; right: 8px; top: 58px; color: rgba(255,242,0,.08); font-family: Georgia,serif; font-size: 150px; line-height: .7; pointer-events: none; }
.plu-endorsement-snapshot .plu-eyebrow { color: var(--plu-yellow); }
.plu-endorsement-snapshot h3 { position: relative; z-index: 1; margin-bottom: 8px; color: #fff; font-size: 25px; }
.plu-endorsement-snapshot > p:not(.plu-eyebrow) { position: relative; z-index: 1; margin: 0; color: rgba(255,255,255,.58); font-size: 12px; line-height: 1.5; }
.plu-endorsement-snapshot__stage { position: relative; z-index: 1; min-height: 190px; flex: 1; margin: 14px 0 0; overflow: hidden; border-top: 1px solid rgba(255,255,255,.14); border-bottom: 1px solid rgba(255,255,255,.14); }
.plu-endorsement-snapshot__stage article { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; opacity: 0; pointer-events: none; transform: translateX(32px); transition: opacity .6s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.plu-endorsement-snapshot__stage article,
.plu-endorsement-snapshot blockquote,
.plu-endorsement-snapshot footer { width: 100%; box-sizing: border-box; }
.plu-endorsement-snapshot__stage article.is-active { opacity: 1; pointer-events: auto; transform: translateX(0); }
.plu-endorsement-snapshot__stage article > span { position: absolute; top: 14px; left: 0; color: var(--plu-yellow); font-family: Georgia,serif; font-size: 38px; line-height: 1; }
.plu-endorsement-snapshot blockquote { display: -webkit-box; margin: 0; padding: 26px 0 0 20px; overflow: hidden; color: #fff; font-size: 17px; line-height: 1.35; font-weight: 800; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.plu-endorsement-snapshot footer { margin: 16px 0 0 20px; padding-left: 10px; border-left: 3px solid var(--plu-red); }
.plu-endorsement-snapshot footer strong,
.plu-endorsement-snapshot footer small,
.plu-endorsement-snapshot footer em { display: block; }
.plu-endorsement-snapshot footer strong { color: var(--plu-yellow); font-size: 13px; }
.plu-endorsement-snapshot footer small,
.plu-endorsement-snapshot footer em { margin-top: 3px; color: rgba(255,255,255,.62); font-size: 10px; line-height: 1.3; font-style: normal; }
.plu-endorsement-snapshot__footer { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }
.plu-endorsement-snapshot .plu-mini-button { margin: 0; background: var(--plu-yellow); color: #000; }
.plu-endorsement-snapshot__controls { display: flex; align-items: center; gap: 7px; }
.plu-endorsement-snapshot__controls button { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.24); background: transparent; color: #fff; cursor: pointer; }
.plu-endorsement-snapshot__controls button:hover,
.plu-endorsement-snapshot__controls button:focus-visible { border-color: var(--plu-yellow); color: var(--plu-yellow); }
.plu-endorsement-snapshot__controls span { color: rgba(255,255,255,.5); font-size: 9px; font-weight: 800; }
.plu-endorsement-snapshot__controls b { color: #fff; }
.plu-endorsement-snapshot__progress { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: rgba(255,255,255,.14); }
.plu-endorsement-snapshot__progress i { display: block; width: 100%; height: 100%; background: var(--plu-yellow); transform: scaleX(0); transform-origin: left; }
.plu-endorsement-snapshot__progress i.is-running { animation: plu-endorsement-progress 6s linear forwards; }
.plu-endorsement-snapshot .plu-mini-button { margin: 0; background: var(--plu-yellow); color: #000; }
.home .plu-tracker-card { min-height: 390px; }
.home .plu-tracker-card { padding: 26px 22px; }
/* ---- Scroll reveal (the accountability strip is the only element that opts in) ---- */
[data-plu-reveal].is-reveal-pending { opacity: 0; transform: translateY(24px); }
[data-plu-reveal].is-revealed { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }

@media (prefers-reduced-motion: reduce) {
  [data-plu-reveal].is-reveal-pending,
  [data-plu-reveal].is-revealed { opacity: 1; transform: none; transition: none; }
}

/* ---- Persistent accountability shortcut: visible after intent, compact when idle ---- */
.plu-corruption-float { position:fixed;
  z-index:80;
  right:18px;
  bottom:24px;
  width:min(350px,calc(100vw - 36px));
  overflow:hidden;
  border-left:4px solid var(--plu-yellow);
  border-radius:4px;
  background:#050505;
  color:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.28);
  opacity:0;
  pointer-events:none;
  transform:translateX(calc(100% + 28px));
  transition:width 240ms ease,opacity 220ms ease,transform 280ms cubic-bezier(.2,.75,.25,1); }
.plu-corruption-float[hidden] { display:none; }
.plu-corruption-float.is-visible { opacity:1; pointer-events:auto; transform:translateX(0); }
.plu-corruption-float.is-suppressed { opacity:0; pointer-events:none; transform:translateY(18px); }
.plu-corruption-float > a { min-height:76px; display:grid; grid-template-columns:48px minmax(0,1fr) 24px; align-items:center; gap:12px; padding:12px 34px 12px 12px; color:#fff; text-decoration:none; }
.plu-corruption-float__icon { width:48px; height:48px; display:grid; place-items:center; flex:0 0 auto; background:var(--plu-yellow); color:#050505; }
.plu-corruption-float__icon svg { width:25px; height:25px; }
.plu-corruption-float__copy { min-width:0; display:block; }
.plu-corruption-float__copy small { display:block; overflow:hidden; color:var(--plu-yellow); font-size:10px; line-height:1.2; font-weight:850; text-transform:uppercase; text-overflow:ellipsis; white-space:nowrap; }
.plu-corruption-float__copy strong { display:block; overflow:hidden; margin-top:5px; font-size:15px; line-height:1.25; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.plu-corruption-float__arrow { color:var(--plu-yellow); font-size:21px; line-height:1; }
.plu-corruption-float__dismiss { position:absolute; z-index:2; top:3px; right:3px; width:28px; height:28px; display:grid; place-items:center; padding:0; border:0; background:transparent; color:rgba(255,255,255,.7); font:inherit; font-size:20px; line-height:1; cursor:pointer; }
.plu-corruption-float__dismiss:hover,
.plu-corruption-float__dismiss:focus-visible { color:#fff; outline:2px solid var(--plu-yellow); outline-offset:-2px; }
.plu-corruption-float.is-collapsed { width:64px; }
.plu-corruption-float.is-collapsed > a { grid-template-columns:48px; gap:0; padding:8px 6px; }
.plu-corruption-float.is-collapsed .plu-corruption-float__copy,
.plu-corruption-float.is-collapsed .plu-corruption-float__arrow,
.plu-corruption-float.is-collapsed .plu-corruption-float__dismiss { display:none; }

@media (max-width: 980px) {
  .home .plu-tracker-card { grid-column: 1 / -1; min-height: 0; display: grid; grid-template-columns: minmax(210px,.8fr) minmax(260px,1.2fr) auto; gap: 20px; align-items: center; }
  .home .plu-tracker-card h3,
  .home .plu-tracker-card p,
  .home .plu-tracker-card div,
  .home .plu-tracker-card a { margin: 0; }
  .home .plu-tracker-card .plu-eyebrow { grid-column: 1; }
  .home .plu-tracker-card h3 { grid-column: 1; }
  .home .plu-tracker-card > p:not(.plu-eyebrow) { grid-column: 2; grid-row: 1 / span 2; }
  .home .plu-tracker-card a { grid-column: 2; grid-row: 3; width: fit-content; }
  .home .plu-endorsement-snapshot { display: flex; padding: 28px; }
  .home .plu-endorsement-snapshot h3 { margin: 0 0 8px; }
  .home .plu-endorsement-snapshot__stage { min-height: 180px; margin-top: 14px; }
  .home .plu-endorsement-snapshot__footer { display: flex; margin-top: 14px; }
  .home .plu-endorsement-snapshot__footer a { width: auto; }
}

@media (max-width: 620px) {
  .home .plu-tracker-card { grid-column: auto; min-height: 0; display: block; padding: 24px 22px; }
  .home .plu-tracker-card h3,
  .home .plu-tracker-card p { margin-bottom: 14px; }
  .home .plu-endorsement-snapshot { display: flex; align-items: stretch; padding: 24px 22px; }
  .home .plu-endorsement-snapshot__stage { min-height: 220px; }
  .home .plu-endorsement-snapshot blockquote { font-size: 18px; -webkit-line-clamp: 5; }
  .home .plu-endorsement-snapshot__footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .plu-endorsement-snapshot__progress i.is-running { animation: none; transform: scaleX(1); }
  .plu-endorsement-snapshot__stage article { transition: none; }
}

@media (max-width: 760px) {
  .home .plu-endorsement-snapshot__stage { min-height: 210px; }
}

@media(max-width:700px) {
  .plu-corruption-float,
  .plu-corruption-float.is-collapsed { right:12px; bottom:max(12px,env(safe-area-inset-bottom)); left:12px; width:auto; border-top:3px solid var(--plu-yellow); border-left:0; }
  .plu-corruption-float > a,
  .plu-corruption-float.is-collapsed > a { min-height:64px; grid-template-columns:42px minmax(0,1fr) 20px; gap:10px; padding:9px 32px 9px 9px; }
  .plu-corruption-float__icon { width:42px; height:42px; }
  .plu-corruption-float__icon svg { width:22px; height:22px; }
  .plu-corruption-float.is-collapsed .plu-corruption-float__copy,
  .plu-corruption-float.is-collapsed .plu-corruption-float__arrow,
  .plu-corruption-float.is-collapsed .plu-corruption-float__dismiss { display:block; }
  .plu-corruption-float__copy strong { font-size:14px; }
}

@media(prefers-reduced-motion:reduce) {
  .plu-corruption-float { transition:none; }
}

/* ---- District Baraza preview ----------------------------------------------
   Ported from plu-core/assets/district-barazas.css. Barazas are not a content
   type: they are events carrying event_type="baraza". The full District Barazas
   page owns that stylesheet; only the two families this section renders are
   copied here, rather than sharing a file two sessions would both edit. */
.plu-baraza-card { min-width:0;border:1px solid #d9d9d9;background:#fff;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease }
.plu-baraza-card:hover { transform:translateY(-4px);border-color:#999;box-shadow:0 18px 38px rgba(0,0,0,.1) }
.plu-baraza-card__media { display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:#111;text-decoration:none }
.plu-baraza-card__media img { width:100%;height:100%;object-fit:cover;object-position:50% 35%;transition:transform .4s ease }
.plu-baraza-card:hover .plu-baraza-card__media img { transform:scale(1.025) }
.plu-baraza-card__media>span { position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#fff }
.plu-baraza-card__media b { font-size:65px;line-height:.85 }
.plu-baraza-card__media small { margin-top:8px;color:var(--baraza-yellow);font-weight:900;text-transform:uppercase }
.plu-baraza-card__body { padding:24px }
.plu-baraza-card__meta { display:flex;justify-content:space-between;gap:12px;margin-bottom:14px;color:#b51622;font-size:11px;font-weight:900;text-transform:uppercase }
.plu-baraza-card h3 { margin:0;font-size:24px;line-height:1.12;letter-spacing:0 }
.plu-baraza-card h3 a { color:#111;text-decoration:none }
.plu-baraza-card p { margin:14px 0 22px;color:var(--baraza-muted);font-size:15px;line-height:1.65 }
.plu-baraza-card footer { display:flex;flex-wrap:wrap;gap:7px 14px;padding-top:16px;border-top:1px solid #dedede;color:#555;font-size:12px }
.plu-baraza-card footer strong { width:100%;color:#111 }
.plu-baraza-home { padding:clamp(62px,8vw,105px) max(24px,calc((100vw - 1240px)/2));background:#f3f3f1 }
.plu-baraza-home__head { display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px }
.plu-baraza-home__head h2 { margin:0;font-size:clamp(38px,4.4vw,65px);line-height:1;letter-spacing:0 }
.plu-baraza-home__head p:not(.plu-eyebrow) { max-width:650px;margin:15px 0 0;color:#626262;font-size:17px }
.plu-baraza-home__head>a { color:#111;font-weight:900;text-decoration:none;border-bottom:3px solid var(--baraza-yellow) }
.plu-baraza-home__grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px }
.plu-baraza-card--compact .plu-baraza-card__body { padding:20px }
.plu-baraza-card--compact h3 { font-size:21px }
.plu-baraza-home__callout,
.plu-baraza-home__notice { display:flex;min-height:100%;flex-direction:column;align-items:flex-start;padding:28px;border:1px solid #111;background:#111;color:#fff }
.plu-baraza-home__callout { border-left:7px solid var(--baraza-yellow) }
.plu-baraza-home__notice { border-color:#d1d1d1;background:#fff;color:#111 }
.plu-baraza-home__callout h3,
.plu-baraza-home__notice h3 { margin:0;line-height:1.05;font-size:clamp(27px,2.4vw,38px);letter-spacing:0 }
.plu-baraza-home__callout p:not(.plu-eyebrow),
.plu-baraza-home__notice p:not(.plu-eyebrow) { margin:16px 0 26px;line-height:1.6 }
.plu-baraza-home__callout p:not(.plu-eyebrow) { color:#e5e5e5 }
.plu-baraza-home__notice p:not(.plu-eyebrow) { color:var(--baraza-muted) }
.plu-baraza-home__callout a { display:inline-flex;min-height:42px;align-items:center;margin-top:auto;padding:0 15px;background:var(--baraza-yellow);color:#111;font-size:13px;font-weight:900;text-decoration:none }

@media(max-width:1000px) {
  .plu-baraza-home__grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}

@media(max-width:680px) {
  .plu-baraza-home__grid { grid-template-columns:1fr }
  .plu-baraza-home { padding-inline:16px }
  .plu-baraza-home__head { align-items:flex-start;flex-direction:column }
  .plu-baraza-card:hover { transform:none }
}

@media(prefers-reduced-motion:reduce) {
  .plu-baraza-card,
  .plu-baraza-card__media img { transition:none }
}