/* Noble Mission homepage layout matching the supplied landing page mockup. */

:root {
    --nm-cream: #f8efdf;
    --nm-cream-soft: #fbf5ea;
    --nm-cream-panel: #f5e0b8;
    --nm-maroon: #9d1d45;
    --nm-maroon-dark: #40171f;
    --nm-brown: #3d1d13;
    --nm-orange: #f2a030;
    --nm-coral: #f4826f;
    --nm-teal: #4f7f82;
    --nm-purple: #7c5c9f;
    --nm-text: #1e1618;
    --nm-muted: #5b4b4d;
    --nm-rule: rgba(157, 29, 69, 0.35);
}

body.home,
body.page-template-front-page {
    background: var(--nm-cream);
    color: var(--nm-text);
}

.nm-home {
    background: var(--nm-cream);
    color: var(--nm-text);
    overflow-x: hidden;
}

.nm-home,
.nm-home button,
.nm-home input,
.nm-home textarea,
.nm-home select {
    font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

.nm-home h1,
.nm-home h2,
.nm-home h3,
.nm-home h4 {
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    letter-spacing: 0;
}

.nm-home a {
    color: inherit;
    text-decoration: none;
}

/* Hide the legacy header on any page that uses the new layout wrapper
   (.nm-home). The footer is now globally themed (nm-gfooter) so it shows
   on every page regardless of wrapper. */
body.home > header.nm-header,
body.page-template-front-page > header.nm-header,
body.home .nm-header,
body.page-template-front-page .nm-header,
body.home .nm-mobile-overlay,
body.page-template-front-page .nm-mobile-overlay,
body:has(.nm-home) > header.nm-header,
body:has(.nm-home) .nm-header,
body:has(.nm-home) > .nm-mobile-overlay {
    display: none !important;
}

/* Top header */
.nm-tophead {
    height: 78px;
    background: #fffefd;
    box-shadow: 0 1px 0 rgba(89, 33, 24, 0.08);
}

.nm-tophead__inner {
    width: 100%;
    height: 78px;
    margin: 0 auto;
    padding: 0 clamp(14px, 3.6vw, 56px) 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(10px, 1.5vw, 26px);
}

.nm-tophead__tagline {
    flex: 1 1 auto;
    min-width: 0;
    color: #1c1718;
    font-size: clamp(12px, 1.04vw, 16px);
    font-style: italic;
    font-weight: 400;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Small in-nav logo — only shown on mobile via the breakpoint below.
   Hidden on desktop so the existing one-line nav layout is unchanged. */
.nm-tophead__brand { display: none; }
.nm-tophead__brand img { display: block; height: 36px; width: auto; }
/* Logo variant visibility: desktop default, mobile breakpoint swaps. */
.nm-tophead__logo--mobile { display: none; }

.nm-tophead__nav {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(4px, 0.9vw, 18px);
    white-space: nowrap;
}

.nm-tophead__nav a {
    height: 44px;
    padding: 0 clamp(5px, 0.55vw, 9px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #141012;
    font-size: clamp(12px, 0.92vw, 14px);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    transition: background-color 160ms ease, color 160ms ease;
}

.nm-tophead__nav a:hover {
    color: var(--nm-maroon);
}

.nm-tophead__nav a.is-active {
    min-width: clamp(68px, 5.6vw, 86px);
    padding: 0 20px;
    background: #a73e4b;
    color: #fff;
}

.nm-tophead__nav a.is-cta {
    min-width: clamp(88px, 8.6vw, 132px);
    height: 46px;
    margin-left: clamp(2px, 0.45vw, 8px);
    border: 1.5px solid #b85c68;
    color: #923141;
    font-size: clamp(13px, 1.05vw, 16px);
    font-weight: 700;
}

.nm-tophead__nav a.is-cta:hover {
    background: #a73e4b;
    border-color: #a73e4b;
    color: #fff;
}

/* When the CTA link is also the active page (i.e. on /contact-us/),
   force white text so it doesn't clash with the maroon background. */
.nm-tophead__nav a.is-active.is-cta {
    background: #a73e4b;
    border-color: #a73e4b;
    color: #fff;
}

.nm-mobile-trigger {
    display: none;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    background: transparent;
    border: 1px solid rgba(157, 29, 69, 0.25);
    border-radius: 999px;
    cursor: pointer;
    transition: transform 200ms ease;
}

.nm-mobile-trigger span {
    width: 20px;
    height: 2px;
    display: block;
    background: var(--nm-maroon);
    transition: transform 200ms ease, opacity 200ms ease;
    transform-origin: center;
}

.nm-mobile-trigger.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}
.nm-mobile-trigger.is-open span:nth-child(2) { opacity: 0; }
.nm-mobile-trigger.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ----- Mobile drawer ----- */
.nm-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 998;
    background: rgba(31, 14, 18, 0.55);
    opacity: 0;
    transition: opacity 240ms ease;
}
.nm-drawer-backdrop.is-open { opacity: 1; }

.nm-drawer {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999;
    width: min(86vw, 320px);
    height: 100vh;
    background: var(--nm-cream-soft);
    box-shadow: -8px 0 28px rgba(31, 14, 18, 0.18);
    transform: translateX(100%);
    transition: transform 280ms cubic-bezier(0.22, 0.61, 0.36, 1);
    display: flex;
    flex-direction: column;
}
.nm-drawer.is-open { transform: translateX(0); }

.nm-drawer__head {
    flex: 0 0 auto;
    padding: 18px 18px;
    background: var(--nm-cream-panel);
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid rgba(157, 29, 69, 0.18);
}
.nm-drawer__tagline {
    flex: 1 1 auto;
    margin: 0;
    color: var(--nm-brown);
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.2px;
    font-style: italic;
}

.nm-drawer__close {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1.5px solid var(--nm-maroon);
    background: transparent;
    color: var(--nm-maroon);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.nm-drawer__close:hover {
    background: var(--nm-maroon);
    color: #fff;
}

.nm-drawer__nav {
    flex: 1 1 auto;
    padding: 14px 8px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--nm-maroon) transparent;
}
.nm-drawer__nav::-webkit-scrollbar { width: 5px; }
.nm-drawer__nav::-webkit-scrollbar-thumb { background: var(--nm-maroon); border-radius: 999px; }

.nm-drawer__nav > a,
.nm-drawer__group > summary {
    display: block;
    padding: 13px 18px;
    color: var(--nm-text);
    font-size: 15px;
    font-weight: 700;
    border-radius: 12px;
    text-decoration: none;
    cursor: pointer;
    list-style: none;
}
.nm-drawer__group > summary::-webkit-details-marker { display: none; }
.nm-drawer__group > summary::after {
    content: "\25BE";
    float: right;
    color: var(--nm-maroon);
    transition: transform 180ms ease;
}
.nm-drawer__group[open] > summary::after { transform: rotate(180deg); }
.nm-drawer__group > a {
    display: block;
    padding: 10px 18px 10px 32px;
    color: var(--nm-muted);
    font-size: 14px;
    font-weight: 600;
    border-radius: 10px;
    text-decoration: none;
}
.nm-drawer__nav > a:hover,
.nm-drawer__group > summary:hover,
.nm-drawer__group > a:hover {
    background: rgba(157, 29, 69, 0.07);
    color: var(--nm-maroon);
}
.nm-drawer__nav > a.is-active {
    background: var(--nm-maroon);
    color: #fff;
}

.nm-drawer__foot {
    flex: 0 0 auto;
    padding: 14px 18px 22px;
    border-top: 1px solid rgba(157, 29, 69, 0.18);
}
.nm-drawer__cta {
    display: block;
    padding: 13px 18px;
    background: var(--nm-maroon);
    color: #fff !important;
    border-radius: 999px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    transition: background 160ms ease;
}
.nm-drawer__cta:hover { background: var(--nm-maroon-dark); }

/* Drawer is mobile-only; hide on desktop just in case. */
@media (min-width: 1101px) {
    .nm-drawer,
    .nm-drawer-backdrop { display: none !important; }
}

/* Hero — three panels: logo (left), gallery (middle, TBD), building (right) */
.nm-hero-2026 {
    padding: 0;
    background: var(--nm-cream);
}

.nm-hero-2026__panels {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 260px 1fr 260px;
    align-items: stretch;
    background: #ffffff;
    height: 380px;
    max-height: 380px;
}

.nm-hero-2026__brand {
    background: var(--nm-cream-panel);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 10px;
    height: 100%;
}

.nm-hero-2026__logo {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center;
}

/* Middle column = gallery (mosaic + wave) + tagline below the wave.
   Use grid (1fr auto) so the tagline always reserves its row and the
   gallery fills whatever's left of the fixed 380px hero height. */
.nm-hero-2026__center {
    display: grid;
    grid-template-rows: 1fr auto;
    background: #ffffff;
    min-width: 0;
    height: 100%;
    overflow: hidden;
}

.nm-hero-2026__gallery {
    position: relative;
    min-height: 0;
    padding: 8px 8px 0;
    background: #ffffff;
    /* Editorial 4-col x 2-row mosaic. Areas are intentionally asymmetric.
       minmax(0,1fr) prevents image intrinsic size from blowing out rows. */
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    gap: 5px;
}

.nm-hero-2026__gallery .g {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    display: block;
    box-shadow: 0 4px 14px rgba(74, 17, 36, 0.08);
}

.nm-hero-2026__gallery .g-a { grid-column: 1 / 3; grid-row: 1 / 2; }
.nm-hero-2026__gallery .g-b { grid-column: 3 / 4; grid-row: 1 / 2; }
.nm-hero-2026__gallery .g-c { grid-column: 4 / 5; grid-row: 1 / 3; }
.nm-hero-2026__gallery .g-d { grid-column: 1 / 2; grid-row: 2 / 3; }
.nm-hero-2026__gallery .g-e { grid-column: 2 / 4; grid-row: 2 / 3; }

/* Floating circular highlight — perfect circle, thick white border,
   slightly left of center, mid-height, overlapping the rectangles. */
.nm-hero-2026__circle {
    position: absolute;
    z-index: 5;
    top: 50%;
    left: 38%;
    transform: translate(-50%, -50%);
    width: 88px;
    height: 88px;
    border-radius: 50%;
    border: 5px solid #ffffff;
    object-fit: cover;
    box-shadow: 0 8px 22px rgba(74, 17, 36, 0.22);
}

/* Wave bottom transition — smooth curved dip in white so the mosaic
   melts down into the tagline strip without a hard edge. */
.nm-hero-2026__wave {
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    width: 100%;
    height: 38px;
    z-index: 4;
    pointer-events: none;
    display: block;
}

.nm-hero-2026__tagline {
    padding: 4px 18px 10px;
    background: #ffffff;
    text-align: left;
}

.nm-hero-2026__quote {
    margin: 0;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 700;
    font-size: clamp(17px, 1.45vw, 22px);
    line-height: 1.2;
    letter-spacing: 0.1px;
    color: #1e1618;
}

.nm-hero-2026__quote::before {
    content: "\201C";
    margin-right: 4px;
    color: var(--nm-maroon);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.1em;
    line-height: 1;
}

.nm-hero-2026__quote .t-ability { color: #4f8d4a; }
.nm-hero-2026__quote .t-dream   { color: #e69a2e; }
.nm-hero-2026__quote .t-day     { color: #3a7ca8; }

.nm-hero-2026__sub {
    margin: 3px 0 0;
    color: #5b3f24;
    font-size: clamp(11px, 0.92vw, 14px);
    font-weight: 500;
    letter-spacing: 0.2px;
    font-style: italic;
}

.nm-hero-2026__building {
    overflow: hidden;
    display: flex;
    align-items: stretch;
}

.nm-hero-2026__building-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ----- MOBILE / TABLET HERO RULES ----- */
/* On <=1100px the desktop 3-column hero collapses to a stacked layout.
   The big brand panel is hidden on mobile because the small logo is now
   shown in the top nav, so the gallery starts right under the nav. */
@media (max-width: 1100px) {
    .nm-hero-2026__panels {
        grid-template-columns: 1fr;
        height: auto;
        max-height: none;
    }
    .nm-hero-2026__brand {
        display: none;
    }
    .nm-hero-2026__center {
        height: auto;
        overflow: visible;
    }
    .nm-hero-2026__gallery {
        min-height: 320px;
        padding: 12px 12px 0;
        gap: 6px;
        grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    }
    /* Re-pack the mosaic into 3 columns (down from 4) */
    .nm-hero-2026__gallery .g-a { grid-column: 1 / 2; grid-row: 1 / 3; }
    .nm-hero-2026__gallery .g-b { grid-column: 2 / 3; grid-row: 1 / 2; }
    .nm-hero-2026__gallery .g-c { grid-column: 3 / 4; grid-row: 1 / 2; }
    .nm-hero-2026__gallery .g-d { grid-column: 2 / 3; grid-row: 2 / 3; }
    .nm-hero-2026__gallery .g-e { grid-column: 3 / 4; grid-row: 2 / 3; }
    .nm-hero-2026__circle {
        width: 78px; height: 78px;
        left: 45%; top: 50%;
    }
    .nm-hero-2026__building {
        height: auto;
    }
    .nm-hero-2026__building-img {
        height: auto;
        min-height: 220px;
        max-height: 280px;
    }
}

/* Phones: tighter still, 2-col mosaic */
@media (max-width: 640px) {
    .nm-hero-2026__gallery {
        min-height: 260px;
        padding: 8px 8px 0;
        gap: 5px;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .nm-hero-2026__gallery .g-a { grid-column: 1 / 3; grid-row: 1 / 2; }
    .nm-hero-2026__gallery .g-b { grid-column: 1 / 2; grid-row: 2 / 3; }
    .nm-hero-2026__gallery .g-c { grid-column: 2 / 3; grid-row: 2 / 3; }
    .nm-hero-2026__gallery .g-d { grid-column: 1 / 2; grid-row: 3 / 4; }
    .nm-hero-2026__gallery .g-e { grid-column: 2 / 3; grid-row: 3 / 4; }
    .nm-hero-2026__circle {
        width: 64px; height: 64px;
        border-width: 4px;
        left: 50%; top: 60%;
    }
    .nm-hero-2026__tagline { padding: 6px 14px 12px; }
    .nm-hero-2026__quote { font-size: 16px; }
    .nm-hero-2026__sub { font-size: 11px; }
    .nm-hero-2026__building-img { min-height: 180px; max-height: 220px; }
}

/* Shared titles */
.nm-sec-title,
.nm-row-2 .nm-block-title {
    margin: 0;
    color: var(--nm-brown);
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    line-height: 1.15;
}

.nm-sec-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    color: #411f14;
    font-size: 24px;
    letter-spacing: 6px;
    text-align: center;
}

.nm-sec-title::before,
.nm-sec-title::after {
    content: "";
    height: 1px;
    flex: 1 1 0;
    background: rgba(126, 55, 40, 0.45);
}

.nm-row-2 .nm-block-title {
    position: relative;
    padding-bottom: 10px;
    color: var(--nm-maroon);
    font-size: 22px;
    letter-spacing: 3px;
    text-align: center;
}

.nm-row-2 .nm-block-title::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 78px;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(157, 29, 69, 0.28);
}

/* What we do and director row */
.nm-row-1 {
    min-height: 252px;
    padding: 18px 0 0;
    background: linear-gradient(90deg, #fbf7f0 0%, #fbf7f0 65%, #fff7ec 100%);
}

.nm-row-1__grid {
    width: 100%;
    max-width: 1536px;
    margin: 0 auto;
    padding: 0 11px 0 38px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(500px, 34vw);
    gap: 54px;
    align-items: start;
}

.nm-whatwedo {
    padding: 0;
}

.nm-whatwedo__cards {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(6, 132px);
    justify-content: space-between;
    align-items: start;
}

.nm-wcard {
    display: block;
    width: 132px;
    height: 132px;
    border-radius: 16px;
    background: transparent;
}

.nm-wcard img {
    width: 132px;
    height: 132px;
    display: block;
    object-fit: contain;
    transition: transform 160ms ease;
}

.nm-wcard:hover img {
    transform: translateY(-2px);
}

.nm-director {
    position: relative;
    min-height: 232px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 189px;
    background: #ffe4bf;
    border-radius: 24px 0 0 24px;
    box-shadow: none;
}

.nm-director::before {
    content: "";
    position: absolute;
    top: 0;
    left: 26px;
    right: 176px;
    height: 4px;
    background: #f6a42b;
}

.nm-director__body {
    min-width: 0;
    padding: 26px 22px 22px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nm-director__label {
    margin: 0 0 14px;
    color: #211717;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: clamp(14px, 1.2vw, 19px);
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.2px;
}

.nm-director__quote {
    position: relative;
    margin: 0 0 11px;
    padding-left: 25px;
    color: #221819;
    font-size: clamp(12.5px, 1.05vw, 16px);
    font-style: normal;
    line-height: 1.45;
}

.nm-director__quote::before {
    content: "\201C";
    position: absolute;
    top: -6px;
    left: 0;
    color: #080606;
    font-family: Georgia, serif;
    font-size: 42px;
    font-weight: 700;
    line-height: 1;
}

.nm-director__name {
    margin-top: 2px;
    color: #191213;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
}

.nm-director__role {
    margin-top: 2px;
    color: #191213;
    font-size: 12px;
    line-height: 1.25;
}

.nm-director__photo {
    width: 189px;
    height: 232px;
    display: block;
    object-fit: cover;
    object-position: center top;
}

/* Why, impact, get involved row */
.nm-row-2 {
    min-height: 264px;
    padding: 20px 0 22px;
    background: #fffbf6;
}

.nm-row-2__grid {
    width: 100%;
    max-width: 1536px;
    margin: 0 auto;
    padding: 0 68px;
    display: grid;
    grid-template-columns: 1fr 1.3fr 0.95fr;
    gap: 34px;
    align-items: start;
}

/* Override legacy .nm-why (padding 100px 0; background light) — keep
   WHY column flush at the top of row-2 so its title sits at the same
   baseline as OUR IMPACT and GET INVOLVED. */
.nm-home .nm-why {
    padding: 0 !important;
    background: transparent !important;
}

.nm-row-2__grid > div {
    min-width: 0;
}

.nm-row-2__grid > div + div {
    min-height: 205px;
    border-left: 1px solid rgba(126, 55, 40, 0.22);
    padding-left: 28px;
}

.nm-why ul {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.nm-why li {
    position: relative;
    min-height: 26px;
    padding: 7px 0 7px 46px;
    color: #1e1718;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
}

.nm-why li::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 7px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: #aa4653;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.2 16.6 4.9 12.3l1.7-1.7 2.6 2.6 8.2-8.2 1.7 1.7z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 17px 17px;
}

.nm-impact-cards {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

.nm-icard {
    min-height: 180px;
    padding: 19px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 16px;
    color: #fff;
    text-align: center;
}

.nm-icard__icon {
    width: 54px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nm-icard__icon svg {
    width: 52px;
    height: 52px;
    fill: currentColor;
}

.nm-icard__num {
    color: currentColor;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: clamp(32px, 3vw, 52px);
    font-weight: 900;
    line-height: 0.95;
}

.nm-icard--peach .nm-icard__num {
    color: #fff;
    font-size: clamp(22px, 1.9vw, 30px);
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.nm-icard--teal .nm-icard__num {
    font-size: clamp(29px, 2.3vw, 34px);
}

.nm-icard__label {
    color: currentColor;
    font-size: clamp(13px, 1.1vw, 17px);
    font-weight: 800;
    line-height: 1.2;
}

.nm-icard--maroon {
    background: #b94362;
}

.nm-icard--peach {
    background: #ffbd5d;
}

.nm-icard--teal {
    background: var(--nm-teal);
}

.nm-getinvolved-cards {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 10px;
}

.nm-gcard {
    min-height: 60px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    border: 1.5px solid #f09a35;
    border-radius: 14px;
    background: transparent;
    color: #1d1517;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.nm-gcard:hover {
    background: #fff6eb;
    color: var(--nm-maroon);
    transform: translateY(-1px);
}

.nm-gcard svg {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    fill: #bf4f67;
}

.nm-gcard__label {
    color: inherit;
    font-size: clamp(13px, 0.95vw, 15px);
    font-weight: 800;
    line-height: 1.15;
    white-space: nowrap;
}

/* ============================================================
   ABOUT US PAGE — sections nm-ah, nm-ast, nm-amv, nm-acv,
   nm-adm, nm-awhy, nm-agb, nm-acta. Same cream/maroon palette
   and tophead/drawer as homepage.
   ============================================================ */
.nm-about-page { background: #ffffff; color: var(--nm-text); }

/* Reusable bits */
.nm-about-page .nm-eyebrow {
    display: inline-block;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--nm-maroon);
    margin: 0 0 10px;
}
.nm-about-page .nm-h2 {
    margin: 0 0 14px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(24px, 2.4vw, 36px);
    line-height: 1.18;
    color: var(--nm-brown);
    letter-spacing: -0.2px;
}
.nm-about-page .nm-h3 {
    margin: 0 0 10px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(17px, 1.4vw, 20px);
    color: var(--nm-maroon);
}
.nm-about-page p {
    margin: 0 0 14px;
    font-size: clamp(14.5px, 1.05vw, 16.5px);
    line-height: 1.7;
    color: #2a2024;
}

/* Page hero — desktop layout mirrors the homepage hero:
   a 260px cream brand panel flush to the left edge containing the logo,
   and the breadcrumb / title / subtitle stacked left-aligned on the right. */
.nm-ah {
    background: linear-gradient(180deg, var(--nm-cream-panel) 0%, var(--nm-cream) 100%);
    padding: 0;
}
.nm-ah__wrap {
    max-width: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    grid-template-rows: 1fr auto auto auto 1fr;
    min-height: 380px;
}
/* Brand panel — same 260×380 cream panel as the homepage hero,
   logo sized to render at the same 235×352 visual area. */
.nm-ah__wrap::before {
    content: "";
    grid-column: 1;
    grid-row: 1 / -1;
    background-color: var(--nm-cream-panel);
    background-image: url("../images/nm-logo-transparent.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 235px 352px;
}
/* Right column items — explicit rows so empty 1fr rows top & bottom
   center the stack vertically inside the 380px panel. */
.nm-ah__crumbs {
    grid-column: 2;
    grid-row: 2;
    text-align: left;
    padding: 0 clamp(20px, 3vw, 40px) 0 clamp(28px, 3.5vw, 56px);
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--nm-muted);
    letter-spacing: 0.6px;
}
.nm-ah__crumbs a { color: var(--nm-maroon); text-decoration: none; font-weight: 600; }
.nm-ah__crumbs a:hover { text-decoration: underline; }
.nm-ah__crumbs span { margin: 0 8px; color: var(--nm-muted); }
.nm-ah__crumbs .is-current { color: var(--nm-text); font-weight: 700; }
.nm-ah__title {
    grid-column: 2;
    grid-row: 3;
    text-align: left;
    padding: 0 clamp(20px, 3vw, 40px) 0 clamp(28px, 3.5vw, 56px);
    margin: 0;
    max-width: 820px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 900;
    font-size: clamp(32px, 4.4vw, 56px);
    line-height: 1.05;
    color: var(--nm-brown);
    letter-spacing: -0.5px;
}
.nm-about-page .nm-ah__sub {
    grid-column: 2;
    grid-row: 4;
    text-align: left;
    padding: 0 clamp(20px, 3vw, 40px) 0 clamp(28px, 3.5vw, 56px);
    margin: 16px 0 0;
    max-width: 760px;
    font-size: clamp(15px, 1.25vw, 18px);
    line-height: 1.6;
    color: var(--nm-muted);
}

/* Mobile / tablet: stack to single column, logo hidden (already shown
   in mobile tophead). Hero reverts to centred full-width text. */
@media (max-width: 900px) {
    .nm-ah {
        padding: clamp(40px, 6vw, 84px) 0 clamp(36px, 5vw, 70px);
    }
    .nm-ah__wrap {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        min-height: 0;
    }
    .nm-ah__wrap::before { display: none; }
    .nm-ah__crumbs,
    .nm-ah__title,
    .nm-about-page .nm-ah__sub {
        grid-column: 1;
        grid-row: auto;
        padding: 0 clamp(18px, 4vw, 32px);
        text-align: center;
        max-width: none;
    }
    .nm-ah__crumbs { margin-bottom: 18px; }
    .nm-about-page .nm-ah__sub { margin: 16px auto 0; max-width: 760px; }
}

/* Our Story */
.nm-ast {
    padding: clamp(50px, 6vw, 90px) 0;
    background: #ffffff;
}
.nm-ast__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 60px);
    align-items: start;
}
.nm-pullquote {
    margin: 22px 0 0;
    padding: 18px 22px;
    border-left: 4px solid var(--nm-maroon);
    background: var(--nm-cream-soft);
    border-radius: 0 12px 12px 0;
    font-size: clamp(15px, 1.2vw, 17px);
    color: var(--nm-brown);
    line-height: 1.55;
}
.nm-pullquote em { font-style: italic; color: var(--nm-maroon); font-weight: 600; }
.nm-ast__bullets {
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.18);
    border-radius: 18px;
    padding: 26px 28px;
}
.nm-ast__bullets ul { list-style: none; margin: 0; padding: 0; }
.nm-ast__bullets li {
    position: relative;
    padding: 10px 0 10px 32px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--nm-text);
    border-bottom: 1px dashed rgba(157,29,69,0.15);
}
.nm-ast__bullets li:last-child { border-bottom: 0; }
.nm-ast__bullets li::before {
    content: "";
    position: absolute;
    left: 0; top: 13px;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--nm-maroon);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.2 16.6 4.9 12.3l1.7-1.7 2.6 2.6 8.2-8.2 1.7 1.7z'/%3E%3C/svg%3E");
    background-size: 14px 14px;
    background-repeat: no-repeat;
    background-position: center;
}

/* Mission + Vision */
.nm-amv {
    padding: clamp(40px, 5vw, 70px) 0;
    background: var(--nm-cream-soft);
}
.nm-amv__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}
.nm-amv__card {
    border-radius: 22px;
    padding: clamp(24px, 3vw, 36px);
    color: #fff;
    box-shadow: 0 14px 40px rgba(74, 17, 36, 0.12);
}
.nm-amv__card--mission { background: linear-gradient(135deg, #b94362 0%, #7e2440 100%); }
.nm-amv__card--vision  { background: linear-gradient(135deg, #4f7f82 0%, #2f5e62 100%); }
.nm-amv__icon {
    width: 56px; height: 56px;
    border-radius: 999px;
    background: rgba(255,255,255,0.18);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 14px;
}
.nm-amv__icon svg { width: 28px; height: 28px; fill: #fff; }
.nm-amv__h {
    margin: 0 0 10px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(22px, 2vw, 28px);
    color: #fff;
}
.nm-amv__card p {
    color: rgba(255,255,255,0.94);
    font-size: clamp(14.5px, 1.05vw, 16.5px);
    line-height: 1.65;
    margin: 0;
}

/* Core Values */
.nm-acv {
    padding: clamp(50px, 6vw, 90px) 0;
    background: #ffffff;
}
.nm-acv__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-acv__head { text-align: center; margin-bottom: clamp(28px, 4vw, 44px); }
.nm-acv__lead { max-width: 640px; margin: 0 auto; color: var(--nm-muted); }
.nm-acv__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.nm-vcard {
    position: relative;
    padding: 26px 20px 22px;
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.16);
    border-radius: 16px;
    transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
}
.nm-vcard:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(74,17,36,0.08);
    background: #fff;
}
.nm-vcard__num {
    display: inline-block;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 900;
    font-size: 26px;
    color: var(--nm-maroon);
    background: rgba(157, 29, 69, 0.08);
    padding: 4px 12px;
    border-radius: 999px;
    margin-bottom: 12px;
}
.nm-vcard__h {
    margin: 0 0 8px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: 16px;
    line-height: 1.3;
    color: var(--nm-brown);
}
.nm-vcard p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: var(--nm-muted);
}

/* Director's Message (full) */
.nm-adm {
    padding: clamp(50px, 6vw, 90px) 0;
    background: linear-gradient(180deg, var(--nm-cream-soft) 0%, var(--nm-cream-panel) 100%);
}
.nm-adm__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    display: grid;
    grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 56px);
    align-items: start;
}
.nm-adm__photo-col { position: relative; text-align: center; }
.nm-adm__photo {
    width: 100%;
    max-width: 280px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    box-shadow: 0 16px 40px rgba(74, 17, 36, 0.18);
    margin: 0 auto;
    display: block;
}
.nm-adm__sig {
    margin-top: 16px;
    padding: 14px 18px;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid rgba(157, 29, 69, 0.16);
    display: flex; flex-direction: column; gap: 2px;
}
.nm-adm__name {
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: 18px;
    color: var(--nm-maroon);
}
.nm-adm__role {
    font-size: 13px;
    color: var(--nm-muted);
}
.nm-adm__body { padding-top: 4px; }
.nm-adm__body p { color: #2a2024; }

/* Why Noble Mission (page version) */
.nm-awhy {
    padding: clamp(40px, 5vw, 80px) 0;
    background: #ffffff;
}
.nm-awhy__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-awhy__head { text-align: center; margin-bottom: 32px; }
.nm-awhy__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
}
.nm-pcard {
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.16);
    border-radius: 16px;
    padding: 20px 16px;
    text-align: center;
    display: flex; flex-direction: column; align-items: center; gap: 10px;
    transition: transform 200ms ease, box-shadow 200ms ease;
}
.nm-pcard:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 28px rgba(74,17,36,0.10);
}
.nm-pcard__icon {
    width: 50px; height: 50px;
    border-radius: 999px;
    background: var(--nm-maroon);
    display: flex; align-items: center; justify-content: center;
}
.nm-pcard__icon svg { width: 24px; height: 24px; fill: #fff; }
.nm-pcard__h {
    margin: 0;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.35;
    color: var(--nm-brown);
}

/* Governing Body */
.nm-agb {
    padding: clamp(50px, 6vw, 90px) 0;
    background: var(--nm-cream-soft);
}
.nm-agb__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-agb__head { text-align: center; margin-bottom: clamp(28px, 4vw, 44px); }
.nm-agb__lead { max-width: 700px; margin: 0 auto; color: var(--nm-muted); }
.nm-agb__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.nm-tcard {
    background: #ffffff;
    border: 1px solid rgba(157, 29, 69, 0.14);
    border-radius: 18px;
    padding: 22px 22px 24px;
    transition: transform 200ms ease, box-shadow 200ms ease;
}
.nm-tcard:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(74,17,36,0.12);
}
.nm-tcard__photo-wrap {
    width: 72%;
    max-width: 220px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto 18px;
    background: transparent;
    border: 0;
}
.nm-tcard__photo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.nm-tcard { text-align: center; }
.nm-tcard p { text-align: left; }
.nm-tcard__name {
    margin: 0 0 4px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: 18px;
    color: var(--nm-maroon);
    line-height: 1.2;
}
.nm-tcard__role {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--nm-orange);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin-bottom: 12px;
}
.nm-tcard p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #2a2024;
}

/* CTA band on About */
.nm-acta {
    padding: clamp(40px, 5vw, 70px) 0;
    background: var(--nm-maroon);
    color: #fff;
}
.nm-acta__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}
.nm-acta__h {
    margin: 0;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(20px, 2.2vw, 30px);
    line-height: 1.3;
    color: #fff;
    flex: 1 1 auto;
}
.nm-acta__h em { font-style: italic; color: var(--nm-cream-panel); }
/* Higher specificity than .nm-home a {color:inherit} so the maroon
   text shows on the white pill. */
.nm-home .nm-acta__btn {
    display: inline-block;
    padding: 14px 28px;
    background: #fff;
    color: var(--nm-maroon);
    border-radius: 999px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: 15px;
    text-decoration: none;
    transition: all 180ms ease;
    flex: 0 0 auto;
}
.nm-home .nm-acta__btn:hover {
    background: var(--nm-cream-panel);
    color: var(--nm-maroon-dark);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.18);
}

/* About page responsive — tablets */
@media (max-width: 1100px) {
    .nm-ast__wrap { grid-template-columns: 1fr; }
    .nm-acv__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nm-awhy__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .nm-agb__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nm-adm__wrap { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); }
}

/* About page responsive — phones */
@media (max-width: 640px) {
    .nm-amv__wrap { grid-template-columns: 1fr; }
    .nm-acv__grid { grid-template-columns: 1fr; }
    .nm-awhy__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nm-agb__grid { grid-template-columns: 1fr; }
    .nm-adm__wrap {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .nm-adm__photo-col {
        max-width: 280px;
        margin: 0 auto;
    }
    .nm-adm__body { text-align: left; }
    .nm-acta__wrap { flex-direction: column; text-align: center; }
    .nm-pullquote { padding: 14px 16px; }
}

/* Closing band */
.nm-footer-band {
    position: relative;
    min-height: 72px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #a33e48;
    color: #fff;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: clamp(18px, 1.72vw, 26px);
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.nm-footer-band::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 13px;
    width: 136px;
    height: 10px;
    transform: translateX(-50%);
    border-bottom: 5px solid #f0a12c;
    border-radius: 50%;
}

/* Mid-size desktop: preserve the one-line navigation and tighten the grid. */
@media (max-width: 1320px) {
    .nm-tophead__inner {
        padding-right: 36px;
        gap: 12px;
    }

    .nm-row-1__grid {
        padding-left: 24px;
        grid-template-columns: minmax(0, 1fr) minmax(356px, 32vw);
        gap: 30px;
    }

    .nm-sec-title {
        font-size: 28px;
        letter-spacing: 2px;
    }

    .nm-whatwedo__cards {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 8px;
    }

    .nm-wcard,
    .nm-wcard img {
        width: 126px;
        height: 126px;
    }

    .nm-director {
        grid-template-columns: minmax(0, 1fr) 128px;
    }

    .nm-director::before {
        right: 128px;
    }

    .nm-director__body {
        padding-left: 23px;
        padding-right: 12px;
    }

    .nm-director__photo {
        width: 128px;
    }

    .nm-row-2__grid {
        padding: 0 52px;
        gap: 24px;
    }

    .nm-row-2__grid > div + div {
        padding-left: 24px;
    }
}

/* Tablet and mobile */
@media (max-width: 1100px) {
    .nm-tophead__nav {
        display: none;
    }

    /* Mobile nav: horizontal logo on the left → spacer → hamburger.
       Tagline moves into the drawer (the logo wordmark already identifies). */
    .nm-tophead__brand {
        display: inline-flex;
        flex: 0 0 auto;
        order: 1;
        align-items: center;
    }
    .nm-tophead__logo--desktop { display: none; }
    .nm-tophead__logo--mobile  { display: block; height: 44px; width: auto; }

    .nm-tophead__tagline { display: none; }

    .nm-mobile-trigger {
        display: inline-flex;
        flex: 0 0 auto;
        order: 3;
        margin-left: auto;
    }

    .nm-row-1 {
        min-height: 0;
        padding: 24px 0 28px;
    }

    .nm-row-1__grid {
        padding: 0 22px;
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .nm-whatwedo__cards {
        grid-template-columns: repeat(3, 132px);
        justify-content: center;
        gap: 18px;
    }

    .nm-wcard,
    .nm-wcard img {
        width: 132px;
        height: 132px;
    }

    .nm-director {
        width: min(100%, 560px);
        margin: 0 auto;
        border-radius: 24px;
    }

    .nm-row-2 {
        min-height: 0;
        padding: 32px 0 34px;
    }

    .nm-row-2__grid {
        padding: 0 28px;
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .nm-row-2__grid > div + div {
        min-height: 0;
        padding-left: 0;
        border-left: 0;
    }

    .nm-impact-cards {
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }

    .nm-getinvolved-cards {
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 640px) {
    .nm-home { overflow-x: hidden; }

    .nm-tophead {
        height: 60px;
    }

    .nm-tophead__inner {
        height: 60px;
        padding: 0 14px;
    }

    .nm-tophead__logo--mobile { height: 40px; }

    .nm-mobile-trigger {
        width: 40px;
        height: 40px;
    }

    /* Section titles tighter */
    .nm-row-1 { padding: 22px 0 24px; }
    .nm-sec-title {
        gap: 10px;
        font-size: 20px;
        letter-spacing: 1.5px;
    }
    .nm-sec-title::before, .nm-sec-title::after {
        max-width: 30px;
    }

    .nm-whatwedo__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-top: 18px;
    }
    .nm-wcard,
    .nm-wcard img {
        width: 100%;
        max-width: 150px;
        height: auto;
        aspect-ratio: 1 / 1;
        margin: 0 auto;
    }

    /* Director: stack vertically, photo at top is too cramped — keep
       text first then photo. Tighten paddings, move scrollbar inline. */
    .nm-director {
        height: auto;
        grid-template-columns: 1fr;
        border-radius: 18px;
    }
    .nm-director::before {
        right: 26px;
    }
    .nm-director__body {
        padding: 22px 16px 14px 18px;
        max-height: none;
        overflow: visible;
    }
    .nm-director__label { font-size: 14px; margin-bottom: 10px; }
    .nm-director__quote {
        font-size: 13.5px;
        line-height: 1.55;
        padding-left: 20px;
    }
    .nm-director__quote::before {
        font-size: 32px;
    }
    .nm-director__photo {
        width: 100%;
        height: 220px;
        object-position: center 20%;
    }

    /* Row 2 — single column, breathable */
    .nm-row-2 { padding: 26px 0 28px; }
    .nm-row-2__grid {
        padding: 0 18px;
        gap: 26px;
    }
    .nm-row-2 .nm-block-title {
        font-size: 18px;
        letter-spacing: 2px;
    }
    .nm-why li {
        padding: 6px 0 6px 38px;
        font-size: 15px;
    }
    .nm-why li::before {
        width: 22px; height: 22px; top: 7px;
        background-size: 14px 14px;
    }

    /* Impact: 3 cards side-by-side on phones (was 1 col) */
    .nm-impact-cards {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 8px;
    }
    .nm-icard {
        min-height: 130px;
        padding: 14px 6px;
        gap: 6px;
        border-radius: 12px;
    }
    .nm-icard__icon { width: 36px; height: 30px; }
    .nm-icard__icon svg { width: 26px; height: 26px; }
    .nm-icard__num { font-size: 22px; }
    .nm-icard--peach .nm-icard__num { font-size: 18px; }
    .nm-icard--teal .nm-icard__num { font-size: 18px; }
    .nm-icard__label { font-size: 10px; letter-spacing: 0; }

    /* Get Involved: keep 2x2 even on small screens */
    .nm-getinvolved-cards {
        grid-template-columns: 1fr 1fr;
        gap: 10px 8px;
    }
    .nm-gcard {
        min-height: 56px;
        padding: 0 10px;
        gap: 8px;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        border-radius: 12px;
    }
    .nm-gcard svg { width: 24px; height: 24px; }
    .nm-gcard__label { font-size: 12px; white-space: normal; }

    /* Footer band: smaller font */
    .nm-footer-band {
        font-size: 15px;
        padding: 16px 18px;
        line-height: 1.4;
    }
    .nm-footer-band::after {
        width: 90px; height: 6px; bottom: 9px;
    }
}

/* ============================================================
   TOP-NAV DROPDOWN (About Us submenu) — desktop only
   ============================================================ */
.nm-tophead__has-sub { position: relative; display: inline-block; }
.nm-tophead__has-sub > a .nm-caret {
    display: inline-block;
    margin-left: 4px;
    font-size: 10px;
    transition: transform 180ms ease;
}
.nm-tophead__sub {
    position: absolute;
    top: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%) translateY(-6px);
    min-width: 220px;
    padding: 10px 0;
    background: #fff;
    border: 1px solid rgba(157, 29, 69, 0.14);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(74, 17, 36, 0.14);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms ease, visibility 180ms;
    z-index: 90;
}
.nm-tophead__sub a {
    display: block;
    padding: 9px 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--nm-text);
    white-space: nowrap;
    transition: background 140ms ease, color 140ms ease;
}
.nm-tophead__sub a:hover { background: var(--nm-cream-soft); color: var(--nm-maroon); }
.nm-tophead__has-sub:hover > .nm-tophead__sub,
.nm-tophead__has-sub:focus-within > .nm-tophead__sub {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.nm-tophead__has-sub:hover > a .nm-caret,
.nm-tophead__has-sub:focus-within > a .nm-caret { transform: rotate(180deg); }

/* Hide submenu on tablet/mobile (drawer takes over) */
@media (max-width: 1100px) {
    .nm-tophead__has-sub > a .nm-caret { display: none; }
    .nm-tophead__sub { display: none; }
}

/* ============================================================
   INSIGHTS / BLOG — index page (.nm-insights-page) +
   single-post page (.nm-single-page)
   ============================================================ */
.nm-insights-page,
.nm-single-page { background: #ffffff; }

.nm-isect {
    padding: clamp(50px, 6vw, 90px) 0;
    background: var(--nm-cream-soft);
}
.nm-isect--related {
    background: #ffffff;
    padding: clamp(50px, 6vw, 80px) 0;
    border-top: 1px solid rgba(157,29,69,0.08);
}
.nm-isect__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-isect__head { text-align: center; margin-bottom: clamp(28px, 4vw, 44px); }
.nm-isect__empty {
    text-align: center;
    color: var(--nm-muted);
    padding: 40px 20px;
    font-size: 15px;
}

.nm-igrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.nm-icard-blog {
    background: #fff;
    border: 1px solid rgba(157, 29, 69, 0.13);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 220ms ease, box-shadow 220ms ease;
}
.nm-icard-blog:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(74,17,36,0.12);
}
.nm-icard-blog__cover {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--nm-cream-panel);
}
.nm-icard-blog__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 320ms ease;
}
.nm-icard-blog:hover .nm-icard-blog__cover img { transform: scale(1.04); }
.nm-icard-blog__placeholder {
    width: 100%;
    height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--nm-cream-panel) 0%, var(--nm-cream) 100%);
}
.nm-icard-blog__placeholder svg { width: 48px; height: 48px; fill: var(--nm-maroon); opacity: 0.35; }
.nm-icard-blog__body { padding: 22px 22px 24px; flex: 1; display: flex; flex-direction: column; }
.nm-icard-blog__date {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--nm-maroon);
    margin-bottom: 8px;
}
.nm-icard-blog__title {
    margin: 0 0 10px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(16px, 1.3vw, 19px);
    line-height: 1.3;
}
.nm-icard-blog__title a {
    color: var(--nm-brown);
    text-decoration: none;
    transition: color 150ms ease;
}
.nm-icard-blog__title a:hover { color: var(--nm-maroon); }
.nm-icard-blog__excerpt {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--nm-muted);
    flex: 1;
}
.nm-icard-blog__more {
    align-self: flex-start;
    font-size: 13px;
    font-weight: 700;
    color: var(--nm-maroon);
    text-decoration: none;
    border-bottom: 1.5px solid rgba(157,29,69,0.3);
    padding-bottom: 1px;
    transition: border-color 150ms ease;
}
.nm-icard-blog__more:hover { border-color: var(--nm-maroon); }

/* Single-post layout */
.nm-single { padding: clamp(40px, 5vw, 80px) 0; background: #ffffff; }
.nm-single__wrap {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-single__cover {
    margin-bottom: clamp(24px, 3vw, 40px);
    border-radius: 18px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: var(--nm-cream-panel);
}
.nm-single__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nm-single__body {
    font-size: clamp(16px, 1.1vw, 18px);
    line-height: 1.75;
    color: var(--nm-text);
}
.nm-single__body p { margin: 0 0 18px; }
.nm-single__body h2 {
    margin: 32px 0 14px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(22px, 2vw, 28px);
    color: var(--nm-brown);
}
.nm-single__body h3 {
    margin: 26px 0 10px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(18px, 1.5vw, 22px);
    color: var(--nm-maroon);
}
.nm-single__body a { color: var(--nm-maroon); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.nm-single__body a:hover { color: var(--nm-maroon-dark); }
.nm-single__body blockquote {
    margin: 24px 0;
    padding: 16px 22px;
    border-left: 4px solid var(--nm-maroon);
    background: var(--nm-cream-soft);
    border-radius: 0 12px 12px 0;
    font-style: italic;
    color: var(--nm-brown);
}
.nm-single__body ul, .nm-single__body ol { margin: 0 0 18px 22px; }
.nm-single__body li { margin-bottom: 6px; }
.nm-single__body img { max-width: 100%; height: auto; border-radius: 12px; margin: 16px 0; }
.nm-single__foot {
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid rgba(157,29,69,0.13);
}
.nm-single__back {
    font-size: 14px;
    font-weight: 700;
    color: var(--nm-maroon);
    text-decoration: none;
}
.nm-single__back:hover { text-decoration: underline; }
.nm-single__meta-sep { margin: 0 8px; opacity: 0.5; }
.nm-single__meta-cat { font-style: italic; color: var(--nm-maroon); }

@media (max-width: 1100px) {
    .nm-igrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 640px) {
    .nm-igrid { grid-template-columns: 1fr; gap: 18px; }
}

/* ============================================================
   WHY NOBLE MISSION — standalone page (.nm-why-page)
   ============================================================ */
.nm-why-page { background: #ffffff; }

.nm-wsect {
    padding: clamp(50px, 6vw, 90px) 0;
    background: var(--nm-cream-soft);
}
.nm-wsect__wrap {
    max-width: 940px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-wlist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.nm-wrow {
    background: #fff;
    border: 1px solid rgba(157, 29, 69, 0.13);
    border-radius: 18px;
    padding: 22px 26px;
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: center;
    gap: 22px;
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
.nm-wrow:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(74,17,36,0.10);
    border-color: rgba(157, 29, 69, 0.28);
}
.nm-wrow__num {
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 900;
    font-size: clamp(34px, 3.4vw, 52px);
    line-height: 1;
    color: var(--nm-maroon);
    opacity: 0.18;
    letter-spacing: -1px;
}
.nm-wrow__icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: var(--nm-maroon);
    display: flex; align-items: center; justify-content: center;
}
.nm-wrow__icon svg { width: 28px; height: 28px; fill: #fff; }
.nm-wrow__h {
    margin: 0;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(17px, 1.5vw, 22px);
    color: var(--nm-brown);
    line-height: 1.3;
}

@media (max-width: 640px) {
    .nm-wrow {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 14px;
        padding: 18px 18px;
    }
    .nm-wrow__num { display: none; }
    .nm-wrow__icon { width: 48px; height: 48px; }
    .nm-wrow__icon svg { width: 24px; height: 24px; }
}

/* ============================================================
   CONTACT PAGE — .nm-contact-page
   ============================================================ */
.nm-contact-page { background: #ffffff; }

.nm-csect {
    padding: clamp(50px, 6vw, 90px) 0;
    background: #ffffff;
}
.nm-csect__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.85fr);
    gap: clamp(28px, 5vw, 60px);
    align-items: start;
}
.nm-cform {
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.14);
    border-radius: 22px;
    padding: clamp(28px, 3.5vw, 44px);
}
.nm-cform__title {
    margin: 0 0 6px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(20px, 1.8vw, 26px);
    color: var(--nm-brown);
}
.nm-cform__sub {
    margin: 0 0 22px;
    font-size: 14.5px;
    color: var(--nm-muted);
    line-height: 1.55;
}
.nm-cform__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
.nm-cform__field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 14px;
}
.nm-cform__label {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--nm-muted);
    letter-spacing: 0.4px;
}
.nm-cform__input,
.nm-cform__textarea,
.nm-cform__select {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 14px;
    border: 1.5px solid rgba(157, 29, 69, 0.22);
    border-radius: 10px;
    background: #fff;
    font-size: 14.5px;
    color: var(--nm-text);
    font-family: inherit;
    outline: none;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}
.nm-cform__input:focus,
.nm-cform__textarea:focus,
.nm-cform__select:focus {
    border-color: var(--nm-maroon);
    box-shadow: 0 0 0 3px rgba(157, 29, 69, 0.1);
}
.nm-cform__textarea { resize: vertical; min-height: 128px; }
.nm-cform__btn {
    display: inline-block;
    padding: 13px 32px;
    background: var(--nm-maroon);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    transition: background 160ms ease, transform 160ms ease;
}
.nm-cform__btn:hover { background: var(--nm-maroon-dark); transform: translateY(-1px); }
.nm-cform__msg {
    margin-bottom: 18px;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
}
.nm-cform__msg--success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.nm-cform__msg--error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

/* Detail cards */
.nm-cdets { display: flex; flex-direction: column; gap: 14px; }
.nm-cdet {
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.13);
    border-radius: 16px;
    padding: 18px 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
.nm-cdet__icon {
    flex: 0 0 auto;
    width: 44px; height: 44px;
    border-radius: 12px;
    background: var(--nm-maroon);
    display: flex; align-items: center; justify-content: center;
}
.nm-cdet__icon svg { width: 20px; height: 20px; fill: #fff; }
.nm-cdet__label {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--nm-maroon);
    margin-bottom: 3px;
}
.nm-cdet__val {
    margin: 0;
    font-size: 14px;
    color: var(--nm-text);
    line-height: 1.65;
}
.nm-cdet__val a { color: var(--nm-maroon); font-weight: 600; }
.nm-cmap {
    background: var(--nm-cream-soft);
    border: 1px solid rgba(157, 29, 69, 0.13);
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    display: flex; align-items: center; justify-content: center;
    flex-direction: column;
    gap: 8px;
    color: var(--nm-muted);
    font-size: 14px;
    text-align: center;
    padding: 20px;
}
.nm-cmap svg { width: 36px; height: 36px; fill: var(--nm-maroon); opacity: 0.4; }

@media (max-width: 1100px) {
    .nm-csect__wrap { grid-template-columns: 1fr; }
    .nm-cdets { flex-direction: row; flex-wrap: wrap; }
    .nm-cdet { flex: 1 1 calc(50% - 7px); }
    .nm-cmap { aspect-ratio: 16 / 7; }
}
@media (max-width: 640px) {
    .nm-cform__row { grid-template-columns: 1fr; }
    .nm-cdets { flex-direction: column; }
    .nm-cdet { flex: 1 1 100%; }
}

/* ============================================================
   OUR OFFERINGS PAGE — .nm-offerings-page
   ============================================================ */
.nm-offerings-page { background: #ffffff; }

.nm-ohead {
    padding: clamp(30px, 4vw, 54px) 0;
    background: #ffffff;
    border-bottom: 1px solid rgba(157,29,69,0.08);
}
.nm-ohead__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
    text-align: center;
}
.nm-ohead__intro {
    max-width: 740px;
    margin: 0 auto;
    font-size: clamp(15px, 1.1vw, 17px);
    color: var(--nm-muted);
    line-height: 1.65;
}
.nm-osect {
    padding: clamp(40px, 5vw, 72px) 0;
    background: var(--nm-cream-soft);
}
.nm-osect__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-osgrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}
.nm-ocard {
    background: #fff;
    border: 1px solid rgba(157, 29, 69, 0.13);
    border-radius: 20px;
    padding: 26px 24px;
    display: flex;
    flex-direction: row;
    gap: 18px;
    align-items: flex-start;
    transition: transform 200ms ease, box-shadow 200ms ease;
}
.nm-ocard:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 40px rgba(74,17,36,0.09);
}
.nm-ocard__icon {
    flex: 0 0 auto;
    width: 68px; height: 68px;
    border-radius: 14px;
    overflow: hidden;
    background: var(--nm-cream-panel);
    display: flex; align-items: center; justify-content: center;
}
.nm-ocard__icon img { width: 100%; height: 100%; object-fit: contain; display: block; }
.nm-ocard__icon svg { width: 36px; height: 36px; fill: var(--nm-maroon); }
.nm-ocard__body { flex: 1; min-width: 0; }
.nm-ocard__h {
    margin: 0 0 7px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(15px, 1.15vw, 17px);
    color: var(--nm-brown);
    line-height: 1.25;
}
.nm-ocard__body p {
    margin: 0 0 8px;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--nm-muted);
}
.nm-ocard__body p:last-of-type { margin-bottom: 0; }
.nm-ocard__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}
.nm-ocard__tag {
    font-size: 11.5px;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(157, 29, 69, 0.08);
    color: var(--nm-maroon);
}
.nm-ocard__link {
    display: inline-block;
    margin-top: 10px;
    font-size: 13px;
    font-weight: 700;
    color: var(--nm-maroon);
    text-decoration: none;
    border-bottom: 1.5px solid rgba(157,29,69,0.3);
    padding-bottom: 1px;
    transition: border-color 150ms ease;
}
.nm-ocard__link:hover { border-color: var(--nm-maroon); }

@media (max-width: 1100px) {
    .nm-osgrid { gap: 16px; }
}
@media (max-width: 640px) {
    .nm-osgrid { grid-template-columns: 1fr; }
    .nm-ocard { gap: 14px; }
    .nm-ocard__icon { width: 58px; height: 58px; }
}

/* ============================================================
   MISSION & VISION — standalone page (.nm-mv-page)
   ============================================================ */
.nm-mv-page { background: var(--nm-cream-soft); }

.nm-smv {
    padding: clamp(60px, 7vw, 100px) 0;
    background: var(--nm-cream-soft);
}
.nm-smv__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px);
}
.nm-smv__cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}
.nm-smv__card {
    border-radius: 28px;
    padding: clamp(36px, 4.5vw, 60px);
    color: #fff;
    box-shadow: 0 20px 60px rgba(74, 17, 36, 0.15);
    position: relative;
    overflow: hidden;
}
.nm-smv__card::before {
    content: "";
    position: absolute;
    top: -40px; right: -40px;
    width: 200px; height: 200px;
    border-radius: 50%;
    background: rgba(255,255,255,0.07);
    pointer-events: none;
}
.nm-smv__card--mission { background: linear-gradient(145deg, #c04768 0%, #7e2440 100%); }
.nm-smv__card--vision  { background: linear-gradient(145deg, #5b9295 0%, #2f5e62 100%); }
.nm-smv__icon {
    width: 68px; height: 68px;
    border-radius: 999px;
    background: rgba(255,255,255,0.2);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 20px;
}
.nm-smv__icon svg { width: 36px; height: 36px; fill: #fff; }
.nm-smv__label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.75);
    margin-bottom: 8px;
}
.nm-smv__h {
    margin: 0 0 16px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-weight: 900;
    font-size: clamp(28px, 2.5vw, 38px);
    color: #fff;
    line-height: 1.1;
}
.nm-smv__card p {
    color: rgba(255,255,255,0.92);
    font-size: clamp(15px, 1.15vw, 17.5px);
    line-height: 1.7;
    margin: 0;
}
.nm-smv__belief {
    margin-top: clamp(28px, 3.5vw, 44px);
    padding: clamp(24px, 3vw, 36px) clamp(28px, 4vw, 48px);
    background: #fff;
    border: 1px solid rgba(157, 29, 69, 0.14);
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: clamp(14px, 2vw, 28px);
    box-shadow: 0 4px 20px rgba(74,17,36,0.06);
}
.nm-smv__belief-icon {
    flex: 0 0 auto;
    width: 54px; height: 54px;
    border-radius: 999px;
    background: var(--nm-maroon);
    display: flex; align-items: center; justify-content: center;
}
.nm-smv__belief-icon svg { width: 28px; height: 28px; fill: #fff; }
.nm-smv__belief-text {
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: clamp(15px, 1.25vw, 18px);
    font-weight: 600;
    color: var(--nm-brown);
    line-height: 1.55;
    margin: 0;
}
.nm-smv__belief-text em { font-style: italic; color: var(--nm-maroon); font-weight: 700; }

/* Mission+Vision page responsive */
@media (max-width: 1100px) {
    .nm-smv__cards { grid-template-columns: 1fr; gap: 22px; }
}
@media (max-width: 640px) {
    .nm-smv__belief { flex-direction: column; text-align: center; }
    .nm-smv__card { padding: 28px 22px; }
}

/* ============================================================
   CORE VALUES — standalone page (.nm-cv-page)
   ============================================================ */
.nm-cv-page .nm-acv {
    padding: clamp(60px, 7vw, 100px) 0;
    background: var(--nm-cream-soft);
}
.nm-cv-page .nm-acv__wrap { max-width: 1180px; }
.nm-cv-page .nm-vcard {
    padding: 30px 22px 26px;
    background: #fff;
}
.nm-cv-page .nm-vcard:hover { background: var(--nm-cream-soft); }
.nm-cv-page .nm-vcard__h { font-size: 17px; }
.nm-cv-page .nm-vcard p  { font-size: 14.5px; }

@media (max-width: 640px) {
    .nm-cv-page .nm-acv__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   GLOBAL FOOTER (.nm-gfooter) — shows on every page
   ============================================================ */
.nm-gfooter {
    background: linear-gradient(180deg, #7e2440 0%, #40171f 100%);
    color: #f2e5cd;
    padding: clamp(40px, 5vw, 64px) 0 0;
    margin-top: 0;
}
.nm-gfooter__top {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 32px) clamp(28px, 4vw, 44px);
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: clamp(24px, 3.5vw, 48px);
}
.nm-gfooter__brand { max-width: 320px; }
.nm-gfooter__logo {
    display: inline-block;
    background: #fff;
    padding: 10px 14px;
    border-radius: 10px;
    margin-bottom: 14px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
.nm-gfooter__logo img {
    height: 48px;
    width: auto;
    display: block;
}
.nm-gfooter__about {
    margin: 0 0 16px;
    font-size: 13.5px;
    line-height: 1.6;
    color: #f2e5cd;
    opacity: 0.88;
}
.nm-gfooter__social { display: flex; gap: 10px; }
.nm-gfooter__social a {
    width: 34px; height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.3);
    color: #f2e5cd;
    display: flex; align-items: center; justify-content: center;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
.nm-gfooter__social a svg { width: 15px; height: 15px; }
.nm-gfooter__social a:hover {
    background: var(--nm-orange);
    border-color: var(--nm-orange);
    color: #40171f;
    transform: translateY(-2px);
}

.nm-gfooter__h {
    margin: 0 0 14px;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #f6a42b;
}
.nm-gfooter__col ul { list-style: none; margin: 0; padding: 0; }
.nm-gfooter__col li { margin-bottom: 8px; }
.nm-gfooter__col a {
    font-size: 14px;
    color: #f2e5cd;
    text-decoration: none;
    opacity: 0.88;
    transition: opacity 140ms ease, color 140ms ease;
}
.nm-gfooter__col a:hover { opacity: 1; color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.nm-gfooter__line {
    margin: 0 0 12px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13.5px;
    line-height: 1.55;
    color: #f2e5cd;
}
.nm-gfooter__line svg {
    flex: 0 0 auto;
    width: 16px; height: 16px;
    fill: #f6a42b;
    margin-top: 3px;
}
.nm-gfooter__line a { color: #f2e5cd; text-decoration: none; }
.nm-gfooter__line a:hover { color: #fff; text-decoration: underline; }

.nm-gfooter__bot {
    border-top: 1px solid rgba(255,255,255,0.13);
    padding: 18px clamp(18px, 4vw, 32px);
    max-width: 1180px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
.nm-gfooter__copy { margin: 0; font-size: 12.5px; color: rgba(242,229,205,0.75); }
.nm-gfooter__tag  { margin: 0; font-size: 12.5px; color: #f6a42b; font-style: italic; }

/* Scroll-top floating button */
.nm-scroll-top {
    position: fixed;
    right: 22px;
    bottom: 22px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--nm-maroon);
    color: #fff;
    border: 0;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 180ms ease, transform 180ms ease, visibility 180ms, background 160ms;
    box-shadow: 0 12px 30px rgba(0,0,0,0.25);
    z-index: 80;
}
.nm-scroll-top svg { width: 20px; height: 20px; }
.nm-scroll-top:hover { background: var(--nm-maroon-dark); }
.nm-scroll-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }

@media (max-width: 1100px) {
    .nm-gfooter__top { grid-template-columns: 1fr 1fr; gap: 32px; }
    .nm-gfooter__brand { grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 640px) {
    .nm-gfooter__top { grid-template-columns: 1fr; gap: 28px; }
    .nm-gfooter__bot { flex-direction: column; text-align: center; }
    .nm-scroll-top { right: 14px; bottom: 14px; width: 40px; height: 40px; }
}