/*
  People & Planet Prize Winners page — shared stylesheet.
  Desktop Figma 6jVr7YbefLWCQjcGuvD59L node 2001:34947 · Mobile Qkw1rAqYvxShVppu34QlEv node 1611:6745.
  One block per section pair; each section gates its desktop/mobile variant at 768px.
*/

/* People & Planet Prize Winners — Hero.
 *
 * Desktop Figma 6jVr7YbefLWCQjcGuvD59L node 2001:34949, mobile Qkw1rAqYvxShVppu34QlEv
 * node 1611:6748. Both variants render at all viewports; the 768px gate hides one.
 */

.pppw-hero--desktop { display: block; }
.pppw-hero--mobile  { display: none; }
@media (max-width: 768px) {
    .pppw-hero--desktop { display: none; }
    .pppw-hero--mobile  { display: block; }
}

/* ============================== Desktop (2001:34949) ============================== */

/* Section — Blue/10 #151C32 bg, 92px vertical / 112px gutters on the 1440 frame, 48px stack gap. */
.pppw-hero--desktop {
    position: relative;
    overflow: hidden;
    background: #151C32;
    padding: 92px 112px;
    font-family: 'Inter', sans-serif;
    box-sizing: border-box;
}
/* Decorative vectorized SVGs (2001:36268 / 2001:36358) — opacity baked into the files. */
.pppw-hero__deco {
    position: absolute;
    display: block;
    pointer-events: none;
}
/* image 138 — leaf + soundwaves, 162×248 at x 1312, y 376 (clipped by right edge). */
.pppw-hero__deco--right {
    left: 1312px;
    top: 376px;
    width: 162px;
    height: 248px;
}
/* image 137 — tree, 170×228 at x -30, y 765. */
.pppw-hero__deco--left {
    left: -30px;
    top: 765px;
    width: 170px;
    height: 228px;
}
/* Hero Text (2001:34950) — centered column, 20px gaps. */
.pppw-hero__intro {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
/* Eyebrow (2001:34951) — 28px icon + 12px gap, Huge/Regular 20/28 teal #2FB8A9. */
.pppw-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
}
.pppw-hero__eyebrow-icon { display: block; width: 28px; height: 28px; }
.pppw-hero__eyebrow-text {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    color: #2FB8A9;
    white-space: nowrap;
}
/* Heading (2001:34954) — Display lg/Semibold 48/60, tracking -0.96, white. */
.pppw-hero__heading {
    margin: 0;
    font-size: 48px;
    line-height: 60px;
    font-weight: 600;
    letter-spacing: -0.96px;
    color: #FFFFFF;
    text-align: center;
}
/* Sub (2001:34955) — Text xl/Medium 20/30, Blue/2 #C8CEE4. */
.pppw-hero__sub {
    margin: 0;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    color: #C8CEE4;
    text-align: center;
}
/* Divider row (2001:34956) — 48px below intro, label + 1px #465DA6 line, 8px gap. */
.pppw-hero__divider {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 48px;
}
/* Label — Text md/Medium 16/24, Blue/2 #C8CEE4. */
.pppw-hero__divider-label {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #C8CEE4;
    white-space: nowrap;
}
.pppw-hero__divider-line {
    flex: 1 0 0;
    height: 1px;
    background: #465DA6;
}
/* Cards row (2001:34959) — 48px gap, equal-height white cards. */
.pppw-hero__cards {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: 48px;
    margin-top: 48px;
}
/* Article-search card (2001:34960) — white, radius 12, pad 12/12/16, Shadow 0 4 28 7%. */
.pppw-hero__card {
    flex: 1 0 0;
    min-width: 1px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 12px 12px 16px;
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0px 4px 28px 0px rgba(0, 0, 0, 0.07);
    text-decoration: none;
    box-sizing: border-box;
}
.pppw-hero__card-media { position: relative; }
/* Cover wrapper (2001:34961) — radius 8, clipped; image 1600:1066, cover. */
.pppw-hero__card-img-wrap {
    border-radius: 8px;
    overflow: hidden;
}
.pppw-hero__card-img {
    display: block;
    width: 100%;
    aspect-ratio: 1600 / 1066;
    object-fit: cover;
}
/* Champion seal (2001:34973) — 92×92 over the cover's bottom-right corner. */
.pppw-hero__card-seal {
    position: absolute;
    right: 28px;
    bottom: -36px;
    width: 92px;
    height: 92px;
    box-shadow: 0px 0.821px 8.214px 0px rgba(0, 0, 0, 0.07);
    border-radius: 50%;
    z-index: 1;
}
/* Body (2001:34963) — 8px gap, 4px side inset. */
.pppw-hero__card-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 0 4px;
}
/* Category badge — px12 py4, radius 16, Text sm/Medium 14/20. */
.pppw-hero__card-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 16px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    white-space: nowrap;
}
/* People — Brand/700 #5E69A8 on Brand/50 #EBF1FF. */
.pppw-hero__card-badge--people { background: #EBF1FF; color: #5E69A8; }
/* Planet — Secondary/800 #1C6E65 on Secondary/50 #EAF8F6. */
.pppw-hero__card-badge--planet { background: #EAF8F6; color: #1C6E65; }
/* Title (2001:34965) — Huge/Medium 20/28 Semibold, #1C1C1C. */
.pppw-hero__card-title {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    color: #1C1C1C;
}
/* Date & Read (2001:34966) — 1px #F0F0F0 top rule, 16px above content, 12px gap. */
.pppw-hero__card-footer {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border-top: 1px solid #F0F0F0;
    padding-top: 16px;
    margin-top: auto;
}
/* Planet card variant (2001:34980) carries a 4px side inset in Figma. */
.pppw-hero__card-footer--inset { padding-left: 4px; padding-right: 4px; }
/* Avatar (2001:34967) — 72px circle, 2.25px #D9D9D9 ring. */
.pppw-hero__card-avatar {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    width: 72px;
    height: 72px;
    background: #FFFFFF;
    border: 2.25px solid #D9D9D9;
    border-radius: 50%;
    overflow: hidden;
    box-sizing: border-box;
}
.pppw-hero__card-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Meta column (2001:34969) — 4px gaps. */
.pppw-hero__card-meta {
    flex: 1 0 0;
    min-width: 1px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}
/* Author — Text md/Semibold 16/24, Brand/700 #5E69A8. */
.pppw-hero__card-author {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #5E69A8;
}
/* Role — Text md/Regular 16/24, heading black 88%. */
.pppw-hero__card-role {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.88);
}
/* Bio — Text md/Regular 16/24, description black 45%. */
.pppw-hero__card-bio {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.45);
}

/* ============================== Mobile (1611:6748) ============================== */

/* Section — Blue/9 #1C2542 bg, 48px vertical / 16px gutters on the 390 frame, 24px stack gap. */
.pppw-hero--mobile {
    background: #1C2542;
    padding: 48px 16px;
    font-family: 'Inter', sans-serif;
    box-sizing: border-box;
}
/* Hero Text (1611:6749) — 8px gaps. */
.pppw-hero-m__intro {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
/* Eyebrow (1611:6750) — 16px globe icon + 8px gap, Small/Regular 12/20 teal. */
.pppw-hero-m__eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
}
.pppw-hero-m__eyebrow-icon { display: block; width: 16px; height: 16px; flex-shrink: 0; }
.pppw-hero-m__eyebrow-text {
    margin: 0;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    color: #2FB8A9;
    white-space: nowrap;
}
/* Heading (1611:6753) — Heading/2 Bold 30/38, white, 2 lines. */
.pppw-hero-m__heading {
    margin: 0;
    font-size: 30px;
    line-height: 38px;
    font-weight: 700;
    color: #FFFFFF;
}
/* Sub (1611:6754) — Base/Regular 14/22, Blue/2 #C8CEE4. */
.pppw-hero-m__sub {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: #C8CEE4;
}
/* Divider row (1611:6755) — 24px below intro, label + 1px #465DA6 line, 8px gap. */
.pppw-hero-m__divider {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
}
/* Label — Text xs/Regular 12/18, Blue/2 #C8CEE4. */
.pppw-hero-m__divider-label {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    color: #C8CEE4;
    white-space: nowrap;
}
.pppw-hero-m__divider-line {
    flex: 1 0 0;
    height: 1px;
    background: #465DA6;
}
/* Article-search card (1611:6758) — white, radius 16, pad 8/8/12, shadow 25 35 110 12%, stacked 24px apart. */
.pppw-hero-m__card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 24px;
    padding: 8px 8px 12px;
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 25px 35px 110px 0px rgba(0, 0, 0, 0.12);
    text-decoration: none;
    box-sizing: border-box;
}
.pppw-hero-m__card-media { position: relative; }
/* Cover wrapper (1611:6759) — radius 8, clipped; image 1600:1066, cover. */
.pppw-hero-m__card-img-wrap {
    border-radius: 8px;
    overflow: hidden;
}
.pppw-hero-m__card-img {
    display: block;
    width: 100%;
    aspect-ratio: 1600 / 1066;
    object-fit: cover;
}
/* Champion seal (1611:6771) — 62×62 over the cover's bottom-right corner. */
.pppw-hero-m__card-seal {
    position: absolute;
    right: 20px;
    bottom: -20px;
    width: 62px;
    height: 62px;
    box-shadow: 0px 0.821px 8.214px 0px rgba(0, 0, 0, 0.07);
    border-radius: 50%;
    z-index: 1;
}
/* Body (1611:6761) — 6px gap, 4px side inset. */
.pppw-hero-m__card-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 0 4px;
}
/* Category badge — px8 py2, radius 16, Text xs/Regular 12/20, multiply blend. */
.pppw-hero-m__card-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 16px;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    white-space: nowrap;
    mix-blend-mode: multiply;
}
.pppw-hero-m__card-badge--people { background: #EBF1FF; color: #5E69A8; }
/* Planet — mobile uses #269387 on #EAF8F6. */
.pppw-hero-m__card-badge--planet { background: #EAF8F6; color: #269387; }
/* Title (1611:6763) — Base/Medium 14/22 Semibold, #1C1C1C. */
.pppw-hero-m__card-title {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    font-weight: 600;
    color: #1C1C1C;
}
/* Date & Read (1611:6764) — 1px #F0F0F0 top rule, 12px above content, 8px gap. */
.pppw-hero-m__card-footer {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    border-top: 1px solid #F0F0F0;
    padding-top: 12px;
}
/* Avatar (1611:6765) — 40px circle, 1.25px #D9D9D9 ring. */
.pppw-hero-m__card-avatar {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    background: #FFFFFF;
    border: 1.25px solid #D9D9D9;
    border-radius: 50%;
    overflow: hidden;
    box-sizing: border-box;
}
.pppw-hero-m__card-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Meta column (1611:6767) — 4px gaps. */
.pppw-hero-m__card-meta {
    flex: 1 0 0;
    min-width: 1px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}
/* Author — Text sm/Semibold 14/20, Brand/700 #5E69A8. */
.pppw-hero-m__card-author {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    color: #5E69A8;
}
/* Role — Text xs/Regular 12/18, heading black 88%. */
.pppw-hero-m__card-role {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.88);
}
/* Bio — Text xs/Regular 12/18, description black 45%. */
.pppw-hero-m__card-bio {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.45);
}

/* Winners intro band — desktop Figma 6jVr7YbefLWCQjcGuvD59L 2001:34988,
 * mobile Figma Qkw1rAqYvxShVppu34QlEv 1611:6786. */

.pppw-intro--desktop { display: block; }
.pppw-intro--mobile  { display: none; }
@media (max-width: 768px) {
    .pppw-intro--desktop { display: none; }
    .pppw-intro--mobile  { display: block; }
}

/* Section root — Brand/25 background on both variants. */
.pppw-intro {
    font-family: 'Inter', sans-serif;
    background: #F6F9FF;
}

/* Desktop section — 72px/112px padding (2001:34988). */
.pppw-intro--desktop { padding: 72px 112px; }
/* 1440 − 2×112 gutters → 1216 row, heading left / description right (2001:34989). */
.pppw-intro--desktop .pppw-intro__container {
    box-sizing: border-box;
    max-width: 1216px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Heading — 88% black on both variants (2001:34992 / 1611:6788). */
.pppw-intro__heading {
    margin: 0;
    color: rgba(0, 0, 0, 0.88);
    white-space: nowrap;
}
/* Display md/Semibold 36/44, −0.72px (2001:34992). */
.pppw-intro--desktop .pppw-intro__heading {
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
    letter-spacing: -0.72px;
}

/* Description — #595959 regular on both variants (2001:34993 / 1611:6789). */
.pppw-intro__desc {
    margin: 0;
    color: #595959;
    font-weight: 400;
}
/* Text md/Regular 16/24, right-aligned 487px column (2001:34993). */
.pppw-intro--desktop .pppw-intro__desc {
    width: 487px;
    font-size: 16px;
    line-height: 24px;
    text-align: right;
}

/* Mobile section — 32px/16px padding (1611:6786). */
.pppw-intro--mobile { padding: 32px 16px; }
/* Stacked column, gap 12 (1611:6787). */
.pppw-intro--mobile .pppw-intro__container {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}
/* Heading/4 Bold 20/28 (1611:6788). */
.pppw-intro--mobile .pppw-intro__heading {
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
}
/* Base/Regular 14/22, full width (1611:6789). */
.pppw-intro--mobile .pppw-intro__desc {
    font-size: 14px;
    line-height: 22px;
    width: 100%;
}

/* ============================================================
   People & Planet Prize Winners — Winners List
   Desktop: 6jVr7YbefLWCQjcGuvD59L node 2001:34994
   Mobile:  Qkw1rAqYvxShVppu34QlEv node 1611:6790
   ============================================================ */

/* Desktop/mobile gate */
.pppw-list--desktop { display: block; }
.pppw-list--mobile  { display: none; }
@media (max-width: 768px) {
    .pppw-list--desktop { display: none; }
    .pppw-list--mobile  { display: block; }
}

/* ---------- Desktop ---------- */
.pppw-list--desktop {
    font-family: 'Inter', sans-serif;
    background: #FFFFFF;
    padding: 72px 112px;
}
.pppw-list--desktop .pppw-list__group { display: flex; flex-direction: column; gap: 32px; }
.pppw-list--desktop .pppw-list__group + .pppw-list__group { margin-top: 80px; }

.pppw-list__divider { display: flex; align-items: center; gap: 8px; height: 30px; }
.pppw-list__divider-label { font-size: 20px; font-weight: 400; line-height: 30px; color: #000000; opacity: 0.6; white-space: nowrap; }
.pppw-list__divider-line { flex: 1 0 0; border-top: 1px solid #D9D9D9; }

.pppw-list__rows { display: flex; flex-direction: column; gap: 60px; }
.pppw-list__row { display: flex; gap: 32px; align-items: flex-start; }

.pppw-list__card {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex: 1 0 0;
    min-width: 1px;
    gap: 16px;
    align-items: flex-start;
    text-decoration: none;
}
.pppw-list__thumb {
    display: block;
    width: 220px;
    height: 160px;
    flex-shrink: 0;
    border: 0.9px solid #F0F0F0;
    border-radius: 8px;
    overflow: hidden;
}
.pppw-list__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

.pppw-list__text { display: flex; flex-direction: column; flex: 1 0 0; min-width: 1px; gap: 12px; }
.pppw-list__head { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.pppw-list__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
}
.pppw-list__chip--people { background: #EBF1FF; color: #5E69A8; }
.pppw-list__chip--planet { background: #EAF8F6; color: #1C6E65; }
.pppw-list__title { font-size: 16px; font-weight: 600; line-height: 24px; color: #1C1C1C; overflow: hidden; }
.pppw-list__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; max-width: 375px; }
.pppw-list__author { font-size: 16px; font-weight: 400; line-height: 24px; color: #465DA6; white-space: nowrap; }
.pppw-list__dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(0, 0, 0, 0.88); }
.pppw-list__org { font-size: 16px; font-weight: 400; line-height: 24px; color: rgba(0, 0, 0, 0.45); white-space: nowrap; }
.pppw-list__badge { position: absolute; left: 146px; top: 120px; width: 62px; height: 62px; }

/* ---------- Mobile ---------- */
.pppw-list--mobile {
    font-family: 'Inter', sans-serif;
    background: #FFFFFF;
    display: none;
    flex-direction: column;
    gap: 20px;
    padding: 20px 16px;
}
@media (max-width: 768px) {
    .pppw-list--mobile { display: flex; }
}

.pppw-list__m-divider { display: flex; align-items: center; gap: 8px; }
.pppw-list__m-divider-label { font-size: 12px; font-weight: 400; line-height: 18px; color: #000000; opacity: 0.6; white-space: nowrap; }
.pppw-list__m-divider-line { flex: 1 0 0; border-top: 1px solid #D9D9D9; }

.pppw-list__m-row {
    box-sizing: border-box;
    position: relative;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    width: 100%;
    text-decoration: none;
}
.pppw-list__m-row--pb20 { padding-bottom: 20px; }
.pppw-list__m-row--pb16 { padding-bottom: 16px; }
.pppw-list__m-row--border { border-bottom: 1px solid #F0F0F0; }

.pppw-list__m-thumb {
    display: block;
    width: 72px;
    height: 72px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
}
.pppw-list__m-thumb--border { border: 1px solid #F0F0F0; }
.pppw-list__m-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

.pppw-list__m-text { display: flex; flex-direction: column; flex: 1 0 0; min-width: 1px; gap: 4px; align-items: flex-start; }
.pppw-list__m-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
    mix-blend-mode: multiply;
}
.pppw-list__m-chip--people { background: #EBF1FF; color: #5E69A8; }
.pppw-list__m-chip--planet { background: #EAF8F6; color: #269387; }
.pppw-list__m-title { font-size: 14px; font-weight: 600; line-height: 22px; color: rgba(0, 0, 0, 0.88); }
.pppw-list__m-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; max-width: 375px; }
.pppw-list__m-author { font-size: 12px; font-weight: 400; line-height: 20px; color: #465DA6; white-space: nowrap; }
.pppw-list__m-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(0, 0, 0, 0.88); }
.pppw-list__m-org { font-size: 12px; font-weight: 400; line-height: 20px; color: rgba(0, 0, 0, 0.45); white-space: nowrap; }
.pppw-list__m-badge { position: absolute; left: 40px; top: 56.29px; width: 28px; height: 28px; }

/* All Submissions — desktop Figma 6jVr7YbefLWCQjcGuvD59L 2001:35016,
 * mobile Figma Qkw1rAqYvxShVppu34QlEv 1611:6905. */

.pppw-subs--desktop { display: block; }
.pppw-subs--mobile  { display: none; }
@media (max-width: 768px) {
    .pppw-subs--desktop { display: none; }
    .pppw-subs--mobile  { display: block; }
}

/* Section root — white on both variants. */
.pppw-subs {
    font-family: 'Inter', sans-serif;
    background: #FFFFFF;
}

/* Shared control resets. */
.pppw-subs button { font-family: 'Inter', sans-serif; }
.pppw-subs__search-input,
.pppw-subs__search-btn,
.pppw-subs__select,
.pppw-subs__chip,
.pppw-subs__btn,
.pppw-subs__thumb,
.pppw-subs__card { box-sizing: border-box; }

/* Filtered-out entries (2001:35016 / 1611:6905 client-side search). */
.pppw-subs__card--hidden { display: none !important; }
.pppw-subs__row--hidden  { display: none !important; }

/* ============================== Desktop ============================== */

/* Section — 52px top / 72px bottom / 112px gutters, 32px stack gap (2001:35016). */
.pppw-subs--desktop { padding: 52px 112px 72px; }
.pppw-subs--desktop .pppw-subs__inner {
    max-width: 1216px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

/* Heading + filter block — 20px gap (2001:35017). */
.pppw-subs--desktop .pppw-subs__head {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
/* "All Submissions" — 36/44 semibold, -0.72px tracking (2001:35018). */
.pppw-subs--desktop .pppw-subs__heading {
    margin: 0;
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
    letter-spacing: -0.72px;
    color: rgba(0, 0, 0, 0.88);
}

/* Filter row — 16px gaps, baseline-aligned to control bottoms (2001:35019). */
.pppw-subs--desktop .pppw-subs__filters {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    width: 100%;
}
.pppw-subs--desktop .pppw-subs__filters-left {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 16px;
    align-items: flex-end;
}
.pppw-subs--desktop .pppw-subs__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.pppw-subs--desktop .pppw-subs__field--search { width: 384px; }
.pppw-subs--desktop .pppw-subs__field--select { width: 280px; }
/* Field labels — 14/20 medium Gray/700 (2001:35022, select label). */
.pppw-subs--desktop .pppw-subs__label {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #414651;
}

/* Search control — 44px input + attached 40px button (I2001:35023). */
.pppw-subs--desktop .pppw-subs__search {
    display: flex;
    width: 100%;
    height: 44px;
}
.pppw-subs--desktop .pppw-subs__search-input {
    flex: 1;
    min-width: 0;
    height: 44px;
    margin-right: -1px;
    padding: 7px 11px;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 8px 0 0 8px;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.88);
}
.pppw-subs .pppw-subs__search-input::placeholder { color: rgba(0, 0, 0, 0.25); }
.pppw-subs--desktop .pppw-subs__search-btn {
    flex: none;
    width: 40px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 0 8px 8px 0;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
    cursor: pointer;
}

/* Vertical divider between search and select — 1×44 #D9D9D9 (2001:35024). */
.pppw-subs--desktop .pppw-subs__divider {
    flex: none;
    width: 1px;
    height: 44px;
    background: #D9D9D9;
}

/* Year select — 44px, Gray/300 border, Shadow/xs (I2001:35025;1096:3583). */
.pppw-subs--desktop .pppw-subs__select {
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #FFFFFF;
    border: 1px solid #D5D7DA;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(10, 13, 18, 0.05);
    cursor: pointer;
}
/* "2026 Winners" — 16/24 medium Gray/900 (I2001:35025;1096:3639). */
.pppw-subs--desktop .pppw-subs__select-value {
    flex: 1;
    min-width: 0;
    text-align: left;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #181D27;
}
.pppw-subs--desktop .pppw-subs__select svg { flex: none; }

/* "Clear all" / "Show More Winners" — 16/24 semibold Gray/700 (2001:35027 / 2001:35098). */
.pppw-subs--desktop .pppw-subs__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 10px 18px;
    background: #FFFFFF;
    border: 1px solid #D5D7DA;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(10, 13, 18, 0.05);
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    color: #414651;
    cursor: pointer;
    white-space: nowrap;
}

/* Card grid — two rows, 24px apart, rows pad 12px below (2001:35028/35029/35063). */
.pppw-subs--desktop .pppw-subs__grid {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.pppw-subs--desktop .pppw-subs__row {
    display: flex;
    gap: 32px;
    padding-bottom: 12px;
}
/* Article card — image + text, 12px apart (2001:35030). */
.pppw-subs--desktop .pppw-subs__card {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-decoration: none;
}
/* Thumbnail — 208px tall, 12px radius, badge inset 8px (2001:35031). */
.pppw-subs--desktop .pppw-subs__thumb {
    position: relative;
    width: 100%;
    height: 208px;
    border-radius: 12px;
    overflow: hidden;
}
/* Bujji thumb carries a hairline Gray/4 border in Figma (2001:35054). */
.pppw-subs--desktop .pppw-subs__thumb--bordered { border: 0.9px solid #F0F0F0; }
.pppw-subs--desktop .pppw-subs__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Category badge — 4/12 padding, 16px radius, 14/20 medium (I2001:35033). */
.pppw-subs--desktop .pppw-subs__badge {
    position: absolute;
    top: 8px;
    left: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
}
.pppw-subs--desktop .pppw-subs__badge--people { background: #EBF1FF; color: #5E69A8; }
.pppw-subs--desktop .pppw-subs__badge--planet { background: #EAF8F6; color: #1C6E65; }

/* Title + meta — 8px gap; first card uses 12px in Figma (2001:35048 vs 2001:35035). */
.pppw-subs--desktop .pppw-subs__text {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pppw-subs--desktop .pppw-subs__text--loose { gap: 12px; }
/* Title — 16/24 semibold #1C1C1C (2001:35036). */
.pppw-subs--desktop .pppw-subs__title {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    color: #1C1C1C;
}
/* Author · org row — 8px column / 4px row gaps (2001:35037). */
.pppw-subs--desktop .pppw-subs__meta {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 8px;
    row-gap: 4px;
    width: 100%;
}
.pppw-subs--desktop .pppw-subs__author {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #465DA6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 4px dot, 88% black (2001:35040 Ellipse 67). */
.pppw-subs--desktop .pppw-subs__dot {
    flex: none;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.88);
}
.pppw-subs--desktop .pppw-subs__org {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ============================== Mobile ============================== */

/* Section — 20px top / 48px bottom / 16px gutters, 20px stack gap (1611:6905). */
.pppw-subs--mobile { padding: 20px 16px 48px; }
.pppw-subs--mobile .pppw-subs__inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* "All Submissions" — 16/24 bold, 88% black (1611:6906). */
.pppw-subs--mobile .pppw-subs__heading {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.88);
}

/* Search + year chip row — 16px gap (1611:6907). */
.pppw-subs--mobile .pppw-subs__filters {
    display: flex;
    gap: 16px;
    width: 100%;
}
.pppw-subs--mobile .pppw-subs__search {
    flex: 1;
    min-width: 0;
    display: flex;
    height: 40px;
}
.pppw-subs--mobile .pppw-subs__search-input {
    flex: 1;
    min-width: 0;
    height: 40px;
    margin-right: -1px;
    padding: 7px 11px;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 8px 0 0 8px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    color: rgba(0, 0, 0, 0.88);
}
.pppw-subs--mobile .pppw-subs__search-btn {
    flex: none;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 0 8px 8px 0;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
    cursor: pointer;
}

/* "2026 Winners" chip — 10/16 padding, Gray/300 border, Shadow/xs (1611:6909). */
.pppw-subs--mobile .pppw-subs__chip {
    flex: none;
    height: 40px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #FFFFFF;
    border: 1px solid #D5D7DA;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(10, 13, 18, 0.05);
    cursor: pointer;
}
.pppw-subs--mobile .pppw-subs__chip-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #262626;
    white-space: nowrap;
}
.pppw-subs--mobile .pppw-subs__chip svg { flex: none; }

/* Count + clear row (1611:6920). */
.pppw-subs--mobile .pppw-subs__count-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}
/* "100 winners shown" — 14/20 semibold Gray/7 (1611:6921). */
.pppw-subs--mobile .pppw-subs__count {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #8C8C8C;
}
/* "Clear Filters" — 14/20 semibold Brand/700 text button (I1611:6922). */
.pppw-subs--mobile .pppw-subs__clear {
    padding: 0;
    background: none;
    border: none;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #5E69A8;
    cursor: pointer;
}

/* List row — 12px gap, 16px pad below, hairline divider (1611:6923). */
.pppw-subs--mobile .pppw-subs__row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 16px;
    border-bottom: 1px solid #F0F0F0;
    text-decoration: none;
}
/* 72px square thumb, 8px radius; inner image 118px wide, centered (1611:6924/6925). */
.pppw-subs--mobile .pppw-subs__thumb {
    flex: none;
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    justify-content: center;
}
.pppw-subs--mobile .pppw-subs__img {
    flex: none;
    width: 118px;
    height: 72px;
    object-fit: cover;
}
.pppw-subs--mobile .pppw-subs__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
/* Category badge — 2/8 padding, 12/20 regular, multiply blend (I1611:6927). */
.pppw-subs--mobile .pppw-subs__badge {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 16px;
    mix-blend-mode: multiply;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
}
.pppw-subs--mobile .pppw-subs__badge--people { background: #EBF1FF; color: #5E69A8; }
.pppw-subs--mobile .pppw-subs__badge--planet { background: #EAF8F6; color: #269387; }
/* Title — 14/22 semibold, 88% black (1611:6928). */
.pppw-subs--mobile .pppw-subs__title {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: rgba(0, 0, 0, 0.88);
}
/* Author · org row — 6px column / 2px row gaps (1611:6929). */
.pppw-subs--mobile .pppw-subs__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 6px;
    row-gap: 2px;
    width: 100%;
}
.pppw-subs--mobile .pppw-subs__author {
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    color: #465DA6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 3px dot, 88% black (1611:6931 Ellipse 68). */
.pppw-subs--mobile .pppw-subs__dot {
    flex: none;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.88);
}
.pppw-subs--mobile .pppw-subs__org {
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* "Show More Winners" — full width, 8/14 padding, 14/20 semibold (I1611:6996). */
.pppw-subs--mobile .pppw-subs__btn {
    width: 100%;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    background: #FFFFFF;
    border: 1px solid #D5D7DA;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(10, 13, 18, 0.05);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #414651;
    cursor: pointer;
}

/* Winners CTA band — "Inspired by these stories?".
 * Desktop Figma 6jVr7YbefLWCQjcGuvD59L 2001:35099, mobile Qkw1rAqYvxShVppu34QlEv 1611:6997. */

.pppw-cta--desktop { display: block; }
.pppw-cta--mobile  { display: none; }
@media (max-width: 768px) {
    .pppw-cta--desktop { display: none; }
    .pppw-cta--mobile  { display: block; }
}

/* Band — Blue/9 #1C2542; art bleeds past the right edge so clip it. */
.pppw-cta {
    position: relative;
    overflow: hidden;
    background: #1C2542;
    font-family: 'Inter', sans-serif;
}

/* Desktop stack — padding 100px 80px on the 1440 frame, centered, gap 24 (2001:35099). */
.pppw-cta__container {
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    margin: 0 auto;
    padding: 100px 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
/* Mobile band 1611:6997 — padding 48px 20px, 335px stack, gap 14. */
.pppw-cta__container--mobile {
    box-sizing: content-box; /* keep the 335px stack exact beside 20px gutters */
    max-width: 335px;
    padding: 48px 20px;
    gap: 14px;
}

/* Heading — Heading/H3: Inter Bold 48/1.2, tracking -1.44px, white. */
.pppw-cta__heading {
    margin: 0;
    font-size: 48px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -1.44px;
    color: #FFFFFF;
    text-align: center;
}
/* Mobile heading — 24/32 Bold, tracking -0.72px. */
.pppw-cta__heading--mobile {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.72px;
}

/* Lead — Body/xlarge: 18/1.5, tracking -0.54px, Gray/6 #BFBFBF. */
.pppw-cta__lead {
    margin: 0;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: -0.54px;
    color: #BFBFBF;
    text-align: center;
}
/* Mobile lead — Base/Regular 14/22, Gray/5 #D9D9D9, no tracking. */
.pppw-cta__lead--mobile {
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0;
    color: #D9D9D9;
}

/* Button row — gap 24 desktop. */
.pppw-cta__buttons { display: flex; gap: 24px; align-items: flex-start; }
/* Mobile row — gap 16, buttons share the 335px width. */
.pppw-cta__buttons--mobile { gap: 16px; width: 100%; }

/* Buttons — Text md/Semibold 16/24, px20 py12, radius 8, Shadow/xs. */
.pppw-cta__button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
    white-space: nowrap;
    transition: background 120ms ease-out, color 120ms ease-out, border-color 120ms ease-out;
}
/* Mobile buttons — Text sm/Semibold 14/20, px16 py10, equal widths. */
.pppw-cta__button--mobile {
    flex: 1 0 0;
    min-width: 1px;
    padding: 10px 16px;
    font-size: 14px;
    line-height: 20px;
}
/* Primary — Brand/600 #465DA6 fill + border, white label, 20px arrow-up-right icon. */
.pppw-cta__button--primary {
    background: #465DA6;
    border-color: #465DA6;
    color: #FFFFFF;
}
.pppw-cta__button--primary:hover { background: #38489E; border-color: #38489E; color: #FFFFFF; }
.pppw-cta__button-icon { flex-shrink: 0; }
/* Secondary — white fill, Gray/300 #D5D7DA border, Gray/700 #414651 label. */
.pppw-cta__button--secondary {
    background: #FFFFFF;
    border-color: #D5D7DA;
    color: #414651;
}
.pppw-cta__button--secondary:hover { border-color: #465DA6; color: #465DA6; }

/* Stewardship logo art — 293x489 crop at right -50px, 5% opacity (2001:35099). */
.pppw-cta__art {
    position: absolute;
    top: 0;
    right: -50px;
    width: 293px;
    height: 489px;
    opacity: 0.05;
    overflow: hidden;
    pointer-events: none;
}
/* Wide logomark scaled to crop height; left edge of the mark shows. */
.pppw-cta__art img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 610.28%;
    max-width: none;
}
/* Mobile art — 149x249 crop at right -25px, 6% opacity (1611:6997). */
.pppw-cta__art--mobile {
    right: -25px;
    width: 149px;
    height: 249px;
    opacity: 0.06;
}

/* ---- Live-data additions (add-hero.css) ---- */
/* ===== Hero champion cards — overflow protection for live CMS data (append-only) ===== */

/* Long titles clamp to 2 lines so the two cards keep equal rhythm. */
.pppw-hero__card-title,
.pppw-hero-m__card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: break-word;
}
/* Role line clamps to 2 lines. */
.pppw-hero__card-role,
.pppw-hero-m__card-role {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: break-word;
}
/* Bio clamps to 3 lines. */
.pppw-hero__card-bio,
.pppw-hero-m__card-bio {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    overflow-wrap: break-word;
}
/* Author name is click-navigable (profile) inside the card anchor. */
.pppw-hero__card-author,
.pppw-hero-m__card-author {
    cursor: pointer;
    overflow-wrap: break-word;
}

/* ---- Live-data additions (add-list.css) ---- */
/* Winners List — live-data additions (append to people-planet-prize-winners.css) */

/* Odd-count last desktop row: lone card keeps half width instead of stretching */
.pppw-list__row > .pppw-list__card:only-child { flex: 0 1 calc(50% - 16px); }

/* Real titles can run long — clamp to 3 lines */
.pppw-list__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.pppw-list__m-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

/* Long org names wrap instead of overflowing the card */
.pppw-list__org,
.pppw-list__m-org { white-space: normal; }

/* ---- Live-data additions (add-subs.css) ---- */
/* ===== All Submissions — live-data additions (SCD-482) ===== */

/* Year controls host an invisible native select for interaction. */
.pppw-subs__select,
.pppw-subs__chip { position: relative; }
.pppw-subs__select-native {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    border: 0;
    opacity: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

/* Clamp long live titles to two lines. */
.pppw-subs__title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Keep desktop cards one-third wide when a row is partially filtered out. */
.pppw-subs--desktop .pppw-subs__card { flex: 0 0 calc((100% - 64px) / 3); }