/* ==========================================================================
   rs-megamenu.css — desktop megamenu (Services / Insights / About Us)
   Markup lives in includes/navbar-global.php; every class is prefixed .rsm-
   so nothing in bundle.css (old .rs-megamenu-* rules) applies. The panel keeps
   the legacy .megamenu class only for the open/close mechanics (JS toggles
   .megamenu-active on the <li>).
   ========================================================================== */

.rsm-panel {
    --rsm-ink: #0a1f4d;
    --rsm-body: #5b6478;
    --rsm-blue: #0b2dbe;
    --rsm-line: #e3e7f1;
    --rsm-font: "Helvetica Neue", "Inter", Helvetica, Arial, sans-serif;
    --rsm-ease: cubic-bezier(.2, .65, .2, 1);
}

/* ---------- panel shell ---------- */
ul.main-menu-list li .megamenu.rsm-panel {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    max-height: calc(100vh - 110px);
    margin: 0;
    padding: 0;
    overflow-y: auto;
    background: #fff;
    border-top: 1px solid var(--rsm-line);
    box-shadow: 0 28px 48px -24px rgba(10, 18, 48, .22);
    font-family: var(--rsm-font);
    color: var(--rsm-ink);
    text-align: left;
    cursor: default;
}

/* left edge lines up with the logo, right edge with the Get In Touch button */
.main-menu-list .rsm-panel .rsm-inner {
    width: 100%;
    padding: clamp(24px, 2.6vw, 44px) 12px clamp(24px, 2.2vw, 38px) 37px;
    box-sizing: border-box;
}

/* ---------- reset the legacy nav rules inside the panel ---------- */
.main-menu-list .rsm-panel a {
    display: inline-flex;
    gap: 0;
    align-items: normal;
    line-height: inherit;
    color: var(--rsm-ink);
    text-decoration: none;
}

.main-menu-list .rsm-panel p {
    margin: 0;
    padding: 0;
    font-family: var(--rsm-font);
}

/* ---------- grids ---------- */
.main-menu-list .rsm-panel .rsm-grid {
    display: grid;
    align-items: stretch;
}

.main-menu-list .rsm-panel .rsm-grid--services {
    grid-template-columns: minmax(0, 43fr) minmax(0, 57fr);
    gap: clamp(20px, 1.6vw, 30px);
}

.main-menu-list .rsm-panel .rsm-grid--insights {
    grid-template-columns: minmax(0, 64fr) minmax(0, 32fr);
    gap: clamp(28px, 4vw, 76px);
}

.main-menu-list .rsm-panel .rsm-grid--about {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(28px, 3.6vw, 68px);
}

.main-menu-list .rsm-panel .rsm-col {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Services: two lists with a hairline between them, "View all" under them */
.main-menu-list .rsm-panel .rsm-lists {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: 1fr auto;
    column-gap: clamp(36px, 4.4vw, 76px);
    position: relative;
    min-width: 0;
}

.main-menu-list .rsm-panel .rsm-lists::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: var(--rsm-line);
}

.main-menu-list .rsm-panel .rsm-lists .rsm-viewall {
    grid-column: 1;
}

/* ---------- headings ---------- */
.main-menu-list .rsm-panel .rsm-heading {
    display: block;
    margin: 0 0 clamp(12px, 1.3vw, 22px);
    font-size: clamp(22px, 1.75vw, 32px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -.01em;
    color: var(--rsm-ink);
}

/* ---------- list rows ---------- */
.main-menu-list .rsm-panel .rsm-rows {
    display: flex;
    flex-direction: column;
}

.main-menu-list .rsm-panel a.rsm-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: clamp(11px, 1vw, 18px) 0;
    border-bottom: 1px solid var(--rsm-line);
    color: var(--rsm-ink);
    transition: color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-ic {
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    margin-left: 6px;
}

.main-menu-list .rsm-panel .rsm-row-label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: clamp(14.5px, 1.1vw, 20px);
    line-height: 1.3;
}

.main-menu-list .rsm-panel .rsm-chev {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-right: 12px;
    transition: transform .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-row:hover,
.main-menu-list .rsm-panel a.rsm-row:focus-visible {
    color: var(--rsm-blue);
    outline: none;
}

.main-menu-list .rsm-panel a.rsm-row:hover .rsm-chev {
    transform: translateX(3px);
}

/* ---------- arrow links ---------- */
.main-menu-list .rsm-panel .rsm-arrow {
    flex: 0 0 auto;
    width: 24px;
    height: 12px;
    transition: transform .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-viewall {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 16px;
    margin-top: auto;
    padding-top: clamp(16px, 1.6vw, 28px);
    font-size: clamp(15px, 1.1vw, 20px);
    font-weight: 500;
    line-height: 1.2;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel a.rsm-viewall:hover,
.main-menu-list .rsm-panel a.rsm-viewall:focus-visible {
    color: var(--rsm-blue);
    outline: none;
}

.main-menu-list .rsm-panel a.rsm-viewall:hover .rsm-arrow,
.main-menu-list .rsm-panel a:hover .rsm-more .rsm-arrow {
    transform: translateX(4px);
}

/* ---------- Services: the blue panel ---------- */
.main-menu-list .rsm-panel .rsm-blue {
    display: grid;
    grid-template-columns: minmax(0, 61fr) minmax(0, 39fr);
    min-width: 0;
    border-radius: 8px;
    overflow: hidden;
    background: linear-gradient(120deg, #0b2dbe 0%, #1a45d6 58%, #2a5ae8 100%);
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-blue-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    padding: clamp(20px, 2vw, 36px);
}

.main-menu-list .rsm-panel .rsm-blue-title {
    display: block;
    margin-bottom: clamp(10px, .9vw, 16px);
    font-size: clamp(21px, 1.75vw, 32px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -.01em;
    color: #fff;
}

.main-menu-list .rsm-panel p.rsm-blue-text {
    margin-bottom: clamp(12px, 1.2vw, 22px);
    font-size: clamp(13px, .95vw, 17px);
    line-height: 1.5;
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-pills {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(7px, .65vw, 12px);
    margin-bottom: clamp(14px, 1.5vw, 28px);
}

.main-menu-list .rsm-panel a.rsm-pill {
    display: inline-flex;
    padding: clamp(6px, .5vw, 9px) clamp(12px, 1vw, 19px);
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    font-size: clamp(12.5px, .86vw, 15.5px);
    font-weight: 500;
    line-height: 1.25;
    color: #fff;
    white-space: nowrap;
    transition: background-color .2s var(--rsm-ease), color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-pill:hover,
.main-menu-list .rsm-panel a.rsm-pill:focus-visible {
    background: #fff;
    color: var(--rsm-blue);
    outline: none;
}

.main-menu-list .rsm-panel a.rsm-blue-btn {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    padding: clamp(11px, .9vw, 16px) clamp(20px, 1.7vw, 32px);
    border-radius: 999px;
    background: #fff;
    font-size: clamp(12px, .82vw, 15px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--rsm-blue);
}

.main-menu-list .rsm-panel a.rsm-blue-btn .rsm-chev {
    margin: 0;
    width: 13px;
    height: 13px;
}

.main-menu-list .rsm-panel a.rsm-blue-btn:hover .rsm-chev {
    transform: translateX(3px);
}

.main-menu-list .rsm-panel a.rsm-blue-report {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    padding: clamp(20px, 2vw, 36px) clamp(18px, 1.9vw, 36px);
    background: rgba(255, 255, 255, .05);
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-report-img {
    display: block;
    width: 100%;
    aspect-ratio: 1.92;
    margin-bottom: clamp(12px, 1.5vw, 28px);
    overflow: hidden;
    border-radius: 6px;
    background: #fff;
}

.main-menu-list .rsm-panel .rsm-report-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .5s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-blue-report:hover .rsm-report-img img {
    transform: scale(1.04);
}

.main-menu-list .rsm-panel .rsm-report-title {
    display: block;
    margin-bottom: clamp(10px, 1.2vw, 22px);
    font-size: clamp(16px, 1.45vw, 26px);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -.01em;
    color: #fff;
}

/* ---------- eyebrow + arrow link ---------- */
.main-menu-list .rsm-panel .rsm-eyebrow {
    display: inline-block;
    margin-bottom: clamp(8px, .9vw, 16px);
    padding-bottom: 6px;
    border-bottom: 1px solid currentColor;
    font-size: clamp(11px, .78vw, 14px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--rsm-blue);
}

.main-menu-list .rsm-panel .rsm-eyebrow--light {
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-more {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    font-size: clamp(14px, 1.05vw, 19px);
    font-weight: 500;
    line-height: 1.2;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-more--light {
    color: #fff;
}

/* ---------- Insights: image cards ---------- */
.main-menu-list .rsm-panel .rsm-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 4.4vw, 84px);
}

.main-menu-list .rsm-panel a.rsm-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-card-img {
    display: block;
    width: 100%;
    aspect-ratio: 1.6;
    margin-bottom: clamp(12px, 1.1vw, 20px);
    overflow: hidden;
    border-radius: 6px;
    background: #eef1f7;
}

.main-menu-list .rsm-panel .rsm-card-img img,
.main-menu-list .rsm-panel .rsm-feature-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-card:hover .rsm-card-img img,
.main-menu-list .rsm-panel a.rsm-feature:hover .rsm-feature-img img {
    transform: scale(1.04);
}

.main-menu-list .rsm-panel .rsm-card-tag {
    display: block;
    margin-bottom: 10px;
    font-size: clamp(11px, .72vw, 13px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-card-title {
    display: block;
    font-size: clamp(15px, 1.1vw, 20px);
    font-weight: 500;
    line-height: 1.32;
    letter-spacing: -.005em;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel a.rsm-card:hover .rsm-card-title {
    color: var(--rsm-blue);
}

/* ---------- About: feature ---------- */
.main-menu-list .rsm-panel a.rsm-feature {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: flex-start;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-feature-img {
    display: block;
    width: 100%;
    aspect-ratio: 3.28;
    margin-bottom: clamp(12px, 1.1vw, 20px);
    overflow: hidden;
    border-radius: 2px;
    background: #0b2dbe;
}

.main-menu-list .rsm-panel .rsm-feature-img img {
    object-position: 50% 50%;
}

.main-menu-list .rsm-panel .rsm-feature-title {
    display: block;
    margin-bottom: clamp(8px, .8vw, 14px);
    font-size: clamp(17px, 1.45vw, 26px);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -.01em;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-feature-text {
    display: block;
    margin-bottom: clamp(12px, 1.2vw, 22px);
    font-size: clamp(13px, .98vw, 17px);
    line-height: 1.55;
    color: var(--rsm-body);
}

/* ---------- open animation: the grid eases in just after the panel ---------- */
.main-menu-list .rsm-panel .rsm-inner {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .22s var(--rsm-ease), transform .28s var(--rsm-ease);
}

ul.main-menu-list li.menu-item-children.megamenu-active > .megamenu.rsm-panel .rsm-inner {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .04s;
}

/* ---------- responsive ---------- */
@media (max-width: 1280px) {
    .main-menu-list .rsm-panel .rsm-grid--services {
        grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
    }

    .main-menu-list .rsm-panel .rsm-lists {
        column-gap: 28px;
    }

    .main-menu-list .rsm-panel .rsm-ic {
        margin-left: 2px;
    }

    .main-menu-list .rsm-panel .rsm-chev {
        margin-right: 4px;
    }
}

@media (max-width: 1024px) {
    /* the desktop nav is collapsed; the mobile drawer carries the links */
    ul.main-menu-list li .megamenu.rsm-panel {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel .rsm-inner,
    .main-menu-list .rsm-panel img,
    .main-menu-list .rsm-panel svg {
        transition: none;
    }
}

/* Insights cards (2026-11-06): 16:9 frames so the blog banner shows uncut and the reports collage keeps its titles */
.main-menu-list .rsm-panel .rsm-card-img {
    aspect-ratio: 16 / 9;
}

.main-menu-list .rsm-panel .rsm-card-img img {
    object-position: 50% 50%;
}

/* ---------- About Us panel, refined (2026-11-06): each link has a short line under it; pointing at a
   row gives it a light tint, a blue edge on the left, nudges the text in and turns it blue ---------- */
.main-menu-list .rsm-panel a.rsm-row--desc {
    position: relative;
    align-items: center;
    padding: clamp(10px, .9vw, 14px) 0;
    transition: color .2s var(--rsm-ease), background-color .25s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-row--desc::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: -1px;
    left: 0;
    width: 2px;
    background: var(--rsm-blue);
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform .3s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-row--desc .rsm-row-label {
    display: flex;
    flex-direction: column;
    gap: 3px;
    transition: transform .25s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-row-desc {
    font-size: clamp(12.5px, .85vw, 14px);
    font-weight: 400;
    line-height: 1.4;
    color: #6b7690;
    transition: color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-row--desc:hover,
.main-menu-list .rsm-panel a.rsm-row--desc:focus-visible {
    background: #f5f7fd;
}

.main-menu-list .rsm-panel a.rsm-row--desc:hover::before,
.main-menu-list .rsm-panel a.rsm-row--desc:focus-visible::before {
    transform: scaleY(1);
}

.main-menu-list .rsm-panel a.rsm-row--desc:hover .rsm-row-label,
.main-menu-list .rsm-panel a.rsm-row--desc:focus-visible .rsm-row-label {
    transform: translateX(14px);
}

.main-menu-list .rsm-panel a.rsm-row--desc:hover .rsm-row-desc {
    color: #4a5568;
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel a.rsm-row--desc::before,
    .main-menu-list .rsm-panel a.rsm-row--desc .rsm-row-label {
        transition: none;
    }
}

/* ---------- language switch (English <-> Arabic), header and mobile menu (2026-11-06) ---------- */
.main-menu-right .rs-lang {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 46px;
    margin-inline-end: 10px;
    padding: 0 14px;
    border: 1px solid transparent;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: border-color .25s ease, color .25s ease;
}

.main-menu-right .rs-lang svg {
    width: 18px;
    height: 18px;
}

.main-menu-right .rs-lang:hover,
.main-menu-right .rs-lang:focus-visible {
    border-color: rgba(255, 255, 255, .55);
    color: #fff;
}

.main-header.is-scrolled .main-menu-right .rs-lang,
.main-header.white-bg .main-menu-right .rs-lang {
    color: #0a1230;
}

.main-header.is-scrolled .main-menu-right .rs-lang:hover,
.main-header.white-bg .main-menu-right .rs-lang:hover {
    border-color: #cfd6e4;
    color: #0b2dbe;
}

.rs-mnav__bar .rs-lang {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 42px;
    margin-inline-start: auto;
    margin-inline-end: 10px;
    padding: 0 12px;
    border: 1px solid #cfd6e4;
    color: #0a1230;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.rs-mnav__bar .rs-lang svg {
    width: 17px;
    height: 17px;
}

@media (max-width: 1199px) {
    .main-menu-right .rs-lang {
        display: none;
    }
}

/* the switch shows a short code (AR / EN) */
.rs-lang span {
    font-family: "Helvetica Neue", "Inter", Helvetica, Arial, sans-serif;
    font-weight: 600;
    letter-spacing: .06em;
}

/* AR switch, compact (2026-11-06): no globe, a 46px square with the two letters on a fine outline,
   tucked beside Book a Valuation instead of floating in its own wide slot */
.main-menu-right .rs-lang {
    justify-content: center;
    width: 46px;
    gap: 0;
    margin-inline-end: 8px;
    padding: 0;
    border-color: rgba(255, 255, 255, .32);
    font-size: 14px;
    letter-spacing: .04em;
}

.main-menu-right .rs-lang svg {
    display: none;
}

.main-header.is-scrolled .main-menu-right .rs-lang,
.main-header.white-bg .main-menu-right .rs-lang {
    border-color: #d9dfeb;
}

/* ---------- Insights card: a moving brand abstract (2026-11-09) ----------
   The blog card shows the brand's ribbon artwork drifting slowly, two soft glows travelling across it
   and a light sweeping over it every few seconds. Transform and opacity only, so it costs nothing
   while the menu is closed. */
.main-menu-list .rsm-panel .rsm-card-img--live {
    position: relative;
    isolation: isolate;
    background: #0a2fb0;
}

.main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__base {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: none;
    transform-origin: 60% 40%;
    animation: rsmLiveBase 18s ease-in-out infinite alternate;
    will-change: transform;
}

.main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__glow {
    position: absolute;
    z-index: 1;
    top: -35%;
    left: -20%;
    width: 75%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(150, 195, 255, .62) 0%, rgba(96, 150, 255, .24) 38%, rgba(96, 150, 255, 0) 70%);
    mix-blend-mode: screen;
    animation: rsmLiveGlowA 13s ease-in-out infinite;
    will-change: transform;
    pointer-events: none;
}

.main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__glow--b {
    top: auto;
    left: auto;
    right: -25%;
    bottom: -45%;
    width: 65%;
    background: radial-gradient(circle, rgba(225, 236, 255, .5) 0%, rgba(140, 180, 255, .18) 40%, rgba(140, 180, 255, 0) 70%);
    animation: rsmLiveGlowB 17s ease-in-out infinite;
}

.main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__sheen {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(110deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, .34) 47%, rgba(255, 255, 255, .08) 55%, rgba(255, 255, 255, 0) 68%);
    transform: translateX(-120%);
    animation: rsmLiveSheen 6.5s cubic-bezier(.45, 0, .2, 1) infinite;
    pointer-events: none;
}

.main-menu-list .rsm-panel .rsm-card--blogs:hover .rsm-card-img--live .rsm-live__glow {
    animation-duration: 8s;
}

@keyframes rsmLiveBase {
    0% { transform: scale(1.2) translate3d(-3%, -2.5%, 0) rotate(-1.5deg); }
    100% { transform: scale(1.34) translate3d(3%, 2.5%, 0) rotate(1.5deg); }
}

@keyframes rsmLiveGlowA {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    33% { transform: translate3d(85%, 30%, 0) scale(1.15); }
    66% { transform: translate3d(35%, 75%, 0) scale(.9); }
}

@keyframes rsmLiveGlowB {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    40% { transform: translate3d(-90%, -45%, 0) scale(1.2); }
    75% { transform: translate3d(-30%, -80%, 0) scale(.85); }
}

@keyframes rsmLiveSheen {
    0%, 45% { transform: translateX(-120%); }
    85%, 100% { transform: translateX(120%); }
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__base,
    .main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__glow,
    .main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__sheen {
        animation: none;
    }

    .main-menu-list .rsm-panel .rsm-card-img--live .rsm-live__base {
        transform: scale(1.2);
    }
}


/* ---------- Insights blog card: latest articles (2026-11-09) ----------
   The card is a <div>: the headlines on the frosted panel link to their posts and the label and title
   below link to the blog listing. The three newest posts take turns (6s each, 18s cycle) with a thin
   progress bar per post; pointing at the card pauses the cycle so a headline can be clicked. */
.main-menu-list .rsm-panel .rsm-card--blogs {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-card--blogs .rsm-card-link {
    display: block;
    color: var(--rsm-ink);
    text-decoration: none;
}

.main-menu-list .rsm-panel .rsm-card--blogs .rsm-card-link:hover .rsm-card-title,
.main-menu-list .rsm-panel .rsm-card--blogs .rsm-card-link:focus-visible .rsm-card-title {
    color: var(--rsm-blue);
}

.main-menu-list .rsm-panel .rsm-feed {
    position: absolute;
    z-index: 3;
    left: 12px;
    right: 12px;
    bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 13px 16px 14px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 5px;
    background: rgba(6, 20, 88, .36);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
    box-shadow: 0 18px 36px -24px rgba(2, 8, 40, .7);
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-feed__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.main-menu-list .rsm-panel .rsm-feed__kicker {
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .82);
}

.main-menu-list .rsm-panel .rsm-feed__bars {
    display: flex;
    gap: 4px;
}

.main-menu-list .rsm-panel .rsm-feed__bars i {
    position: relative;
    display: block;
    width: 18px;
    height: 2px;
    overflow: hidden;
    background: rgba(255, 255, 255, .28);
}

.main-menu-list .rsm-panel .rsm-feed__bars i::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #fff;
    transform: scaleX(0);
    transform-origin: 0 50%;
    animation: 18s linear infinite;
}

.main-menu-list .rsm-panel .rsm-feed__bars i:nth-child(1)::after { animation-name: rsmFeedBar1; }
.main-menu-list .rsm-panel .rsm-feed__bars i:nth-child(2)::after { animation-name: rsmFeedBar2; }
.main-menu-list .rsm-panel .rsm-feed__bars i:nth-child(3)::after { animation-name: rsmFeedBar3; }

/* all headlines share one grid cell, so the panel is as tall as the longest */
.main-menu-list .rsm-panel .rsm-feed__items {
    display: grid;
}

.main-menu-list .rsm-panel .rsm-feed__item {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    color: #fff;
    text-decoration: none;
    opacity: 0;
    visibility: hidden;
    animation: 18s ease infinite;
}

.main-menu-list .rsm-panel .rsm-feed__item:nth-child(1) { animation-name: rsmFeedItem1; }
.main-menu-list .rsm-panel .rsm-feed__item:nth-child(2) { animation-name: rsmFeedItem2; }
.main-menu-list .rsm-panel .rsm-feed__item:nth-child(3) { animation-name: rsmFeedItem3; }

.main-menu-list .rsm-panel .rsm-feed__date {
    font-size: 11px;
    line-height: 1.3;
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .72);
}

.main-menu-list .rsm-panel .rsm-feed__title {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: clamp(13px, .95vw, 16px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.005em;
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-feed__item:hover .rsm-feed__title,
.main-menu-list .rsm-panel .rsm-feed__item:focus-visible .rsm-feed__title {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.main-menu-list .rsm-panel .rsm-card--blogs:hover .rsm-feed *,
.main-menu-list .rsm-panel .rsm-card--blogs:hover .rsm-feed *::after,
.main-menu-list .rsm-panel .rsm-card--blogs:focus-within .rsm-feed *,
.main-menu-list .rsm-panel .rsm-card--blogs:focus-within .rsm-feed *::after {
    animation-play-state: paused;
}

@keyframes rsmFeedItem1 {
    0% { opacity: 0; visibility: visible; transform: translate3d(0, 6px, 0); }
    3%, 30% { opacity: 1; visibility: visible; transform: none; }
    33.33%, 100% { opacity: 0; visibility: hidden; transform: translate3d(0, -4px, 0); }
}

@keyframes rsmFeedItem2 {
    0%, 33.33% { opacity: 0; visibility: hidden; transform: translate3d(0, 6px, 0); }
    36.33%, 63.33% { opacity: 1; visibility: visible; transform: none; }
    66.67%, 100% { opacity: 0; visibility: hidden; transform: translate3d(0, -4px, 0); }
}

@keyframes rsmFeedItem3 {
    0%, 66.67% { opacity: 0; visibility: hidden; transform: translate3d(0, 6px, 0); }
    69.67%, 96.67% { opacity: 1; visibility: visible; transform: none; }
    100% { opacity: 0; visibility: hidden; transform: translate3d(0, -4px, 0); }
}

@keyframes rsmFeedBar1 {
    0% { transform: scaleX(0); }
    33.33%, 100% { transform: scaleX(1); }
}

@keyframes rsmFeedBar2 {
    0%, 33.33% { transform: scaleX(0); }
    66.67%, 100% { transform: scaleX(1); }
}

@keyframes rsmFeedBar3 {
    0%, 66.67% { transform: scaleX(0); }
    100% { transform: scaleX(1); }
}

/* fewer than three posts, or reduced motion: the newest one, still */
.main-menu-list .rsm-panel .rsm-feed--static .rsm-feed__item,
.main-menu-list .rsm-panel .rsm-feed--static .rsm-feed__bars i::after {
    animation: none;
}

.main-menu-list .rsm-panel .rsm-feed--static .rsm-feed__item:first-child {
    opacity: 1;
    visibility: visible;
}

.main-menu-list .rsm-panel .rsm-feed--static .rsm-feed__bars {
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel .rsm-feed__item,
    .main-menu-list .rsm-panel .rsm-feed__bars i::after {
        animation: none;
    }

    .main-menu-list .rsm-panel .rsm-feed__item:first-child {
        opacity: 1;
        visibility: visible;
    }

    .main-menu-list .rsm-panel .rsm-feed__bars {
        display: none;
    }
}

/* ---------- one height for every panel (2026-11-10) ----------
   Services, Insights and About Us open to the same height, so the panel no longer jumps when the
   pointer moves between them. The height follows Services, the tallest list, across desktop widths
   with a little room to spare: clamp(400px, 74px + 25.4vw, 572px) is 11-23px above Services' own
   height everywhere from 1200px to 2560px (measured 2026-11-10; re-measure if a panel gains rows).
   The other panels fill it: their card pictures take the height that is left. */
.main-menu-list .rsm-panel .rsm-grid--services,
.main-menu-list .rsm-panel .rsm-grid--insights,
.main-menu-list .rsm-panel .rsm-grid--about6,
.main-menu-list .rsm-panel .rsm-grid--about7,
.main-menu-list .rsm-panel .rsm-grid--about9 {
    min-height: clamp(400px, calc(74px + 25.4vw), 572px);
}

.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) .rsm-card-img {
    flex: 1 1 0;
    aspect-ratio: auto;
    min-height: clamp(140px, 11vw, 220px);
}

/* ---------- Insights and About Us on one grid (2026-11-10) ----------
   Both panels: two picture cards on the left, a list on the right. The two columns share four rows
   (subgrid): the headings, the pictures and two caption rows. So the right column lines up with the
   cards: its list starts level with the top of the pictures. Insights: "View all" ends level with the
   foot of the pictures and the newest report sits on the caption rows as a third caption. About Us:
   six rows fill the picture row and "View all" sits on the card names' line. The pictures take the
   height that is left in the panel. */
.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) {
    grid-template-columns: minmax(0, 64fr) minmax(0, 32fr);
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    gap: 0 clamp(28px, 4vw, 76px);
}

.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) > .rsm-col {
    display: grid;
    grid-row: 1 / -1;
    grid-template-rows: subgrid;
}

/* every item sits in the column's one track (an item given only a row would otherwise open a second
   column beside the item already in that row) */
.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) > .rsm-col > * {
    grid-column: 1;
}

/* the subgrids keep the parent's zero row gap (the cards' own gap would push the captions down) */
.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) .rsm-cards {
    grid-row: 2 / -1;
    grid-template-rows: subgrid;
    row-gap: 0;
}

.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) a.rsm-card,
.main-menu-list .rsm-panel .rsm-grid--insights .rsm-card--blogs {
    display: grid;
    grid-row: 1 / -1;
    grid-template-rows: subgrid;
    row-gap: 0;
}

.main-menu-list .rsm-panel .rsm-grid--insights .rsm-card--blogs .rsm-card-link {
    grid-row: 2 / -1;
}

/* the photo is laid over its frame, so its own proportions never stretch the picture row (the panel
   height decides the picture size, down to the frame's min-height) */
.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) .rsm-card-img {
    position: relative;
}

.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) .rsm-card-img > img {
    position: absolute;
    inset: 0;
}

.main-menu-list .rsm-panel :is(.rsm-grid--insights, .rsm-grid--about6) > .rsm-col:last-child > .rsm-rows {
    grid-row: 2;
    align-self: start;
}

.main-menu-list .rsm-panel .rsm-grid--insights > .rsm-col:last-child > .rsm-viewall {
    grid-row: 2;
    align-self: end;
    justify-self: start;
    margin: 0 0 clamp(12px, 1.1vw, 20px);
    padding-top: 0;
}

/* the newest report: a third caption across the label and title rows, in the cards' caption type */
.main-menu-list .rsm-panel .rsm-grid--insights > .rsm-col:last-child > a.rsm-ins-report {
    display: block;
    grid-row: 3 / -1;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel a.rsm-ins-report .rsm-card-title {
    transition: color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-ins-report:hover .rsm-card-title,
.main-menu-list .rsm-panel a.rsm-ins-report:focus-visible .rsm-card-title {
    color: var(--rsm-blue);
}

/* About Us captions: the page name, then one line, set on white under the photo (no plate over it) */
.main-menu-list .rsm-panel .rsm-card-name {
    display: block;
    font-size: clamp(15px, 1.1vw, 20px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.005em;
    color: var(--rsm-ink);
    transition: color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-card-line {
    display: block;
    margin-top: 4px;
    font-size: clamp(13px, .9vw, 15px);
    line-height: 1.45;
    color: var(--rsm-body);
}

.main-menu-list .rsm-panel a.rsm-card:hover .rsm-card-name,
.main-menu-list .rsm-panel a.rsm-card:focus-visible .rsm-card-name {
    color: var(--rsm-blue);
}

.main-menu-list .rsm-panel .rsm-grid--about6 > .rsm-col:last-child > .rsm-viewall {
    grid-row: 3 / -1;
    align-self: start;
    justify-self: start;
    margin: 0;
    padding-top: 0;
}

/* the blog card's title on the blue (2026-11-10, v2): a short white rule over a larger, light title,
   lined up with the feed panel's text below it (the panel sits 12px in, with a 1px border and 16px of
   padding) */
.main-menu-list .rsm-panel .rsm-live__title {
    position: absolute;
    z-index: 3;
    top: clamp(20px, 1.8vw, 30px);
    left: 29px;
    right: 29px;
    font-size: clamp(25px, 2.05vw, 36px);
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: -.02em;
    color: #fff;
    text-shadow: 0 2px 18px rgba(2, 8, 40, .28);
    pointer-events: none;
}

.main-menu-list .rsm-panel .rsm-live__title::before {
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    margin-bottom: clamp(10px, .9vw, 14px);
    border-radius: 2px;
    background: rgba(255, 255, 255, .9);
}

/* ---------- Services: headings on one row, and the rotating card (2026-11-10) ----------
   The right side's two headings ("Our Sectors", "Latest Insights") sit on the row of the list headings,
   in the same type, over the blue panel's two columns; the blue panel then starts level with the first
   list rows. Its right column (.rsm-feat) turns through the newest market report and the three newest
   articles: story bars across the top fill over six seconds and move it on (the script listens for the
   bar's animationend, so pausing the bar pauses the card); it waits while pointed at or focused, while
   the menu is closed, and for reduced motion (then the bars stand full and only the buttons move it).
   The previous / next buttons are frosted glass that turns white on hover, like the site's glass. */
.main-menu-list .rsm-panel .rsm-side {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.main-menu-list .rsm-panel .rsm-side__heads {
    display: grid;
    grid-template-columns: minmax(0, 61fr) minmax(0, 39fr);
}

.main-menu-list .rsm-panel .rsm-side > .rsm-blue {
    flex: 1 1 auto;
}

.main-menu-list .rsm-panel .rsm-feat {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(18px, 1.7vw, 30px) clamp(18px, 1.9vw, 36px);
    background: rgba(255, 255, 255, .05);
    color: #fff;
}

.main-menu-list .rsm-panel .rsm-feat__steps {
    display: flex;
    gap: 5px;
    margin-bottom: clamp(12px, 1.1vw, 18px);
}

.main-menu-list .rsm-panel .rsm-feat__steps i {
    position: relative;
    flex: 1 1 0;
    height: 2px;
    overflow: hidden;
    border-radius: 2px;
    background: rgba(255, 255, 255, .28);
}

.main-menu-list .rsm-panel .rsm-feat__steps i::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #fff;
    transform: scaleX(0);
    transform-origin: left center;
}

.main-menu-list .rsm-panel .rsm-feat__steps i.is-done::after {
    transform: scaleX(1);
}

.main-menu-list .rsm-panel .rsm-feat__steps i.is-on::after {
    animation: rsmFeatFill 6s linear forwards;
}

@keyframes rsmFeatFill {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

ul.main-menu-list li:not(.megamenu-active) .rsm-feat__steps i.is-on::after,
.main-menu-list .rsm-panel .rsm-feat:hover .rsm-feat__steps i.is-on::after,
.main-menu-list .rsm-panel .rsm-feat:focus-within .rsm-feat__steps i.is-on::after {
    animation-play-state: paused;
}

.main-menu-list .rsm-panel .rsm-feat.is-still .rsm-feat__steps i.is-on::after {
    animation: none;
    transform: scaleX(1);
}

/* the slides share one cell, so the card is as tall as its tallest slide and never jumps */
.main-menu-list .rsm-panel .rsm-feat__slides {
    display: grid;
    flex: 1 1 auto;
}

.main-menu-list .rsm-panel a.rsm-feat__slide {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: opacity .6s var(--rsm-ease), visibility 0s linear .6s;
}

.main-menu-list .rsm-panel a.rsm-feat__slide.is-on {
    opacity: 1;
    visibility: visible;
    transition: opacity .6s var(--rsm-ease), visibility 0s;
}

.main-menu-list .rsm-panel .rsm-feat__img {
    display: block;
    width: 100%;
    aspect-ratio: 1.92;
    margin-bottom: clamp(12px, 1.2vw, 20px);
    overflow: hidden;
    border-radius: 6px;
    background: #fff;
}

.main-menu-list .rsm-panel .rsm-feat__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform: scale(1.05);
    transition: transform 1.4s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-feat__slide--post .rsm-feat__img img {
    object-fit: cover;
}

.main-menu-list .rsm-panel .rsm-feat__slide.is-on .rsm-feat__img img {
    transform: none;
}

.main-menu-list .rsm-panel .rsm-feat__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    margin-bottom: 8px;
    font-size: clamp(12px, .85vw, 14px);
    font-weight: 500;
    line-height: 1.3;
    color: rgba(255, 255, 255, .8);
}

.main-menu-list .rsm-panel .rsm-feat__meta > span + span::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    margin-right: 10px;
    border-radius: 50%;
    background: currentColor;
    vertical-align: middle;
}

.main-menu-list .rsm-panel .rsm-feat__title {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: clamp(16px, 1.35vw, 24px);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -.01em;
    color: #fff;
    transform: translateY(8px);
    transition: transform .8s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-feat__slide.is-on .rsm-feat__title {
    transform: none;
}

/* the link line; the glass buttons sit on its right, level with it */
.main-menu-list .rsm-panel .rsm-feat__more {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    padding-top: clamp(14px, 1.2vw, 20px);
    font-size: clamp(14px, 1vw, 17px);
    font-weight: 500;
    line-height: 1.2;
    color: #fff;
}

.main-menu-list .rsm-panel a.rsm-feat__slide:hover .rsm-feat__more .rsm-arrow,
.main-menu-list .rsm-panel a.rsm-feat__slide:focus-visible .rsm-feat__more .rsm-arrow {
    transform: translateX(4px);
}

.main-menu-list .rsm-panel .rsm-feat__nav {
    position: absolute;
    right: clamp(18px, 1.9vw, 36px);
    bottom: calc(clamp(18px, 1.7vw, 30px) - clamp(6px, .6vw, 10px));
    z-index: 2;
    display: flex;
    gap: 8px;
}

.main-menu-list .rsm-panel .rsm-feat__btn {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(32px, 2.4vw, 40px);
    height: clamp(32px, 2.4vw, 40px);
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    -webkit-backdrop-filter: blur(10px) saturate(160%);
    backdrop-filter: blur(10px) saturate(160%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 10px 22px -14px rgba(2, 8, 40, .7);
    color: #fff;
    cursor: pointer;
    transition: background-color .25s var(--rsm-ease), border-color .25s var(--rsm-ease), color .25s var(--rsm-ease), transform .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel .rsm-feat__btn svg {
    width: 16px;
    height: 16px;
}

.main-menu-list .rsm-panel .rsm-feat__btn:hover,
.main-menu-list .rsm-panel .rsm-feat__btn:focus-visible {
    border-color: #fff;
    background: #fff;
    color: var(--rsm-blue);
    outline: none;
}

.main-menu-list .rsm-panel .rsm-feat__btn:active {
    transform: scale(.94);
}

html[dir="rtl"] .main-menu-list .rsm-panel .rsm-feat__btn svg {
    transform: scaleX(-1);
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel a.rsm-feat__slide,
    .main-menu-list .rsm-panel .rsm-feat__img img,
    .main-menu-list .rsm-panel .rsm-feat__title {
        transition: none;
    }
}

/* ---------- About Us panel, v9 (2026-11-10) ----------
   Built like the Services panel (same column split, same list block), so switching between the two
   keeps every heading and rule in place. Left: "Who We Are" and "People & Careers", icon rows with a
   hairline between them, and a link under them. Right: "Inside Reliant" (until 2026-11-10 "Our Leadership"),
   four About pages as photo cards with a short line each, and a link to the people page on the line of the left one. */
.main-menu-list .rsm-panel .rsm-grid--about9 {
    grid-template-columns: minmax(0, 43fr) minmax(0, 57fr);
    gap: clamp(20px, 1.6vw, 30px);
}

@media (max-width: 1280px) {
    .main-menu-list .rsm-panel .rsm-grid--about9 {
        grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
    }
}

.main-menu-list .rsm-panel .rsm-lead {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* the portraits take the height the column leaves, down to a margin above the link */
.main-menu-list .rsm-panel .rsm-lead__grid {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(12px, 1.1vw, 20px);
    margin-bottom: clamp(18px, 1.6vw, 28px);
}

.main-menu-list .rsm-panel a.rsm-lead__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--rsm-ink);
}

.main-menu-list .rsm-panel .rsm-lead__img {
    position: relative;
    display: block;
    flex: 1 1 0;
    min-height: clamp(150px, 12vw, 300px);
    overflow: hidden;
    border-radius: 6px;
    background: #e9ecf2;
}

.main-menu-list .rsm-panel .rsm-lead__img img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 16%;
    transition: transform .6s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-lead__card:is(:hover, :focus-visible) .rsm-lead__img img {
    transform: scale(1.04);
}

.main-menu-list .rsm-panel .rsm-lead__name {
    display: block;
    margin-top: clamp(10px, .9vw, 14px);
    font-size: clamp(14.5px, 1.05vw, 18px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.005em;
    color: var(--rsm-ink);
    transition: color .2s var(--rsm-ease);
}

.main-menu-list .rsm-panel a.rsm-lead__card:is(:hover, :focus-visible) .rsm-lead__name {
    color: var(--rsm-blue);
}

.main-menu-list .rsm-panel .rsm-lead__role {
    display: block;
    margin-top: 2px;
    font-size: clamp(12.5px, .85vw, 14px);
    line-height: 1.4;
    color: var(--rsm-body);
}

/* the link closes the column on the line of "More about Reliant" */
.main-menu-list .rsm-panel .rsm-lead > .rsm-viewall {
    margin-top: auto;
}

/* "Inside Reliant" (2026-11-10): the same cards carrying page photos, which are framed on their centre */
.main-menu-list .rsm-panel .rsm-lead--pages .rsm-lead__img img {
    object-position: 50% 50%;
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel .rsm-lead__img img {
        transition: none;
    }
}


/* ==========================================================================
   Open / close motion (2026-11-10)
   Open: the white panel unrolls down from the bar (420 ms) and its columns follow from left to
   right, each fading up 14px, 60 ms apart; the divider in Services draws downwards. Close is
   quicker: the columns fade out first and the panel rolls back up under the bar (280 ms); the bar
   turns clear only once the panel has gone (the script in includes/navbar-global.php).
   Moving from one open menu to the next (all three panels are one height) keeps the panel where
   it is and cross-fades the columns only: the script sets .rsm-switch on the menu list for that.
   These replace the older fade (bundle.css, the .rsm-inner fade above, and the column stagger in
   assets/js/rs-animate.js, which now leaves .rsm-panel alone).
   ========================================================================== */
.main-header {
    --rsm-out: cubic-bezier(.22, 1, .36, 1);
    --rsm-inout: cubic-bezier(.65, 0, .35, 1);
}

ul.main-menu-list li .megamenu.rsm-panel {
    opacity: 1;
    transform: none;
    clip-path: inset(0 0 100% 0);
    transition: clip-path .28s var(--rsm-inout) .06s, visibility 0s linear .36s;
}

/* the negative bottom inset keeps the soft shadow under the open panel */
ul.main-menu-list li.menu-item-children.megamenu-active > .megamenu.rsm-panel {
    clip-path: inset(0 0 -80px 0);
    transition: clip-path .42s var(--rsm-out), visibility 0s;
}

.main-menu-list .rsm-panel .rsm-inner,
ul.main-menu-list li.menu-item-children.megamenu-active > .megamenu.rsm-panel .rsm-inner {
    opacity: 1;
    transform: none;
    transition: none;
}

/* the pieces that move, in reading order (--rsm-i, 0 when unset: set below on its own so the long
   :is() list's weight cannot override it) */
.main-menu-list .rsm-panel :is(.rsm-lists > .rsm-col, .rsm-lists > .rsm-viewall, .rsm-side, .rsm-lead,
    .rsm-grid--insights > .rsm-col:first-child > .rsm-heading, .rsm-cards > .rsm-card, .rsm-grid--insights > .rsm-col:last-child,
    .rsm-grid--about7 > .rsm-col:first-child > .rsm-heading, .rsm-ab7 > .rsm-ab7__col, .rsm-grid--about7 > .rsm-col:last-child) {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
    transition: opacity .14s ease, transform 0s linear .36s;
}

.main-menu-list .rsm-panel :is(.rsm-lists > .rsm-col:nth-child(2), .rsm-lists > .rsm-viewall, .rsm-cards > .rsm-card:nth-child(2), .rsm-ab7 > .rsm-ab7__col:nth-child(2)) {
    --rsm-i: 1;
}

.main-menu-list .rsm-panel :is(.rsm-side, .rsm-lead, .rsm-grid--insights > .rsm-col:last-child, .rsm-grid--about7 > .rsm-col:last-child) {
    --rsm-i: 2;
}

ul.main-menu-list li.megamenu-active > .rsm-panel :is(.rsm-lists > .rsm-col, .rsm-lists > .rsm-viewall, .rsm-side, .rsm-lead,
    .rsm-grid--insights > .rsm-col:first-child > .rsm-heading, .rsm-cards > .rsm-card, .rsm-grid--insights > .rsm-col:last-child,
    .rsm-grid--about7 > .rsm-col:first-child > .rsm-heading, .rsm-ab7 > .rsm-ab7__col, .rsm-grid--about7 > .rsm-col:last-child) {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition: opacity .45s ease calc(.1s + var(--rsm-i, 0) * .06s), transform .6s var(--rsm-out) calc(.1s + var(--rsm-i, 0) * .06s);
}

/* Services: the hairline between the two lists draws downwards */
.main-menu-list .rsm-panel .rsm-lists::before {
    transform: scaleY(0);
    transform-origin: 50% 0;
    transition: transform 0s linear .36s;
}

ul.main-menu-list li.megamenu-active > .rsm-panel .rsm-lists::before {
    transform: scaleY(1);
    transition: transform .7s var(--rsm-out) .16s;
}

/* switching between open menus: the panel stays, the columns cross-fade */
ul.main-menu-list.rsm-switch li.menu-item-children > .megamenu.rsm-panel,
ul.main-menu-list.rsm-switch li.menu-item-children:not(.megamenu-active) > .rsm-panel .rsm-lists::before {
    transition: none;
}

ul.main-menu-list.rsm-switch li.megamenu-active > .rsm-panel :is(.rsm-lists > .rsm-col, .rsm-lists > .rsm-viewall, .rsm-side, .rsm-lead,
    .rsm-grid--insights > .rsm-col:first-child > .rsm-heading, .rsm-cards > .rsm-card, .rsm-grid--insights > .rsm-col:last-child,
    .rsm-grid--about7 > .rsm-col:first-child > .rsm-heading, .rsm-ab7 > .rsm-ab7__col, .rsm-grid--about7 > .rsm-col:last-child) {
    transition: opacity .32s ease calc(var(--rsm-i, 0) * .045s), transform .45s var(--rsm-out) calc(var(--rsm-i, 0) * .045s);
}

ul.main-menu-list.rsm-switch li.megamenu-active > .rsm-panel .rsm-lists::before {
    transition: transform .5s var(--rsm-out) .05s;
}

/* the chevron turns with the panel (not on a passing hover) */
.main-header ul.main-menu-list > li.has-megamenu .rs-menu-chevron,
.main-header ul.main-menu-list > li.has-megamenu:hover .rs-menu-chevron {
    transform: none;
    transition: transform .4s var(--rsm-out);
}

.main-header ul.main-menu-list > li.has-megamenu.megamenu-active .rs-menu-chevron {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    ul.main-menu-list li .megamenu.rsm-panel,
    ul.main-menu-list li.menu-item-children.megamenu-active > .megamenu.rsm-panel {
        clip-path: none;
        opacity: 0;
        transition: opacity .15s linear, visibility 0s linear .15s;
    }

    ul.main-menu-list li.menu-item-children.megamenu-active > .megamenu.rsm-panel {
        opacity: 1;
        transition: opacity .15s linear, visibility 0s;
    }

    .main-menu-list .rsm-panel :is(.rsm-lists > .rsm-col, .rsm-lists > .rsm-viewall, .rsm-side, .rsm-lead,
        .rsm-grid--insights > .rsm-col:first-child > .rsm-heading, .rsm-cards > .rsm-card, .rsm-grid--insights > .rsm-col:last-child,
        .rsm-grid--about7 > .rsm-col:first-child > .rsm-heading, .rsm-ab7 > .rsm-ab7__col, .rsm-grid--about7 > .rsm-col:last-child),
    .main-menu-list .rsm-panel .rsm-lists::before {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .main-header ul.main-menu-list > li.has-megamenu .rs-menu-chevron {
        transition: none;
    }
}

/* ---------- Blog card: the whole picture opens the blog (2026-11-10) ----------
   A cover link fills the moving abstract (under the frosted feed, over the glows; the title above it
   already lets clicks through). The feed panel passes clicks down to it, except on the headline showing,
   which still opens its own article. Hovering the picture lights the card's title, as one link would. */
.main-menu-list .rsm-panel .rsm-live__cover {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: block;
}

.main-menu-list .rsm-panel .rsm-card--blogs .rsm-feed {
    pointer-events: none;
}

.main-menu-list .rsm-panel .rsm-card--blogs .rsm-feed__item {
    pointer-events: auto;
}

.main-menu-list .rsm-panel .rsm-card--blogs:has(.rsm-live__cover:hover) .rsm-card-title {
    color: var(--rsm-blue);
}

/* ---------- "Inside Reliant" cards: a blue curtain on hover (2026-11-11) ----------
   A brand-blue curtain rises from the foot of the photo and an "Explore" cue with an arrow slides in
   on it; the photo eases in a touch. CSS only, on the card's own photo frame. */
.main-menu-list .rsm-panel .rsm-lead--pages .rsm-lead__img::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(10, 47, 200, .18) 0%, rgba(10, 40, 180, .62) 52%, rgba(6, 26, 140, .92) 100%);
    clip-path: inset(100% 0 0 0);
    transition: clip-path .6s cubic-bezier(.65, 0, .25, 1);
}

.main-menu-list .rsm-panel .rsm-lead--pages .rsm-lead__img::after {
    content: "Explore";
    position: absolute;
    left: 18px;
    bottom: 16px;
    z-index: 2;
    padding-right: 30px;
    font-size: 12px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #fff;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 10' fill='none' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 5h21M17.5 1 22 5l-4.5 4'/%3E%3C/svg%3E") right center / 22px 10px no-repeat;
    opacity: 0;
    transform: translate3d(0, 10px, 0);
    transition: opacity .35s ease, transform .5s cubic-bezier(.22, .61, .36, 1);
}

.main-menu-list .rsm-panel .rsm-lead--pages a.rsm-lead__card:is(:hover, :focus-visible) .rsm-lead__img::before {
    clip-path: inset(0 0 0 0);
}

.main-menu-list .rsm-panel .rsm-lead--pages a.rsm-lead__card:is(:hover, :focus-visible) .rsm-lead__img::after {
    opacity: 1;
    transform: none;
    transition-delay: .18s;
}

.main-menu-list .rsm-panel .rsm-lead--pages a.rsm-lead__card:is(:hover, :focus-visible) .rsm-lead__img img {
    transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
    .main-menu-list .rsm-panel .rsm-lead--pages .rsm-lead__img::before {
        transition: none;
    }

    .main-menu-list .rsm-panel .rsm-lead--pages .rsm-lead__img::after {
        transition: none;
        transform: none;
    }
}
