/* =====================================================================
 * Ubongo Campaign — redesign layer
 * Loaded AFTER css/bootstrap.min.css and css/style.css.
 * Your original style.css is untouched (spinner, back-to-top etc. still
 * come from there); everything new is prefixed "ub-".
 * ===================================================================== */

:root {
    --ub-green: #0B5847;      /* deep green (buttons, mission panel) */
    --ub-green-dark: #08463A;
    --ub-teal: #12A2C6;       /* brand teal (headline, icons, links) */
    --ub-teal-dark: #0C87A6;
    --ub-ink: #0F2E28;        /* headings */
    --ub-text: #3C4F57;       /* body copy */
    --ub-muted: #6B7F87;
    --ub-tint: #F1F9FB;       /* pale section background */
    --ub-line: #D3E8EE;
    --ub-white: #FFFFFF;
    --ub-radius: 14px;
    --ub-shadow: 0 6px 24px rgba(15, 46, 40, .07);

    /* keep Bootstrap/template "primary" in the new palette */
    --primary: var(--ub-teal);
    --secondary: var(--ub-green);
    --dark: var(--ub-ink);
}

body {
    font-family: 'Open Sans', sans-serif;
    color: var(--ub-text);
    background: var(--ub-white);
}

h1, h2, h3, h4, h5, h6 { font-family: 'Jost', sans-serif; color: var(--ub-ink); }

a { color: var(--ub-teal-dark); }
a:hover { color: var(--ub-green); }

.ub-teal   { color: var(--ub-teal); }
.ub-accent { color: var(--ub-teal); }

/* ---------- Template overrides (primary colour, back-to-top) ---------- */
.text-primary { color: var(--ub-teal) !important; }
.bg-primary   { background-color: var(--ub-teal) !important; }
.btn-primary  { background: var(--ub-green); border-color: var(--ub-green); }
.btn-primary:hover, .btn-primary:focus { background: var(--ub-teal); border-color: var(--ub-teal); }
.back-to-top { right: 24px; bottom: 24px; }

/* =====================================================================
 * Navbar
 * ===================================================================== */
.ub-nav {
    padding-top: 14px;
    padding-bottom: 14px;
    box-shadow: 0 1px 0 var(--ub-line);
    z-index: 1030;
}
.ub-brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    padding: 0;
    margin-right: 1rem;
}
.ub-brand-icon {
    font-size: 2.6rem;
    color: var(--ub-teal);
    line-height: 1;
}
.ub-brand-text {
    display: flex;
    flex-direction: column;
    padding-left: 14px;
    border-left: 2px solid var(--ub-teal);
    line-height: 1.1;
}
.ub-brand-name {
    font-family: 'Jost', sans-serif;
    font-weight: 700;
    font-size: 1.9rem;
    color: var(--ub-teal);
    letter-spacing: -.01em;
}
.ub-brand-tag {
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    font-size: .64rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ub-teal-dark);
    margin-top: 4px;
}
.ub-brand--light .ub-brand-name,
.ub-brand--light .ub-brand-icon { color: #fff; }
.ub-brand--light .ub-brand-text { border-color: var(--ub-teal); }
.ub-brand--light .ub-brand-tag  { color: #9FD9E8; }

/* nav links: override template's 35px padding */
.ub-nav.navbar-light .navbar-nav .nav-link,
.sticky-top.ub-nav.navbar-light .navbar-nav .nav-link {
    position: relative;
    padding: 10px 12px;
    font-family: 'Jost', sans-serif;
    font-weight: 500;
    font-size: 1.02rem;
    color: var(--ub-ink);
}
.ub-nav.navbar-light .navbar-nav .nav-link:hover,
.ub-nav.navbar-light .navbar-nav .nav-link.active { color: var(--ub-teal); }

@media (min-width: 1200px) {
    .ub-nav.navbar-light .navbar-nav .nav-link.active::after {
        content: "";
        position: absolute;
        left: 12px; right: 12px; bottom: 2px;
        height: 3px;
        border-radius: 3px;
        background: var(--ub-teal);
    }
}
@media (max-width: 1199.98px) {
    .ub-nav .navbar-collapse { padding-top: 10px; }
    .ub-nav.navbar-light .navbar-nav .nav-link { padding: 10px 4px; border-bottom: 1px solid var(--ub-line); }
}
@media (max-width: 575.98px) {
    .ub-brand-icon { font-size: 2rem; }
    .ub-brand-name { font-size: 1.35rem; }
    .ub-brand-tag  { font-size: .5rem; letter-spacing: .1em; }
    .ub-brand-text { padding-left: 10px; }
    .ub-brand { gap: 10px; }
}
.ub-nav.scrolled { box-shadow: 0 6px 20px rgba(15, 46, 40, .08); }

/* =====================================================================
 * Shared elements
 * ===================================================================== */
.ub-eyebrow {
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    font-size: 1.05rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ub-teal);
}
.ub-lead { font-size: 1.2rem; line-height: 1.55; color: var(--ub-text); }

.ub-btn {
    display: inline-flex;
    align-items: center;
    background: var(--ub-green);
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: 10px 24px;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    transition: background .25s, transform .25s;
}
.ub-btn:hover, .ub-btn:focus { background: var(--ub-teal); color: #fff; transform: translateY(-1px); }
.ub-btn--lg { padding: 14px 32px; font-size: 1.05rem; }

.ub-section { padding: 72px 0; }
.ub-section--tint { background: var(--ub-tint); }
.ub-divider { height: 1px; background: var(--ub-line); }
.ub-rounded { border-radius: var(--ub-radius); }
.ub-inline-link { font-weight: 600; text-decoration: none; }

/* Section heading (icon + spaced caps + rule) */
.ub-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}
.ub-heading-icon {
    flex: 0 0 auto;
    width: 46px; height: 46px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 1.2rem;
}
.ub-heading-title {
    margin: 0;
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    font-weight: 700 !important;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ub-green);
}
.ub-heading-rule {
    flex: 0 0 56px;
    height: 3px;
    border-radius: 3px;
    background: var(--ub-teal);
}
.d-flex > .ub-heading { margin-bottom: 0; }

.ub-icon--green { background: var(--ub-green); color: #fff; }
.ub-icon--teal  { background: var(--ub-teal);  color: #fff; }

.ub-round-icon {
    flex: 0 0 auto;
    width: 64px; height: 64px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.6rem;
}

/* Inner-page banner */
.ub-page-banner {
    position: relative;
    padding: 72px 0 64px;
    background:
        radial-gradient(1200px 400px at 100% 0%, rgba(18, 162, 198, .18), transparent 60%),
        linear-gradient(180deg, #E9F6FA 0%, var(--ub-tint) 100%);
    overflow: hidden;
}
.ub-page-banner::after {
    content: "";
    position: absolute;
    right: -120px; bottom: -160px;
    width: 520px; height: 320px;
    border-radius: 50%;
    border: 28px solid rgba(11, 88, 71, .9);
    border-left-color: transparent;
    border-bottom-color: transparent;
    transform: rotate(-12deg);
    opacity: .9;
}
.ub-page-title {
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    font-weight: 800 !important;
    color: var(--ub-green);
    margin-bottom: 12px;
    max-width: 760px;
}
.ub-page-banner .ub-lead { max-width: 680px; position: relative; z-index: 1; }

/* Strapline */
.ub-strap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 28px 16px;
    background: #fff;
}
.ub-strap span { flex: 0 1 300px; height: 2px; background: var(--ub-teal); opacity: .6; }
.ub-strap p {
    margin: 0;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ub-teal);
    white-space: nowrap;
}
@media (max-width: 575.98px) {
    .ub-strap { gap: 10px; }
    .ub-strap p { font-size: .72rem; letter-spacing: .14em; }
}

/* Callout */
.ub-callout {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 28px 32px;
    border-radius: var(--ub-radius);
    background: var(--ub-tint);
    border: 1px solid var(--ub-line);
}
.ub-callout h3 { font-size: 1.3rem; }

/* =====================================================================
 * Home — Hero
 * ===================================================================== */
.ub-hero {
    position: relative;
    /* height follows the screen width so a wide banner image keeps its shape (mock-up is ~4:1) */
    min-height: clamp(400px, 25vw, 540px);
    display: flex;
    align-items: center;
    background: linear-gradient(90deg, #EEF8FB 0%, #E6F4F8 45%, #DCEFF3 100%);
    overflow: hidden;
}
.ub-hero-media {
    position: absolute;
    top: 0; bottom: 0; right: 0;
    width: 62%;                     /* photo sits in the right ~60%, as in the mock-up */
    /* image is set inline (style="background-image:...") so relative paths resolve from the page */
    background-position: right center;   /* keep the subject (right side) in view; trims the left first */
    background-size: cover;
    background-repeat: no-repeat;
    /* soften the left of the image behind the headline */
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 22%);
}
.ub-hero-swoosh {
    position: absolute;
    right: 0; top: 0; bottom: 0;
    width: 22%;
    min-width: 200px;
    /* teal + green waves sweeping up the right edge */
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 500' preserveAspectRatio='none'%3E%3Cpath d='M300 0 C 290 200 200 400 0 500 L300 500 Z' fill='%230B5847'/%3E%3Cpath d='M300 70 C 285 250 210 420 60 500 L300 500 Z' fill='%23ffffff'/%3E%3Cpath d='M300 95 C 288 265 220 430 85 500 L300 500 Z' fill='%2312A2C6'/%3E%3C/svg%3E")
        right bottom / 100% 100% no-repeat;
    pointer-events: none;
    z-index: 1;
}
@media (max-width: 991.98px) { .ub-hero-swoosh { display: none; } }
.ub-hero-copy { position: relative; z-index: 2; padding: 48px 0; }
.ub-hero-title {
    display: flex;
    flex-direction: column;
    font-size: clamp(2.4rem, 4.6vw, 4.4rem);
    line-height: 1.02;
    font-weight: 800 !important;
    color: var(--ub-green);
    margin: 10px 0 22px;
    letter-spacing: -.01em;
}
.ub-hero .ub-lead { max-width: 480px; margin-bottom: 30px; }
.ub-hero-script {
    position: absolute;
    right: 70px;
    top: 60px;
    transform: rotate(-10deg);
    z-index: 2;
    font-family: 'Caveat', cursive;
    font-weight: 700;
    font-size: 2.6rem;
    line-height: 1.05;
    color: var(--ub-green);
    text-align: left;
}
@media (max-width: 991.98px) {
    /* phones/tablets: text first, then the full photo as a banner underneath */
    .ub-hero { min-height: 0; flex-direction: column; align-items: stretch; }
    .ub-hero > .container { order: 1; }
    .ub-hero-media { order: 2; position: relative; width: 100%; height: 42vw; min-height: 200px;
                     -webkit-mask-image: none; mask-image: none; }
    .ub-hero-copy { padding: 44px 0 32px; }
}

/* =====================================================================
 * Home — Objectives
 * ===================================================================== */
.ub-objective { height: 100%; padding-right: 8px; }
@media (min-width: 1200px) {
    .ub-objectives > div + div .ub-objective {
        border-left: 1px solid var(--ub-line);
        padding-left: 24px;
    }
}
.ub-objective-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 14px;
}
.ub-objective-head h3 {
    font-size: 1.02rem;
    line-height: 1.3;
    margin: 0;
    font-weight: 600 !important;
}
.ub-objective p { margin: 0; font-size: .95rem; line-height: 1.6; }

/* =====================================================================
 * Update cards
 * ===================================================================== */
.ub-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: var(--ub-radius);
    border: 1px solid var(--ub-line);
    border-top: 5px solid var(--ub-teal);
    padding: 26px 26px 22px;
    box-shadow: var(--ub-shadow);
    transition: transform .25s, box-shadow .25s;
    scroll-margin-top: 120px;
}
.ub-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(15, 46, 40, .12); }
.ub-card--event { border-top-color: var(--ub-green); }
.ub-card:target { outline: 3px solid var(--ub-teal); outline-offset: 3px; }

.ub-card-meta { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; font-size: .88rem; color: var(--ub-muted); }
.ub-tag {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
}
.ub-tag--research { background: #E2F4F8; color: var(--ub-teal-dark); }
.ub-tag--event    { background: #E3F0EC; color: var(--ub-green); }
.ub-tag--campaign { background: #E2F4F8; color: var(--ub-teal-dark); }

.ub-card-title { font-size: 1.3rem; line-height: 1.3; margin-bottom: 10px; font-weight: 700 !important; }
.ub-card-text  { font-size: .95rem; margin-bottom: 18px; }
.ub-card-body  { font-size: .95rem; border-top: 1px dashed var(--ub-line); padding-top: 14px; margin-bottom: 8px; }
.ub-card-link {
    margin-top: auto;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    color: var(--ub-green);
    text-decoration: none;
}
.ub-card-link i { transition: transform .2s; display: inline-block; }
.ub-card-link:hover i { transform: translateX(4px); }

/* Updates page filters */
.ub-filters { display: flex; flex-wrap: wrap; gap: 10px; }
.ub-filter {
    border: 1px solid var(--ub-line);
    background: #fff;
    color: var(--ub-ink);
    border-radius: 999px;
    padding: 7px 18px;
    font-family: 'Jost', sans-serif;
    font-weight: 500;
    transition: all .2s;
}
.ub-filter:hover { border-color: var(--ub-teal); color: var(--ub-teal); }
.ub-filter.active { background: var(--ub-green); border-color: var(--ub-green); color: #fff; }
.ub-update-col.is-hidden { display: none; }

/* =====================================================================
 * Mission / Vision band
 * ===================================================================== */
.ub-mv { overflow: hidden; }
.ub-mv-inner { padding: 40px clamp(24px, 4vw, 56px); height: 100%; }
.ub-mv-mission {
    background:
        radial-gradient(500px 300px at 85% 40%, rgba(255,255,255,.06), transparent 70%),
        var(--ub-green);
    color: #fff;
}
.ub-mv-label {
    font-size: 1.1rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 14px;
}
.ub-mv-label--teal { color: var(--ub-teal); }
.ub-mv-mission-text {
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    font-size: 1.2rem;
    line-height: 1.45;
    margin: 0;
    max-width: 460px;
}
.ub-mv-vision {
    position: relative;
    background: var(--ub-tint);
}
.ub-mv-vision-img {
    position: absolute;
    inset: 0 0 0 48%;               /* right half of the vision panel, as in the mock-up */
    background-position: right bottom;   /* whole image shown, never cropped */
    background-size: contain;
    background-repeat: no-repeat;
    /* hide the image's left part behind the text, reveal it from mid-panel */
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 12%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 12%);
}
.ub-mv-vision-inner {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 24px;
    max-width: 640px;
    font-size: 1rem;
    line-height: 1.6;
}
.ub-mv-eye {
    flex: 0 0 auto;
    width: 72px; height: 72px;
    border-radius: 50%;
    background: var(--ub-teal);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.9rem;
}
.ub-mv-vision-inner > div { border-left: 2px solid var(--ub-teal); padding-left: 24px; max-width: 330px; }
@media (max-width: 991.98px) {
    /* phones/tablets: text first, then the full image underneath */
    .ub-mv-vision { display: flex; flex-direction: column; }
    .ub-mv-vision-img { order: 2; position: relative; inset: auto; height: 50vw; max-height: 320px;
                        background-position: center; background-size: contain; background-repeat: no-repeat;
                        -webkit-mask-image: none; mask-image: none; }
    .ub-mv-vision-inner > div { max-width: none; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* narrower desktops: give the text more room before the image starts */
    .ub-mv-vision-img { inset: 0 0 0 64%; }
    .ub-mv-vision-inner > div { max-width: 270px; }
}

/* =====================================================================
 * About — team
 * ===================================================================== */
.ub-team-card {
    height: 100%;
    background: #fff;
    border: 1px solid var(--ub-line);
    border-radius: var(--ub-radius);
    padding: 26px 16px 20px;
    text-align: center;
    box-shadow: var(--ub-shadow);
    transition: transform .25s;
}
.ub-team-card:hover { transform: translateY(-4px); }
.ub-avatar {
    width: 72px; height: 72px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-family: 'Jost', sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: .04em;
    margin-bottom: 14px;
}
.ub-team-name { font-size: 1.05rem; margin-bottom: 4px; }
.ub-team-role {
    margin: 0;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ub-teal-dark);
}

/* =====================================================================
 * Campaign Newsletter gallery
 * ===================================================================== */
.ub-gallery-group + .ub-gallery-group { margin-top: 56px; }
.ub-gallery-title {
    font-size: 1.35rem;
    color: var(--ub-green);
    padding-left: 14px;
    border-left: 4px solid var(--ub-teal);
    margin-bottom: 22px;
}
.ub-photo {
    height: 100%;
    margin: 0;
    background: #fff;
    border: 1px solid var(--ub-line);
    border-radius: var(--ub-radius);
    overflow: hidden;
    box-shadow: var(--ub-shadow);
}
.ub-photo a { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3; background: var(--ub-tint); }
.ub-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.ub-photo a:hover img { transform: scale(1.06); }
.ub-photo-zoom {
    position: absolute; right: 12px; bottom: 12px;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: rgba(11, 88, 71, .85);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .25s;
}
.ub-photo a:hover .ub-photo-zoom, .ub-photo a:focus .ub-photo-zoom { opacity: 1; }
.ub-photo figcaption { padding: 14px 16px 16px; font-size: .9rem; line-height: 1.5; color: var(--ub-text); }

/* Lightbox */
.ub-lightbox { position: relative; background: #061f1a; border: 0; border-radius: var(--ub-radius); overflow: hidden; }
.ub-lightbox img { max-height: 78vh; object-fit: contain; background: #061f1a; }
.ub-lightbox-caption { color: #DDEFF3; padding: 14px 20px 18px; font-size: .95rem; }
.ub-lightbox-close { position: absolute; top: 12px; right: 12px; z-index: 2; background-color: rgba(0,0,0,.4); border-radius: 50%; padding: 10px; opacity: 1; }
.ub-lightbox-nav {
    position: absolute; top: 40%;
    width: 46px; height: 46px; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.85); color: var(--ub-green);
    font-size: 1.3rem;
    display: inline-flex; align-items: center; justify-content: center;
}
.ub-lightbox-prev { left: 12px; }
.ub-lightbox-next { right: 12px; }
.ub-lightbox-nav[hidden] { display: none; }

/* =====================================================================
 * Valued Sponsors
 * ===================================================================== */
.ub-sponsor-band {
    padding: 40px;
    border-radius: var(--ub-radius);
    background: linear-gradient(135deg, var(--ub-green) 0%, #0E6E5A 55%, var(--ub-teal) 130%);
}
.ub-sponsor {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    transition: transform .25s, box-shadow .25s;
}
.ub-sponsor:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(0,0,0,.2); }
.ub-sponsor-logo { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; padding: 18px; }
.ub-sponsor-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ub-sponsor-name {
    display: block;
    padding: 12px 14px;
    border-top: 1px solid var(--ub-line);
    text-align: center;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    font-size: .88rem;
    color: var(--ub-ink);
}
@media (max-width: 575.98px) { .ub-sponsor-band { padding: 20px; } }

/* =====================================================================
 * Contact
 * ===================================================================== */
.ub-contact {
    display: block;
    height: 100%;
    background: #fff;
    border: 1px solid var(--ub-line);
    border-radius: var(--ub-radius);
    padding: 28px 22px;
    text-align: center;
    text-decoration: none;
    color: var(--ub-text);
    box-shadow: var(--ub-shadow);
    transition: transform .25s;
}
a.ub-contact:hover { transform: translateY(-4px); color: var(--ub-text); }
.ub-contact .ub-round-icon { margin-bottom: 14px; }
.ub-contact h3 { font-size: 1.15rem; margin-bottom: 6px; }
.ub-contact p { margin-bottom: 0; word-break: break-word; }
.ub-contact small { color: var(--ub-muted); }
.ub-form-card {
    background: #fff;
    border: 1px solid var(--ub-line);
    border-radius: var(--ub-radius);
    padding: clamp(24px, 4vw, 40px);
    box-shadow: var(--ub-shadow);
}
.ub-form-card .form-control, .ub-form-card .form-select { border-radius: 10px; padding: 12px 14px; border-color: var(--ub-line); }
.ub-form-card .form-control:focus, .ub-form-card .form-select:focus { border-color: var(--ub-teal); box-shadow: 0 0 0 .2rem rgba(18,162,198,.15); }

/* =====================================================================
 * Archive (old newsletter content)
 * ===================================================================== */
.ub-archive { background: #fff; }
.ub-archive img.img-fluid { object-fit: cover; width: 100%; }
.ub-archive .display-5 { color: var(--ub-green); }
/* archive photos: zoom badge + gentle hover zoom, like the newsletter gallery */
.ub-archive-zoom { position: relative; display: block; overflow: hidden; cursor: zoom-in; border-radius: inherit; }
.ub-archive-zoom img { transition: transform .5s; }
.ub-archive-zoom:hover img { transform: scale(1.06); }
.ub-archive-zoom:hover .ub-photo-zoom, .ub-archive-zoom:focus .ub-photo-zoom { opacity: 1; }

/* =====================================================================
 * Footer
 * ===================================================================== */
.ub-footer { background: var(--ub-green-dark); }
.ub-footer a { text-decoration: none; }
.ub-footer a.text-light:hover { color: #9FD9E8 !important; }
.ub-footer-muted { color: #A9C9C1; font-size: .92rem; }
.ub-footer h4 { font-size: 1.25rem; }
.ub-social {
    width: 44px; height: 44px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--ub-teal); color: #fff; border-radius: 50%;
}
.ub-social:hover { background: #fff; color: var(--ub-green); }
.ub-footer-bottom { background: #05332A; color: #CFE3DD; font-size: .92rem; }