/* ============================================================
   UDM v2 — interior pages bridge  ·  udm-pages.css
   Loads AFTER the layout's legacy inline <style>, so these rules
   win and lift the existing content pages (About, History,
   Leadership, Blog, Downloads, Contact, Donate) into the v2 look
   without rewriting each page's markup.
   ============================================================ */

/* ---- Shared page hero (v2) ---- */
.udm-page-hero {
    background: var(--udm-night);
    color: var(--udm-white);
    padding: 72px 0 64px;
    position: relative;
    overflow: hidden;
}

.udm-page-hero::after {
    content: "";
    position: absolute;
    right: -180px;
    top: -180px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: repeating-conic-gradient(from 0deg, rgba(242, 183, 5, .18) 0deg 3deg, rgba(242, 183, 5, 0) 3deg 10deg);
    -webkit-mask-image: radial-gradient(circle, #000 0, transparent 70%);
    mask-image: radial-gradient(circle, #000 0, transparent 70%);
    pointer-events: none;
}

.udm-page-hero__label {
    position: relative;
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin: 0 0 10px;
}

.udm-page-hero__title {
    position: relative;
    font-size: clamp(44px, 6vw, 76px);
    max-width: 900px;
}

.udm-page-hero__title span {
    color: var(--udm-accent);
}

.udm-page-hero__desc {
    position: relative;
    color: rgba(255, 255, 255, .82);
    font-size: 18px;
    line-height: 1.6;
    max-width: 620px;
    margin: 18px 0 0;
}

/* ============================================================
   Legacy content-component bridges
   (these class names are defined in the layout inline <style>;
   the rules below load later and override them to the v2 look)
   ============================================================ */

/* Section headings */
.udm-section-title {
    font-family: 'Archivo', sans-serif;
    font-stretch: 118%;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
    font-size: clamp(30px, 4vw, 48px);
    color: var(--udm-ink);
}

.udm-section-subtitle {
    color: var(--udm-muted);
    font-size: 18px;
    line-height: 1.6;
}

.udm-section-bar {
    width: 56px;
    height: 4px;
    border-radius: 2px;
    background: var(--udm-accent);
}

.udm-section-label,
.udm-eyebrow {
    color: var(--udm-primary);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.udm-bg-light {
    background: var(--udm-surface);
}

/* Cards */
.udm-card {
    border: 1px solid var(--udm-border);
    border-radius: var(--udm-radius);
    box-shadow: none;
    transition: transform .25s var(--udm-ease), box-shadow .25s var(--udm-ease);
    background: var(--udm-white);
}

.udm-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--udm-shadow);
}

.card-icon {
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.udm-value-card,
.udm-leader-card {
    border-radius: var(--udm-radius);
}

/* Buttons — reshape the legacy brand buttons into v2 pills */
.btn-udm,
.btn-udm-nav,
.btn-donate-nav,
.btn-udm-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: var(--udm-radius-pill);
    font-weight: 700;
    border: 0;
    transition: transform .2s var(--udm-ease), box-shadow .2s var(--udm-ease), background .2s ease;
}

.btn-udm,
.btn-udm-nav {
    background: var(--udm-primary);
    color: var(--udm-white);
}

.btn-udm:hover,
.btn-udm-nav:hover {
    background: var(--udm-primary-dark);
    color: var(--udm-white);
    transform: translateY(-2px);
    box-shadow: var(--udm-shadow);
}

.btn-donate-nav {
    background: var(--udm-accent);
    color: var(--udm-accent-ink);
}

.btn-donate-nav:hover {
    color: var(--udm-accent-ink);
    transform: translateY(-2px);
    box-shadow: var(--udm-shadow);
}

.btn-udm-outline {
    background: transparent;
    color: var(--udm-primary);
    box-shadow: inset 0 0 0 2px var(--udm-primary);
}

.btn-udm-outline:hover {
    background: var(--udm-primary);
    color: var(--udm-white);
}

/* Button text colour must beat the base `.udm-v2 a` link colour */
.udm-v2 .btn-udm,
.udm-v2 .btn-udm-nav {
    color: var(--udm-white);
}

.udm-v2 .btn-donate-nav {
    color: var(--udm-accent-ink);
}

.udm-v2 .btn-udm-outline {
    color: var(--udm-primary);
}

.udm-v2 .btn-udm:hover,
.udm-v2 .btn-udm-nav:hover,
.udm-v2 .btn-udm-outline:hover {
    color: var(--udm-white);
}

/* ---- Empty state (no data / no search results) ---- */
.udm-empty {
    max-width: 580px;
    margin: 32px auto;
    text-align: center;
    padding: 48px 24px;
}

.udm-empty__logo {
    width: 104px;
    height: 104px;
    margin: 0 auto 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 50% 40%, rgba(211, 0, 15, .12), transparent 70%),
        var(--udm-surface-2);
}

.udm-empty__logo img {
    width: 62%;
    max-width: 70px;
    opacity: .92;
}

.udm-empty__title {
    font-family: 'Archivo', sans-serif;
    font-stretch: 112%;
    font-weight: 800;
    letter-spacing: -.01em;
    font-size: clamp(22px, 3vw, 28px);
    color: var(--udm-ink);
    margin: 0 0 10px;
}

.udm-empty__text {
    color: var(--udm-muted);
    font-size: 16px;
    line-height: 1.6;
    margin: 0 auto 24px;
    max-width: 460px;
}

.udm-empty__cta {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Timeline (History page) accents */
.udm-timeline-badge {
    background: var(--udm-primary) !important;
    color: var(--udm-white) !important;
}

/* ============================================================
   Leader profile page  (LeaderProfile.cshtml)
   ============================================================ */
.udm-profilehero__inner {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.udm-profilehero__photo {
    width: 300px;
    height: 360px;
    border-radius: var(--udm-radius);
    overflow: hidden;
    background: rgba(255, 255, 255, .06);
    box-shadow: 0 30px 60px rgba(0, 0, 0, .4);
}

.udm-profilehero__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.udm-profilehero__photo.udm-logo-ph img {
    width: 55% !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Hover-cycle: stacked frames cross-fade through the leader's photos on hover */
.udm-profilehero__photo[data-hover-cycle] { position: relative; cursor: pointer; }

.udm-profilehero__frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .55s ease;
}

.udm-profilehero__frame.is-active { opacity: 1; }

/* Little "has more photos" hint that turns into progress dots */
.udm-profilehero__dots {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .42);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity .3s ease;
    z-index: 2;
    pointer-events: none;
}

.udm-profilehero__photo[data-hover-cycle]:hover .udm-profilehero__dots { opacity: 1; }

.udm-profilehero__dots i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .45);
    transition: background .3s ease, width .3s ease;
}

.udm-profilehero__dots i.is-active { background: #fff; width: 14px; border-radius: 999px; }

.udm-profilehero__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .78);
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 18px;
    text-decoration: none;
}

.udm-profilehero__back:hover { color: var(--udm-accent); }

.udm-profilehero__name {
    font-family: 'Archivo', sans-serif;
    font-stretch: 116%;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.02;
    font-size: clamp(38px, 5.5vw, 64px);
    margin: 6px 0 8px;
    color: #fff;
}

.udm-profilehero__role {
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 19px;
    margin: 0 0 20px;
}

.udm-profilehero__chips {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 26px;
}

.udm-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .14);
    color: rgba(255, 255, 255, .9);
    font-size: 14px;
    font-weight: 600;
}

.udm-profilehero__ctas {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* Body */
.udm-profilebody {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: 52px;
    align-items: start;
}

.udm-profilebody__h {
    font-family: 'Archivo', sans-serif;
    font-stretch: 112%;
    font-weight: 800;
    font-size: clamp(26px, 3vw, 36px);
    color: var(--udm-ink);
    margin: 0 0 18px;
}

.udm-profilebody__text {
    color: var(--udm-muted);
    font-size: 18px;
    line-height: 1.75;
    white-space: pre-line;
    margin: 0 0 24px;
}

.udm-profilebody__note {
    padding: 16px 20px;
    border-left: 4px solid var(--udm-accent);
    background: var(--udm-surface);
    border-radius: 0 var(--udm-radius-sm) var(--udm-radius-sm) 0;
    color: var(--udm-ink);
    font-size: 15px;
}

.udm-factcard {
    border: 1px solid var(--udm-border);
    border-radius: var(--udm-radius);
    padding: 26px;
    background: var(--udm-white);
    box-shadow: var(--udm-shadow);
}

.udm-factcard__h {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 20px;
    margin: 0 0 16px;
    color: var(--udm-ink);
}

.udm-factlist { margin: 0; }

.udm-factlist > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-top: 1px solid var(--udm-border);
}

.udm-factlist > div:first-child { border-top: 0; }

.udm-factlist dt { color: var(--udm-muted); font-size: 15px; }
.udm-factlist dd { margin: 0; font-weight: 700; color: var(--udm-ink); font-size: 15px; text-align: right; }

@media (max-width: 860px) {
    .udm-profilehero__inner { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .udm-profilehero__photo { width: 220px; height: 264px; }
    .udm-profilebody { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

/* ============================================================
   Election results map (History page) — self-contained so it
   works without the home-only udm-home.css.
   ============================================================ */
.udm-emapsec__head { max-width: 820px; margin-bottom: 26px; position: relative; }

.udm-emap__eyebrow {
    display: block;
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.udm-emap__lead {
    color: rgba(255, 255, 255, .78);
    font-size: 17px;
    line-height: 1.6;
    margin: 14px 0 0;
}

.udm-emap__lead strong { color: #fff; }

/* year tabs */
.udm-emaptabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; }

.udm-emaptab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 12px 18px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .04);
    color: #fff;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
    min-width: 96px;
}

.udm-emaptab:hover { border-color: rgba(242, 183, 5, .5); background: rgba(242, 183, 5, .1); transform: translateY(-2px); }

.udm-emaptab.is-on {
    background: linear-gradient(135deg, var(--udm-primary), #8c0a12);
    border-color: transparent;
}

.udm-emaptab__year { font-size: 22px; line-height: 1; }
.udm-emaptab__seats { font-size: 12px; color: rgba(255, 255, 255, .7); }
.udm-emaptab.is-on .udm-emaptab__seats { color: rgba(255, 255, 255, .92); }
.udm-emaptab.is-zero:not(.is-on) { opacity: .72; }

/* map + panel grid */
.udm-emapgrid {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 48px;
    align-items: stretch;
}

.udm-emap__wrap { position: relative; min-width: 0; }

.udm-emap__svg {
    width: 100%;
    max-width: 620px;
    display: block;
    margin: 0 auto;
    overflow: visible;
    filter: drop-shadow(0 24px 40px rgba(0, 0, 0, .45));
}

.udm-emap__svg .cty { transition: fill .22s ease; }

.udm-emap__hint {
    position: absolute;
    left: 50%;
    bottom: -6px;
    transform: translateX(-50%);
    font-size: 13px;
    color: rgba(255, 255, 255, .55);
}

/* panel */
.udm-emappanel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 32px;
    border-left: 1px solid rgba(255, 255, 255, .12);
}

.udm-emap__era {
    display: block;
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.udm-emap__title {
    display: block;
    font-family: 'Archivo', sans-serif;
    font-stretch: 112%;
    font-weight: 800;
    font-size: 26px;
    margin: 6px 0 6px;
    color: #fff;
}

.udm-emap__desc { display: block; color: rgba(255, 255, 255, .72); font-size: 15px; line-height: 1.55; }

.udm-emap__total { display: block; margin-top: 14px; color: rgba(255, 255, 255, .85); font-size: 15px; }
.udm-emap__total .udm-x { font-size: 30px; color: var(--udm-accent); margin-right: 4px; }

.udm-emappanel__list { margin-top: 22px; }

.udm-emaplabel {
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.udm-emappos-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; }

.udm-emappos { display: flex; align-items: center; gap: 10px; }
.udm-emappos__n { font-size: 26px; line-height: 1; color: #fff; min-width: 34px; }
.udm-emappos.is-zero .udm-emappos__n { color: rgba(255, 255, 255, .35); }
.udm-emappos__p { color: rgba(255, 255, 255, .85); font-size: 14px; font-weight: 600; }
.udm-emappos.is-zero .udm-emappos__p { color: rgba(255, 255, 255, .5); }
.udm-emappos__p em { font-style: normal; color: rgba(255, 255, 255, .5); font-weight: 500; font-size: 12px; }
.udm-emappos__split { display: block; color: rgba(255, 255, 255, .5); font-size: 11.5px; font-weight: 600; margin-top: 3px; }

.udm-emaphint2 { color: rgba(255, 255, 255, .6); font-size: 14px; margin: 18px 0 0; line-height: 1.5; }
.udm-emappanel__list .udm-btn { margin-top: 16px; }

@media (max-width: 1080px) {
    .udm-emapgrid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .udm-emappanel { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); padding-left: 0; padding-top: 24px; }
}

@media (max-width: 520px) {
    .udm-emappos-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   History page — intro/facts, story timeline, video grid
   ============================================================ */
.udm-hintro {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 48px;
    align-items: start;
}

.udm-hintro__lead {
    color: var(--udm-muted);
    font-size: 18px;
    line-height: 1.75;
    margin: 14px 0 0;
}

.udm-hintro__lead strong { color: var(--udm-ink); }

.udm-hintro__motto {
    margin: 20px 0 0;
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 22px;
    color: var(--udm-primary);
}

.udm-facts {
    border: 1px solid var(--udm-border);
    border-radius: var(--udm-radius);
    background: var(--udm-white);
    box-shadow: var(--udm-shadow);
    padding: 26px 28px;
}

.udm-facts__h {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 20px;
    color: var(--udm-ink);
    margin: 0 0 14px;
}

.udm-facts__list { margin: 0; }

.udm-facts__list > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid var(--udm-border);
}

.udm-facts__list > div:first-child { border-top: 0; }
.udm-facts__list dt { color: var(--udm-muted); font-size: 14.5px; }
.udm-facts__list dd { margin: 0; font-weight: 700; color: var(--udm-ink); font-size: 14.5px; text-align: right; }

/* ---- Story timeline ---- */
.udm-story {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    position: relative;
    max-width: 940px;
}

.udm-story::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    bottom: 10px;
    width: 2px;
    background: linear-gradient(var(--udm-primary), var(--udm-accent));
}

.udm-storyrow {
    position: relative;
    padding-left: 46px;
    margin-bottom: 26px;
}

.udm-storyrow__dot {
    position: absolute;
    left: 1px;
    top: 26px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--udm-primary);
    border: 4px solid var(--udm-white);
    box-shadow: 0 0 0 2px rgba(211, 0, 15, .25);
}

.udm-storycard {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    background: var(--udm-white);
    border: 1px solid var(--udm-border);
    border-radius: var(--udm-radius);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(30, 8, 10, .06);
    transition: transform .25s var(--udm-ease), box-shadow .25s ease;
}

.udm-storycard:hover { transform: translateY(-3px); box-shadow: var(--udm-shadow); }

.udm-storycard__img { position: relative; min-height: 170px; background: var(--udm-surface-2); }
.udm-storycard__img img { width: 100%; height: 100%; object-fit: cover; }

.udm-storycard__body { padding: 22px 26px; }

.udm-storycard__year {
    display: inline-block;
    color: var(--udm-primary);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: .02em;
    margin-bottom: 6px;
}

.udm-storycard__title {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 21px;
    color: var(--udm-ink);
    margin: 0 0 8px;
    line-height: 1.2;
}

.udm-storycard__text { color: var(--udm-muted); font-size: 15.5px; line-height: 1.7; margin: 0; }

/* ---- Video grid (UDM in the news) ---- */
.udm-vgrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: 20px;
}

.udm-vcard {
    display: flex;
    flex-direction: column;
    text-align: left;
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
}

.udm-vcard__thumb {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    overflow: hidden;
    background: var(--udm-night);
}

.udm-vcard__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s var(--udm-ease);
}

.udm-vcard:hover .udm-vcard__thumb img { transform: scale(1.05); }

.udm-vcard__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: rgba(211, 0, 15, .92);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
    transition: transform .2s var(--udm-ease), background .2s ease;
}

.udm-vcard__play svg { margin-left: 3px; }
.udm-vcard:hover .udm-vcard__play { transform: translate(-50%, -50%) scale(1.08); background: var(--udm-primary); }

.udm-vcard__body { padding: 12px 2px 0; }
.udm-vcard__title { display: block; color: var(--udm-ink); font-size: 16px; font-weight: 700; line-height: 1.35; }
.udm-vcard__src { display: block; color: var(--udm-muted); font-size: 13px; margin-top: 3px; }

/* ---- Misc ---- */
.udm-hnote { color: var(--udm-muted); font-size: 14px; }
.udm-sources { color: var(--udm-muted); font-size: 13.5px; line-height: 1.7; max-width: 900px; font-style: italic; }

@media (max-width: 920px) {
    .udm-hintro { grid-template-columns: minmax(0, 1fr); gap: 30px; }
}

@media (max-width: 640px) {
    .udm-storycard { grid-template-columns: minmax(0, 1fr); }
    .udm-storycard__img { min-height: 180px; }
}

/* ============================================================
   History — "Coming home" quote feature + national-figure cards
   ============================================================ */
.udm-homecoming { position: relative; }

.udm-homecoming__rays {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(900px 500px at 15% 0%, rgba(211, 0, 15, .5), transparent 60%),
        radial-gradient(900px 500px at 100% 120%, rgba(242, 183, 5, .14), transparent 55%);
    pointer-events: none;
}

.udm-homecoming__inner {
    position: relative;
    max-width: 960px;
    margin: 0 auto;
    text-align: center;
}

.udm-homecoming__mark {
    display: block;
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 110px;
    line-height: .5;
    color: var(--udm-accent);
    opacity: .5;
}

.udm-homecoming__quote {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-stretch: 110%;
    font-size: clamp(25px, 3.6vw, 44px);
    line-height: 1.2;
    color: #fff;
    margin: 12px auto 26px;
    max-width: 900px;
}

.udm-homecoming__by strong { display: block; color: var(--udm-accent); font-size: 18px; }
.udm-homecoming__by span { color: rgba(255, 255, 255, .72); font-size: 15px; }

/* National-figure cards */
.udm-allies {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 22px;
}

.udm-ally {
    display: flex;
    gap: 18px;
    background: var(--udm-white);
    border: 1px solid var(--udm-border);
    border-radius: var(--udm-radius);
    padding: 22px;
    transition: transform .25s var(--udm-ease), box-shadow .25s ease;
}

.udm-ally:hover { transform: translateY(-3px); box-shadow: var(--udm-shadow); }

/* Allies with supporting videos become full-width, with a video slider wrapped below */
.udm-ally--featured { grid-column: 1 / -1; flex-wrap: wrap; }
.udm-ally__videos {
    flex: 1 1 100%;
    margin-top: 6px;
    padding-top: 16px;
    border-top: 1px solid var(--udm-border);
}

.udm-ally__photo {
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, var(--udm-primary), #8c0a12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.udm-ally__photo img { width: 100%; height: 100%; object-fit: cover; }
.udm-ally__mono { color: #fff; font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 26px; }

.udm-ally__body { min-width: 0; }
.udm-ally__name { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 19px; color: var(--udm-ink); margin: 0; }
.udm-ally__role { display: block; color: var(--udm-primary); font-weight: 700; font-size: 13px; margin: 2px 0 8px; }
.udm-ally__text { color: var(--udm-muted); font-size: 14.5px; line-height: 1.6; margin: 0 0 10px; }
.udm-ally__period {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    color: var(--udm-muted);
    background: var(--udm-surface);
    padding: 3px 10px;
    border-radius: 999px;
}

/* ---- Coming-home background image + video + allies background ---- */
.udm-homecoming__bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    background-size: contain;          /* show the whole photo, fit top-to-bottom */
    background-repeat: no-repeat;
    background-position: center;
    opacity: .9;
}

.udm-homecoming::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(20, 6, 8, .62), rgba(20, 6, 8, .4) 45%, rgba(20, 6, 8, .78)),
        radial-gradient(ellipse at 50% 46%, rgba(20, 6, 8, .12), rgba(20, 6, 8, .68) 85%);
    pointer-events: none;
}

.udm-homecoming__rays { z-index: 3; }
.udm-homecoming__inner { position: relative; z-index: 4; }

.udm-homecoming__watch {
    margin-top: 28px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.udm-alliesec { position: relative; }

.udm-alliesec__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: .05;
    pointer-events: none;
}

.udm-credit {
    color: var(--udm-muted);
    font-size: 12px;
    opacity: .7;
    margin: 20px 0 0;
}

/* ============================================================
   History — "The UDM story" animated world + chapter cards
   ============================================================ */
.udm-storyworld {
    position: relative;
    /* NOTE: no overflow:hidden here — it would break the sticky chapter media.
       The decorative orbs are clipped on the __bg layer instead. */
    background: #150708;
    color: #fff;
    padding: 90px 0 100px;
}

.udm-storyworld__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
/* isolate the content onto its own stacking context so it paints above the
   blurred orbs. (No transform here — it would create a containing block that
   interferes with the sticky media column.) */
.udm-storyworld__inner { position: relative; z-index: 1; isolation: isolate; }

/* drifting colour orbs */
.udm-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    opacity: .55;
    will-change: transform;
}

.udm-orb--1 {
    width: 46vw; height: 46vw; max-width: 720px; max-height: 720px;
    background: radial-gradient(circle, rgba(211, 0, 15, .7), transparent 62%);
    top: -12%; left: -8%;
    animation: udm-orb1 24s ease-in-out infinite;
}

.udm-orb--2 {
    width: 42vw; height: 42vw; max-width: 640px; max-height: 640px;
    background: radial-gradient(circle, rgba(242, 183, 5, .5), transparent 62%);
    bottom: -16%; right: -10%;
    animation: udm-orb2 30s ease-in-out infinite;
}

.udm-orb--3 {
    width: 34vw; height: 34vw; max-width: 520px; max-height: 520px;
    background: radial-gradient(circle, rgba(211, 0, 15, .5), transparent 62%);
    top: 36%; left: 55%;
    animation: udm-orb3 34s ease-in-out infinite;
}

@keyframes udm-orb1 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(10%,8%) scale(1.15); } }
@keyframes udm-orb2 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-12%,-10%) scale(1.2); } }
@keyframes udm-orb3 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-8%,12%) scale(1.1); } }

/* drifting starfield */
.udm-stars {
    position: absolute;
    inset: -48px;
    background-image: radial-gradient(rgba(255, 255, 255, .18) 1px, transparent 1.6px);
    background-size: 44px 44px;
    opacity: .5;
    animation: udm-stars 60s linear infinite;
    will-change: transform;
}

.udm-stars--2 { background-size: 80px 80px; opacity: .26; animation-duration: 95s; animation-direction: reverse; }

@keyframes udm-stars { from { transform: translate(0,0); } to { transform: translate(44px,44px); } }

/* section head */
.udm-storyworld__head { max-width: 760px; margin-bottom: 44px; }

/* chapters */
.udm-chapters { display: flex; flex-direction: column; gap: 30px; }

.udm-chapter {
    display: grid;
    grid-template-columns: minmax(0, 520px) minmax(0, 1fr);
    gap: 44px;
    align-items: start;
    background: linear-gradient(160deg, rgba(42, 17, 19, .85), rgba(18, 8, 10, .92));
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 24px;
    padding: 28px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .06);
}

/* Media is always the fixed 440px column (left by default, right when flipped)
   so every chapter image renders at the same size. grid-row:1 keeps both items
   on the same row (sparse auto-flow won't backtrack for out-of-order columns). */
.udm-chapter__media { grid-column: 1; grid-row: 1; }
.udm-chapter__body { grid-column: 2; grid-row: 1; }
.udm-chapter.is-flip { grid-template-columns: minmax(0, 1fr) minmax(0, 520px); }
.udm-chapter.is-flip .udm-chapter__media { grid-column: 2; grid-row: 1; }
.udm-chapter.is-flip .udm-chapter__body { grid-column: 1; grid-row: 1; }

/* media (main + inset collage, with optional play) */
/* Sticky so the image stays beside long chapter text instead of leaving an
   empty column once you scroll past it. */
.udm-chapter__media { min-width: 0; position: sticky; top: 84px; align-self: start; }
.udm-chapter__imgs { position: relative; }

.udm-chapter__img--main {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 20px 44px rgba(0, 0, 0, .45);
}

.udm-chapter__img--main img { width: 100%; height: 100%; object-fit: cover; }

.udm-chapter__img--inset {
    position: absolute;
    right: -14px;
    bottom: -20px;
    width: 42%;
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    border: 4px solid #150708;
    box-shadow: 0 16px 30px rgba(0, 0, 0, .5);
}

.udm-chapter__img--inset img { width: 100%; height: 100%; object-fit: cover; }

.udm-chapter__play {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 60px; height: 60px;
    border: 0;
    border-radius: 50%;
    background: rgba(211, 0, 15, .92);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
    transition: transform .2s var(--udm-ease), background .2s ease;
}

.udm-chapter__play svg { margin-left: 3px; }
.udm-chapter__play:hover { transform: translate(-50%, -50%) scale(1.08); background: var(--udm-primary); }

/* body */
.udm-chapter__era {
    display: block;
    color: var(--udm-accent);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.udm-chapter__title {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-stretch: 112%;
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.1;
    color: #fff;
    margin: 0 0 10px;
}

.udm-chapter__lead { color: rgba(255, 255, 255, .8); font-size: 17px; line-height: 1.6; margin: 0 0 22px; }

.udm-chapter__events { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; gap: 16px; }
/* direct children only — so the timeline grid doesn't leak into nested
   rich-text lists (e.g. the founders <ol>), which would crush them into 96px. */
.udm-chapter__events > li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
.udm-chapter__year { color: var(--udm-accent); font-weight: 800; font-size: 14px; }
.udm-chapter__evtitle { display: block; color: #fff; font-size: 16px; font-weight: 700; margin-bottom: 4px; }
/* Rich-text (admin-authored HTML) body for each milestone */
.udm-chapter__text { color: rgba(255, 255, 255, .72); font-size: 14px; line-height: 1.6; }
.udm-chapter__text > :first-child { margin-top: 0; }
.udm-chapter__text > :last-child { margin-bottom: 0; }
.udm-chapter__text p { margin: 0 0 9px; }
.udm-chapter__text strong, .udm-chapter__text b { color: rgba(255, 255, 255, .96); font-weight: 700; }
.udm-chapter__text em { color: rgba(255, 255, 255, .85); }
.udm-chapter__text a { color: var(--udm-accent); text-decoration: underline; text-underline-offset: 2px; }
.udm-chapter__text ol, .udm-chapter__text ul { margin: 2px 0 10px; padding-left: 20px; }
.udm-chapter__text li { margin: 0 0 4px; }
.udm-chapter__text h3, .udm-chapter__text h4, .udm-chapter__text h5 { color: #fff; font-size: 14.5px; font-weight: 700; margin: 12px 0 4px; }
.udm-chapter__watch { display: inline-flex; align-items: center; gap: 7px; }

@media (max-width: 860px) {
    .udm-chapter,
    .udm-chapter.is-flip { grid-template-columns: minmax(0, 1fr); gap: 26px; }
    .udm-chapter__media,
    .udm-chapter__body,
    .udm-chapter.is-flip .udm-chapter__media,
    .udm-chapter.is-flip .udm-chapter__body { grid-column: auto; grid-row: auto; }
    /* Keep the taller (portrait-friendly) frame a sensible size once stacked full-width. */
    .udm-chapter__media { position: static; max-width: 420px; width: 100%; margin-inline: auto; }
    .udm-chapter__events > li { grid-template-columns: 74px minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .udm-orb, .udm-stars { animation: none !important; }
}

/* ---- Chapter image/video slider ---- */
.udm-cslider {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    background: #0e0506;
    box-shadow: 0 20px 44px rgba(0, 0, 0, .45);
}

.udm-cslider__track {
    display: flex;
    transition: transform .5s var(--udm-ease);
    will-change: transform;
}

.udm-cslide {
    position: relative;
    flex: 0 0 100%;
    aspect-ratio: 4 / 5;
    border: 0;
    padding: 0;
    margin: 0;
    background: #0e0506;
    cursor: pointer;
    display: block;
}

/* Show the whole photo (no cropping) on the dark panel — history photos come in
   mixed shapes and must be seen in full. */
.udm-cslide img { width: 100%; height: 100%; object-fit: contain; display: block; }

.udm-cslide__play {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: rgba(211, 0, 15, .92);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
    transition: transform .2s var(--udm-ease), background .2s ease;
}

.udm-cslide__play svg { margin-left: 3px; }
.udm-cslide--video:hover .udm-cslide__play { transform: scale(1.08); background: var(--udm-primary); }

.udm-cslider__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .5);
    border: 1px solid rgba(255, 255, 255, .3);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    opacity: 0;
    transition: opacity .2s ease, background .2s ease;
}

.udm-cslider:hover .udm-cslider__nav { opacity: 1; }
.udm-cslider__nav:hover { background: var(--udm-primary); border-color: transparent; }
.udm-cslider__prev { left: 10px; }
.udm-cslider__next { right: 10px; }

.udm-cslider__dots {
    position: absolute;
    bottom: 12px;
    left: 0; right: 0;
    display: flex;
    justify-content: center;
    gap: 6px;
    z-index: 2;
}

.udm-cslider__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .5);
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: width .2s ease, background .2s ease, border-radius .2s ease;
}

.udm-cslider__dot.is-on { background: #fff; width: 18px; border-radius: 4px; }

/* ---- Overrides: clearer slider dots/arrows + readable gallery captions ---- */
.udm-cslider__dots {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    padding: 7px 12px;
    background: rgba(0, 0, 0, .5);
    border-radius: 999px;
}

.udm-cslider__dot {
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, .6);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}

.udm-cslider__dot.is-on { background: var(--udm-accent); width: 22px; border-radius: 5px; }

/* arrows always slightly visible so users know they can browse more */
.udm-cslider__nav { opacity: .7; }
.udm-cslider:hover .udm-cslider__nav { opacity: 1; }

/* gallery photo captions must read over the images */
#gallery .udm-ph__cap {
    color: #fff;
    background: linear-gradient(0deg, rgba(0, 0, 0, .82) 8%, rgba(0, 0, 0, 0));
}

#gallery .udm-ph__cap strong { color: var(--udm-accent); }

/* Logo/emblem slides: show the whole mark (no zoom/crop) on a branded panel */
.udm-cslide--logo {
    background: radial-gradient(circle at 50% 45%, rgba(211, 0, 15, .2), transparent 62%), #140708;
}

.udm-cslide--logo img {
    object-fit: contain;
    padding: 26px;
}

/* ============================================================
   ABOUT PAGE (v2) — identity, values, creed, representation
   ============================================================ */

/* Facts card CTA */
.udm-facts__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    justify-content: center;
    margin-top: 18px;
}

/* --- Our agenda (inside intro main column) --- */
.udm-agenda {
    display: grid;
    gap: 14px;
    margin-top: 30px;
}
.udm-agenda__card {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px 20px;
    background: #fff;
    border: 1px solid var(--udm-line, rgba(30,20,20,.1));
    border-left: 4px solid var(--udm-primary);
    border-radius: 14px;
    box-shadow: 0 2px 14px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-agenda__card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(30,20,20,.1);
}
.udm-agenda__ico {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(211,0,15,.08);
    color: var(--udm-primary);
    font-size: 1.4rem;
}
.udm-agenda__title {
    margin: 0 0 4px;
    font-size: 1.02rem;
    font-weight: 800;
    color: var(--udm-ink);
}
.udm-agenda__text {
    margin: 0;
    font-size: .95rem;
    line-height: 1.7;
    color: var(--udm-muted);
}

/* Centered section head */
.udm-sechead--center {
    justify-content: center;
    text-align: center;
}
.udm-sechead--center > div { max-width: 720px; }

/* --- Vision / Mission / Values --- */
.udm-vmv-sec { overflow: hidden; }
.udm-vmv {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 40px;
}
.udm-vmv__card {
    position: relative;
    padding: 34px 28px;
    border-radius: 18px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    text-align: center;
    overflow: hidden;
    transition: transform .25s ease, background .25s ease, border-color .25s ease;
}
.udm-vmv__card:hover {
    transform: translateY(-4px);
    background: rgba(255,255,255,.08);
    border-color: rgba(242,183,5,.4);
}
.udm-vmv__card--accent {
    background: linear-gradient(160deg, rgba(211,0,15,.9), rgba(126,0,9,.92));
    border-color: rgba(242,183,5,.35);
}
.udm-vmv__ico {
    width: 60px;
    height: 60px;
    margin: 0 auto 18px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(242,183,5,.16);
    color: var(--udm-accent);
    font-size: 1.7rem;
}
.udm-vmv__card--accent .udm-vmv__ico { background: rgba(255,255,255,.18); color: #fff; }
.udm-vmv__title {
    margin: 0 0 10px;
    font-size: 1.15rem;
    font-weight: 800;
    color: #fff;
}
.udm-vmv__text {
    margin: 0;
    font-size: .95rem;
    line-height: 1.75;
    color: rgba(255,255,255,.82);
}

/* --- What we stand for (creed) --- */
.udm-creed {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 40px;
}
.udm-creed__card {
    padding: 28px 26px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--udm-line, rgba(30,20,20,.1));
    box-shadow: 0 2px 14px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.udm-creed__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 34px rgba(30,20,20,.1);
    border-color: rgba(211,0,15,.35);
}
.udm-creed__ico {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, var(--udm-primary), var(--udm-primary-dark));
    color: #fff;
    font-size: 1.55rem;
    margin-bottom: 16px;
    box-shadow: 0 6px 16px rgba(211,0,15,.28);
}
.udm-creed__title {
    margin: 0 0 8px;
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--udm-ink);
}
.udm-creed__text {
    margin: 0;
    font-size: .94rem;
    line-height: 1.75;
    color: var(--udm-muted);
}

/* --- By the numbers (self-contained impact strip) --- */
.udm-impact--about {
    background: var(--udm-night);
    padding: 48px 0;
}
.udm-impact--about .udm-impact__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.udm-impact--about .udm-impact__item {
    position: relative;
    text-align: center;
    padding: 6px 12px;
}
.udm-impact--about .udm-impact__item + .udm-impact__item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 12%;
    height: 76%;
    width: 1px;
    background: rgba(255,255,255,.14);
}
.udm-impact--about .udm-impact__num {
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    font-weight: 800;
    line-height: 1;
    color: var(--udm-accent);
}
.udm-impact--about .udm-impact__label {
    margin-top: 10px;
    font-size: .82rem;
    letter-spacing: .4px;
    text-transform: uppercase;
    color: rgba(255,255,255,.72);
}

/* --- Representation cards --- */
.udm-rep {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px;
    margin-top: 36px;
}
.udm-rep__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 26px 18px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--udm-line, rgba(30,20,20,.1));
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-rep__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(30,20,20,.1);
}
.udm-rep__ico {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(211,0,15,.08);
    color: var(--udm-primary);
    font-size: 1.35rem;
    margin-bottom: 4px;
}
.udm-rep__num {
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
    color: var(--udm-primary);
}
.udm-rep__label {
    font-size: .86rem;
    font-weight: 600;
    color: var(--udm-muted);
}
.udm-rep__split {
    display: block;
    margin-top: 6px;
    font-size: .72rem;
    font-weight: 600;
    color: var(--udm-muted);
    opacity: .85;
}

/* --- Our story teaser (compact storyworld) --- */
.udm-about-story { padding: 70px 0; }
.udm-about-story__inner { text-align: center; max-width: 820px; margin-inline: auto; }
.udm-about-story__cta { margin-top: 26px; display: inline-flex; align-items: center; gap: 8px; }

/* --- Join CTA band --- */
.udm-about-join {
    position: relative;
    background: linear-gradient(135deg, var(--udm-primary), var(--udm-primary-dark));
    overflow: hidden;
    padding: 46px 0;
}
.udm-about-join__logo {
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%);
    width: 300px;
    height: 300px;
    background: url('/assets/images/brands/mainlogo.png') center/contain no-repeat;
    opacity: .08;
    pointer-events: none;
}
.udm-about-join__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.udm-about-join__title {
    margin: 0 0 6px;
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 800;
    color: #fff;
}
.udm-about-join__text {
    margin: 0;
    font-size: 1rem;
    color: rgba(255,255,255,.9);
    max-width: 520px;
}
.udm-about-join__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.udm-about-join .udm-btn--ghost {
    border-color: rgba(255,255,255,.6);
    color: #fff;
}
.udm-about-join .udm-btn--ghost:hover {
    background: rgba(255,255,255,.14);
    border-color: #fff;
}

/* --- About responsive --- */
@media (max-width: 900px) {
    .udm-vmv { grid-template-columns: 1fr; }
    .udm-creed { grid-template-columns: repeat(2, 1fr); }
    .udm-impact--about .udm-impact__grid { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
    .udm-impact--about .udm-impact__item:nth-child(odd) + .udm-impact__item::before { display: none; }
}
@media (max-width: 560px) {
    .udm-creed { grid-template-columns: 1fr; }
    .udm-about-join__inner { flex-direction: column; align-items: flex-start; }
}


/* ============================================================
   ABOUT PAGE (v2) — media: gallery, the moment, video strip
   ============================================================ */

/* --- Photo gallery (mosaic) --- */
.udm-agal {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 180px;
    gap: 14px;
    margin-top: 38px;
}
.udm-agal__cell {
    position: relative;
    margin: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(30,20,20,.1);
}
.udm-agal__cell--lg {
    grid-column: span 2;
    grid-row: span 2;
}
.udm-agal__cell img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.udm-agal__cell:hover img { transform: scale(1.06); }
.udm-agal__cell figcaption {
    position: absolute;
    inset: auto 0 0 0;
    padding: 28px 16px 14px;
    background: linear-gradient(0deg, rgba(0,0,0,.82) 10%, transparent);
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.udm-agal__cell figcaption strong { font-size: .95rem; color: #fff; }
.udm-agal__cell figcaption span { font-size: .8rem; color: rgba(255,255,255,.82); line-height: 1.5; }

/* --- The moment: quote + embedded video --- */
.udm-moment { position: relative; }
.udm-moment__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: .14;
    pointer-events: none;
}
.udm-moment__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 48px;
    align-items: center;
}
.udm-moment__mark {
    display: block;
    font-family: Georgia, serif;
    font-size: 5rem;
    line-height: .6;
    color: var(--udm-accent);
    opacity: .9;
    margin-bottom: 8px;
}
.udm-moment__quote {
    margin: 0;
    font-size: clamp(1.3rem, 2.6vw, 1.85rem);
    font-weight: 700;
    line-height: 1.45;
    color: #fff;
}
.udm-moment__by { margin-top: 20px; display: flex; flex-direction: column; gap: 2px; }
.udm-moment__by strong { color: var(--udm-accent); font-size: 1.02rem; }
.udm-moment__by span { color: rgba(255,255,255,.72); font-size: .88rem; }
.udm-moment__ctx {
    margin: 20px 0 0;
    color: rgba(255,255,255,.82);
    font-size: .98rem;
    line-height: 1.75;
    max-width: 520px;
}
.udm-moment__vcap {
    margin: 12px 0 0;
    color: rgba(255,255,255,.7);
    font-size: .85rem;
}

/* Responsive 16:9 embed */
.udm-embed {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.12);
}
.udm-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* --- Video strip --- */
.udm-vidstrip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 38px;
}
.udm-vidcard {
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--udm-line, rgba(30,20,20,.1));
    box-shadow: 0 2px 14px rgba(30,20,20,.06);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-vidcard:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(30,20,20,.14);
}
.udm-vidcard__thumb {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #140708;
}
.udm-vidcard__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.udm-vidcard:hover .udm-vidcard__thumb img { transform: scale(1.05); }
.udm-vidcard__play {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(211,0,15,.92);
    box-shadow: 0 6px 20px rgba(0,0,0,.4);
    transition: transform .2s ease, background .2s ease;
}
.udm-vidcard:hover .udm-vidcard__play { transform: scale(1.1); background: var(--udm-primary); }
.udm-vidcard__play svg { margin-left: 3px; }
.udm-vidcard__body { padding: 16px 18px 18px; }
.udm-vidcard__era {
    display: inline-block;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--udm-primary);
    margin-bottom: 6px;
}
.udm-vidcard__title {
    margin: 0 0 8px;
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--udm-ink);
}
.udm-vidcard__src {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .78rem;
    color: var(--udm-muted);
}
.udm-vidcard__src i { color: #FF0000; font-size: 1rem; }

/* --- About media responsive --- */
@media (max-width: 900px) {
    .udm-agal { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
    .udm-agal__cell--lg { grid-column: span 2; grid-row: span 1; }
    .udm-moment__inner { grid-template-columns: 1fr; gap: 30px; }
    .udm-vidstrip { grid-template-columns: 1fr; }
}


/* ============================================================
   Leader cards (shared) — hoisted global so About (and any page
   without udm-home.css) renders the component correctly.
   ============================================================ */
.udm-lead {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}
.udm-leadcard {
    display: block;
    text-decoration: none;
    color: var(--udm-ink);
}
.udm-leadcard__photo {
    position: relative;
    aspect-ratio: 4 / 5;
    border-radius: var(--udm-radius, 16px);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--udm-surface-2, #f1ecec);
    box-shadow: 0 2px 10px rgba(30, 8, 10, .08);
}
.udm-leadcard__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.udm-leadcard:hover .udm-leadcard__photo img { transform: scale(1.06); }
.udm-leadcard__cat {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    padding: 5px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    color: var(--udm-primary);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
    backdrop-filter: blur(4px);
}
.udm-leadcard__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 12px;
    padding: 20px;
    background: linear-gradient(0deg, rgba(20, 6, 8, .92) 12%, rgba(20, 6, 8, .35) 60%, rgba(20, 6, 8, 0));
    opacity: 0;
    transition: opacity .35s ease;
}
.udm-leadcard:hover .udm-leadcard__overlay,
.udm-leadcard:focus-visible .udm-leadcard__overlay { opacity: 1; }
.udm-leadcard__bio {
    color: rgba(255, 255, 255, .92);
    font-size: 13.5px;
    line-height: 1.5;
    transform: translateY(10px);
    transition: transform .4s ease .05s;
}
.udm-leadcard:hover .udm-leadcard__bio { transform: none; }
.udm-leadcard__view {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 9px 16px;
    border-radius: 999px;
    background: var(--udm-accent);
    color: var(--udm-accent-ink);
    font-weight: 800;
    font-size: 13.5px;
    transform: translateY(10px);
    transition: transform .4s ease .12s;
}
.udm-leadcard:hover .udm-leadcard__view { transform: none; }
.udm-leadcard__name {
    font-weight: 700;
    font-size: 17px;
    line-height: 1.3;
    margin-top: 16px;
    color: var(--udm-ink);
}
.udm-leadcard__role {
    color: var(--udm-primary);
    font-weight: 600;
    font-size: 14px;
    margin-top: 4px;
}
@media (max-width: 1080px) {
    .udm-lead { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
    .udm-lead { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* ============================================================
   Leader profile — enriched (quote, focus areas, aside CTA)
   ============================================================ */

/* Back link now sits on its own row above the hero grid */
.udm-profilehero .udm-profilehero__back {
    position: relative;
    z-index: 1;
    margin: 0 0 20px;
    width: max-content;
}

/* Multi-paragraph bio spacing */
.udm-profilebody__text p { margin: 0 0 16px; }
.udm-profilebody__text p:last-child { margin-bottom: 0; }

/* Pull-quote */
.udm-pquote {
    position: relative;
    margin: 30px 0 8px;
    padding: 22px 26px 22px 30px;
    border-left: 4px solid var(--udm-primary);
    background: linear-gradient(100deg, rgba(211,0,15,.05), rgba(211,0,15,0));
    border-radius: 0 16px 16px 0;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    font-weight: 700;
    line-height: 1.55;
    color: var(--udm-ink);
}
.udm-pquote__mark {
    font-family: Georgia, serif;
    color: var(--udm-primary);
    font-size: 2.2rem;
    line-height: 0;
    position: relative;
    top: 10px;
    margin-right: 4px;
}

/* Focus areas */
.udm-pfocus__h {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 1.3rem;
    color: var(--udm-ink);
    margin: 40px 0 18px;
}
.udm-pfocus {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.udm-pfocus__card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 18px 20px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--udm-border, rgba(30,20,20,.1));
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-pfocus__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(30,20,20,.1);
}
.udm-pfocus__ico {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(211,0,15,.08);
    color: var(--udm-primary);
    font-size: 1.35rem;
}
.udm-pfocus__t {
    margin: 2px 0 5px;
    font-size: 1rem;
    font-weight: 800;
    color: var(--udm-ink);
}
.udm-pfocus__d {
    margin: 0;
    font-size: .9rem;
    line-height: 1.6;
    color: var(--udm-muted);
}

/* Aside join CTA */
.udm-pcta {
    position: relative;
    overflow: hidden;
    margin-top: 20px;
    padding: 28px 26px;
    border-radius: var(--udm-radius, 16px);
    background: linear-gradient(145deg, var(--udm-primary), var(--udm-primary-dark));
    color: #fff;
    box-shadow: 0 14px 34px rgba(211,0,15,.28);
}
.udm-pcta__logo {
    position: absolute;
    right: -30px;
    bottom: -30px;
    width: 160px;
    height: 160px;
    background: url('/assets/images/brands/mainlogo.png') center/contain no-repeat;
    opacity: .1;
    pointer-events: none;
}
.udm-pcta__ico {
    font-size: 1.6rem;
    color: var(--udm-accent);
    position: relative;
    z-index: 1;
}
.udm-pcta__h {
    position: relative;
    z-index: 1;
    margin: 10px 0 6px;
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 1.25rem;
    color: #fff;
}
.udm-pcta__p {
    position: relative;
    z-index: 1;
    margin: 0 0 16px;
    font-size: .92rem;
    line-height: 1.6;
    color: rgba(255,255,255,.9);
}
.udm-pcta .udm-btn { position: relative; z-index: 1; }

@media (max-width: 860px) {
    .udm-pfocus { grid-template-columns: 1fr; }
}


/* ============================================================
   Leader profile — submission enrichment (socials, achievements)
   ============================================================ */

/* Hero social links */
.udm-profilehero__social {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 24px;
}
.udm-profilehero__social a {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
    color: #fff;
    font-size: 1.15rem;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}
.udm-profilehero__social a:hover {
    background: var(--udm-accent);
    color: var(--udm-accent-ink);
    transform: translateY(-2px);
}

/* Achievements list */
.udm-pach {
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
    display: grid;
    gap: 12px;
}
.udm-pach li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 1rem;
    line-height: 1.65;
    color: var(--udm-ink);
}
.udm-pach li i {
    flex-shrink: 0;
    color: var(--udm-primary);
    font-size: 1.2rem;
    margin-top: 2px;
}

/* Media card play icon / fallback (uses global .udm-vidcard) */
.udm-vidcard__play i { color: #fff; font-size: 1.5rem; line-height: 1; }
.udm-vidcard__noimg {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: rgba(255,255,255,.5);
    font-size: 2.6rem;
    background: radial-gradient(circle at 50% 40%, rgba(211,0,15,.3), #140708);
}


/* ============================================================
   LEADERSHIP PAGE (v2) — tabs, filters, elected/nominated cards
   ============================================================ */

/* Tabs */
.udm-ltabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 30px;
}
.udm-ltab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;
    border-radius: 999px;
    background: var(--udm-surface, #f6f1f1);
    border: 1px solid var(--udm-border, rgba(30,20,20,.1));
    color: var(--udm-ink);
    font-weight: 700;
    font-size: .92rem;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.udm-ltab i { font-size: 1.05rem; }
.udm-ltab:hover { border-color: var(--udm-primary); color: var(--udm-primary); transform: translateY(-1px); }
.udm-ltab.is-on {
    background: var(--udm-primary);
    border-color: var(--udm-primary);
    color: #fff;
    box-shadow: 0 8px 20px rgba(211,0,15,.28);
}

/* Filter bar */
.udm-lfilter {
    background: #fff;
    border: 1px solid var(--udm-border, rgba(30,20,20,.1));
    border-top: 3px solid var(--udm-accent);
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 26px;
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
}
.udm-lfilter__row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: flex-end;
}
.udm-field { display: flex; flex-direction: column; gap: 6px; min-width: 170px; }
.udm-field--grow { flex: 1; min-width: 220px; }
.udm-field label {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
    color: var(--udm-muted);
}
.udm-field input,
.udm-field select {
    width: 100%;
    padding: 11px 14px;
    border: 1px solid var(--udm-border, rgba(30,20,20,.14));
    border-radius: 10px;
    font-size: .95rem;
    color: var(--udm-ink);
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.udm-field input:focus,
.udm-field select:focus {
    outline: none;
    border-color: var(--udm-primary);
    box-shadow: 0 0 0 3px rgba(211,0,15,.12);
}
.udm-lfilter .udm-btn { align-self: flex-end; }

/* Result count row */
.udm-lcount {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    font-size: .9rem;
    color: var(--udm-muted);
}
.udm-lcount strong { color: var(--udm-ink); }

/* Elected position groups */
.udm-egroup { margin-bottom: 36px; }
.udm-egroup__head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}
.udm-egroup__ico {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(211,0,15,.08);
    color: var(--udm-primary);
    font-size: 1.3rem;
}
.udm-egroup__title {
    margin: 0;
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 1.25rem;
    color: var(--udm-ink);
}
.udm-egroup__count { font-size: .8rem; color: var(--udm-muted); }
.udm-egroup__rule {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(211,0,15,.2), transparent);
}

/* Elected / nominated cards */
.udm-egrid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: 18px;
}
.udm-ecard {
    display: flex;
    flex-direction: column;
    text-align: left;
    width: 100%;
    padding: 0;
    border: 1px solid var(--udm-border, rgba(30,20,20,.1));
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-ecard:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(30,20,20,.12);
}
.udm-ecard__top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    background: linear-gradient(135deg, var(--udm-primary), var(--udm-primary-dark));
}
.udm-ecard__photo {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--udm-accent);
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.15);
}
.udm-ecard__photo img { width: 100%; height: 100%; object-fit: cover; }
.udm-ecard__photo.is-ph i { color: var(--udm-accent); font-size: 1.6rem; }
.udm-ecard__name {
    margin: 0 0 6px;
    font-size: 1rem;
    font-weight: 800;
    color: #fff;
    line-height: 1.25;
}
.udm-ecard__pos {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(242,183,5,.25);
    color: var(--udm-accent);
    font-size: .72rem;
    font-weight: 700;
}
.udm-ecard__meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 16px 18px;
    flex: 1;
}
.udm-ecard__meta div { display: flex; flex-direction: column; gap: 1px; }
.udm-ecard__meta span { font-size: .68rem; text-transform: uppercase; letter-spacing: .3px; color: var(--udm-muted); }
.udm-ecard__meta strong { font-size: .9rem; color: var(--udm-ink); font-weight: 700; }
.udm-ecard__view {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
    padding: 0 18px 16px;
    color: var(--udm-primary);
    font-weight: 700;
    font-size: .85rem;
}

/* Pagination (v2 override of Bootstrap) */
.udm-wrap .pagination { gap: 4px; }
.udm-wrap .pagination .page-link {
    border: 1px solid var(--udm-border, rgba(30,20,20,.12));
    border-radius: 10px !important;
    color: var(--udm-ink) !important;
    font-size: .9rem;
    font-weight: 600;
    padding: 8px 14px;
}
.udm-wrap .pagination .page-link:hover { background: var(--udm-surface, #f6f1f1); }
.udm-wrap .pagination .active .page-link,
.udm-wrap .pagination .page-item.active .page-link {
    background: var(--udm-primary) !important;
    border-color: var(--udm-primary) !important;
    color: #fff !important;
}
.udm-wrap .pagination .disabled .page-link { opacity: .45; }

@media (max-width: 560px) {
    .udm-ecard__meta { grid-template-columns: 1fr; }
    .udm-field, .udm-field--grow { min-width: 100%; }
    .udm-lfilter .udm-btn { flex: 1; }
}


/* ============================================================
   Logo placeholder (hoisted global) — for cards with no photo.
   Keeps the emblem small, contained and centred on a branded tint
   instead of filling the frame via object-fit:cover.
   ============================================================ */
.udm-logo-ph {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background:
        radial-gradient(circle at 50% 38%, rgba(211, 0, 15, .14), transparent 68%),
        var(--udm-surface-2, #f1ecec) !important;
}
.udm-logo-ph img {
    width: 46% !important;
    height: auto !important;
    max-width: 120px !important;
    object-fit: contain !important;
    opacity: .9;
    filter: drop-shadow(0 6px 16px rgba(30, 8, 10, .18));
}

/* ============================================================
   LEADERSHIP PAGE — modern animated backdrop
   ============================================================ */
.udm-aura {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(1100px 520px at 85% -10%, rgba(242, 183, 5, .07), transparent 60%),
        radial-gradient(900px 480px at -5% 8%, rgba(211, 0, 15, .06), transparent 55%),
        linear-gradient(180deg, #ffffff 0%, var(--udm-surface, #f7f2f2) 100%);
}
/* faint dot grid texture */
.udm-aura::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(30, 20, 20, .05) 1px, transparent 1px);
    background-size: 26px 26px;
    -webkit-mask-image: linear-gradient(180deg, #000 0, transparent 80%);
    mask-image: linear-gradient(180deg, #000 0, transparent 80%);
    pointer-events: none;
    z-index: 0;
}
.udm-aura > .udm-wrap { position: relative; z-index: 1; }

.udm-aura__bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}
.udm-aura__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: .5;
    will-change: transform;
}
.udm-aura__orb--1 {
    width: 420px; height: 420px;
    top: -80px; left: -120px;
    background: radial-gradient(circle, rgba(211, 0, 15, .22), transparent 70%);
    animation: udm-orb1 26s ease-in-out infinite;
}
.udm-aura__orb--2 {
    width: 360px; height: 360px;
    top: 30%; right: -140px;
    background: radial-gradient(circle, rgba(242, 183, 5, .22), transparent 70%);
    animation: udm-orb2 32s ease-in-out infinite;
}
.udm-aura__orb--3 {
    width: 300px; height: 300px;
    bottom: -120px; left: 35%;
    background: radial-gradient(circle, rgba(211, 0, 15, .14), transparent 70%);
    animation: udm-orb3 38s ease-in-out infinite;
}

/* Tabs — glassy bar + animated active pill */
.udm-ltabs {
    padding: 8px;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(30, 20, 20, .08);
    border-radius: 999px;
    box-shadow: 0 10px 30px rgba(30, 20, 20, .08);
    backdrop-filter: blur(8px);
    width: max-content;
    max-width: 100%;
    margin-inline: auto;
}
.udm-ltab {
    background: transparent;
    border: 0;
}
.udm-ltab:hover { transform: none; background: rgba(211, 0, 15, .06); }
.udm-ltab.is-on { transform: none; }

/* Elected card header: subtle sheen */
.udm-ecard__top { position: relative; overflow: hidden; }
.udm-ecard__top::after {
    content: "";
    position: absolute;
    top: -60%; left: -30%;
    width: 60%; height: 220%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .22), transparent);
    transform: translateX(-120%) rotate(8deg);
    transition: transform .7s ease;
}
.udm-ecard:hover .udm-ecard__top::after { transform: translateX(320%) rotate(8deg); }

@media (prefers-reduced-motion: reduce) {
    .udm-aura__orb { animation: none !important; }
    .udm-ecard__top::after { transition: none; }
}


/* ============================================================
   DOWNLOADS — "The UDM Library": 3D books on shelves + reader
   ============================================================ */
.udm-library__intro { margin-bottom: 36px; }
.udm-library__lead {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 12px 20px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .7);
    border: 1px solid rgba(30, 20, 20, .08);
    box-shadow: 0 6px 20px rgba(30, 20, 20, .06);
    backdrop-filter: blur(6px);
    font-size: .95rem;
    color: var(--udm-ink);
}
.udm-library__lead i { color: var(--udm-primary); font-size: 1.15rem; }
.udm-library__foot { margin-top: 10px; text-align: center; color: var(--udm-muted); font-size: .95rem; }
.udm-library__foot a { color: var(--udm-primary); font-weight: 700; }

/* ---- Shelf ---- */
.udm-shelf { margin-bottom: 52px; }
.udm-shelf__head { display: flex; align-items: center; gap: 12px; margin-bottom: 26px; }
.udm-shelf__ico {
    width: 42px; height: 42px;
    border-radius: 12px;
    display: grid; place-items: center;
    background: rgba(211, 0, 15, .08);
    color: var(--udm-primary);
    font-size: 1.3rem;
}
.udm-shelf__title { margin: 0; font-size: 1.3rem; font-weight: 800; color: var(--udm-ink); }
.udm-shelf__count {
    min-width: 26px; height: 26px; padding: 0 9px;
    display: inline-grid; place-items: center;
    border-radius: 999px;
    background: var(--udm-primary); color: #fff;
    font-size: .8rem; font-weight: 800;
}
.udm-shelf__books {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 34px 30px;
    padding: 0 10px 6px;
}
.udm-shelf__plank {
    height: 18px;
    border-radius: 4px;
    background: linear-gradient(180deg, #9a6a38 0%, #7a4f27 45%, #5a3a1c 100%);
    box-shadow:
        0 18px 26px -10px rgba(60, 30, 10, .55),
        inset 0 2px 0 rgba(255, 255, 255, .22),
        inset 0 -3px 6px rgba(0, 0, 0, .28);
}

/* ---- Book ---- */
.udm-book { width: 184px; }
.udm-book__3d {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4.15;
    perspective: 1500px;
}
/* page stack on the right edge */
.udm-book__3d::after {
    content: "";
    position: absolute;
    top: 4px; bottom: 4px; right: -2px;
    width: 8px;
    border-radius: 0 6px 6px 0;
    background: repeating-linear-gradient(0deg, #fdfaf1 0 2px, #e3d9c2 2px 3px);
    box-shadow: 1px 0 4px rgba(0, 0, 0, .18);
    z-index: 0;
}
/* inside (revealed when the cover swings open) */
.udm-book__inside {
    position: absolute;
    inset: 0;
    border-radius: 3px 9px 9px 3px;
    background: linear-gradient(90deg, #e9dfc7 0 14px, #fbf6ea 16px);
    box-shadow: inset 0 0 24px rgba(120, 90, 40, .18);
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 8px;
    color: #9a7b45;
    z-index: 1;
}
.udm-book__inside i { font-size: 1.9rem; }
.udm-book__inside span { font-size: .8rem; font-weight: 700; letter-spacing: .3px; }

/* cover (swings open on hover) */
.udm-book__cover {
    position: absolute;
    inset: 0;
    z-index: 2;
    border: 0;
    cursor: pointer;
    border-radius: 3px 9px 9px 3px;
    padding: 18px 16px 15px 24px;
    display: flex;
    flex-direction: column;
    text-align: left;
    color: #fff;
    overflow: hidden;
    transform-origin: left center;
    transform-style: preserve-3d;
    box-shadow: 0 16px 30px -10px rgba(30, 8, 10, .5);
    transition: transform .7s cubic-bezier(.25, .8, .25, 1), box-shadow .4s ease;
}
.udm-book:hover .udm-book__cover,
.udm-book:focus-within .udm-book__cover {
    transform: rotateY(-38deg);
    box-shadow: 28px 26px 48px -14px rgba(30, 8, 10, .5);
}
/* spine shading at the hinge */
.udm-book__cover::before {
    content: "";
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 18px;
    background: linear-gradient(90deg, rgba(0,0,0,.32), rgba(255,255,255,.14) 55%, rgba(0,0,0,.12));
    z-index: 3;
}
.udm-book__sheen {
    position: absolute;
    top: -40%; left: -60%;
    width: 50%; height: 190%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
    transform: rotate(8deg);
    transition: left .8s ease;
    pointer-events: none;
}
.udm-book:hover .udm-book__sheen { left: 130%; }

.udm-book__top { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 12px; }
.udm-book__emblem { width: 26px; height: 26px; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0,0,0,.3)); opacity: .95; }
.udm-book__cat {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: .6rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
    opacity: .9;
}
.udm-book__title {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.22;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.udm-book__foot {
    margin-top: auto;
    display: flex; align-items: center; gap: 8px;
    font-size: .72rem; font-weight: 600;
    opacity: .92;
}
.udm-book__fmt {
    padding: 2px 7px;
    border-radius: 5px;
    background: rgba(255, 255, 255, .22);
    font-weight: 800; letter-spacing: .5px;
}

/* cover colour themes */
.udm-book__cover.is-financial  { background: linear-gradient(140deg, #D3000F, #7E0009); }
.udm-book__cover.is-notices    { background: linear-gradient(140deg, #8c1020, #45070f); }
.udm-book__cover.is-governance { background: linear-gradient(140deg, #39171b, #140709); }
.udm-book__cover.is-resources  { background: linear-gradient(140deg, #6a141b, #2A0D10); }
.udm-book__cover.is-forms      { background: linear-gradient(140deg, #F2B705, #B8860B); color: var(--udm-accent-ink); }
.udm-book__cover.is-forms .udm-book__fmt { background: rgba(0,0,0,.14); }

/* floating download button */
.udm-book__dl {
    position: absolute;
    top: 10px; right: 10px;
    z-index: 4;
    width: 36px; height: 36px;
    border-radius: 50%;
    display: grid; place-items: center;
    background: #fff;
    color: var(--udm-primary);
    font-size: 1.05rem;
    box-shadow: 0 6px 16px rgba(30, 8, 10, .3);
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.udm-book:hover .udm-book__dl { opacity: 1; transform: none; }
.udm-book__dl:hover { background: var(--udm-primary); color: #fff; }

/* ============================================================
   READER (open-book modal)
   ============================================================ */
.udm-reader {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.udm-reader.is-open { display: flex; }
.udm-reader__overlay {
    position: absolute; inset: 0;
    background: rgba(12, 4, 6, .72);
    backdrop-filter: blur(4px);
}
.udm-reader__book {
    position: relative;
    width: min(1120px, 96vw);
    height: min(86vh, 860px);
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .55);
    animation: udm-reader-in .4s cubic-bezier(.2, .8, .25, 1);
}
@keyframes udm-reader-in {
    from { opacity: 0; transform: translateY(20px) scale(.97); }
    to { opacity: 1; transform: none; }
}
.udm-reader__bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 12px 16px;
    background: var(--udm-night);
    color: #fff;
}
.udm-reader__bartitle { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1rem; min-width: 0; }
.udm-reader__bartitle i { color: var(--udm-accent); font-size: 1.2rem; }
.udm-reader__bartitle span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.udm-reader__baracts { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.udm-reader__btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: 9px;
    background: var(--udm-primary); color: #fff;
    font-size: .85rem; font-weight: 700; text-decoration: none;
    transition: background .2s ease;
}
.udm-reader__btn:hover { background: var(--udm-primary-dark); color: #fff; }
.udm-reader__btn--ghost { background: rgba(255,255,255,.12); }
.udm-reader__btn--ghost:hover { background: rgba(255,255,255,.22); }
.udm-reader__close {
    width: 38px; height: 38px; border: 0; border-radius: 9px;
    background: rgba(255,255,255,.12); color: #fff; cursor: pointer;
    font-size: 1.2rem; display: grid; place-items: center;
    transition: background .2s ease;
}
.udm-reader__close:hover { background: var(--udm-primary); }

.udm-reader__spread { flex: 1; display: grid; grid-template-columns: 320px 1fr; min-height: 0; }
.udm-reader__page {
    padding: 30px 28px;
    background: linear-gradient(120deg, #fbf6ea, #fff);
    border-right: 1px solid rgba(30,20,20,.1);
    box-shadow: inset -14px 0 24px -16px rgba(120,90,40,.4);
    overflow-y: auto;
}
.udm-reader__cat {
    display: inline-block;
    font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    color: var(--udm-primary); margin-bottom: 10px;
}
.udm-reader__doctitle { margin: 0 0 14px; font-size: 1.4rem; font-weight: 800; color: var(--udm-ink); line-height: 1.25; }
.udm-reader__desc { margin: 0 0 20px; color: var(--udm-muted); font-size: .95rem; line-height: 1.7; }
.udm-reader__facts { margin: 0 0 22px; }
.udm-reader__facts > div { display: flex; justify-content: space-between; padding: 10px 0; border-top: 1px solid rgba(30,20,20,.1); }
.udm-reader__facts dt { color: var(--udm-muted); font-size: .9rem; }
.udm-reader__facts dd { margin: 0; font-weight: 700; color: var(--udm-ink); font-size: .9rem; }
.udm-reader__page .udm-btn { width: 100%; justify-content: center; }
.udm-reader__hint { margin: 16px 0 0; font-size: .8rem; color: var(--udm-muted); line-height: 1.6; }

.udm-reader__viewer { position: relative; background: #525659; min-height: 0; }
.udm-reader__viewer iframe { width: 100%; height: 100%; border: 0; display: block; }
.udm-reader__loading {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center; gap: 12px;
    color: #fff; font-size: .95rem;
    background: #525659;
}
.udm-reader__spin {
    width: 22px; height: 22px; border-radius: 50%;
    border: 3px solid rgba(255,255,255,.3);
    border-top-color: #fff;
    animation: udm-spin .8s linear infinite;
}
@keyframes udm-spin { to { transform: rotate(360deg); } }

@media (max-width: 760px) {
    .udm-reader__book { height: 92vh; }
    .udm-reader__spread { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
    .udm-reader__page { max-height: 34%; border-right: 0; border-bottom: 1px solid rgba(30,20,20,.1); }
    .udm-reader__baracts .udm-reader__btn span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .udm-book__cover { transition: box-shadow .3s ease; }
    .udm-book:hover .udm-book__cover, .udm-book:focus-within .udm-book__cover { transform: none; }
    .udm-book__sheen { display: none; }
    .udm-reader__book { animation: none; }
}


/* Reader bar buttons: beat the global <a> colour (was red-on-red) */
.udm-reader__bar a.udm-reader__btn { color: #fff !important; text-decoration: none; }
.udm-reader__bar a.udm-reader__btn:hover { color: #fff !important; }

/* ---- Downloads fixes: cover text colour + reader error panel ---- */
/* Beat the global `.udm-section *` colour so cover text is legible. */
.udm-library .udm-book__cover { color: #fff; }
.udm-library .udm-book__cover.is-forms { color: var(--udm-accent-ink); }
.udm-library .udm-book__cover * { color: inherit; }

.udm-reader__error {
    position: absolute;
    inset: 0;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 10px;
    padding: 30px;
    background: #525659;
    color: #fff;
}
.udm-reader__error i { font-size: 2.6rem; color: var(--udm-accent); }
.udm-reader__error h4 { margin: 4px 0 0; font-size: 1.15rem; font-weight: 800; }
.udm-reader__error p { margin: 0 0 14px; max-width: 320px; color: rgba(255,255,255,.8); font-size: .92rem; line-height: 1.6; }

/* ============================================================
   GALLERY PAGE — albums, lazy grid, lightbox
   ============================================================ */
.udm-galintro { margin-bottom: 36px; }
.udm-galintro__lead {
    display: inline-flex; align-items: center; gap: 10px;
    margin: 0; padding: 12px 20px; border-radius: 999px;
    background: rgba(255,255,255,.7);
    border: 1px solid rgba(30,20,20,.08);
    box-shadow: 0 6px 20px rgba(30,20,20,.06);
    backdrop-filter: blur(6px);
    font-size: .95rem; color: var(--udm-ink);
}
.udm-galintro__lead i { color: var(--udm-primary); font-size: 1.15rem; }
.udm-galintro__foot { margin-top: 8px; text-align: center; color: var(--udm-muted); font-size: .95rem; }

/* ---- Album group ---- */
.udm-album {
    margin-bottom: 56px;
    /* skip rendering off-screen albums — big win when there are many photos */
    content-visibility: auto;
    contain-intrinsic-size: auto 600px;
}
.udm-album__head {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: 16px; margin-bottom: 22px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(30,20,20,.1);
    cursor: pointer; user-select: none;
}
.udm-album__meta { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.udm-album__chev {
    display: inline-flex; width: 30px; height: 30px; border-radius: 50%;
    align-items: center; justify-content: center;
    background: rgba(30,20,20,.06); color: var(--udm-ink); font-size: 1.2rem;
    transition: transform .25s ease;
}
.udm-album.is-collapsed .udm-album__chev { transform: rotate(180deg); }
.udm-album.is-collapsed .udm-grid { display: none; }
.udm-album.is-collapsed .udm-album__head { margin-bottom: 0; }
.udm-album__label {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: .74rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    color: var(--udm-primary); margin-bottom: 8px;
}
.udm-album__title { margin: 0; font-size: clamp(1.4rem, 2.6vw, 2rem); font-weight: 800; color: var(--udm-ink); }
.udm-album__desc { margin: 10px 0 0; color: var(--udm-muted); font-size: .98rem; line-height: 1.65; max-width: 640px; }
.udm-album__count {
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 14px; border-radius: 999px;
    background: rgba(211,0,15,.08); color: var(--udm-primary);
    font-size: .85rem; font-weight: 800;
}

/* ---- Image grid ---- */
.udm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    grid-auto-rows: 190px;
    gap: 14px;
}
.udm-tile {
    position: relative;
    margin: 0; padding: 0; border: 0;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    background: var(--udm-surface-2, #efe9e9);
    box-shadow: 0 4px 16px rgba(30,20,20,.08);
}
/* feature the first tile of each album */
.udm-tile.is-feature { grid-column: span 2; grid-row: span 2; }
.udm-tile img, .udm-tile > video {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.udm-tile:hover img, .udm-tile:focus-visible img { transform: scale(1.07); }
.udm-tile__cap {
    position: absolute; inset: auto 0 0 0;
    padding: 26px 14px 12px;
    background: linear-gradient(0deg, rgba(0,0,0,.82) 10%, transparent);
    color: #fff; font-size: .85rem; line-height: 1.4;
    text-align: left;
    transform: translateY(8px); opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
}
.udm-tile:hover .udm-tile__cap, .udm-tile:focus-visible .udm-tile__cap { transform: none; opacity: 1; }
.udm-tile__zoom {
    position: absolute; top: 12px; right: 12px;
    width: 38px; height: 38px; border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(0,0,0,.45); color: #fff; font-size: 1.1rem;
    opacity: 0; transform: scale(.8);
    transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.udm-tile:hover .udm-tile__zoom, .udm-tile:focus-visible .udm-tile__zoom { opacity: 1; transform: none; }

/* Video tiles: a prominent, always-visible centred play badge. */
.udm-tile--video .udm-tile__zoom {
    top: 50%; left: 50%; right: auto;
    width: 56px; height: 56px; font-size: 1.8rem;
    background: rgba(211,0,15,.92);
    opacity: 1; transform: translate(-50%, -50%);
}
.udm-tile--video:hover .udm-tile__zoom, .udm-tile--video:focus-visible .udm-tile__zoom { transform: translate(-50%, -50%) scale(1.08); }

/* ---- Lightbox ---- */
.udm-glb {
    position: fixed; inset: 0; z-index: 2000;
    display: none; align-items: center; justify-content: center;
    padding: 28px;
}
.udm-glb.is-open { display: flex; }
.udm-glb__overlay { position: absolute; inset: 0; background: rgba(8,3,4,.92); backdrop-filter: blur(4px); }
.udm-glb__stage {
    position: relative; z-index: 1; margin: 0;
    max-width: min(1200px, 94vw); max-height: 88vh;
    display: flex; flex-direction: column; align-items: center;
}
.udm-glb__stage img {
    max-width: 100%; max-height: 82vh;
    border-radius: 10px; object-fit: contain;
    box-shadow: 0 30px 80px rgba(0,0,0,.6);
    opacity: 0; transition: opacity .3s ease;
}
.udm-glb__video {
    position: relative; z-index: 1;
    width: min(1100px, 92vw); aspect-ratio: 16 / 9; max-height: 82vh;
    border-radius: 10px; overflow: hidden; background: #000;
    box-shadow: 0 30px 80px rgba(0,0,0,.6);
}
.udm-glb__video iframe, .udm-glb__video video { width: 100%; height: 100%; border: 0; display: block; background: #000; }

/* ============================================================
   PRESS ARCHIVE — "In the headlines" (History page)
   A press-cuttings wall: masonry of newspaper scans + photos.
   ============================================================ */
.udm-press__head { max-width: 760px; margin: 0 auto 10px; text-align: center; }
.udm-press__lead { color: var(--udm-muted); font-size: 1.02rem; line-height: 1.6; margin: 12px auto 0; max-width: 620px; }

.udm-pressfilter {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
    margin: 26px 0 30px;
}
.udm-pchip {
    border: 1px solid rgba(30,20,20,.16); background: #fff; color: var(--udm-ink);
    padding: 6px 15px; border-radius: 999px; cursor: pointer;
    font-size: .82rem; font-weight: 700; transition: all .18s ease;
}
.udm-pchip:hover { border-color: var(--udm-primary); color: var(--udm-primary); }
.udm-pchip.is-on { background: var(--udm-primary); border-color: var(--udm-primary); color: #fff; }

/* Masonry via CSS columns — clippings keep their natural aspect ratio. */
.udm-presswall { columns: 4 240px; column-gap: 22px; }
.udm-pclip {
    break-inside: avoid; margin: 0 0 22px;
    background: #fdfcf8; border: 1px solid rgba(30,20,20,.12);
    border-radius: 6px; overflow: hidden;
    box-shadow: 0 6px 20px rgba(30,20,20,.09);
    transition: transform .22s ease, box-shadow .22s ease;
}
.udm-pclip:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(30,20,20,.18); }
.udm-pclip__btn {
    display: block; width: 100%; margin: 0; padding: 0; border: 0; cursor: pointer;
    position: relative; background: #f1efe9; line-height: 0;
}
.udm-pclip__btn img { width: 100%; height: auto; display: block; }
.udm-pclip__ribbon {
    position: absolute; top: 10px; left: 10px;
    width: 30px; height: 30px; border-radius: 50%;
    background: rgba(17,17,17,.82); color: #fff;
    display: grid; place-items: center; font-size: 1rem;
}
.udm-pclip__zoom {
    position: absolute; top: 10px; right: 10px;
    width: 34px; height: 34px; border-radius: 50%;
    background: rgba(211,0,15,.92); color: #fff;
    display: grid; place-items: center; font-size: 1.1rem;
    opacity: 0; transform: scale(.8); transition: opacity .2s ease, transform .2s ease;
}
.udm-pclip:hover .udm-pclip__zoom { opacity: 1; transform: none; }
.udm-pclip__cap { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 5px; }
.udm-pclip__meta {
    font-size: .68rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    color: var(--udm-primary);
}
.udm-pclip__title {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1.02rem; font-weight: 700; line-height: 1.3; color: var(--udm-ink);
}
.udm-pclip__sum { font-size: .84rem; color: var(--udm-muted); line-height: 1.5; }
.udm-pclip__link {
    margin-top: 2px; font-size: .78rem; font-weight: 700; color: var(--udm-primary);
    display: inline-flex; align-items: center; gap: 5px; text-decoration: none;
}
.udm-pclip__link:hover { text-decoration: underline; }

@media (max-width: 1080px) { .udm-presswall { columns: 3 220px; } }
@media (max-width: 760px)  { .udm-presswall { columns: 2 150px; column-gap: 14px; } .udm-pclip { margin-bottom: 14px; } }
.udm-glb__cap {
    margin-top: 14px; text-align: center; color: #fff;
    display: flex; flex-direction: column; gap: 4px;
    font-size: .95rem;
}
.udm-glb__count { color: rgba(255,255,255,.6); font-size: .82rem; font-weight: 700; letter-spacing: .5px; }
.udm-glb__btn {
    position: absolute; z-index: 2;
    width: 50px; height: 50px; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.12); color: #fff; cursor: pointer;
    font-size: 1.6rem; display: grid; place-items: center;
    transition: background .2s ease;
}
.udm-glb__btn:hover { background: var(--udm-primary); }
.udm-glb__close { top: 20px; right: 20px; }
.udm-glb__prev { left: 20px; top: 50%; transform: translateY(-50%); }
.udm-glb__next { right: 20px; top: 50%; transform: translateY(-50%); }
.udm-glb__spin {
    position: absolute; top: 50%; left: 50%; margin: -16px 0 0 -16px;
    width: 32px; height: 32px; border-radius: 50%;
    border: 3px solid rgba(255,255,255,.3); border-top-color: #fff;
    animation: udm-spin .8s linear infinite;
}

@media (max-width: 680px) {
    .udm-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
    .udm-tile.is-feature { grid-column: span 2; grid-row: span 1; }
    .udm-glb__prev { left: 10px; }
    .udm-glb__next { right: 10px; }
    .udm-album__head { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    .udm-tile img, .udm-tile__cap, .udm-tile__zoom, .udm-glb__stage img { transition: none; }
}


/* ---- Gallery: follow-us block ---- */
.udm-galfollow {
    margin-top: 26px;
    text-align: center;
    padding: 36px 24px;
    border-radius: 20px;
    background: linear-gradient(160deg, rgba(211,0,15,.05), rgba(242,183,5,.05));
    border: 1px solid rgba(30,20,20,.08);
}
.udm-galfollow__h {
    margin: 0 0 20px;
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: clamp(1.15rem, 2.4vw, 1.5rem);
    color: var(--udm-ink);
}
.udm-galfollow__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}
.udm-social {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 11px 20px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(30,20,20,.1);
    box-shadow: 0 4px 14px rgba(30,20,20,.06);
    color: var(--udm-ink);
    font-weight: 700;
    font-size: .92rem;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, color .2s ease, background .2s ease;
}
.udm-social i { font-size: 1.25rem; line-height: 1; }
.udm-social:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(30,20,20,.14); color: #fff; }
.udm-social--fb i { color: #1877F2; }
.udm-social--fb:hover { background: #1877F2; }
.udm-social--x i { color: #111; }
.udm-social--x:hover { background: #111; }
.udm-social--ig i { color: #E1306C; }
.udm-social--ig:hover { background: linear-gradient(45deg, #F58529, #DD2A7B, #8134AF); }
.udm-social--tt i { color: #111; }
.udm-social--tt:hover { background: #111; }
.udm-social:hover i { color: #fff; }

/* ============================================================
   NEWSROOM (Blog) — newspaper front page, stories, socials
   ============================================================ */
.udm-news__masthead {
    display: flex; align-items: baseline; justify-content: space-between;
    flex-wrap: wrap; gap: 10px;
    padding-bottom: 14px; margin-bottom: 30px;
    border-bottom: 3px double rgba(30,20,20,.3);
}
.udm-news__edition {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: 'Archivo', sans-serif; font-weight: 800;
    font-size: 1.05rem; letter-spacing: .5px; color: var(--udm-ink);
    text-transform: uppercase;
}
.udm-news__edition i { color: var(--udm-primary); }
.udm-news__tagline { font-size: .85rem; color: var(--udm-muted); font-style: italic; }

/* Kicker (category eyebrow) */
.udm-kicker {
    display: inline-block;
    font-size: .68rem; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
    color: var(--udm-primary); margin-bottom: 8px;
}

/* Byline */
.udm-byline { display: flex; flex-wrap: wrap; gap: 14px; color: var(--udm-muted); font-size: .85rem; }
.udm-byline span { display: inline-flex; align-items: center; gap: 5px; }
.udm-byline--sm { font-size: .78rem; gap: 10px; }

/* ---- Front page: lead + sidebar ---- */
.udm-frontpage {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr);
    gap: 40px;
    margin-bottom: 20px;
}
.udm-leadstory__imgwrap {
    position: relative; display: block;
    border-radius: 18px; overflow: hidden;
    aspect-ratio: 16 / 9; margin-bottom: 20px;
    background: var(--udm-surface-2, #efe9e9);
}
.udm-leadstory__imgwrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.udm-leadstory__imgwrap:hover img { transform: scale(1.04); }
.udm-leadstory__ph { position: absolute; inset: 0; display: grid; place-items: center; color: #cbb; font-size: 3rem; }
.udm-leadstory__badge {
    position: absolute; top: 16px; left: 16px;
    padding: 6px 14px; border-radius: 999px;
    background: var(--udm-primary); color: #fff;
    font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    box-shadow: 0 6px 16px rgba(211,0,15,.35);
}
.udm-leadstory__title { margin: 0 0 14px; font-size: clamp(1.7rem, 3.4vw, 2.6rem); font-weight: 800; line-height: 1.1; }
.udm-leadstory__title a { color: var(--udm-ink); text-decoration: none; }
.udm-leadstory__title a:hover { color: var(--udm-primary); }
.udm-leadstory__lead {
    margin: 0 0 16px; font-size: 1.08rem; line-height: 1.75; color: var(--udm-muted);
}
.udm-leadstory__lead::first-letter {
    float: left; font-family: 'Archivo', serif; font-weight: 800;
    font-size: 3.1rem; line-height: .82; padding: 4px 10px 0 0; color: var(--udm-primary);
}
.udm-leadstory__cta { margin-top: 18px; display: inline-flex; align-items: center; gap: 8px; }

/* Sidebar list */
.udm-sidelist { border-left: 1px solid rgba(30,20,20,.12); padding-left: 32px; }
.udm-sidelist__h {
    margin: 0 0 18px; font-size: .8rem; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--udm-ink); padding-bottom: 10px; border-bottom: 2px solid var(--udm-primary); display: inline-block;
}
.udm-sideitem {
    display: flex; gap: 14px; padding: 16px 0;
    border-top: 1px solid rgba(30,20,20,.1);
    text-decoration: none;
}
.udm-sideitem:first-of-type { border-top: 0; }
.udm-sideitem__thumb {
    flex-shrink: 0; width: 84px; height: 72px; border-radius: 10px; overflow: hidden;
    background: var(--udm-surface-2, #efe9e9); display: grid; place-items: center; color: #cbb;
}
.udm-sideitem__thumb img { width: 100%; height: 100%; object-fit: cover; }
.udm-sideitem__title {
    display: block; font-size: .98rem; font-weight: 700; line-height: 1.3; color: var(--udm-ink);
    margin: 2px 0 6px;
    transition: color .2s ease;
}
.udm-sideitem:hover .udm-sideitem__title { color: var(--udm-primary); }
.udm-sideitem__date { font-size: .76rem; color: var(--udm-muted); display: inline-flex; align-items: center; gap: 5px; }

/* ---- Section rule ---- */
.udm-newsrule {
    position: relative; text-align: center; margin: 44px 0 30px;
}
.udm-newsrule::before {
    content: ""; position: absolute; top: 50%; left: 0; right: 0; height: 1px;
    background: rgba(30,20,20,.18);
}
.udm-newsrule span {
    position: relative; background: transparent; padding: 0 18px;
    font-family: 'Archivo', sans-serif; font-weight: 800; font-size: .85rem;
    letter-spacing: 1.5px; text-transform: uppercase; color: var(--udm-ink);
}
.udm-newsrule span::before, .udm-newsrule span::after { content: ""; }
.udm-news .udm-wrap { position: relative; }
/* give the rule label a solid backdrop so the line doesn't cross the text */
.udm-newsrule span {
    background: linear-gradient(180deg, transparent 45%, #fdf7f7 45%);
}

/* ---- Stories grid ---- */
.udm-stories {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 26px;
}
.udm-story {
    display: flex; flex-direction: column;
    background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; overflow: hidden;
    box-shadow: 0 2px 14px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease;
}
.udm-story:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(30,20,20,.12); }
.udm-story__imgwrap { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--udm-surface-2, #efe9e9); }
.udm-story__imgwrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.udm-story:hover .udm-story__imgwrap img { transform: scale(1.06); }
.udm-story__ph { display: grid; place-items: center; height: 100%; color: #cbb; font-size: 2.4rem; }
.udm-story__body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.udm-story__title { margin: 0 0 8px; font-size: 1.12rem; font-weight: 800; line-height: 1.3; }
.udm-story__title a { color: var(--udm-ink); text-decoration: none; }
.udm-story__title a:hover { color: var(--udm-primary); }
.udm-story__excerpt { margin: 0 0 14px; font-size: .9rem; line-height: 1.6; color: var(--udm-muted); flex: 1; }

.udm-newspag { margin-top: 40px; }

/* ---- Social section ---- */
.udm-socgrid {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px;
    margin-top: 36px; align-items: start;
}
.udm-socfeed {
    min-height: 620px;
    border-radius: 16px; overflow: hidden;
    background: #fff; border: 1px solid rgba(30,20,20,.1);
    box-shadow: 0 2px 14px rgba(30,20,20,.06);
    display: flex; justify-content: center;
}
.udm-socfeed .fb-page, .udm-socfeed span, .udm-socfeed iframe { max-width: 100%; }
.udm-socchannels { display: grid; gap: 14px; align-content: start; }
.udm-socch {
    display: flex; align-items: center; gap: 16px;
    padding: 18px 20px; border-radius: 16px;
    background: #fff; border: 1px solid rgba(30,20,20,.1);
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
    text-decoration: none; color: var(--udm-ink);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.udm-socch:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(30,20,20,.12); border-color: rgba(211,0,15,.3); }
.udm-socch__ico {
    flex-shrink: 0; width: 52px; height: 52px; border-radius: 14px;
    display: grid; place-items: center; font-size: 1.6rem; color: #fff;
}
.udm-socch--x .udm-socch__ico { background: #111; }
.udm-socch--ig .udm-socch__ico { background: linear-gradient(45deg, #F58529, #DD2A7B, #8134AF); }
.udm-socch--tt .udm-socch__ico { background: #111; }
.udm-socch--yt .udm-socch__ico { background: #FF0000; }
.udm-socch__body { display: flex; flex-direction: column; flex: 1; }
.udm-socch__body strong { font-size: 1rem; font-weight: 800; }
.udm-socch__body span { font-size: .85rem; color: var(--udm-muted); }
.udm-socch__go { color: var(--udm-muted); font-size: 1.2rem; }
.udm-socch:hover .udm-socch__go { color: var(--udm-primary); }

@media (max-width: 920px) {
    .udm-frontpage { grid-template-columns: 1fr; gap: 30px; }
    .udm-sidelist { border-left: 0; padding-left: 0; border-top: 1px solid rgba(30,20,20,.12); padding-top: 24px; }
    .udm-socgrid { grid-template-columns: 1fr; }
    .udm-socfeed { min-height: auto; }
}


/* ---- Newsroom social: feed fits the card + more platform icons ---- */
.udm-socgrid { grid-template-columns: minmax(0, 500px) minmax(0, 1fr); }
.udm-socgrid--nofeed { grid-template-columns: 1fr; }
.udm-socgrid--nofeed .udm-socchannels { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

/* feed card hugs the embed (no centring gutters, no fixed min-height) */
.udm-socfeed {
    display: block;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}
.udm-socfeed__head {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(30,20,20,.08);
}
.udm-socfeed__ico {
    flex-shrink: 0;
    width: 44px; height: 44px; border-radius: 12px;
    display: grid; place-items: center; color: #fff; font-size: 1.4rem;
    background: #1877F2;
}
.udm-socfeed__id { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.udm-socfeed__id strong { font-size: 1rem; font-weight: 800; color: var(--udm-ink); }
.udm-socfeed__id span { font-size: .82rem; color: var(--udm-muted); }
.udm-socfeed__follow {
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 5px;
    padding: 8px 14px; border-radius: 999px;
    background: #1877F2; color: #fff !important; text-decoration: none;
    font-size: .82rem; font-weight: 700;
}
.udm-socfeed__follow:hover { background: #0e5fc7; }
.udm-socfeed__embed { width: 100%; background: #fff; }
.udm-socfeed__embed .fb-page,
.udm-socfeed__embed .fb-page > span,
.udm-socfeed__embed iframe { width: 100% !important; }

/* extra platform card colours */
.udm-socch--fb .udm-socch__ico { background: #1877F2; }
.udm-socch--in .udm-socch__ico { background: #0A66C2; }
.udm-socch--wa .udm-socch__ico { background: #25D366; }
.udm-socch--tg .udm-socch__ico { background: #229ED9; }

/* ============================================================
   DONATE PAGE (v2) — cause, impact, transparent giving flow
   ============================================================ */
.udm-hide { display: none !important; }

/* ---- The cause ---- */
.udm-impactcards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 40px;
}
.udm-icard {
    padding: 26px 24px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(30,20,20,.08);
    box-shadow: 0 2px 14px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.udm-icard:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(30,20,20,.1); border-color: rgba(211,0,15,.3); }
.udm-icard__ico {
    width: 50px; height: 50px; border-radius: 14px;
    display: grid; place-items: center;
    background: linear-gradient(145deg, var(--udm-primary), var(--udm-primary-dark));
    color: #fff; font-size: 1.5rem; margin-bottom: 14px;
    box-shadow: 0 6px 16px rgba(211,0,15,.26);
}
.udm-icard__title { margin: 0 0 7px; font-size: 1.08rem; font-weight: 800; color: var(--udm-ink); }
.udm-icard__text { margin: 0; font-size: .93rem; line-height: 1.65; color: var(--udm-muted); }

.udm-trans {
    display: flex; gap: 18px; align-items: flex-start;
    margin-top: 28px; padding: 24px 26px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(211,0,15,.05), rgba(242,183,5,.06));
    border: 1px solid rgba(211,0,15,.14);
}
.udm-trans__ico {
    flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%;
    display: grid; place-items: center;
    background: #fff; color: var(--udm-primary); font-size: 1.6rem;
    box-shadow: 0 4px 14px rgba(30,20,20,.1);
}
.udm-trans__h { margin: 2px 0 6px; font-size: 1.1rem; font-weight: 800; color: var(--udm-ink); }
.udm-trans__p { margin: 0; font-size: .95rem; line-height: 1.7; color: var(--udm-muted); }
.udm-trans__p strong { color: var(--udm-ink); }

/* ---- Donate layout ---- */
.udm-dgrid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 36px; align-items: start; }

/* alerts */
.udm-dalert { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; border-radius: 12px; margin-bottom: 20px; font-size: .92rem; }
.udm-dalert i { font-size: 1.3rem; margin-top: 1px; }
.udm-dalert--ok { background: #eaf7ee; color: #1b7a3d; border: 1px solid #bfe6cc; }
.udm-dalert--err { background: #fdeaea; color: #b11; border: 1px solid #f3bcbc; }

/* stepper */
.udm-stepper { display: flex; align-items: center; margin-bottom: 24px; }
.udm-step { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 92px; flex-shrink: 0; }
.udm-step__dot {
    width: 38px; height: 38px; border-radius: 50%;
    display: grid; place-items: center;
    background: #e7dede; color: var(--udm-muted);
    font-weight: 800; font-size: .95rem;
    transition: background .3s ease, color .3s ease, transform .3s ease;
}
.udm-step__label { font-size: .72rem; font-weight: 700; color: var(--udm-muted); text-align: center; }
.udm-step.is-active .udm-step__dot { background: var(--udm-primary); color: #fff; transform: scale(1.08); box-shadow: 0 6px 16px rgba(211,0,15,.3); }
.udm-step.is-active .udm-step__label { color: var(--udm-ink); }
.udm-step.is-done .udm-step__dot { background: #1b7a3d; color: #fff; }
.udm-step.is-done .udm-step__dot::before { content: "\2713"; }
.udm-step.is-done .udm-step__dot { font-size: 0; }
.udm-step.is-done .udm-step__dot::before { font-size: 1rem; }
.udm-step__line { flex: 1; height: 2px; background: #e7dede; transition: background .3s ease; }
.udm-step__line.is-done { background: #1b7a3d; }

/* cards */
.udm-dcard {
    position: relative;
    background: #fff;
    border: 1px solid rgba(30,20,20,.08);
    border-top: 3px solid var(--udm-primary);
    border-radius: 18px;
    padding: 28px;
    box-shadow: 0 4px 20px rgba(30,20,20,.06);
    animation: udm-dfade .4s ease;
}
@keyframes udm-dfade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.udm-dcard__h { margin: 0 0 4px; font-size: 1.2rem; font-weight: 800; color: var(--udm-ink); display: flex; align-items: center; gap: 8px; }
.udm-dcard__h i { color: var(--udm-primary); }
.udm-dcard__h--center { justify-content: center; }
.udm-dcard__sub { margin: 0 0 22px; font-size: .92rem; color: var(--udm-muted); }
.udm-dcard__sub--center { text-align: center; }
.udm-dcard__badge {
    width: 58px; height: 58px; margin: 0 auto 14px; border-radius: 50%;
    display: grid; place-items: center; font-size: 1.6rem;
    background: rgba(27,122,61,.12); color: #1b7a3d;
}
.udm-dcard__badge--gold { background: rgba(242,183,5,.16); color: #b8860b; }

/* presets */
.udm-presets { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.udm-preset {
    padding: 9px 18px; border-radius: 999px;
    background: var(--udm-surface, #f6f1f1); border: 1px solid rgba(30,20,20,.12);
    color: var(--udm-ink); font-weight: 700; font-size: .9rem; cursor: pointer;
    transition: all .2s ease;
}
.udm-preset:hover { border-color: var(--udm-primary); color: var(--udm-primary); }
.udm-preset.is-on { background: var(--udm-primary); border-color: var(--udm-primary); color: #fff; }

/* fields */
.udm-dfield { margin-bottom: 18px; }
.udm-dfield label { display: block; font-size: .82rem; font-weight: 700; color: var(--udm-ink); margin-bottom: 7px; }
.udm-dfield label .req { color: var(--udm-primary); }
.udm-dfield input {
    width: 100%; padding: 12px 15px;
    border: 1px solid rgba(30,20,20,.16); border-radius: 11px;
    font-size: 1rem; color: var(--udm-ink); background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.udm-dfield input:focus { outline: none; border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.12); }
.udm-dformgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }

/* amount box */
.udm-amountbox { display: flex; align-items: center; border: 1px solid rgba(30,20,20,.16); border-radius: 12px; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease; }
.udm-amountbox:focus-within { border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.12); }
.udm-amountbox__cur { padding: 0 14px; font-weight: 800; color: var(--udm-muted); font-size: .95rem; background: var(--udm-surface, #f6f1f1); align-self: stretch; display: flex; align-items: center; }
.udm-amountbox input { border: 0 !important; border-radius: 0; font-size: 1.6rem; font-weight: 800; padding: 14px 15px; }
.udm-amountbox input:focus { box-shadow: none; }

/* methods */
.udm-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.udm-method {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 18px; border-radius: 14px; cursor: pointer;
    background: #fff; border: 2px solid rgba(30,20,20,.12);
    font-weight: 700; color: var(--udm-ink);
    transition: all .2s ease;
}
.udm-method i { font-size: 1.6rem; color: var(--udm-muted); }
.udm-method:hover { border-color: rgba(211,0,15,.4); }
.udm-method.is-on { border-color: var(--udm-primary); background: rgba(211,0,15,.04); }
.udm-method.is-on i { color: var(--udm-primary); }

.udm-dnext { width: 100%; justify-content: center; margin-top: 6px; }

/* confirm amount */
.udm-damount {
    text-align: center; padding: 18px; margin-bottom: 20px;
    border-radius: 14px; background: var(--udm-surface, #f6f1f1);
    border: 2px dashed var(--udm-accent);
}
.udm-damount span { display: block; font-size: .8rem; color: var(--udm-muted); }
.udm-damount strong { display: block; font-size: 1.9rem; font-weight: 800; color: #1b7a3d; }

/* guides */
.udm-guide { padding: 18px 20px; border-radius: 14px; margin-bottom: 18px; }
.udm-guide h4 { margin: 0 0 12px; font-size: .95rem; font-weight: 800; display: flex; align-items: center; gap: 7px; }
.udm-guide--mpesa { background: #f0faf0; border: 1px solid #c8e6c9; }
.udm-guide--mpesa h4 { color: #2e7d32; }
.udm-guide--bank { background: #eef4fe; border: 1px solid #c5d9f7; }
.udm-guide--bank h4 { color: #1565c0; }
.udm-guide ol { margin: 0; padding-left: 20px; font-size: .9rem; line-height: 2; color: var(--udm-ink); }
.udm-guide ul { margin: 0; padding: 0; list-style: none; }
.udm-guide ul li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid rgba(30,20,20,.07); font-size: .92rem; }
.udm-guide ul li:first-child { border-top: 0; }
.udm-guide ul li span { color: var(--udm-muted); }
.udm-green { color: #1b7a3d; }
.udm-copybtn {
    border: 1px solid rgba(30,20,20,.2); background: #fff; color: var(--udm-ink);
    font-size: .68rem; font-weight: 700; padding: 2px 9px; border-radius: 6px; cursor: pointer; margin-left: 4px;
    transition: all .15s ease;
}
.udm-copybtn:hover { background: var(--udm-primary); color: #fff; border-color: var(--udm-primary); }

.udm-dactions { display: flex; gap: 12px; margin-top: 8px; }
.udm-dactions .udm-btn { flex: 1; justify-content: center; }

/* ---- Sidebar ---- */
.udm-dside { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 16px; }
.udm-dside__card { background: var(--udm-night); border-radius: 18px; padding: 24px; color: #fff; }
.udm-dside__h { margin: 0 0 16px; font-size: 1rem; font-weight: 800; color: var(--udm-accent); display: flex; align-items: center; gap: 8px; }
.udm-payline { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.1); }
.udm-payline:first-of-type { border-top: 0; }
.udm-payline__ico { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; font-size: 1.2rem; color: #fff; flex-shrink: 0; }
.udm-payline__ico--mpesa { background: #2e8b2e; }
.udm-payline__ico--bank { background: #1565c0; }
.udm-payline div { flex: 1; display: flex; flex-direction: column; }
.udm-payline span { font-size: .72rem; color: rgba(255,255,255,.6); }
.udm-payline strong { font-size: 1rem; color: #fff; }
.udm-dside__trust { display: grid; gap: 10px; }
.udm-dside__trust div { display: flex; align-items: center; gap: 9px; font-size: .88rem; color: var(--udm-muted); font-weight: 600; }
.udm-dside__trust i { color: #1b7a3d; font-size: 1.1rem; }
.udm-dside__quote {
    padding: 20px 22px; border-radius: 16px; position: relative;
    background: linear-gradient(135deg, var(--udm-primary), var(--udm-primary-dark));
    color: #fff; font-size: .98rem; font-weight: 600; line-height: 1.6; font-style: italic;
}
.udm-dside__quote span { font-family: Georgia, serif; font-size: 2rem; color: var(--udm-accent); line-height: 0; position: relative; top: 8px; margin-right: 4px; }

@media (max-width: 920px) {
    .udm-impactcards { grid-template-columns: repeat(2, 1fr); }
    .udm-dgrid { grid-template-columns: 1fr; }
    .udm-dside { position: static; }
    .udm-trans { flex-direction: column; }
}
@media (max-width: 560px) {
    .udm-impactcards { grid-template-columns: 1fr; }
    .udm-dformgrid { grid-template-columns: 1fr; }
    .udm-step__label { display: none; }
}


/* ============================================================
   DONATE — images & motion (collage, stats, photo band)
   ============================================================ */
@keyframes udm-kenburns { 0% { transform: scale(1); } 100% { transform: scale(1.14); } }
@keyframes udm-dfloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* Two-column intro */
.udm-dintro { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.udm-dstats { display: flex; gap: 30px; margin-top: 26px; }
.udm-dstats > div { display: flex; flex-direction: column; }
.udm-dstats span { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; line-height: 1; color: var(--udm-primary); }
.udm-dstats small { margin-top: 4px; font-size: .78rem; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-muted); }

/* Image collage */
.udm-dcollage { position: relative; aspect-ratio: 4 / 3.4; }
.udm-dcollage__img {
    position: absolute; display: block; background-size: cover; background-position: center;
    border-radius: 18px; box-shadow: 0 18px 44px rgba(30,8,10,.28);
}
.udm-dcollage__img--main { inset: 0 0 16% 18%; overflow: hidden; }
.udm-dcollage__img--main::after {
    content: ""; position: absolute; inset: 0; background-image: inherit; background-size: cover; background-position: center;
    animation: udm-kenburns 16s ease-in-out infinite alternate;
}
.udm-dcollage__img--inset {
    width: 46%; aspect-ratio: 1 / 1; left: 0; bottom: 0;
    border: 5px solid #fff; animation: udm-dfloat 6s ease-in-out infinite;
}
.udm-dcollage__badge {
    position: absolute; top: 6%; right: 0; z-index: 2;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 16px; border-radius: 999px;
    background: var(--udm-accent); color: var(--udm-accent-ink);
    font-weight: 800; font-size: .82rem; box-shadow: 0 8px 20px rgba(242,183,5,.4);
    animation: udm-dfloat 7s ease-in-out infinite .5s;
}

/* Full-width photo banner */
.udm-dband { position: relative; overflow: hidden; padding: 72px 0; }
.udm-dband__img {
    position: absolute; inset: 0; background-size: cover; background-position: center 35%;
    animation: udm-kenburns 22s ease-in-out infinite alternate;
}
.udm-dband__scrim { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(20,6,8,.88), rgba(20,6,8,.55) 70%, rgba(126,0,9,.5)); }
.udm-dband__inner { position: relative; z-index: 1; max-width: 680px; }
.udm-dband__eyebrow { display: inline-block; color: var(--udm-accent); font-weight: 800; font-size: .8rem; letter-spacing: .6px; text-transform: uppercase; margin-bottom: 12px; }
.udm-dband__h { margin: 0 0 12px; font-size: clamp(1.6rem, 3.6vw, 2.6rem); font-weight: 800; color: #fff; line-height: 1.1; }
.udm-dband__p { margin: 0 0 22px; font-size: 1.05rem; line-height: 1.6; color: rgba(255,255,255,.88); }
.udm-dband .udm-btn { display: inline-flex; align-items: center; gap: 8px; }

/* Sidebar photo */
.udm-dside__photo { position: relative; border-radius: 18px; overflow: hidden; aspect-ratio: 16 / 9; box-shadow: 0 8px 24px rgba(30,20,20,.12); }
.udm-dside__photoimg { position: absolute; inset: 0; background-size: cover; background-position: center; animation: udm-kenburns 20s ease-in-out infinite alternate; }
.udm-dside__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,6,8,.8), transparent 60%); }
.udm-dside__photocap { position: absolute; left: 16px; bottom: 12px; z-index: 1; color: #fff; font-weight: 800; font-size: .95rem; text-shadow: 0 2px 8px rgba(0,0,0,.5); }

@media (max-width: 920px) {
    .udm-dintro { grid-template-columns: 1fr; gap: 32px; }
    .udm-dcollage { max-width: 440px; }
}
@media (prefers-reduced-motion: reduce) {
    .udm-dcollage__img--main::after, .udm-dcollage__img--inset, .udm-dcollage__badge,
    .udm-dband__img, .udm-dside__photoimg { animation: none !important; }
}

/* ============================================================
   CONTACT PAGE (v2) — info, form, photo, map
   ============================================================ */
.udm-cgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 40px; align-items: start; }

/* ---- Info side ---- */
.udm-cphoto {
    position: relative; border-radius: 18px; overflow: hidden;
    aspect-ratio: 16 / 9; margin-bottom: 20px;
    box-shadow: 0 12px 34px rgba(30,20,20,.14);
}
.udm-cphoto__img { position: absolute; inset: 0; background-size: cover; background-position: center; animation: udm-kenburns 20s ease-in-out infinite alternate; }
.udm-cphoto__scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,6,8,.82), transparent 60%); }
.udm-cphoto__cap { position: absolute; left: 20px; bottom: 16px; z-index: 1; display: flex; flex-direction: column; gap: 2px; }
.udm-cphoto__eyebrow { font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-accent); }
.udm-cphoto__cap strong { font-size: 1.3rem; font-weight: 800; color: #fff; }

.udm-ccards { display: grid; gap: 12px; }
.udm-ccard {
    display: flex; align-items: center; gap: 14px;
    padding: 14px 16px; border-radius: 14px;
    background: #fff; border: 1px solid rgba(30,20,20,.08);
    box-shadow: 0 2px 12px rgba(30,20,20,.05);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.udm-ccard:hover { transform: translateX(4px); box-shadow: 0 10px 26px rgba(30,20,20,.1); border-color: rgba(211,0,15,.3); }
.udm-ccard__ico {
    flex-shrink: 0; width: 46px; height: 46px; border-radius: 12px;
    display: grid; place-items: center; font-size: 1.3rem;
    background: rgba(211,0,15,.08); color: var(--udm-primary);
}
.udm-ccard__body { display: flex; flex-direction: column; min-width: 0; }
.udm-ccard__label { font-size: .72rem; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; color: var(--udm-muted); }
.udm-ccard__value { font-size: .98rem; font-weight: 700; color: var(--udm-ink); text-decoration: none; }
a.udm-ccard__value:hover { color: var(--udm-primary); }

.udm-csocial { margin-top: 22px; }
.udm-csocial__label { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-muted); margin-bottom: 12px; }
.udm-csocial__links { display: flex; gap: 10px; flex-wrap: wrap; }
.udm-csocial .udm-social { width: 46px; height: 46px; padding: 0; justify-content: center; }

/* ---- Form side ---- */
.udm-cform__card {
    background: #fff; border: 1px solid rgba(30,20,20,.08);
    border-top: 3px solid var(--udm-primary); border-radius: 18px;
    padding: 30px; box-shadow: 0 6px 24px rgba(30,20,20,.07);
}
.udm-cform__h { margin: 0 0 4px; font-size: 1.3rem; font-weight: 800; color: var(--udm-ink); display: flex; align-items: center; gap: 9px; }
.udm-cform__h i { color: var(--udm-primary); }
.udm-cform__sub { margin: 0 0 22px; font-size: .92rem; color: var(--udm-muted); }
/* textarea + select reuse the donate .udm-dfield input look */
.udm-dfield textarea, .udm-cselect {
    width: 100%; padding: 12px 15px;
    border: 1px solid rgba(30,20,20,.16); border-radius: 11px;
    font-size: 1rem; color: var(--udm-ink); background: #fff; font-family: inherit;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.udm-dfield textarea { resize: vertical; min-height: 120px; line-height: 1.6; }
.udm-dfield textarea:focus, .udm-cselect:focus { outline: none; border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.12); }
.udm-cform__send { width: 100%; justify-content: center; margin-top: 4px; }

/* ---- Map ---- */
.udm-cmapsec { position: relative; }
.udm-cmap { position: relative; height: 460px; }
.udm-cmap iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(.15); }
.udm-cmap__card {
    position: absolute; top: 50%; left: 7%; transform: translateY(-50%);
    width: min(340px, 84vw);
    background: #fff; border-radius: 18px; padding: 26px;
    box-shadow: 0 20px 50px rgba(0,0,0,.25);
    border-top: 4px solid var(--udm-primary);
}
.udm-cmap__eyebrow { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-primary); margin-bottom: 10px; }
.udm-cmap__h { margin: 0 0 8px; font-size: 1.25rem; font-weight: 800; color: var(--udm-ink); }
.udm-cmap__addr { margin: 0 0 6px; color: var(--udm-muted); font-size: .96rem; }
.udm-cmap__hours { margin: 0 0 18px; color: var(--udm-muted); font-size: .9rem; display: flex; align-items: center; gap: 6px; }
.udm-cmap__card .udm-btn { width: 100%; justify-content: center; }

@media (max-width: 900px) {
    .udm-cgrid { grid-template-columns: 1fr; gap: 30px; }
    .udm-cmap { height: auto; }
    .udm-cmap iframe { height: 320px; }
    .udm-cmap__card { position: static; transform: none; width: auto; margin: -40px 18px 0; position: relative; z-index: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .udm-cphoto__img { animation: none !important; }
}


/* ============================================================
   REGISTRATION PAGE (v2) — benefits/levels panel + form
   ============================================================ */
.udm-reg {
    position: relative;
    overflow: hidden;
    padding: 36px 18px 56px;
    background:
        radial-gradient(900px 440px at 12% -5%, rgba(211,0,15,.07), transparent 60%),
        radial-gradient(900px 460px at 100% 10%, rgba(242,183,5,.08), transparent 55%),
        linear-gradient(180deg, #fbf7f7 0%, #f4eeee 100%);
}
.udm-reg::before {
    content: "";
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(30,20,20,.05) 1px, transparent 1px);
    background-size: 26px 26px;
    -webkit-mask-image: linear-gradient(180deg, #000, transparent 70%);
    mask-image: linear-gradient(180deg, #000, transparent 70%);
    pointer-events: none;
}
.udm-reg__bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.udm-reg__orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .5; }
.udm-reg__orb--1 { width: 420px; height: 420px; top: -100px; left: -120px; background: radial-gradient(circle, rgba(211,0,15,.22), transparent 70%); animation: udm-orb1 26s ease-in-out infinite; }
.udm-reg__orb--2 { width: 360px; height: 360px; top: 28%; right: -140px; background: radial-gradient(circle, rgba(242,183,5,.22), transparent 70%); animation: udm-orb2 32s ease-in-out infinite; }
.udm-reg__orb--3 { width: 320px; height: 320px; bottom: -130px; left: 30%; background: radial-gradient(circle, rgba(211,0,15,.14), transparent 70%); animation: udm-orb3 38s ease-in-out infinite; }

.udm-reg__wrap {
    position: relative; z-index: 1;
    max-width: 1180px; margin: 0 auto;
    display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 28px; align-items: start;
}

/* ---- Benefits / levels panel (dark branded card) ---- */
.udm-reg__aside {
    background: linear-gradient(165deg, #3a1316 0%, #1b080a 100%);
    border-radius: 22px; padding: 32px 30px; color: #fff;
    box-shadow: 0 20px 50px rgba(30,8,10,.3);
    position: relative; overflow: hidden;
}
.udm-reg__eyebrow { display: inline-block; color: var(--udm-accent); font-weight: 800; font-size: .78rem; letter-spacing: .6px; text-transform: uppercase; margin-bottom: 10px; }
.udm-reg__title { margin: 0 0 12px; font-size: clamp(1.7rem, 3vw, 2.3rem); font-weight: 800; line-height: 1.08; color: #fff; }
.udm-reg__lead { margin: 0 0 22px; font-size: .98rem; line-height: 1.7; color: rgba(255,255,255,.82); }

.udm-reg__photo { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 16/9; margin-bottom: 26px; }
.udm-reg__photoimg { position: absolute; inset: 0; background-size: cover; background-position: center; animation: udm-kenburns 20s ease-in-out infinite alternate; }
.udm-reg__photoscrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,6,8,.75), transparent 55%); }
.udm-reg__photocap { position: absolute; left: 14px; bottom: 11px; display: inline-flex; align-items: center; gap: 6px; color: #fff; font-weight: 800; font-size: .9rem; }
.udm-reg__photocap i { color: var(--udm-accent); }

.udm-reg__h { margin: 0 0 16px; font-size: .82rem; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: var(--udm-accent); }

.udm-reg__benefits { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 16px; }
.udm-reg__benefits li { display: flex; gap: 14px; align-items: flex-start; }
.udm-reg__bico { flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: rgba(242,183,5,.16); color: var(--udm-accent); font-size: 1.25rem; }
.udm-reg__benefits strong { display: block; color: #fff; font-size: .98rem; margin-bottom: 2px; }
.udm-reg__benefits div { font-size: .86rem; line-height: 1.55; color: rgba(255,255,255,.72); }

.udm-reg__levels { display: grid; gap: 10px; margin-bottom: 14px; }
.udm-reg__level { display: flex; gap: 13px; align-items: flex-start; padding: 13px 15px; border-radius: 13px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); transition: background .2s ease, border-color .2s ease; }
.udm-reg__level:hover { background: rgba(255,255,255,.09); }
.udm-reg__level.is-default { border-color: rgba(242,183,5,.5); background: rgba(242,183,5,.08); }
.udm-reg__levelico { flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: rgba(211,0,15,.25); color: #fff; font-size: 1.2rem; }
.udm-reg__level.is-default .udm-reg__levelico { background: var(--udm-accent); color: var(--udm-accent-ink); }
.udm-reg__leveltext { flex: 1; min-width: 0; }
.udm-reg__levelhead { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.udm-reg__levelhead strong { color: #fff; font-size: .98rem; font-weight: 800; }
.udm-reg__levelhead span { color: var(--udm-accent); font-size: .82rem; font-weight: 800; white-space: nowrap; }
.udm-reg__leveltext p { margin: 3px 0 0; font-size: .8rem; line-height: 1.5; color: rgba(255,255,255,.68); }
.udm-reg__levelnote { margin: 0; font-size: .8rem; line-height: 1.6; color: rgba(255,255,255,.6); }
.udm-reg__levelnote strong { color: rgba(255,255,255,.85); }

/* ---- Form column ---- */
.udm-reg__main { min-width: 0; }
.udm-reg__main .reg-card { max-width: none; border-radius: 20px; overflow: hidden; }

/* small polish on existing form inputs within this page */
.udm-reg__main .form-control, .udm-reg__main .form-select { border-radius: 9px; }
.udm-reg__main .form-control:focus, .udm-reg__main .form-select:focus { border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.12); }

@media (max-width: 920px) {
    .udm-reg__wrap { grid-template-columns: 1fr; gap: 22px; }
    .udm-reg__aside { position: static; order: 2; }   /* form first on mobile */
    .udm-reg__main { order: 1; }
}
@media (max-width: 640px) {
    .udm-reg { padding: 22px 12px 44px; }
    .udm-reg__wrap { gap: 18px; }
    .udm-reg__aside { padding: 26px 20px; border-radius: 18px; }
    .udm-reg__main .card-body { padding: 20px 16px 24px; }
    .reg-header--hero { padding: 28px 16px 24px; }
    .reg-header__badge { width: 74px; height: 74px; }
    .reg-header__badge img { width: 60px; height: 60px; }
    .reg-header__title { font-size: 1.18rem; }
    .udm-reg__main .reg-card { border-radius: 16px; }
    /* floating fields: a touch more room for labels on tiny screens */
    .udm-ff__input, .udm-ff--select .select2-container--default .select2-selection--single { height: 56px; }
}
@media (max-width: 400px) {
    .udm-segs { gap: 8px; }
    .udm-seg span { padding: 9px 13px; font-size: .84rem; }
    .udm-reg__levelhead { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
    .udm-reg__orb, .udm-reg__photoimg { animation: none !important; }
}


/* ---- Register tweaks: visible Check-Membership btn + clickable levels ---- */
.udm-reg .btn-verify {
    display: inline-flex; align-items: center; gap: 6px;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.75) !important;
    background: rgba(0,0,0,.18);
    font-weight: 700; text-decoration: none;
}
.udm-reg .btn-verify:hover {
    background: var(--udm-accent);
    color: var(--udm-accent-ink) !important;
    border-color: var(--udm-accent) !important;
}

/* ---- Form card header: hero with convoy backdrop ---- */
.reg-header--hero {
    position: relative; overflow: hidden;
    padding: 36px 22px 30px;
    background: #7a0109;   /* fallback beneath the image */
}
.reg-header__media {
    position: absolute; inset: 0;
    background: url('/assets/v2/field-convoy.jpg') center 38% / cover no-repeat;
    transform: scale(1.06);
}
.reg-header__scrim {
    position: absolute; inset: 0;
    background:
        linear-gradient(180deg, rgba(160,3,14,.74) 0%, rgba(110,1,8,.86) 100%),
        radial-gradient(120% 95% at 50% -10%, rgba(0,0,0,.05), rgba(0,0,0,.42) 96%);
}
.reg-header__content { position: relative; z-index: 2; }
.reg-header__badge {
    display: inline-grid; place-items: center;
    width: 86px; height: 86px; border-radius: 50%;
    background: rgba(255,255,255,.96);
    box-shadow: 0 10px 26px rgba(0,0,0,.38), 0 0 0 4px rgba(255,255,255,.16);
    margin-bottom: 14px;
}
.reg-header__badge img { width: 72px; height: 72px; object-fit: contain; }
.reg-header__title {
    margin: 0 0 7px; color: #fff; font-weight: 800;
    font-size: 1.35rem; letter-spacing: .6px;
    text-shadow: 0 2px 12px rgba(0,0,0,.45);
}
.reg-header__tag {
    margin: 0 0 16px; display: inline-flex; align-items: center; gap: 9px;
    color: var(--udm-accent); font-weight: 700; font-size: .86rem; letter-spacing: .8px; text-transform: uppercase;
}
.reg-header__tag i { font-size: .62rem; opacity: .9; }

/* ---- Select2 dropdown panel: theme colours (panel is appended to <body>) ---- */
.udm-v2 .select2-dropdown {
    border: 1.5px solid rgba(211,0,15,.22);
    border-radius: 12px;
    box-shadow: 0 14px 34px rgba(30,8,10,.18);
    overflow: hidden;
}
.udm-v2 .select2-search--dropdown { padding: 8px; }
.udm-v2 .select2-search--dropdown .select2-search__field {
    border: 1.5px solid rgba(30,20,20,.15); border-radius: 8px; padding: 7px 10px; outline: none;
}
.udm-v2 .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.12);
}
.udm-v2 .select2-results__option {
    padding: 9px 14px; font-size: .95rem; color: var(--udm-ink); transition: background .12s ease, color .12s ease;
}
/* hover / keyboard highlight */
.udm-v2 .select2-results__option--highlighted,
.udm-v2 .select2-results__option--highlighted[aria-selected] {
    background-color: var(--udm-primary) !important; color: #fff !important;
}
/* currently selected value */
.udm-v2 .select2-results__option--selected,
.udm-v2 .select2-results__option[aria-selected="true"] {
    background-color: rgba(211,0,15,.1); color: var(--udm-primary); font-weight: 700;
}
/* selected AND hovered → keep solid red */
.udm-v2 .select2-results__option--selected.select2-results__option--highlighted {
    background-color: var(--udm-primary) !important; color: #fff !important;
}

.udm-reg__level { cursor: pointer; }
.udm-reg__level:hover { transform: translateX(3px); }
.udm-reg__levelgo { align-self: center; flex-shrink: 0; color: rgba(255,255,255,.35); font-size: 1.15rem; transition: color .2s ease, transform .2s ease; }
.udm-reg__level:hover .udm-reg__levelgo { color: var(--udm-accent); transform: translateX(3px); }
.udm-reg__level.is-default .udm-reg__levelgo { color: rgba(242,183,5,.6); }

/* ---- Membership level details modal ---- */
.udm-lvlmodal { position: relative; border: 0; border-radius: 20px; overflow: hidden; padding: 30px; box-shadow: 0 30px 70px rgba(0,0,0,.4); }
.udm-lvlmodal__close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--udm-surface, #f1ecec); color: var(--udm-ink); cursor: pointer; display: grid; place-items: center; font-size: 1.15rem; }
.udm-lvlmodal__close:hover { background: var(--udm-primary); color: #fff; }
.udm-lvlmodal__head { display: flex; gap: 16px; align-items: center; margin-bottom: 18px; }
.udm-lvlmodal__ico { flex-shrink: 0; width: 60px; height: 60px; border-radius: 16px; display: grid; place-items: center; font-size: 1.8rem; color: #fff; background: linear-gradient(145deg, var(--udm-primary), var(--udm-primary-dark)); box-shadow: 0 8px 20px rgba(211,0,15,.3); }
.udm-lvlmodal__id { min-width: 0; }
.udm-lvlmodal__badge { display: inline-block; font-size: .68rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-primary); margin-bottom: 4px; }
.udm-lvlmodal__name { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--udm-ink); line-height: 1.15; }
.udm-lvlmodal__fee { font-size: 1.05rem; font-weight: 800; color: #b8860b; margin-top: 2px; }
.udm-lvlmodal__desc { margin: 0 0 18px; color: var(--udm-muted); font-size: .98rem; line-height: 1.7; }
.udm-lvlmodal__bh { margin: 0 0 12px; font-size: .78rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-ink); }
.udm-lvlmodal__benefits { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 10px; }
.udm-lvlmodal__benefits li { display: flex; gap: 10px; align-items: flex-start; font-size: .95rem; line-height: 1.5; color: var(--udm-ink); }
.udm-lvlmodal__benefits i { color: #1b7a3d; font-size: 1.15rem; flex-shrink: 0; margin-top: 1px; }
.udm-lvlmodal__cta { width: 100%; justify-content: center; }

/* ============================================================
   REGISTRATION FORM (v2) — floating labels, in-field icons
   ============================================================ */
@keyframes udm-ffin { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Section header */
.udm-fsec { display: flex; align-items: center; gap: 11px; margin: 10px 0 4px; animation: udm-ffin .4s ease both; }
.udm-fsec__ico { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: rgba(211,0,15,.1); color: var(--udm-primary); font-size: 1.15rem; }
.udm-fsec__h { margin: 0; font-size: .95rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-ink); }

/* Field wrapper */
.udm-ff { position: relative; animation: udm-ffin .4s ease both; }
.udm-ff__ico { position: absolute; left: 14px; top: 27px; transform: translateY(-50%); color: var(--udm-muted); font-size: 1.1rem; z-index: 3; pointer-events: none; transition: color .2s ease; }
.udm-ff:focus-within .udm-ff__ico { color: var(--udm-primary); }

.udm-ff__input {
    width: 100%; height: 54px;
    padding: 19px 14px 4px 42px;
    border: 1.5px solid rgba(30,20,20,.15); border-radius: 12px;
    font-size: .98rem; color: var(--udm-ink); background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.udm-ff__input:focus { outline: none; border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.1); }

.udm-ff__label {
    position: absolute; left: 42px; top: 15px; z-index: 2;
    color: var(--udm-muted); font-size: .95rem; font-weight: 400;
    pointer-events: none; transition: all .15s ease; white-space: nowrap;
    max-width: calc(100% - 50px); overflow: hidden; text-overflow: ellipsis;
}
/* floated state */
.udm-ff__input:focus ~ .udm-ff__label,
.udm-ff__input:not(:placeholder-shown) ~ .udm-ff__label,
.udm-ff--static .udm-ff__label,
.udm-ff--select .udm-ff__label {
    top: 6px; left: 42px; font-size: .64rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-primary);
}
.udm-ff--req .udm-ff__label::after { content: " *"; color: var(--udm-primary); }

/* phone prefix — align with the input text, which sits below the floated label */
.udm-ff--phone .udm-ff__prefix { position: absolute; left: 42px; top: 34px; transform: translateY(-50%); font-weight: 700; font-size: .98rem; line-height: 1; color: var(--udm-ink); z-index: 3; pointer-events: none; }
.udm-ff--phone .udm-ff__input { padding-left: 80px; }

/* select (Select2) */
.udm-ff--select .select2-container { width: 100% !important; }
.udm-ff--select .select2-container--default .select2-selection--single {
    height: 54px !important;
    padding: 19px 28px 0 42px !important;
    border: 1.5px solid rgba(30,20,20,.15) !important;
    border-radius: 12px !important;
    background: #fff;
}
.udm-ff--select .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 !important; color: var(--udm-ink) !important; line-height: 16px !important; font-size: .95rem;
}
.udm-ff--select .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 52px !important; top: 1px !important; right: 8px !important;
}
.udm-ff--select .select2-container--default.select2-container--open .select2-selection--single,
.udm-ff--select .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.1) !important;
}
/* native select fallback (if Select2 fails to init) */
.udm-ff--select select.udm-ff__select:not(.select2-hidden-accessible) {
    width: 100%; height: 54px; padding: 19px 14px 0 42px;
    border: 1.5px solid rgba(30,20,20,.15); border-radius: 12px; background: #fff;
}

.udm-ff + .text-danger { display: inline-block; margin: 4px 0 0 4px; font-size: .78rem; }
.text-danger:empty { display: none; }

/* invalid field state (client-side validation) */
.udm-ff.udm-ff--invalid .udm-ff__input { border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.08); }
.udm-ff.udm-ff--invalid .select2-container--default .select2-selection--single { border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.08); }
.udm-ff.udm-ff--invalid .udm-ff__ico { color: var(--udm-primary); }
/* jQuery-unobtrusive error class → same red treatment */
.udm-ff__input.input-validation-error { border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.08); }
.udm-ff__select.input-validation-error + .select2-container .select2-selection--single { border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.08); }

/* ============================================================
   UNIFIED PERSON / LEADER CARD (v2) — portrait, photo-dominant
   Used across Leadership (officials, secretariat, elected,
   nominated) and the public Aspirants directory.
   ============================================================ */
.ldr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(224px, 1fr)); gap: 22px; max-width: 1120px; margin: 0 auto; }
.ldr-card { position: relative; display: block; width: 100%; text-align: left; border: 0; padding: 0; margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 3 / 4; text-decoration: none; cursor: pointer; background: linear-gradient(145deg, #3a1316, #1b080a); box-shadow: 0 10px 30px rgba(30,8,10,.1); transition: transform .3s var(--udm-ease, ease), box-shadow .3s ease; }
.ldr-card:hover, .ldr-card:focus-visible { transform: translateY(-6px); box-shadow: 0 26px 56px rgba(30,8,10,.24); outline: none; }
.ldr-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; transition: transform .55s ease; }
.ldr-card:hover .ldr-card__img { transform: scale(1.06); }
.ldr-card__phico { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(242,183,5,.35); font-size: 4.4rem; }
.ldr-card__scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(14,4,5,.97) 0%, rgba(14,4,5,.82) 26%, rgba(14,4,5,.4) 46%, rgba(14,4,5,.08) 62%, transparent 74%); }
.ldr-card__badge { position: absolute; top: 13px; left: 13px; z-index: 3; background: rgba(211,0,15,.95); color: #fff; font-size: .63rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; }
.ldr-card__body { position: absolute; left: 17px; right: 17px; bottom: 15px; z-index: 2; color: #fff; }
/* high specificity + !important so a global heading colour can't override it */
.ldr-card .ldr-card__name { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.08rem; line-height: 1.18; margin: 0; color: #fff !important; text-shadow: 0 1px 2px rgba(0,0,0,.7), 0 3px 14px rgba(0,0,0,.55); }
.ldr-card__role { display: block; color: var(--udm-accent); font-weight: 700; font-size: .82rem; line-height: 1.3; margin-top: 4px; text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.ldr-card__sub { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: rgba(255,255,255,.82); font-size: .78rem; margin-top: 5px; }
.ldr-card__sub i { color: var(--udm-accent); font-size: .9rem; }
.ldr-card__sub span + span::before { content: "·"; margin: 0 5px; opacity: .6; }
.ldr-card__view { display: inline-flex; align-items: center; gap: 5px; margin-top: 11px; font-size: .78rem; font-weight: 800; color: #fff; opacity: 0; transform: translateY(6px); transition: opacity .25s ease, transform .25s ease; }
.ldr-card:hover .ldr-card__view, .ldr-card:focus-visible .ldr-card__view { opacity: 1; transform: none; }
@media (hover: none) { .ldr-card__view { opacity: 1; transform: none; } }

/* ---- leader detail modal: rich bio + mini stats ---- */
.leader-modal-bio h3 { font-size: .98rem; font-weight: 800; color: var(--udm-ink); margin: 14px 0 6px; }
.leader-modal-bio h3:first-child { margin-top: 0; }
.leader-modal-bio p { margin: 0 0 10px; }
.leader-modal-bio ul, .leader-modal-bio ol { padding-left: 18px; margin: 0 0 10px; }
.leader-modal-bio a { color: var(--udm-primary); font-weight: 600; }
.leader-modal-bio strong { color: var(--udm-ink); }
.leader-mstat { flex: 1 1 calc(33% - 8px); min-width: 92px; background: #fff5f5; border: 1px solid #f3d0d2; border-radius: 9px; padding: 9px 11px; }
.leader-mstat__v { color: var(--udm-primary); font-weight: 800; font-size: 1.1rem; line-height: 1; }
.leader-mstat__l { color: #666; font-size: .66rem; margin-top: 3px; line-height: 1.3; }

/* ---- leader profile: signature stats + rich article prose ---- */
.ldr-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 6px 0 30px; }
.ldr-stat { background: #fff; border: 1px solid rgba(30,20,20,.08); border-left: 3px solid var(--udm-primary); border-radius: 12px; padding: 15px 16px; box-shadow: 0 8px 22px rgba(30,8,10,.05); }
.ldr-stat__v { display: block; font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--udm-primary); line-height: 1.05; }
.ldr-stat__l { display: block; font-size: .8rem; color: var(--udm-muted); margin-top: 5px; line-height: 1.4; }

.ldr-prose { color: var(--udm-muted); line-height: 1.82; font-size: 1.02rem; }
.ldr-prose > *:first-child { margin-top: 0; }
.ldr-prose p { margin: 0 0 16px; }
.ldr-prose p.lead { font-size: 1.14rem; color: var(--udm-ink); line-height: 1.7; }
.ldr-prose h3 { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.32rem; color: var(--udm-ink); margin: 32px 0 13px; display: flex; align-items: center; gap: 12px; }
.ldr-prose h3::before { content: ""; width: 22px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, var(--udm-primary), var(--udm-accent)); flex-shrink: 0; }
.ldr-prose ul { margin: 0 0 16px; padding: 0; list-style: none; }
.ldr-prose li { position: relative; padding-left: 26px; margin-bottom: 9px; }
.ldr-prose li::before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--udm-primary); font-weight: 800; }
.ldr-prose a { color: var(--udm-primary); font-weight: 600; }
.ldr-prose strong { color: var(--udm-ink); }

@media (max-width: 680px) { .ldr-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .ldr-stats { grid-template-columns: 1fr; } }

/* position group header (elected leaders) */
.ldr-group { max-width: 1120px; margin: 0 auto 36px; }
.ldr-group__head { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; }
.ldr-group__ico { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; background: rgba(211,0,15,.1); color: var(--udm-primary); font-size: 1.35rem; flex-shrink: 0; }
.ldr-group__title { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--udm-ink); margin: 0; line-height: 1.1; }
.ldr-group__count { font-size: .82rem; color: var(--udm-muted); }
.ldr-group__rule { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(30,20,20,.14), transparent); }

@media (max-width: 560px) {
    .ldr-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .ldr-card__name { font-size: .96rem; }
    .ldr-group__title { font-size: 1.25rem; }
}

/* ---- Aspirant / person detail modal (fresh v2) ---- */
.aspm { background: #fff; }
.aspm__hero { position: relative; background: linear-gradient(135deg, #3a1316, #1b080a); padding: 30px 24px 24px; text-align: center; color: #fff; overflow: hidden; }
.aspm__hero::before { content: ""; position: absolute; inset: 0; background: url('/assets/v2/field-convoy.jpg') center/cover no-repeat; opacity: .16; }
.aspm__hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, var(--udm-primary), var(--udm-accent)); }
.aspm__hero > * { position: relative; z-index: 1; }
.aspm__close { position: absolute; top: 12px; right: 12px; z-index: 2; width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(255,255,255,.16); color: #fff; display: grid; place-items: center; cursor: pointer; font-size: 1.15rem; transition: background .2s ease; }
.aspm__close:hover { background: rgba(255,255,255,.3); }
.aspm__avatar { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; border: 4px solid var(--udm-accent); margin: 0 auto 12px; display: grid; place-items: center; background: #2a0e10; color: var(--udm-accent); font-size: 2.4rem; box-shadow: 0 10px 26px rgba(0,0,0,.4); }
.aspm__name { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.28rem; margin: 0 0 9px; color: #fff; text-transform: uppercase; letter-spacing: .3px; line-height: 1.1; }
.aspm__pos { display: inline-block; background: var(--udm-accent); color: var(--udm-accent-ink, #3a2600); font-weight: 800; font-size: .72rem; letter-spacing: .3px; padding: 5px 15px; border-radius: 999px; }
.aspm__body { padding: 20px 22px 4px; }
.aspm__sec { display: flex; align-items: center; gap: 10px; font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-primary); margin: 6px 0 14px; }
.aspm__sec:not(:first-child) { margin-top: 18px; }
.aspm__sec::after { content: ""; flex: 1; height: 1px; background: rgba(30,20,20,.1); }
.aspm__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 16px; }
.aspm__fact { display: flex; gap: 11px; align-items: center; min-width: 0; }
.aspm__fact > i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(211,0,15,.08); color: var(--udm-primary); font-size: 1.1rem; flex-shrink: 0; }
.aspm__fact div { min-width: 0; }
.aspm__fact span { display: block; font-size: .64rem; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; color: var(--udm-muted); margin-bottom: 1px; }
.aspm__fact strong { font-size: .92rem; color: var(--udm-ink); font-weight: 700; display: block; overflow: hidden; text-overflow: ellipsis; }
.aspm__foot { display: flex; gap: 10px; justify-content: flex-end; padding: 16px 22px 18px; border-top: 1px solid rgba(30,20,20,.07); margin-top: 16px; }
@media (max-width: 460px) { .aspm__facts { grid-template-columns: 1fr; } }

/* ============================================================
   PUBLIC ASPIRANTS (v2)
   ============================================================ */
.pasp-filter { max-width: 1120px; margin: 0 auto 28px; padding: 18px; background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; box-shadow: 0 10px 30px rgba(30,8,10,.05); }
.pasp-filter__row { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 12px; align-items: end; }
.pasp-filter label { font-size: .72rem; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; color: var(--udm-primary); margin-bottom: 5px; display: block; }
.pasp-filter select, .pasp-filter input { width: 100%; height: 46px; border: 1.5px solid rgba(30,20,20,.15); border-radius: 10px; padding: 0 12px; font-size: .95rem; background: #fff; color: var(--udm-ink); }
.pasp-filter select:focus, .pasp-filter input:focus { outline: none; border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.1); }
.pasp-filter__btns { display: flex; gap: 8px; }
.pasp-count { max-width: 1120px; margin: 0 auto 18px; padding: 0 16px; display: flex; justify-content: space-between; align-items: center; color: var(--udm-muted); font-size: .9rem; }

.pasp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.pasp-card { display: flex; flex-direction: column; background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; overflow: hidden; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.pasp-card:hover { transform: translateY(-5px); box-shadow: 0 22px 46px rgba(30,8,10,.14); border-color: rgba(211,0,15,.25); }
.pasp-card__top { display: flex; align-items: center; gap: 14px; padding: 20px; background: linear-gradient(135deg, #3a1316, #1b080a); }
.pasp-card__avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 3px solid var(--udm-accent); flex-shrink: 0; background: #2a0e10; display: grid; place-items: center; color: var(--udm-accent); font-size: 1.7rem; }
.pasp-card__id { min-width: 0; }
.pasp-card__id h3 { margin: 0 0 6px; color: #fff; font-size: 1.02rem; font-weight: 800; text-transform: uppercase; letter-spacing: .3px; line-height: 1.2; }
.pasp-card__pos { display: inline-block; background: var(--udm-accent); color: var(--udm-accent-ink, #3a2600); font-size: .7rem; font-weight: 800; letter-spacing: .3px; padding: 4px 10px; border-radius: 999px; }
.pasp-card__body { padding: 16px 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; flex: 1; }
.pasp-chip span { display: block; font-size: .66rem; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; color: var(--udm-muted); margin-bottom: 2px; }
.pasp-chip strong { font-size: .9rem; color: var(--udm-ink); font-weight: 700; }
.pasp-card__foot { padding: 12px 20px; border-top: 1px solid rgba(30,20,20,.07); text-align: right; font-weight: 800; font-size: .86rem; color: var(--udm-primary); }
.pasp-card:hover .pasp-card__foot i { transform: translateX(3px); transition: transform .2s ease; display: inline-block; }

.pasp-empty { max-width: 640px; margin: 0 auto; text-align: center; padding: 20px 16px; }
.pasp-empty__img { width: 100%; max-width: 420px; border-radius: 18px; margin: 0 auto 22px; display: block; box-shadow: 0 20px 50px rgba(30,8,10,.18); }
.pasp-empty h3 { font-family:'Archivo',sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--udm-ink); margin: 0 0 10px; }
.pasp-empty p { color: var(--udm-muted); line-height: 1.7; margin: 0 0 18px; }

@media (max-width: 900px) {
    .pasp-filter__row { grid-template-columns: 1fr 1fr; }
    .pasp-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
    .pasp-filter__row { grid-template-columns: 1fr; }
    .pasp-grid { grid-template-columns: 1fr; max-width: 440px; }
}

/* ============================================================
   EVENTS (v2)
   ============================================================ */
.ev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.ev-card { display: flex; flex-direction: column; background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; overflow: hidden; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.ev-card:hover { transform: translateY(-5px); box-shadow: 0 22px 46px rgba(30,8,10,.14); }
.ev-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.ev-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ev-card:hover .ev-card__media img { transform: scale(1.06); }
.ev-card__date { position: absolute; top: 12px; left: 12px; background: #fff; border-radius: 12px; padding: 7px 11px; text-align: center; line-height: 1; box-shadow: 0 6px 16px rgba(0,0,0,.18); }
.ev-card__date strong { display: block; font-size: 1.25rem; font-weight: 800; color: var(--udm-primary); }
.ev-card__date small { display: block; font-size: .64rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--udm-ink); margin-top: 2px; }
.ev-card__cat { position: absolute; top: 14px; right: 12px; background: var(--udm-primary); color: #fff; font-size: .68rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; }
.ev-card__body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.ev-card__body h3 { font-size: 1.15rem; font-weight: 800; color: var(--udm-ink); margin: 0 0 10px; line-height: 1.25; }
.ev-card__meta { display: grid; gap: 6px; margin-bottom: 14px; }
.ev-card__meta span { display: flex; align-items: center; gap: 7px; font-size: .86rem; color: var(--udm-muted); }
.ev-card__meta i { color: var(--udm-primary); }
.ev-card__go { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: .88rem; color: var(--udm-primary); }
.ev-card:hover .ev-card__go i { transform: translateX(3px); transition: transform .2s ease; }

.ev-past { max-width: 820px; margin: 0 auto; padding: 0 16px; display: grid; gap: 10px; }
.ev-past__row { display: grid; grid-template-columns: 130px 1fr auto 20px; gap: 14px; align-items: center; background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 12px; padding: 14px 18px; text-decoration: none; transition: border-color .2s ease; }
.ev-past__row:hover { border-color: rgba(211,0,15,.3); }
.ev-past__date { font-weight: 800; color: var(--udm-primary); font-size: .85rem; }
.ev-past__title { font-weight: 700; color: var(--udm-ink); }
.ev-past__loc { color: var(--udm-muted); font-size: .85rem; }
.ev-past__row i { color: var(--udm-muted); }

/* event detail */
.evd-hero { position: relative; min-height: 420px; display: flex; align-items: flex-end; overflow: hidden; color: #fff; }
.evd-hero__media { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.05); }
.evd-hero__scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,6,8,.92) 0%, rgba(20,6,8,.5) 45%, rgba(20,6,8,.35) 100%); }
.evd-hero__inner { position: relative; z-index: 2; max-width: 1120px; margin: 0 auto; width: 100%; padding: 36px 20px 40px; }
.evd-hero__back { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.85); font-weight: 600; font-size: .9rem; text-decoration: none; margin-bottom: 18px; }
.evd-hero__back:hover { color: #fff; }
.evd-hero__tags { display: flex; gap: 10px; margin-bottom: 12px; }
.evd-hero__cat { background: var(--udm-primary); color: #fff; font-size: .7rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.evd-hero__status { font-size: .7rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.evd-hero__status.is-up { background: rgba(27,122,61,.9); color: #fff; }
.evd-hero__status.is-past { background: rgba(255,255,255,.2); color: #fff; }
.evd-hero__title { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: clamp(1.8rem, 4vw, 3rem); line-height: 1.08; margin: 0; max-width: 820px; text-shadow: 0 3px 18px rgba(0,0,0,.4); }

.evd-wrap { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 44px; max-width: 1120px; margin: 0 auto; padding: 0 16px; align-items: start; }
.evd-h { font-family:'Archivo', sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--udm-ink); margin: 0 0 14px; }
.evd-desc { color: var(--udm-muted); line-height: 1.8; font-size: 1.02rem; white-space: pre-line; }
.evd-card { background: #fff; border: 1px solid rgba(30,20,20,.1); border-radius: 16px; padding: 22px; box-shadow: 0 14px 36px rgba(30,8,10,.07); position: sticky; top: 100px; }
.evd-fact { display: flex; gap: 13px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid rgba(30,20,20,.07); }
.evd-fact:first-child { padding-top: 0; }
.evd-fact__ico { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: rgba(211,0,15,.1); color: var(--udm-primary); font-size: 1.2rem; flex-shrink: 0; }
.evd-fact strong { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-primary); margin-bottom: 3px; }
.evd-fact span { color: var(--udm-ink); font-size: .92rem; line-height: 1.5; }

@media (max-width: 860px) {
    .ev-grid { grid-template-columns: 1fr; max-width: 460px; }
    .evd-wrap { grid-template-columns: 1fr; gap: 28px; }
    .evd-card { position: static; }
    .ev-past__row { grid-template-columns: 1fr; gap: 4px; }
    .ev-past__row i { display: none; }
}
@media (max-width: 560px) { .ev-grid { max-width: 100%; } }

/* ============================================================
   ASPIRANT REGISTRATION (v2)
   ============================================================ */
.asp-hero { position: relative; overflow: hidden; min-height: 470px; display: flex; align-items: center; color: #fff; }
.asp-hero__media { position: absolute; inset: 0; background: url('/assets/v2/field-podium.jpg') center 18% / cover no-repeat; transform: scale(1.05); }
.asp-hero__scrim { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(88,1,8,.95) 0%, rgba(120,2,10,.82) 42%, rgba(20,6,8,.42) 100%); }
.asp-hero__inner { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; padding: 72px 20px; width: 100%; }
.asp-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(242,183,5,.16); color: var(--udm-accent); font-weight: 800; font-size: .78rem; letter-spacing: .8px; text-transform: uppercase; padding: 7px 14px; border-radius: 999px; margin-bottom: 18px; }
.asp-hero__title { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.05; margin: 0 0 16px; max-width: 780px; text-shadow: 0 3px 20px rgba(0,0,0,.4); }
.asp-hero__title span { color: var(--udm-accent); }
.asp-hero__desc { font-size: 1.06rem; line-height: 1.7; color: rgba(255,255,255,.9); max-width: 600px; margin: 0 0 26px; }
.asp-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.asp-hero__badge { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; font-weight: 700; color: #fff; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); padding: 11px 16px; border-radius: 999px; }
.asp-hero__badge i { color: var(--udm-accent); font-size: 1.1rem; }

.asp-section { padding: 64px 0; }
.asp-section--alt { background: linear-gradient(180deg, #fbf7f7, #f4eeee); }
.asp-shead { text-align: center; max-width: 650px; margin: 0 auto 42px; padding: 0 16px; }
.asp-shead__eyebrow { color: var(--udm-primary); font-weight: 800; font-size: .8rem; letter-spacing: .8px; text-transform: uppercase; }
.asp-shead__title { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: clamp(1.6rem, 3vw, 2.3rem); color: var(--udm-ink); margin: 8px 0 10px; }
.asp-shead__sub { color: var(--udm-muted); font-size: 1rem; line-height: 1.7; }

/* eligibility */
.asp-elig { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.asp-elig__img { border-radius: 18px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 20px 50px rgba(30,8,10,.2); }
.asp-elig__img img { width: 100%; height: 100%; object-fit: cover; }
.asp-elig__body h3 { font-family:'Archivo', sans-serif; font-weight: 800; font-size: 1.7rem; color: var(--udm-ink); margin: 0 0 14px; }
.asp-elig__body p { color: var(--udm-muted); line-height: 1.75; margin: 0 0 16px; }
.asp-callout { display: flex; gap: 14px; background: rgba(211,0,15,.06); border: 1px solid rgba(211,0,15,.18); border-left: 4px solid var(--udm-primary); border-radius: 12px; padding: 16px 18px; }
.asp-callout i { color: var(--udm-primary); font-size: 1.5rem; flex-shrink: 0; }
.asp-callout strong { color: var(--udm-ink); display: block; margin-bottom: 3px; }
.asp-callout span { color: var(--udm-muted); font-size: .92rem; line-height: 1.6; }

/* how it works */
.asp-how__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 1120px; margin: 0 auto; padding: 14px 16px 0; }
.asp-how__step { position: relative; background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; padding: 28px 22px; text-align: center; box-shadow: 0 10px 30px rgba(30,8,10,.05); }
.asp-how__n { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); width: 30px; height: 30px; border-radius: 50%; background: var(--udm-primary); color: #fff; font-weight: 800; font-size: .85rem; display: grid; place-items: center; box-shadow: 0 6px 16px rgba(211,0,15,.3); }
.asp-how__ico { width: 56px; height: 56px; border-radius: 15px; display: grid; place-items: center; margin: 6px auto 14px; background: rgba(242,183,5,.14); color: #b8860b; font-size: 1.6rem; }
.asp-how__step h4 { font-weight: 800; font-size: 1.02rem; color: var(--udm-ink); margin: 0 0 6px; }
.asp-how__step p { font-size: .86rem; color: var(--udm-muted); line-height: 1.55; margin: 0; }

/* positions */
.asp-pos__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.asp-pos__card { background: #fff; border: 1px solid rgba(30,20,20,.08); border-radius: 16px; padding: 24px; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.asp-pos__card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(30,8,10,.12); border-color: rgba(211,0,15,.25); }
.asp-pos__ico { width: 50px; height: 50px; border-radius: 13px; display: grid; place-items: center; background: linear-gradient(145deg, var(--udm-primary), var(--udm-primary-dark)); color: #fff; font-size: 1.4rem; margin-bottom: 14px; }
.asp-pos__card h4 { font-weight: 800; font-size: 1.1rem; color: var(--udm-ink); margin: 0 0 6px; }
.asp-pos__scope { display: inline-block; font-size: .68rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-primary); background: rgba(211,0,15,.08); padding: 3px 9px; border-radius: 999px; margin-bottom: 10px; }
.asp-pos__card p { font-size: .88rem; color: var(--udm-muted); line-height: 1.6; margin: 0; }

/* wizard */
.asp-wizard { padding: 64px 0; background: linear-gradient(180deg, #fbf7f7, #f4eeee); }
.asp-wizard__inner { max-width: 720px; margin: 0 auto; padding: 0 16px; }
.step-indicator { display: flex; justify-content: center; gap: 10px; margin-bottom: 28px; }
.step-dot { width: 11px; height: 11px; border-radius: 50%; background: rgba(30,20,20,.15); transition: all .3s; }
.step-dot.active { background: var(--udm-primary); transform: scale(1.35); box-shadow: 0 0 0 4px rgba(211,0,15,.12); }
.step-dot.done { background: #1b7a3d; }
.step-card { border: none; border-radius: 18px; box-shadow: 0 16px 44px rgba(30,8,10,.1); overflow: hidden; }
.step-card .card-body { padding: 30px; }
.asp-step-head { display: flex; align-items: center; gap: 13px; margin-bottom: 8px; }
.asp-step-head__ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(211,0,15,.1); color: var(--udm-primary); font-size: 1.3rem; flex-shrink: 0; }
.asp-step-head h5 { margin: 0; font-weight: 800; color: var(--udm-ink); font-size: 1.15rem; }
.fee-display { background: #fffbea; border-left: 4px solid var(--udm-accent); padding: 14px 16px; border-radius: 10px; margin: 6px 0; }

/* aspirant form: applicant banner */
.asp-applicant { display: flex; align-items: center; gap: 14px; background: linear-gradient(135deg, #3a1316, #1b080a); color: #fff; border-radius: 14px; padding: 14px 18px; }
.asp-applicant__avatar { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: rgba(242,183,5,.16); color: var(--udm-accent); font-size: 1.4rem; flex-shrink: 0; }
.asp-applicant__id { flex: 1; min-width: 0; }
.asp-applicant__id strong { display: block; font-size: 1rem; color: #fff; text-transform: uppercase; letter-spacing: .3px; }
.asp-applicant__id span { font-size: .82rem; color: rgba(255,255,255,.72); }
.asp-applicant__badge { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; font-weight: 800; letter-spacing: .3px; color: var(--udm-accent-ink, #3a2600); background: var(--udm-accent); padding: 6px 11px; border-radius: 999px; white-space: nowrap; }

.udm-fsec__opt { font-size: .68rem; font-weight: 700; letter-spacing: .3px; text-transform: none; color: var(--udm-muted); background: rgba(30,20,20,.06); padding: 2px 9px; border-radius: 999px; margin-left: 6px; }

/* aspirant form: native-select floating fields + validation */
.udm-ff--select select.udm-ff__select:not(.select2-hidden-accessible):focus { outline: none; border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.1); }
#aspirantForm .udm-ff:has(.is-invalid) .udm-ff__select,
#aspirantForm .udm-ff:has(.is-invalid) .udm-ff__input { border-color: var(--udm-primary) !important; box-shadow: 0 0 0 3px rgba(211,0,15,.08); }

/* modern drag-and-drop image uploader */
.udm-drop { position: relative; border: 2px dashed rgba(211,0,15,.3); border-radius: 14px; background: rgba(211,0,15,.02); padding: 26px 20px; text-align: center; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .1s ease; outline: none; }
.udm-drop:hover, .udm-drop:focus-visible { border-color: var(--udm-primary); background: rgba(211,0,15,.05); }
.udm-drop--over { border-color: var(--udm-primary); background: rgba(211,0,15,.09); }
.udm-drop--invalid { border-color: var(--udm-primary); background: rgba(211,0,15,.05); }
.udm-drop__empty i { font-size: 2.4rem; color: var(--udm-primary); }
.udm-drop__empty p { margin: 8px 0 2px; color: var(--udm-ink); font-size: .95rem; }
.udm-drop__empty p strong { color: var(--udm-ink); }
.udm-drop__empty p span { color: var(--udm-primary); font-weight: 700; text-decoration: underline; }
.udm-drop__empty small { color: var(--udm-muted); font-size: .8rem; }
.udm-drop__preview { display: flex; align-items: center; gap: 16px; justify-content: center; }
.udm-drop__preview img { width: 96px; height: 96px; object-fit: cover; border-radius: 12px; border: 1px solid rgba(30,20,20,.12); background: #fff; }
.udm-drop__meta { text-align: left; }
.udm-drop__name { display: block; font-weight: 700; color: var(--udm-ink); font-size: .9rem; margin-bottom: 8px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.udm-drop__remove { border: 1px solid rgba(211,0,15,.3); background: #fff; color: var(--udm-primary); border-radius: 8px; padding: 5px 12px; font-size: .82rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.udm-drop__remove:hover { background: var(--udm-primary); color: #fff; }

/* aspirant form: M-Pesa instructions card */
.asp-mpesa { border: 1px solid #e0e0e0; border-radius: 12px; overflow: hidden; }
.asp-mpesa__head { background: #1b7a3d; padding: 12px 16px; display: flex; align-items: center; gap: 11px; }
.asp-mpesa__logo { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.18); display: grid; place-items: center; color: #fff; font-size: 1.05rem; }
.asp-mpesa__title { color: #fff; font-weight: 800; font-size: .92rem; line-height: 1.2; }
.asp-mpesa__sub { color: rgba(255,255,255,.82); font-size: .74rem; }
.asp-mpesa__body { padding: 14px 16px; background: #fff; }
.asp-mpesa__step { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; }
.asp-mpesa__step:last-child { margin-bottom: 0; }
.asp-mpesa__step > span { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: rgba(27,122,61,.12); color: #1b7a3d; font-weight: 800; font-size: .72rem; display: grid; place-items: center; }
.asp-mpesa__step p { margin: 0; font-size: .84rem; color: #444; line-height: 1.5; }
.asp-mpesa__step code { background: #f5f5f5; padding: 1px 6px; border-radius: 4px; font-size: .78rem; }
.asp-mpesa__chip { display: inline-flex; align-items: center; gap: 7px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 6px; padding: 2px 10px; margin-left: 4px; font-weight: 800; letter-spacing: 1px; color: var(--udm-ink); }

@media (max-width: 860px) {
    .asp-elig { grid-template-columns: 1fr; gap: 26px; }
    .asp-how__grid { grid-template-columns: repeat(2, 1fr); }
    .asp-pos__grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) { .asp-how__grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .asp-hero__media { transform: none; } }

/* outline button for light surfaces (verification pages, cards) */
.udm-btn.udm-btn--line { background: #fff; color: var(--udm-ink); box-shadow: inset 0 0 0 1.5px rgba(30,20,20,.15); }
.udm-btn.udm-btn--line:hover { background: #faf7f7; color: var(--udm-ink); box-shadow: inset 0 0 0 1.5px rgba(211,0,15,.4); }

/* ---- Verification pages: result icon + steps ---- */
.rv-result { width: 84px; height: 84px; border-radius: 50%; display: inline-grid; place-items: center; margin: 4px 0 16px; }
.rv-result i { font-size: 46px; line-height: 1; }
.rv-result--ok { background: rgba(27,122,61,.1); }
.rv-result--ok i { color: #1b7a3d; }
.rv-result--err { background: rgba(211,0,15,.1); }
.rv-result--err i { color: var(--udm-primary); }

/* ---- Resend verification: "what happens next" steps ---- */
.rv-steps { display: grid; gap: 12px; }
.rv-step { display: flex; gap: 12px; align-items: flex-start; }
.rv-step__n { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: rgba(211,0,15,.1); color: var(--udm-primary); font-weight: 800; font-size: .85rem; }
.rv-step strong { display: block; font-size: .9rem; color: var(--udm-ink); }
.rv-step span { font-size: .82rem; color: var(--udm-muted); line-height: 1.5; }

/* tidy the info alerts + header spacing within the new look */
.udm-reg__main .reg-card { border-radius: 20px; }
.udm-reg__main .card-body { padding: 26px 26px 30px; }


/* ---- Register: SIG / PWD / Terms / Submit polish ---- */
/* custom checkbox card (SIG + terms) */
.udm-check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; padding: 14px 16px; border: 1.5px solid rgba(30,20,20,.12); border-radius: 12px; transition: border-color .2s ease, background .2s ease; margin: 0; }
.udm-check:hover { border-color: rgba(211,0,15,.4); }
.udm-check:has(.udm-check__input:checked) { border-color: var(--udm-primary); background: rgba(211,0,15,.04); }
.udm-check__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.udm-check__box { flex-shrink: 0; width: 22px; height: 22px; margin-top: 1px; border-radius: 6px; border: 2px solid rgba(30,20,20,.3); display: grid; place-items: center; color: #fff; font-size: .95rem; transition: all .15s ease; }
.udm-check__box i { opacity: 0; transform: scale(.4); transition: all .15s ease; }
.udm-check__input:checked ~ .udm-check__box { background: var(--udm-primary); border-color: var(--udm-primary); }
.udm-check__input:checked ~ .udm-check__box i { opacity: 1; transform: none; }
.udm-check__input:focus-visible ~ .udm-check__box { box-shadow: 0 0 0 3px rgba(211,0,15,.2); }
.udm-check__text { font-size: .9rem; color: var(--udm-ink); line-height: 1.5; }
.udm-check__text strong { display: block; font-weight: 700; }
.udm-check__text > span { display: block; font-size: .8rem; color: var(--udm-muted); margin-top: 2px; }
.udm-check__text a { color: var(--udm-primary); font-weight: 700; }
.udm-check__text .req { display: inline; color: var(--udm-primary); font-size: inherit; margin: 0; }

/* SIG category segmented pills */
.udm-sigcat { margin-top: 12px; }
.udm-sigcat__label { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--udm-primary); margin-bottom: 9px; }
.udm-segs { display: flex; gap: 10px; flex-wrap: wrap; }
.udm-seg { position: relative; cursor: pointer; margin: 0; }
.udm-seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.udm-seg span { display: inline-flex; align-items: center; gap: 7px; padding: 10px 18px; border-radius: 999px; border: 1.5px solid rgba(30,20,20,.14); background: #fff; font-weight: 700; font-size: .88rem; color: var(--udm-ink); transition: all .2s ease; }
.udm-seg span i { font-size: 1.1rem; color: var(--udm-muted); }
.udm-seg:hover span { border-color: rgba(211,0,15,.4); }
.udm-seg input:checked ~ span { background: var(--udm-primary); border-color: var(--udm-primary); color: #fff; }
.udm-seg input:checked ~ span i { color: #fff; }
.udm-seg input:focus-visible ~ span { box-shadow: 0 0 0 3px rgba(211,0,15,.2); }

/* file upload */
.udm-file { display: flex; align-items: center; gap: 12px; cursor: pointer; padding: 11px 15px; border: 1.5px dashed rgba(30,20,20,.25); border-radius: 12px; transition: all .2s ease; width: 100%; margin: 0; height: 54px; }
.udm-file:hover { border-color: var(--udm-primary); background: rgba(211,0,15,.03); }
.udm-file__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.udm-file__ico { flex-shrink: 0; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: rgba(211,0,15,.08); color: var(--udm-primary); font-size: 1.25rem; }
.udm-file__text { display: flex; flex-direction: column; min-width: 0; }
.udm-file__name { font-weight: 700; font-size: .88rem; color: var(--udm-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.udm-file__text small { font-size: .72rem; color: var(--udm-muted); }

/* terms + submit */
.udm-reg .udm-terms { margin-bottom: 22px !important; padding-bottom: 22px; border-bottom: 1px solid rgba(30,20,20,.08); }
.udm-reg__submit { width: 100%; margin-top: 10px; justify-content: center; gap: 9px; font-size: 1.05rem; font-weight: 800; padding: 15px; border-radius: 12px; }
.udm-reg__submit:disabled, .udm-reg__submit[disabled] { opacity: .5; cursor: not-allowed; box-shadow: none; transform: none; filter: grayscale(.15); }
.udm-reg__securenote { margin: 14px 0 0; text-align: center; font-size: .8rem; color: var(--udm-muted); display: flex; align-items: center; justify-content: center; gap: 6px; }
.udm-reg__securenote i { color: #1b7a3d; font-size: 1rem; }

/* ===== Manifesto page ===== */
.mfst-intro { display: grid; grid-template-columns: 1.6fr 1fr; gap: 40px; align-items: center; }
.mfst-intro__art { display: flex; justify-content: center; }
.mfst-intro__emblem { position: relative; width: 220px; height: 220px; border-radius: 50%; display: grid; place-items: center;
    background: radial-gradient(circle at 50% 40%, rgba(211,0,15,.10), rgba(211,0,15,0) 70%); }
.mfst-intro__emblem::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px dashed rgba(211,0,15,.25); animation: mfstspin 28s linear infinite; }
.mfst-intro__emblem img { width: 150px; height: 150px; object-fit: contain; filter: drop-shadow(0 10px 24px rgba(0,0,0,.18)); }
@keyframes mfstspin { to { transform: rotate(360deg); } }

.mfst-mv { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.mfst-mv__card { background: #fff; border: 1px solid rgba(0,0,0,.06); border-left: 5px solid var(--udm-primary);
    border-radius: 16px; padding: 30px 28px; box-shadow: 0 10px 30px rgba(0,0,0,.05); }
.mfst-mv__card--alt { border-left-color: var(--udm-gold, #F2B705); }
.mfst-mv__ico { display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 14px;
    background: rgba(211,0,15,.08); color: var(--udm-primary); font-size: 1.6rem; margin-bottom: 14px; }
.mfst-mv__card--alt .mfst-mv__ico { background: rgba(242,183,5,.14); color: #b98a00; }
.mfst-mv__card h3 { font-weight: 800; margin: 0 0 10px; color: var(--udm-ink); }
.mfst-mv__card p { color: var(--udm-muted); line-height: 1.8; margin: 0; }

.mfst-cta { text-align: center; max-width: 720px; margin: 0 auto; padding: 44px 28px; border-radius: 20px;
    background: linear-gradient(135deg, #2B2E34 0%, var(--udm-primary) 140%); color: #fff;
    box-shadow: 0 20px 50px rgba(0,0,0,.18); }
.mfst-cta h2 { color: #fff; margin: 0 0 10px; }
.mfst-cta p { color: rgba(255,255,255,.82); margin: 0 0 20px; line-height: 1.7; }

@media (max-width: 820px) {
    .mfst-intro { grid-template-columns: 1fr; }
    .mfst-intro__art { order: -1; }
    .mfst-intro__emblem { width: 160px; height: 160px; }
    .mfst-intro__emblem img { width: 110px; height: 110px; }
    .mfst-mv { grid-template-columns: 1fr; }
}

/* ===== Manifesto: pillars grid ===== */
.udm-sechead--center { justify-content: center; text-align: center; }
.mfst-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 8px; }
.mfst-pillar { position: relative; overflow: hidden; background: #fff; border: 1px solid rgba(0,0,0,.06);
    border-radius: 18px; padding: 30px 26px 28px; box-shadow: 0 10px 30px rgba(0,0,0,.05);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.mfst-pillar::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--pc, #D3000F); }
.mfst-pillar:hover { transform: translateY(-6px); box-shadow: 0 22px 46px rgba(0,0,0,.12); border-color: transparent; }
.mfst-pillar__num { position: absolute; top: 18px; right: 22px; font-family: "Archivo", sans-serif; font-weight: 800;
    font-size: 2.2rem; line-height: 1; color: var(--pc, #D3000F); opacity: .12; }
.mfst-pillar__ico { display: inline-grid; place-items: center; width: 58px; height: 58px; border-radius: 15px;
    background: color-mix(in srgb, var(--pc, #D3000F) 12%, #fff); color: var(--pc, #D3000F);
    font-size: 1.7rem; margin-bottom: 16px; }
.mfst-pillar__title { font-weight: 800; font-size: 1.12rem; color: var(--udm-ink); margin: 0 0 8px; }
.mfst-pillar__text { color: var(--udm-muted); line-height: 1.7; font-size: .93rem; margin: 0; }

/* ===== Manifesto: leader quote ===== */
.mfst-quote { position: relative; max-width: 860px; margin: 0 auto; text-align: center; padding: 10px 20px; }
.mfst-quote__mark { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
    background: rgba(211,0,15,.08); color: var(--udm-primary); font-size: 1.8rem; margin-bottom: 18px; }
.mfst-quote__text { font-family: "Archivo", sans-serif; font-weight: 600; font-size: 1.5rem; line-height: 1.5;
    color: var(--udm-ink); margin: 0 0 20px; }
.mfst-quote__by { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; color: var(--udm-muted); }
.mfst-quote__by img { width: 42px; height: 42px; object-fit: contain; }
.mfst-quote__by span { position: relative; padding-left: 12px; }
.mfst-quote__by span::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 2px; height: 18px; background: var(--udm-gold, #F2B705); }

@media (max-width: 900px) { .mfst-pillars { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .mfst-pillars { grid-template-columns: 1fr; } .mfst-quote__text { font-size: 1.25rem; } }

/* ===== Uniform Select2 for standalone dropdowns (contact subject, listing filters) ===== */
/* Panel/results theming is already global via .udm-v2 .select2-dropdown; this styles the closed box. */
.udm-dfield .select2-container,
.udm-field .select2-container,
.pasp-filter .select2-container { width: 100% !important; }

.udm-dfield .select2-container--default .select2-selection--single,
.udm-field .select2-container--default .select2-selection--single,
.pasp-filter .select2-container--default .select2-selection--single {
    height: 46px;
    border: 1.5px solid rgba(30,20,20,.15);
    border-radius: 11px;
    background: #fff;
    display: flex;
    align-items: center;
    padding: 0 30px 0 14px;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.udm-dfield .select2-container--default .select2-selection--single .select2-selection__rendered,
.udm-field .select2-container--default .select2-selection--single .select2-selection__rendered,
.pasp-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0; color: var(--udm-ink); line-height: normal; font-size: .95rem;
}
.udm-dfield .select2-selection__placeholder,
.udm-field .select2-selection__placeholder,
.pasp-filter .select2-selection__placeholder { color: var(--udm-muted); }

.udm-dfield .select2-container--default .select2-selection--single .select2-selection__arrow,
.udm-field .select2-container--default .select2-selection--single .select2-selection__arrow,
.pasp-filter .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px; top: 0; right: 8px;
}
.udm-dfield .select2-container--default.select2-container--open .select2-selection--single,
.udm-dfield .select2-container--default.select2-container--focus .select2-selection--single,
.udm-field .select2-container--default.select2-container--open .select2-selection--single,
.udm-field .select2-container--default.select2-container--focus .select2-selection--single,
.pasp-filter .select2-container--default.select2-container--open .select2-selection--single,
.pasp-filter .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--udm-primary); box-shadow: 0 0 0 3px rgba(211,0,15,.1);
}