/* articles-page-header.css */

/* ─── Font Face ─────────────────────────────────────────────────────────────── */
@font-face {
    font-family: 'LD';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff2') format('woff2'),
    url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
}

/* ─── Design Tokens (extracted from live site) ───────────────────────────────── */
.articles-page {
    /* Colors - extracted from live site */
    --opus-copper:       #da9c70;   /* primary accent — nav highlights, tags, links */
    --opus-copper-dark:  #b08163;   /* hover / heading accent */
    --opus-copper-light: #e0ac87;   /* tint */
    --opus-dark:         #393641;   /* primary text */
    --opus-dark-2:       #353144;   /* headings */
    --opus-dark-nav:     #3d3b45;   /* header/footer bg */
    --opus-mid:          #777584;   /* secondary/muted text */
    --opus-mid-2:        #878594;
    --opus-cream:        #efebe6;   /* page background */
    --opus-cream-2:      #e8e4df;   /* notification bar text, alt bg */
    --opus-cream-3:      #f5f3f0;   /* card / blockquote bg */
    --opus-white:        #ffffff;
    --opus-black:        #000000;

    /* Typography — live site uses Helvetica-LT */
    --font-body: 'Helvetica-LT', Helvetica, Arial, sans-serif;

    /* Layout */
    --container-max:  860px;
    --container-wide: 1640px;
    --header-height:  auto;  /* live site: height driven by padding + logo, not fixed */

    font-family:         var(--font-body);
    background:          var(--opus-cream);
    color:               var(--opus-dark);
    -webkit-font-smoothing: auto;
}

/* ─── Reset ──────────────────────────────────────────────────────────────────── */
.articles-page *, .articles-page *::before, .articles-page *::after {
    box-sizing: border-box; margin: 0; padding: 0;
}
.articles-page img { display: block; max-width: 100%; }
.articles-page a   { color: inherit; }

/* Reset body margin (browser default = 8px) */
body { margin: 0; padding: 0; }
html.scrollStopTm,
html.scrollStopTm body {
    overflow: hidden;
    width: 100%;
}

/* Set dark bg on body/html so any compositor gap shows dark instead of white */
html:has(.pruadviser-root) { background: #3d3b45; }
body:has(.pruadviser-root) { background: #3d3b45; }

/* Offset anchor-link scroll so sections land below the fixed header (matches live site html{scroll-padding-top:179px}) */
html { scroll-padding-top: 180px; }

/* ─── Container ──────────────────────────────────────────────────────────────── */
.articles-page .pa-container {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
}

/* ─── Notification Bar ───────────────────────────────────────────────────────── */
.articles-page .pa-sticky-wrap {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
    background: #3d3b45;
}
/* Prevent cream flash in padding-top area — scope to home page only (has .oh-main) */
.articles-page .pruadviser-root:has(.oh-main) {
    background: #3d3b45;
}
.articles-page .pa-notification {
    background: var(--opus-black);
    padding: 15px 0;
    overflow: hidden;
}
.articles-page .pa-notification-inner {
    width: 80%;
    max-width: var(--container-wide);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-notification-inner { width: 88%; }
}
.articles-page .pa-notif-text {
    color: var(--opus-cream-2);
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 14px !important;
    font-weight: 100 !important;
    line-height: normal !important;
    text-align: left;
}
.articles-page .pa-notif-highlight {
    color: var(--opus-copper);
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: normal !important;
}
.articles-page .pa-notif-close {
    float: right;
    background: none;
    border: none;
    color: var(--opus-copper);
    font-size: 16px;
    font-weight: 100;
    cursor: pointer;
    line-height: normal;
    padding: 10px;
    opacity: 0.8;
    transition: opacity 0.2s;
    flex-shrink: 0;
}
.articles-page .pa-notif-close:hover { opacity: 1; }

/* ─── Header ─────────────────────────────────────────────────────────────────── */
.articles-page .pa-header {
    background: var(--opus-dark-nav);
    border-bottom: 0;
    padding: 18px 0;
}
.articles-page .pa-header-inner {
    width: 92%;
    max-width: var(--container-wide);
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-header-inner { width: 88%; }
}
@media only screen and (min-width: 412px) {
    .articles-page .pa-header { padding-top: 20px; padding-bottom: 20px; }
}
@media only screen and (min-width: 700px) {
    .articles-page .pa-header { padding-top: 26px; padding-bottom: 26px; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-header-inner { align-items: center; }
}
@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pa-header-logo { flex-shrink: 1; min-width: 0; }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pa-header { padding-top: 18px; padding-bottom: 18px; }
}
/* Nav aligns with logo image center, ignoring BY PRUDENTIAL height */
.articles-page .pa-header-logo-image {
    display: block;
    width: 100%;
    height: auto;
}
.articles-page .pa-header-logo-text-wrap {
    display: flex;
    flex-direction: column;
}


@media only screen and (min-width: 1000px) {
    .articles-page .pa-header-inner { width: 88%; }
}


/* Mobile base padding — matches live site .header .wrap { padding: 11px 0 } */
@media only screen and (max-width: 411px) {
    .articles-page .pa-header { padding-top: 11px; padding-bottom: 11px; }
}

/* Logo — matches live site exactly:
   font-size drives em-based width: 11em × font-size = rendered width
   1000px: 15px → 165px, 1200px: 18px → 198px, 1600px: 21px → 231px, 1900px: 24px → 264px
*/
.articles-page .pa-header-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 11em;
    font-size: 12px;
    flex-shrink: 0;
    text-decoration: none;
    margin: 0;
    line-height: 1;
}
.articles-page .pa-header-logo-img-wrap {
    display: block;
    width: 100%;
}
.articles-page .pa-header-logo-image {
    width: 100%;
    height: auto;
    display: block;
}
@media only screen and (min-width: 412px) {
    .articles-page .pa-header-logo { font-size: 13px; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-header-logo { font-size: 15px; }
}
@media only screen and (min-width: 1200px) {
    .articles-page .pa-header-logo { font-size: 18px; }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pa-header-logo { font-size: 21px; }
}
@media only screen and (min-width: 1900px) {
    .articles-page .pa-header-logo { font-size: 24px; }
}
.articles-page .pa-header-logo-text {
    font-size: 22px;
    font-weight: 300;
    color: var(--opus-cream-2);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    line-height: 1;
}
.articles-page .pa-header-logo-sub {
    display: block;
    font-size: 9px;
    font-weight: 400;
    letter-spacing: 0.25em;
    color: var(--opus-copper);
    text-transform: uppercase;
    margin-top: 4px;
    text-align: center;
}

/* Nav — matches live site exactly:
   font: LD 800, 16px desktop base → scales up
   separator: border-right on li (not pseudo)
   active: #e8e4df (not copper)
   hover: #e8e4df
*/
.articles-page .pa-header-nav {
    display: flex;
    align-items: center;
    align-self: center;
    padding-bottom: 0;
}
.articles-page .pa-nav-list {
    display: flex;
    align-items: center;
}
/* Desktop: pa-nav-items is the flex ul */
.articles-page .pa-nav-items {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}
.articles-page .pa-nav-item {
    display: table;
    border-right: 2px solid #777583;
    margin-right: 1.46em;
    padding-right: 1.46em;
    margin-bottom: 0;
}
.articles-page .pa-nav-item:last-child {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
}
.articles-page .pa-nav-link {
    font-family: 'LD';
    font-size: 16px;
    font-weight: 700;
    color: #878594;
    white-space: nowrap;
    line-height: 1;
    transition: color 0.4s;
    text-decoration: none;
    display: table;
    position: relative;
}
/* Active underline — matches live site ::before with button-border gradient */
.articles-page .pa-nav-link::before {
    content: '';
    width: 100%;
    position: absolute;
    bottom: -1em;
    height: 3px;
    left: 0;
    background: linear-gradient(90deg, #dca479 0, #c37146);
    transform: scaleX(0);
    transition: transform 0.4s;
    transform-origin: left center;
}
.articles-page .pa-nav-link:hover,
.articles-page .pa-nav-link.pa-nav-active {
    color: #e8e4df;
}
.articles-page .pa-nav-link.pa-nav-active::before {
    transform: scaleX(1);
    transition-delay: 0.6s;
}
/* Prevent AEM base styles overriding nav font */
.articles-page .pa-header-nav * { font-family: 'LD' !important; }

/* Desktop nav sizing follows live breakpoints */
@media only screen and (min-width: 1000px) and (max-width: 1099px) {
    .articles-page .pa-nav-link { font-size: 14px; }
    .articles-page .pa-nav-item {
        margin-right: 0.8em;
        padding-right: 0.8em;
    }
}
@media only screen and (min-width: 1300px) and (max-width: 1599px) {
    .articles-page .pa-nav-link { font-size: 18px; }
    .articles-page .pa-nav-item {
        margin-right: 26.28px;
        padding-right: 26.28px;
    }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pa-header-nav { font-size: 20px; }
    .articles-page .pa-nav-link { font-size: 20px; }
}
@media only screen and (min-width: 1700px) {
    .articles-page .pa-header-nav { font-size: 22px; }
    .articles-page .pa-nav-link { font-size: 22px; }
}
@media only screen and (min-width: 1900px) {
    .articles-page .pa-header-logo,
    .articles-page .pa-header-nav,
    .articles-page .pa-nav-link {
        font-size: 24px;
    }
}

/* Mobile hamburger */
/* Hide close button on desktop */
.articles-page .pa-nav-close { display: none; }
.articles-page .pa-nav-logo  { display: none; }

.articles-page .pa-header-inner .pa-header-toggle,
.articles-page .pa-header-toggle {
    display: none !important;
    position: relative;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0; /* use margin-bottom on spans instead — gap gets overridden by AEM */
    width: 30px;
    height: auto;
    top: auto !important;
    transform: none !important;
    background: none !important;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    user-select: none;
    -webkit-user-select: none;
}
.articles-page .pa-header-toggle span {
    display: block;
    width: 22px;
    height: 3px;
    margin-bottom: 5px;
    border-radius: 4px;
    transition: transform 0.25s, opacity 0.25s;
}
.articles-page .pa-header-toggle span:nth-child(1) { background: linear-gradient(90deg, #dca67a 0, #c37245); }
.articles-page .pa-header-toggle span:nth-child(2) { background: linear-gradient(90deg, #ce865d 1%, #b86640); }
.articles-page .pa-header-toggle span:nth-child(3) { background: linear-gradient(90deg, #c17254 0, #944932); margin-bottom: 0; }
.articles-page .pa-header.is-open .pa-header-toggle span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.articles-page .pa-header.is-open .pa-header-toggle span:nth-child(2) { transform: rotate(-45deg); }
.articles-page .pa-header.is-open .pa-header-toggle span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ─── Mobile Navigation (≤ 999px) ────────────────────────────────────────────
   FIX 1: Show hamburger toggle on mobile (overrides the global display:none !important)
   FIX 2: Slide-in nav panel, close button, logo, touch-close overlay
   ─────────────────────────────────────────────────────────────────────────── */
@media only screen and (max-width: 999px) {
    .articles-page .pa-notification-inner {
        display: block;
        position: relative;
    }

    .articles-page .pa-notif-text {
        width: 100%;
    }

    .articles-page .pa-notif-close {
        position: absolute;
        top: 0;
        right: 0;
    }

    /* FIX 1 — show hamburger */
    .articles-page .pa-header-inner .pa-header-toggle,
    .articles-page .pa-header-toggle {
        display: flex !important;
    }

    /* Logo centered on mobile — hamburger takes its natural right position */
    .articles-page .pa-header-inner {
        justify-content: center;
        position: relative;
        min-height: 41.9px;
    }
    .articles-page .pa-header-logo {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
    .articles-page .pa-header-toggle {
        margin-left: auto;
    }

    /* FIX 2a — nav = full-screen container, hidden by default. */
    .articles-page .pa-header-nav {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100vw;
        max-width: 100vw;
        height: 100vh;
        z-index: 9999;
        overflow: hidden;
        display: none;
        padding: 0;
        background: transparent;
    }
    .articles-page .pa-header.is-open .pa-header-nav {
        display: block;
        background: transparent;
    }

    /* FIX 2b — pa-nav-list = actual sliding 80% panel (live site .navWrap) */
    .articles-page .pa-nav-list {
        position: absolute;
        top: 0;
        right: 0;
        width: 80vw;
        max-width: 480px;
        height: 100%;
        background-color: rgba(58, 55, 66, 0.95);
        overflow-y: auto;
        overflow-x: hidden;
        transform: translateX(110%);
        transition: transform 0.5s;
    }
    .articles-page .pa-header.is-animate .pa-header-nav .pa-nav-list {
        transform: translateX(0);
    }

    /* pa-nav-wrap = inner padding wrapper */
    .articles-page .pa-nav-wrap {
        display: block;
        min-height: 100%;
        padding: 20px;
    }

    /* FIX 2c — logo inside mobile panel, matches live .header nav .logo */
    .articles-page .pa-nav-logo {
        display: block;
        width: 8em;
        font-size: 16px;
        margin: 0;
    }
    .articles-page .pa-nav-logo img {
        width: 100%;
        height: auto;
    }

    /* FIX 2d — X close button inside panel */
    .articles-page .pa-nav-close {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 5%;
        right: 10%;
        width: 30px;
        height: 30px;
        cursor: pointer;
    }
    .articles-page .pa-nav-close i {
        position: absolute;
        display: block;
        width: 22px;
        height: 2px;
        background: linear-gradient(90deg, #dca67a 0, #c37245);
        border-radius: 2px;
    }
    .articles-page .pa-nav-close i:nth-child(1) { transform: rotate(45deg); }
    .articles-page .pa-nav-close i:nth-child(2) { opacity: 0; }
    .articles-page .pa-nav-close i:nth-child(3) { transform: rotate(-45deg); }

    /* FIX 2e — stack nav items vertically, matching live mobile nav */
    .articles-page .pa-nav-items {
        display: block;
        list-style: none;
        padding: 19% 7%;
        align-items: flex-start;
        width: auto;
        margin: 0;
    }
    .articles-page .pa-nav-item {
        display: table;
        width: auto;
        border-right: none;
        margin-right: 0;
        padding-right: 0;
        padding-bottom: 0;
        margin-bottom: 1.25em;
    }
    .articles-page .pa-nav-item:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .articles-page .pa-nav-link {
        font-size: 27px;
        white-space: normal;
        color: #878594;
        display: table;
        line-height: 1;
    }
    .articles-page .pa-nav-link.pa-nav-active {
        color: #e8e4df;
    }
    .articles-page .pa-nav-link::before {
        bottom: -0.4em;
        display: block;
    }
    .articles-page .pa-nav-link.pa-nav-active::before {
        transform: scaleX(1);
        transition-delay: 0.6s;
    }

    /* FIX 2f — touch-close: now handled by clicking pa-header-nav background */
    .articles-page .pa-nav-touch-close { display: none !important; }

    /* FIX 2g — hide floating CTA when menu open */
    html.scrollStopTm .pa-floating-cta { display: none !important; }
}

@media only screen and (max-width: 411px) {
    .articles-page .pa-header {
        padding-top: 11px;
        padding-bottom: 11px;
    }
}

@media only screen and (min-width: 412px) and (max-width: 999px) {
    .articles-page .pa-header-toggle,
    .articles-page .pa-nav-close {
        transform: scale(1.3);
    }
}

@media only screen and (min-width: 500px) and (max-width: 999px) {
    .articles-page .pa-nav-link {
        font-size: 30px;
    }
    .articles-page .pa-nav-logo {
        font-size: 19px;
    }
}

@media only screen and (min-width: 700px) and (max-width: 999px) {
    .articles-page .pa-nav-link {
        font-size: 35px;
    }
    .articles-page .pa-nav-wrap {
        padding: 40px;
    }
    .articles-page .pa-nav-logo {
        font-size: 23px;
    }
}

/* ─── Gift Popup ─────────────────────────────────────────────────────────────── */
.articles-page .pa-gift-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
}
.articles-page .pa-gift-overlay.is-active { display: block; }

.articles-page .pa-gift-modal {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background: #fff;
    box-sizing: border-box;
    width: min(500px, 92vw);
    min-height: 398px;
    padding: 24px;
    border: 1px solid #ccc;
    color: #000;
    text-align: left;
    font-family: "Helvetica-LT", Helvetica, Arial, sans-serif;
    font-weight: 100;
    line-height: normal;
}
.articles-page .pa-gift-modal.is-active { display: block; }

.articles-page .pa-gift-close {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: none;
    font-size: 22px;
    cursor: pointer;
    color: var(--opus-mid);
    line-height: 1;
    padding: 4px 8px;
}
.articles-page .pa-gift-close:hover { color: var(--opus-dark); }

.articles-page .pa-gift-logo {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 24px;
}
.articles-page .pa-gift-logo-img {
    width: 145px;
    height: auto;
    display: block;
}
.articles-page .pa-gift-logo-sub {
    font-size: 9px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--opus-copper);
    margin-top: 4px;
}

.articles-page .pa-gift-body {
    font-size: 16px;
    line-height: normal;
    color: #000;
    margin: 20px 0;
    text-align: justify;
}
.articles-page .pa-gift-proceed-word {
    color: var(--opus-copper);
    font-weight: 700;
}

.articles-page .pa-gift-eligible {
    font-size: 16px;
    color: #000;
    margin: 20px 0;
    text-align: left;
}

.articles-page .pa-gift-login {
    font-size: 16px;
    color: #000;
    margin: 20px 0;
    text-align: center;
}

.articles-page .pa-gift-proceed {
    box-sizing: border-box;
    position: relative;
    display: block;
    vertical-align: top;
    width: 8.4em;
    height: auto;
    padding: 13.3px 19px 12.35px;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #000;
    font-family: "LD", sans-serif;
    font-weight: 800;
    font-size: 19px;
    line-height: 19px;
    text-align: center;
    text-decoration: none;
    transition: all;
    margin: 0 auto;
    cursor: pointer;
    z-index: 0;
}
.articles-page .pa-gift-proceed i {
    display: block;
    background: url('articles-page/resources/img/btn-sprite.png') no-repeat 0 0;
    background-size: auto 100%;
    width: 286px;
    height: 115px;
    position: absolute;
    left: 53%;
    top: 54%;
    transform: translate(-50%, -50%) scale(.741);
    pointer-events: none;
    z-index: -1;
}
.articles-page .pa-gift-proceed span {
    display: block;
    width: 100%;
    text-align: center;
}
.articles-page .pa-gift-proceed:hover i {
    animation: btnFrames 2s steps(75) both infinite;
}

.articles-page .pa-gift-guide {
    font-size: 16px;
    color: #000;
    margin: 20px 0;
    text-align: center;
}

/* articles-page-footer.css — pa-* class names, styles from live .footer.lite */

/* ─── Footer — matches live .footer / .footer.lite ──────────────────────────── */
.articles-page .pa-footer {
    text-align: center;
    color: #393641;
    padding: 18px 0;
    font-size: 12px;
    background-color: #f9f7f5; /* mobile: matches live .footer.lite */
}
.articles-page .pa-footer a { text-decoration: none; color: inherit; }
.articles-page .pa-footer p { margin: 0; }

@media only screen and (min-width: 500px) {
    .articles-page .pa-footer { font-size: 14px; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-footer {
        font-size: 16px;
        background-color: #f9f7f5;
        color: #393641;
    }
}
@media only screen and (min-width: 1300px) {
    .articles-page .pa-footer { font-size: 18px; }
}

/* ─── Dark variant ───────────────────────────── */
.articles-page .pa-footer--dark {
    background-color: #777584;
    color: #393641;
}


/* ─── Floating CTA ──────────────────────────────────────────────────────── */

@font-face {
    font-family: 'OpusIcomoon';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/icomoon-live.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: block;
}

.pa-floating-cta {
    position: fixed;
    bottom: 16px;
    right: calc(16px + (100vw - 100%));
    z-index: 999;
}

.pa-floating-cta__wrapper {
    position: relative;
    display: flex;
    align-items: center;
    width: 125px;
    height: 38px;
    background-color: #fff;
    border-radius: 48px;
}

.pa-floating-cta__wrapper::before {
    content: none;
    display: none;
}

.pa-floating-cta__wrapper::after {
    content: '';
    position: absolute;
    top: 2px;
    right: -1px;
    width: 6px;
    height: 10px;
    background: #393641;
    border-radius: 0 10px 0 6px;
    z-index: 2;
    pointer-events: none;
}

.pa-floating-cta__content {
    position: relative;
    z-index: 1;
    width: 125px;
    height: 38px;
    overflow: visible;
    background: transparent;
    border-radius: 0;
}

.pa-floating-cta__btn,
.articles-page .pa-floating-cta__btn {
    position: relative;
    display: block;
    float: right;
    width: auto;
    min-width: 134px;
    height: auto;
    margin-left: -9px;
    padding: 12px 15px;
    font-family: LD;
    font-size: 16px;
    font-weight: 600;
    line-height: 16px;
    color: #000;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.pa-floating-cta__btn::before,
.articles-page .pa-floating-cta__btn::before {
    content: none;
    display: none;
}

.pa-floating-cta__btn i,
.articles-page .pa-floating-cta__btn i {
    display: block;
    position: absolute;
    top: 54%;
    left: 56%;
    width: 286px;
    height: 115px;
    background-image: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/img/btn-sprite.png');
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto 100%;
    transform: translate(-50%, -50%) scale(0.6);
    transform-origin: center;
    pointer-events: none;
}

.pa-floating-cta__btn:hover i,
.articles-page .pa-floating-cta__btn:hover i {
    animation: btnFrames 2s steps(75) both infinite;
}

.pa-floating-cta__label {
    display: block;
    position: relative;
    z-index: 1;
    left: 0;
    top: 0;
    text-align: center;
    text-indent: 10px;
    font-family: LD;
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
    color: #000;
}

.pa-floating-cta--icon {
    position: absolute;
    top: -16px;
    right: -12px;
    width: 32px;
    height: 32px;
    background: #da9c70;
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99;
    color: #fff;
    pointer-events: none;
}

.pa-floating-cta__icon-glyph {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 16px;
    height: 16px;
    color: #fff;
    font-family: OpusIcomoon !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    speak: none;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(-50%, -50%);
}

.pa-floating-cta__icon-glyph::before {
    content: "\e902";
}

/* articles-page-body.css */

/* ─── Font Face ─────────────────────────────────────────────────────────────── */
@font-face {
    font-family: 'LD';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff2') format('woff2'),
    url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: 'Helvetica-LT';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/055551baa1d1618.woff2') format('woff2'),
    url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/ae8dcc4c15ddc7b.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
}

/* ─── Icomoon icon font ──────────────────────────────────────────────────────── */
@font-face {
    font-family: icomoon;
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/icomoon-social.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: block;
}
.icomoon, [class*=" icon-"], [class^=icon-] {
    font-family: icomoon !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-link:before     { content: "\e9cb"; }
.icon-facebook:before { content: "\ea90"; }
.icon-twitter:before  { content: "\ea96"; }
.icon-linkedin:before { content: "\eaca"; }
.icon-phone-sms:before { content: "\e902"; }

/* ─── Design Tokens ──────────────────────────────────────────────────────────── */
.articles-page {
    --opus-copper:       #da9c70;
    --opus-copper-dark:  #b08163;
    --opus-copper-light: #e0ac87;
    --opus-dark:         #393641;
    --opus-dark-2:       #353144;
    --opus-dark-nav:     #3d3b45;
    --opus-mid:          #777584;
    --opus-mid-2:        #878594;
    --opus-cream:        #efebe6;
    --opus-cream-2:      #e8e4df;
    --opus-cream-3:      #f5f3f0;
    --opus-white:        #ffffff;
    --opus-black:        #000000;

    --font-body-title: LD;
    --font-body: Helvetica-LT, Helvetica, Arial, sans-serif;

    --container-max:  1180px;
    --container-wide: 1640px;
    --header-height:  auto;

    font-family:            var(--font-body);
    background:             var(--opus-white);
    color:                  var(--opus-dark);
    -webkit-font-smoothing: auto;
    overflow-x: hidden;
}

/* ─── Reset ──────────────────────────────────────────────────────────────────── */
.articles-page *, .articles-page *::before, .articles-page *::after {
    box-sizing: border-box; margin: 0; padding: 0;
}
.articles-page img { display: block; max-width: 100%; }
.articles-page a   { color: #da9c70;}
body { margin: 0; padding: 0; }

/* ─── Container ──────────────────────────────────────────────────────────────── */
.articles-page .pa-container {
    width: 80vw;
    max-width: var(--container-wide);
    margin: 0 auto;
    padding: 0;
    min-width: 0;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-container { width: 88vw; }
}

/* banner — full-width, no padding, fixed height */
.articles-page .pa-article-hero--banner {
    padding: 0;
    max-width: 100%;
}
.articles-page .pa-article-hero--banner .pa-article-hero-img {
    max-height: 450px;
    object-fit: cover;
    width: 100%;
    object-position: top;
}

/* Portrait layout constrained with top padding */
.articles-page .pa-article-hero--portrait {
    max-width: 1089px;
    margin: 0 auto;
    padding: 5% 0 0;
    width: 80%;
}
@media only screen and (min-width: 860px) {
    .articles-page .pa-article-hero--portrait { padding: 5% 0 0; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-article-hero--portrait {
        padding: 2.5% 0 0;
        width: 88%;
    }
}
.articles-page .pa-article-hero--portrait .pa-article-hero-img {
    max-height: none;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: top;
}

/* White bg so dark body bg (compositor-gap fix) doesn't bleed into article content */
.articles-page .pa-article {
    background: #fff;
}

/* ─── Article Wrapper ────────────────────────────────────────────────────────── */
.articles-page .pa-article-wrap {
    max-width: 1089px;
    padding-top: 5%;
    padding-bottom: 9%;
    font-size: 16px;
    font-weight: 100;
    color: #78849e;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-article-wrap {
        padding-top: 2.5%;
        padding-bottom: 2.5%;
        font-size: 20px;
    }
}

/* ─── Meta ───────────────────────────────────────────────────────────────────── */
.articles-page .pa-article-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}
.articles-page .pa-tag {
    display: inline-block;
    padding: 3px 12px;
    font-size: 0.62em;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--opus-white);
    background: var(--opus-copper);
}
.articles-page .pa-article-date {
    font-size: 0.72em;
    color: var(--opus-mid);
}

/* ─── Title ──────────────────────────────────────────────────────────────────── */
.articles-page .pa-article-title {
    font-family: var(--font-body-title);
    font-size: 1.6em;
    font-weight: 800;
    line-height: 1;
    letter-spacing: normal;
    color: #353144;
    margin-bottom: 0.5em;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-article-title { font-size: 2.3em; }
}

/* ─── Subtitle ───────────────────────────────────────────────────────────────── */
.articles-page .pa-article-subtitle {
    font-size: 1em;
    font-weight: 100;
    color: #78849e;
    margin-bottom: 1em;
    line-height: normal;
}

/* ─── Author ─────────────────────────────────────────────────────────────────── */
.articles-page .pa-article-author {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
}
.articles-page .pa-article-author-img {
    width: 2.25em;
    height: 2.25em;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--opus-copper-light);
}
.articles-page .pa-article-author-name {
    font-size: 0.72em;
    color: var(--opus-mid);
}
.articles-page .pa-article-author-name::before { content: 'By '; }

/* ─── Body Content ───────────────────────────────────────────────────────────── */
.articles-page .pa-article-content {
    font-size: 1em;
    font-weight: 100;
    line-height: normal;
    color: #78849e;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: normal;
}
.articles-page .pa-article-content p { margin-bottom: 1em; }

.articles-page .pa-article-content h2,
.articles-page .pa-article-content h3,
.articles-page .pa-article-content h4 {
    font-family: var(--font-body-title);
    font-weight: 800;
    margin-top: 0;
    margin-bottom: 0.8em;
    line-height: normal;
    letter-spacing: normal;
    color: var(--opus-dark-2);
}
.articles-page .pa-article-content h2 { font-size: 1.3em; }
.articles-page .pa-article-content h3 { font-size: 1.17em; color: #353144; }
.articles-page .pa-article-content h4 { font-size: 0.95em; }

.articles-page .pa-article-content ul,
.articles-page .pa-article-content ol {
    padding-left: 0;
    margin-left: 1em;
    margin-bottom: 1em;
}
.articles-page .pa-article-content li { margin-bottom: 0; line-height: normal; }

/* QA row 143 reflects the legacy list layout used by this article only. */
.cmp-custom-html[data-resource-path$="/aesthetics-and-wellness-fancy-a-makeover/jcr:content/root/container/customhtml_opus"]
    .pa-article-content ul,
.cmp-custom-html[data-resource-path$="/aesthetics-and-wellness-fancy-a-makeover/jcr:content/root/container/customhtml_opus"]
    .pa-article-content ol {
    margin-left: 0;
    list-style-position: inside;
}
.cmp-custom-html[data-resource-path$="/aesthetics-and-wellness-fancy-a-makeover/jcr:content/root/container/customhtml_opus"]
    .pa-article-content li {
    margin-bottom: 0;
}
.articles-page .pa-article-content ul li::marker { color: #78849e; }

.articles-page .pa-article-content blockquote {
    margin: 32px 0;
    padding: 18px 24px;
    border-left: 3px solid var(--opus-copper);
    background: var(--opus-cream-3);
    font-size: 0.95em;
    font-style: italic;
    color: var(--opus-dark);
    line-height: 1.7;
}

/* Generic img inside content — scoped to NOT affect person cards & figures */
.articles-page .pa-article-content > img,
.articles-page .pa-article-content p > img {
    width: 100%;
    height: auto;
    margin: 28px 0;
}
.articles-page .pa-article-content a:hover { color: #b08163; }
.articles-page .pa-article-content strong { font-weight: 600; color: var(--opus-dark-2); }

.articles-page .pa-article-content .pquote {
    float: right;
    width: 260px;
    color: var(--opus-dark-2);
    line-height: 0.9;
    font-style: italic;
    padding: 13px;
    border: 2px solid var(--opus-copper);
    margin: 0 0 20px 24px;
}
.articles-page .pa-article-content .pquote p:first-letter {
    font-size: 1.8em;
    font-weight: bold;
}

/* ─── Figure / Image Block ───────────────────────────────────────────────────── */
.articles-page .pa-figure {
    margin: 28px 0;
}
.articles-page .pa-figure img {
    width: 100%;
    height: auto;
    margin: 0;
}
.articles-page .pa-figure figcaption {
    font-size: 0.72em;
    color: var(--opus-mid);
    text-align: center;
    margin-top: 8px;
    font-style: italic;
    line-height: 1.5;
}

/* ─── Video Frame ────────────────────────────────────────────────────────────── */
.articles-page .pa-video-frame {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    margin: 0 0 24px;
    background: #000;
}
.articles-page .pa-video-frame iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: 0;
}
.articles-page .pa-video-caption {
    font-size: 0.78em;
    color: var(--opus-mid);
    text-align: center;
    margin-top: 8px;
    margin-bottom: 20px;
}

/* ─── Audio Embed ────────────────────────────────────────────────────────────── */
.articles-page .pa-audio-wrap { margin: 28px 0; }
.articles-page .pa-audio-title {
    font-size: 0.9em;
    font-weight: 600;
    color: var(--opus-dark-2);
    margin-bottom: 10px;
}
.articles-page .pa-audio-frame {
    display: block;
    width: 100%;
    height: 180px;
    border: none;
}
.articles-page .pa-audio-caption { font-size: 0.72em; color: var(--opus-mid); margin-top: 8px; }

/* ─── Divider ────────────────────────────────────────────────────────────────── */
.articles-page .pa-divider {
    border: none;
    border-top: 1px solid var(--opus-cream-2);
    margin: 32px 0;
}

/* ─── Disclaimer ─────────────────────────────────────────────────────────────── */
.articles-page .pa-article-disclaimer {
    font-size: 16px;
    font-weight: 100;
    color: #78849e;
    line-height: normal;
}
.articles-page .pa-article-disclaimer p {
    margin-bottom: 0.8em;
}

/* ─── Share Bar ──────────────────────────────────────────────────────────────── */
.articles-page .pa-share {
    color: #da9c70;
    display: flex;
    align-items: center;
    font-size: 0.9em;
    margin: 32px 0 40px;
}
.articles-page .pa-share-divider {
    border: none;
    display: block;
    height: 5px;
    background: url('articles-page/resources/img/button-border.jpg') no-repeat 0 0;
    background-size: 100% auto;
    margin-bottom: 3%;
}
.articles-page .pa-share-btn::after,
.articles-page a[target="_blank"].pa-share-btn::after,
.articles-page a[target="_blank"]::after {
    display: none !important;
    content: '' !important;
}
.articles-page .pa-share-label { margin-right: 1.3em; }
.articles-page .pa-share-btn {
    color: inherit;
    margin-right: 0.8em;
    text-decoration: none;
    box-shadow: inset 0 0 0 3px #dddce0;
    width: 2.1em;
    height: 2.1em;
    text-align: center;
    line-height: 2.1em;
    font-size: 1.3em;
    border-radius: 1.05em;
    transition: box-shadow 0.4s;
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
}
.articles-page .pa-share-btn:hover { box-shadow: inset 0 0 0 3px #da9c70; }
.articles-page .pa-share-copy--done { box-shadow: inset 0 0 0 3px #5a9a6f; color: #5a9a6f; }

/* ─── Related Articles ───────────────────────────────────────────────────────── */
.articles-page .pa-article-related {
    background: #efebe6;
    color: #393641;
    box-shadow: inset 0 -3px 9px 0 rgba(0, 0, 0, 0.05);
    padding: 6% 0;
    font-size: 16px;
    font-weight: 100;
    line-height: normal;
}
.articles-page .pa-article-related-inner {
    width: 80%;
    max-width: var(--container-wide);
    margin: 0 auto;
}
.articles-page .pa-article-related-title {
    font-family: var(--font-body-title) !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--opus-dark-2) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1 !important;
    text-align: center !important;
    margin-bottom: 2.2em !important;
    counter-reset: none !important;
}
.articles-page .pa-article-related-title::before,
.articles-page .pa-article-related-title::after { content: none !important; display: none !important; }
.articles-page .pa-article-related-grid {
    display: block;
    margin: 0;
}
.articles-page .pa-article-related-card {
    display: flex;
    flex-direction: row;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    text-decoration: none;
    color: inherit;
    padding: 0 !important;
    margin-bottom: 9%;
}
.articles-page .pa-article-related-img {
    width: 34%;
    min-width: 34%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    margin: 0;
}
.articles-page .pa-article-related-body {
    flex: 1;
    display: block;
    background: transparent !important;
    padding: 0 0 0 6% !important;
    font-size: 16px;
}
.articles-page .pa-article-related-body h4 {
    font-family: var(--font-body-title) !important;
    font-size: 1.3em !important;
    font-weight: 800 !important;
    line-height: 22px !important;
    color: #393641 !important;
    text-transform: none !important;
    margin: 0 0 0.5em !important;
    padding: 0 !important;
}
.articles-page .pa-article-related-card:hover h4 { color: var(--opus-copper-dark) !important; }
.articles-page .pa-article-related-excerpt {
    font-size: 1em;
    font-weight: 400;
    line-height: 1.1;
    color: #393641;
    padding-bottom: 0.2em;
    box-sizing: content-box;
}

@media only screen and (min-width: 375px) {
    .articles-page .pa-article-related-title { font-size: 24px !important; }
}
@media only screen and (min-width: 412px) {
    .articles-page .pa-article-related-title { font-size: 28px !important; }
    .articles-page .pa-article-related-body { font-size: 14px; }
    .articles-page .pa-article-related-body h4 { line-height: 25px !important; }
}
@media only screen and (min-width: 500px) {
    .articles-page .pa-article-related-body { font-size: 16px; }
    .articles-page .pa-article-related-img {
        width: 30%;
        min-width: 30%;
    }
}
@media only screen and (min-width: 600px) {
    .articles-page .pa-article-related-title { font-size: 32px !important; }
    .articles-page .pa-article-related-img {
        width: 24%;
        min-width: 24%;
    }
    .articles-page .pa-article-related-body { font-size: 18px; }
}
@media only screen and (min-width: 700px) {
    .articles-page .pa-article-related-img { display: block; }
    .articles-page .pa-article-related-body { font-size: 20px; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pa-article-related {
        padding: 5% 0;
    }
    .articles-page .pa-article-related-inner {
        width: 88%;
    }
    .articles-page .pa-article-related-title {
        font-size: 34px !important;
        line-height: 1 !important;
        text-align: left !important;
        margin-bottom: 1.2em !important;
    }
    .articles-page .pa-article-related-grid {
        display: flex;
        flex-wrap: wrap;
        margin-left: -3.3%;
    }
    .articles-page .pa-article-related-card {
        display: block;
        width: 30%;
        margin-bottom: 3%;
        margin-left: 3.3%;
    }
    .articles-page .pa-article-related-img {
        width: 100%;
        min-width: 100%;
        aspect-ratio: 100 / 57;
    }
    .articles-page .pa-article-related-body {
        padding-left: 0 !important;
        font-size: 16px;
    }
    .articles-page .pa-article-related-body h4 {
        box-sizing: content-box;
        font-size: 1.5em !important;
        line-height: 29px !important;
        margin: 0 !important;
        padding: 0.5em 0 !important;
    }
    .articles-page .pa-article-related-excerpt {
        font-size: 0.9em;
    }
}
@media only screen and (min-width: 1200px) {
    .articles-page .pa-article-related-body { font-size: 18px; }
}
@media only screen and (min-width: 1300px) {
    .articles-page .pa-article-related-title { font-size: 38px !important; }
    .articles-page .pa-article-related-body { font-size: 19px; }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pa-article-related-title { font-size: 42px !important; }
}
@media only screen and (min-width: 1900px) {
    .articles-page .pa-article-related-title { font-size: 45px !important; }
    .articles-page .pa-article-related-body { font-size: 20px; }
}

/* QA row 153: preserve the legacy related-card typography for this article. */
.cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-inner {
    max-width: 1227px;
}
.cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-grid {
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
}
.cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-body h4 {
    font-size: 28.5px !important;
    line-height: 29px;
    letter-spacing: normal;
    color: #393641 !important;
    text-align: left;
}
.cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-excerpt {
    font-size: 17.1px !important;
    line-height: 18.81px !important;
    letter-spacing: 0;
    color: #393641;
    text-align: justify;
    padding-bottom: 3px;
}

/* QA row 155: match the legacy related-card layout at all three breakpoints. */
.cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-inner {
    max-width: 1227px;
}
.cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-grid {
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
}
.cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-body h4 {
    font-size: 28.5px !important;
    line-height: 29px;
    letter-spacing: normal;
    color: #393641 !important;
    text-align: left;
}
.cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
    .pa-article-related-excerpt {
    font-size: 17.1px !important;
    line-height: 18.81px !important;
    letter-spacing: 0;
    color: #393641;
    text-align: justify;
    padding-bottom: 3px;
}

@media only screen and (max-width: 899px) {
    .articles-page .pa-article-related-inner {
        width: 80%;
        max-width: none;
    }
    .articles-page .pa-article-related-grid {
        display: block !important;
        margin-left: 0 !important;
    }
    .articles-page .pa-article-related-card {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 40px !important;
    }
    .articles-page .pa-article-related-img {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: auto !important;
        object-fit: fill !important;
        margin-bottom: 30px !important;
    }
    .articles-page .pa-article-related-body {
        padding-left: 0 !important;
        font-size: 14px !important;
    }
    .articles-page .pa-article-related-body h4 {
        font-size: 18.2px !important;
        line-height: 25px !important;
        margin: 0 0 9.1px !important;
        padding: 0 !important;
    }
    .articles-page .pa-article-related-excerpt {
        font-size: 14px !important;
        line-height: 15.4px !important;
        text-align: left !important;
        padding-bottom: 2.8px !important;
    }

    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-inner {
        width: 80%;
        max-width: none;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-grid {
        display: block !important;
        margin-left: 0 !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-card {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 40px !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-img {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: auto !important;
        object-fit: fill !important;
        margin-bottom: 30px !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body {
        padding-left: 0 !important;
        font-size: 14px !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body h4 {
        font-size: 18.2px !important;
        line-height: 25px !important;
        margin: 0 0 9.1px !important;
        padding: 0 !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-excerpt {
        font-size: 14px !important;
        line-height: 15.4px !important;
        text-align: left !important;
        padding-bottom: 2.8px !important;
    }

    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-inner {
        width: 80%;
        max-width: none;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-grid {
        display: block !important;
        margin-left: 0 !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-card {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 40px !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-img {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: auto !important;
        object-fit: fill !important;
        margin-bottom: 30px !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body {
        padding-left: 0 !important;
        font-size: 14px !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body h4 {
        font-size: 18.2px !important;
        line-height: 25px !important;
        margin: 0 0 9.1px !important;
        padding: 0 !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-excerpt {
        font-size: 14px !important;
        line-height: 15.4px !important;
        text-align: left !important;
        padding-bottom: 2.8px !important;
    }
}

@media only screen and (max-width: 600px) {
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body h4 {
        font-size: 18.2px !important;
        line-height: 25px !important;
        margin-bottom: 9.1px !important;
    }
    .cmp-custom-html[data-resource-path$="/aimran-alkaffs-greatest-legacy-is-his-family/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-excerpt {
        font-size: 14px !important;
        line-height: 15.4px !important;
        padding-bottom: 2.8px !important;
    }

    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-body h4 {
        font-size: 18.2px !important;
        line-height: 25px !important;
        margin-bottom: 9.1px !important;
    }
    .cmp-custom-html[data-resource-path$="/dean-hos-legacy-is-revolutionising-the-future-of-healthcare/jcr:content/root/container/customhtml_opus"]
        .pa-article-related-excerpt {
        font-size: 14px !important;
        line-height: 15.4px !important;
        padding-bottom: 2.8px !important;
    }
}

/* ─────────────────────────────────────────────────────────────────────────────
   PERSON CARD — 1 card per row (full width), image ~380px, text below image
   ─────────────────────────────────────────────────────────────────────────── */
.articles-page .pa-person-card {
    display: block;
    width: 100%;
    margin-bottom: 48px;
}

.articles-page .pa-person-card__img {
    display: block;
    width: 380px;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: top;
    margin: 0 0 14px 0 !important;
}

.articles-page .pa-person-card__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.articles-page .pa-person-card__name {
    font-size: 1.1em;
    font-weight: 700;
    color: #78849e;
    line-height: 1.5;
    margin-bottom: 8px;
}

.articles-page .pa-person-card__desc {
    font-size: 1.1em;
    color: var(--opus-mid);
    line-height: 1.7;
    margin-bottom: 10px;
}

.articles-page .pa-person-card__link {
    display: inline-block;
    font-size: 1.1em;
    font-weight: 600;
    color: var(--opus-copper);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.2s;
}
.articles-page .pa-person-card__link:hover { color: var(--opus-copper-dark); }

/* QA row 157: preserve the legacy campaign article typography and spacing. */
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-article-subtitle {
    margin-bottom: 35px;
}
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-person-card__body {
    align-items: stretch;
}
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-person-card__name,
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-person-card__desc {
    width: 100%;
    font-size: inherit;
    font-weight: 100;
    line-height: normal;
    color: #78849e;
    margin-bottom: 10px;
}
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-person-card__link {
    display: inline;
    align-self: flex-start;
    font-size: inherit;
    font-weight: 800;
}
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-article-content h3 {
    font-size: 30px;
    line-height: normal;
    letter-spacing: normal;
    margin-top: 0;
    margin-bottom: 24px;
}
.cmp-custom-html[data-resource-path$="/four-individuals-four-different-visions-with-one-common-goal/jcr:content/root/container/customhtml_opus"]
    .pa-article-content > p {
    font-weight: 100;
    line-height: normal;
    margin-bottom: 10px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   PERSON CARD SMALL — 1 card per row (full width), image ~200px, text below
   ─────────────────────────────────────────────────────────────────────────── */
.articles-page .pa-person-card-sm {
    display: block;
    width: 100%;
    margin-bottom: 28px;
}

.articles-page .pa-person-card-sm__img {
    display: block;
    width: 200px;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: top;
    margin: 0 0 10px 0 !important;
}

.articles-page .pa-person-card-sm__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.articles-page .pa-person-card-sm__name {
    font-size: 0.78em;
    font-weight: 700;
    color: var(--opus-copper);
    line-height: 1.45;
    margin-bottom: 6px;
}

.articles-page .pa-person-card-sm__desc {
    font-size: 0.72em;
    color: var(--opus-mid);
    line-height: 1.65;
    margin-bottom: 8px;
}

.articles-page .pa-person-card-sm__link {
    display: inline-block;
    font-size: 0.68em;
    font-weight: 600;
    color: var(--opus-copper);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.2s;
}
.articles-page .pa-person-card-sm__link:hover { color: var(--opus-copper-dark); }

/* ─── Responsive misc ────────────────────────────────────────────────────────── */
@media only screen and (max-width: 600px) {
    .articles-page .pa-article-content .pquote { float: none; width: 100%; margin: 0 0 20px 0; }
}

/* opus-home-base.css
   Shared: container, section base, section-title
*/

/* ─── Fonts ──────────────────────────────────────────────────────────────────── */
@font-face {
    font-family: 'LD';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff2') format('woff2'),
         url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/pruadviser/resources/font/LyonDisplay-Bold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Helvetica-LT';
    src: url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/055551baa1d1618.woff2') format('woff2'),
         url('../../../../../../../../etc.clientlibs/prudential-aem-singapore/components/content/customhtmlpacs/v1/customhtml/clientlibs/articles-page/resources/font/ae8dcc4c15ddc7b.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

/* ─── Scrollbar: hidden until user scrolls ───────────────────────────────────── */
html::-webkit-scrollbar-thumb {
    background: transparent;
    transition: background 0.3s;
}
html::-webkit-scrollbar-track {
    background: transparent;
}
html.is-scrolling::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.35);
}
html {
    scrollbar-color: transparent transparent;
}
html.is-scrolling {
    scrollbar-color: rgba(255, 255, 255, 0.35) transparent;
}

/* ─── Prevent horizontal scrollbar ──────────────────────────────────────────── */
.articles-page,
.opus-home-page {
    overflow-x: hidden;
}

/* ─── Global heading + img rules (mirrors livesite) ─────────────────────────── */
.articles-page .pruadviser-root h1,
.articles-page .pruadviser-root h2,
.articles-page .pruadviser-root h3,
.articles-page .pruadviser-root h4,
.articles-page .pruadviser-root h5,
.articles-page .pruadviser-root h6 {
    font-family: LD;
    font-weight: 800;
}
.articles-page .pruadviser-root b,
.articles-page .pruadviser-root strong {
    font-weight: 800;
}
.articles-page .pruadviser-root img {
    max-width: 100%;
}

/* ─── Container ─────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-container {
    width: 80%;
    max-width: 1471px;
    margin: 0 auto;
    position: relative;
}
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-container { width: 88%; }
}

@keyframes btnFrames {
    100% { background-position: -21450px 0; }
}

/* ─── Section base ────────────────────────────────────────────────────────────── */
/* Matches livesite: global 19px desktop, 16px ≤768px (same cascade pattern as .section in main.css) */
.articles-page .pruadviser-root .oh-section {
    position: relative;
    color: #353144;
    text-align: center;
    font-size: 19px;
    overflow: hidden;
}
@media only screen and (max-width: 768px) {
    .articles-page .pruadviser-root .oh-section { font-size: 16px; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-section {
        display: flex;
        scroll-margin-top: 179px;
    }
    .articles-page .pruadviser-root .oh-section .oh-container {
        display: flex;
        align-items: center;
        width: 100%;
    }
}


/* ─── Section title ───────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-section-title {
    font-family: LD;
    font-size: 2.25em; /* livesite: .section h2 { font-size: 2.25em } → 42.75px at 19px */
    font-weight: 800;
    line-height: 1;
    margin-bottom: .45em;
    letter-spacing: 1.2px; /* livesite: .section h2 { letter-spacing: 1.2px } */
    color: #353144;
}

/* opus-home-hero.css */

.articles-page .pruadviser-root .oh-hero {
    position: relative;
    background-color: #3d3b45 !important;
    padding: 4% 0;
    display: block;
    overflow: hidden;
}
.articles-page .pruadviser-root .oh-hero-overlay { display: none; }
.articles-page .pruadviser-root .oh-hero-content {
    text-align: center;
    padding: 0 13.5%;
    color: #fff;
}

/* Live hero sub-head spacing (matches 21.375px at 42.75px) */
.articles-page .pruadviser-root .oh-hero-content .oh-section-title {
    margin-bottom: 0.5em;
    font-size: 36px;
    line-height: 36px;
    letter-spacing: 1.2px;
    color: #da9c70;
}
.articles-page .pruadviser-root .oh-hero-subtitle {
    font-family: LD;
    font-size: 14px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #da9c70;
    margin-bottom: .8em;
}
.articles-page .pruadviser-root .oh-hero-title {
    font-family: LD;
    font-weight: 800;
    font-size: 36px;
    line-height: 1 !important;
    color: #fff;
    margin: 0 auto 20px !important;
    max-width: none !important;
    width: 80vw;
    padding: 0;
    letter-spacing: 1.2px;
}
.articles-page .pruadviser-root .oh-hero-text {
    font-size: 16px;
    color: #e8e4df;
    margin-bottom: 1.5em;
    letter-spacing: .015em;
}
.articles-page .pruadviser-root .oh-hero-cta {
    display: inline-block;
    font-family: LD;
    font-weight: 800;
    font-size: 16px;
    color: #fff;
    padding: .7em 2.2em .65em;
    text-decoration: none;
    border: 2px solid #da9c70;
    transition: background .3s, color .3s;
}
.articles-page .pruadviser-root .oh-hero-cta:hover {
    background: #da9c70;
}
@media only screen and (min-width: 360px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 36px !important; }
}
@media only screen and (min-width: 375px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 36px !important; }
}
@media only screen and (min-width: 600px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 40px !important; }
}
@media only screen and (min-width: 700px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 40px !important; }
}
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-hero { display: flex; }
    .articles-page .pruadviser-root .oh-hero-title {
        font-size: 47.5px !important;
        margin: 0 auto 59.375px !important;
        max-width: none !important;
        width: 73vw !important;
    }
}
@media only screen and (min-width: 1300px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 47.5px !important; }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pruadviser-root .oh-hero-title {
        padding: 0 !important;
        font-size: 47.5px !important;
    }
}
@media only screen and (min-width: 1700px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 47.5px !important; }
    .articles-page .pruadviser-root .oh-hero-text { font-size: 24px !important; }
}
@media only screen and (min-width: 1900px) {
    .articles-page .pruadviser-root .oh-hero-title { font-size: 47.5px !important; }
    .articles-page .pruadviser-root .oh-hero-text { font-size: 26px !important; }
}

/* opus-home-about.css */

.articles-page .pruadviser-root .oh-about {
    background-color: #3d3b45;
    padding: 1.95em 0;
    display: block;
}
.articles-page .pruadviser-root .oh-about-hero {
    text-align: center;
    color: #fff;
}
.articles-page .pruadviser-root .oh-about-hero-title {
    font-family: LD;
    font-weight: 800;
    font-size: 2.5em;
    line-height: 1 !important;
    color: #fff;
    margin: 0 auto 1.25em !important;
    width: 73%;
    max-width: none !important;
    padding: 0;
    letter-spacing: 1.2px;
}
.articles-page .pruadviser-root .oh-about-hero-text {
    font-size: 1em;
    color: #e8e4df;
    margin-bottom: 1.5em;
    letter-spacing: .015em;
}
.articles-page .pruadviser-root .oh-about .oh-container {
    width: 80%;
    max-width: 1640px;
    margin: 0 auto;
    position: relative;
}
.articles-page .pruadviser-root .oh-about .oh-section-title {
    color: #da9c70;
    margin-bottom: .5em;
    text-align: center;
    font-size: 36px;
    font-weight: 800;
    line-height: 36px;
    letter-spacing: 1.2px;
}
.articles-page .pruadviser-root .oh-about-text {
    font-weight: 400;
    margin-bottom: 1.5em;
    text-align: left;
    letter-spacing: .015em;
    color: #fff;
    font-size: 1em;
    line-height: normal;
}
.articles-page .pruadviser-root .oh-about-video-wrap {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    margin-bottom: 1.5em;
}
.articles-page .pruadviser-root .oh-about-video-wrap iframe {
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
}
@media only screen and (min-width: 600px) {
    .articles-page .pruadviser-root .oh-about-hero-title { font-size: 2.5em !important; }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .articles-page .pruadviser-root .oh-about {
        padding: 3.2337em 0;
    }

    .articles-page .pruadviser-root .oh-about .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
        margin-bottom: .45em;
    }
}
@media only screen and (min-width: 992px) {
    .articles-page .pruadviser-root .oh-about { display: block; }
    .articles-page .pruadviser-root .oh-about .oh-container {
        display: flex;
        align-items: center;
        width: 88%;
        margin: 0 auto;
    }
    .articles-page .pruadviser-root .oh-about-inner {
        display: flex;
        align-items: center;
        gap: 0;
        width: 100%;
    }
    .articles-page .pruadviser-root .oh-about-video-col {
        flex: 0 0 35%;
        margin-left: 5%;
    }
    .articles-page .pruadviser-root .oh-about-video-wrap { margin-bottom: 0; }
    .articles-page .pruadviser-root .oh-about-text-col {
        flex: 0 0 50%;
        max-width: 50%;
        margin-left: 10%;
        padding: 0 5%;
        text-align: justify;
    }
    .articles-page .pruadviser-root .oh-about-hero-title {
        font-size: 2.5em !important;
        margin: 0 auto 1.25em !important;
        width: 73% !important;
    }
    .articles-page .pruadviser-root .oh-about .oh-section-title {
        font-size: 2.25em;
        line-height: 1;
        margin-bottom: .45em;
    }
    .articles-page .pruadviser-root .oh-about-text {
        color: #fff;
        font-size: 19px;
        line-height: normal;
        margin-bottom: 1.5em;
        text-align: justify;
    }
}
/* ─── iPad (1000-1199px) ──────────────────────────────────────────────────── */
@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pruadviser-root .oh-about .oh-container {
        width: 80%;
    }
    .articles-page .pruadviser-root .oh-about-video-col {
        flex: 0 0 50%;
        margin-left: 0;
    }
    .articles-page .pruadviser-root .oh-about-text-col {
        flex: 0 0 50%;
        max-width: 50%;
        margin-left: 0;
        padding: 0 3%;
    }
}

@media only screen and (min-width: 1300px) {
    .articles-page .pruadviser-root .oh-about { padding: 3% 0; }
}

/* opus-home-experience.css */

/* ─── Desktop ────────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-experience {
    background: #f9f0e8;
    position: relative;
    text-align: left;
    color: #353144;
    min-height: 0;
    overflow: visible;
}
.articles-page .pruadviser-root .oh-experience .oh-container {
    width: 88%;
    max-width: 1640px;
}
.articles-page .pruadviser-root .oh-exp-figure {
    margin: 0;
    overflow: hidden;
}
.articles-page .pruadviser-root .oh-exp-figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}
.articles-page .pruadviser-root .oh-exp-content {
    width: 500px;
}
.articles-page .pruadviser-root .oh-experience .oh-section-title {
    color: #353144;
    text-align: center;
    font-size: 2.25em;
    line-height: 1;
    margin-bottom: 0.5em;
    letter-spacing: 1.2px;
}
.articles-page .pruadviser-root .oh-exp-intro {
    color: #da9c70;
    margin-bottom: 0;
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: 100;
    letter-spacing: 0.015em;
    line-height: normal;
    text-align: justify;
    max-width: 500px;
}
.articles-page .pruadviser-root .oh-exp-intro p {
    margin-bottom: 0;
    line-height: normal;
}
.articles-page .pruadviser-root .oh-exp-panels {
    margin-top: 30px;
}

/* ─── Accordion ──────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-exp-acc-item:first-child > hr {
    display: none;
}
.articles-page .pruadviser-root .oh-exp-panels hr {
    background: linear-gradient(90deg, #dca479 0, #c37146);
    height: 2px;
    border: none;
    margin: 0;
    padding: 0;
}
.articles-page .pruadviser-root .oh-exp-acc-head {
    position: relative;
    cursor: pointer;
    padding: 15px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.articles-page .pruadviser-root .oh-exp-acc-title {
    font-family: LD;
    font-size: 1em;
    color: #353144;
    font-weight: 800;
    letter-spacing: 0.015em;
    line-height: normal;
    margin: 0;
}
.articles-page .pruadviser-root .oh-exp-acc-icon {
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    transition: opacity .15s ease;
}
.articles-page .pruadviser-root .oh-exp-acc-icon::before,
.articles-page .pruadviser-root .oh-exp-acc-icon::after {
    content: '';
    width: 18px;
    height: 1px;
    background-color: #353144;
    display: block;
    position: absolute;
    top: 50%; left: 50%;
    transition: all 0.15s cubic-bezier(.42, 0, .58, 1);
    border-radius: 2px;
}
.articles-page .pruadviser-root .oh-exp-acc-icon::before {
    transform: translate(-50%, -50%) rotate(90deg);
}
.articles-page .pruadviser-root .oh-exp-acc-icon::after {
    transform: translate(-50%, -50%);
}
.articles-page .pruadviser-root .oh-exp-acc-icon.on::before {
    transform: translate(-50%, -50%) rotate(0deg);
}
.articles-page .pruadviser-root .oh-exp-acc-icon.on::after {
    transform: translate(-50%, -50%) rotate(0deg);
    opacity: 0;
}
.articles-page .pruadviser-root .oh-exp-acc-body {
    height: 0;
    overflow: hidden;
    opacity: 0;
    padding: 0;
    transition: height .6s ease, opacity .25s ease, padding .6s ease;
}
.articles-page .pruadviser-root .oh-exp-acc-item.is-open .oh-exp-acc-body {
    opacity: 1;
    padding: 0 0 20px;
}
.articles-page .pruadviser-root .oh-exp-acc-body p {
    margin-bottom: 20px;
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
/*
    font-size: 0.8889em;
*/
    font-weight: 100;
    line-height: normal;
    text-align: left;
    letter-spacing: 0.015em;
    color: #353144;
}
.articles-page .pruadviser-root .oh-exp-acc-body h5 {
    color: #da9c70;
    font-weight: 400;
    font-family: LD;
    margin-bottom: 0;
    text-align: left;
    font-size: 1em;
    line-height: normal;
    letter-spacing: 0.075em;
}
.articles-page .pruadviser-root .oh-exp-acc-body ul {
    padding-left: 20px;
    margin: 0;
}
.articles-page .pruadviser-root .oh-exp-acc-body ul li {
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: 100;
    line-height: normal;
    margin-bottom: 0;
    color: #353144;
    letter-spacing: 0.015em;
}

@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-experience {
        display: flex;
        padding: 7% 0 2%;
        min-height: 0;
    }
    .articles-page .pruadviser-root .oh-experience .oh-container {
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
        min-height: 0;
    }
    .articles-page .pruadviser-root .oh-exp-figure {
        position: absolute;
        top: 0;
        left: 0;
        width: 56.4%;
        max-width: 943px;
        aspect-ratio: 943 / 1093;
    }
    .articles-page .pruadviser-root .oh-exp-content {
        flex: 0 0 500px;
        margin-right: 8.8%;
    }
}
@media only screen and (min-width: 1500px) {
    .articles-page .pruadviser-root .oh-experience {
        min-height: 0;
    }
}

@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-experience + .oh-privileges {
        margin-top: 0;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pruadviser-root .oh-exp-content {
        max-width: 390px;
        flex: 0 0 390px;
        margin-right: 7%;
    }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pruadviser-root .oh-experience {
        padding: 7% 0 2%;
    }
    .articles-page .pruadviser-root .oh-experience .oh-container {
        max-width: 1640px;
    }
    .articles-page .pruadviser-root .oh-exp-content {
        margin-right: 144px;
    }
}

/* ─── Mobile ─────────────────────────────────────────────────────────────────── */
@media only screen and (max-width: 991px) {
    .articles-page .pruadviser-root .oh-experience {
        background: rgba(244, 225, 210, .5);
        padding: 0 0 32px;
        min-height: 0;
        overflow: visible;
    }
    .articles-page .pruadviser-root .oh-exp-figure {
        position: relative;
        width: 100%;
        height: 320px;
        margin: 0;
        overflow: hidden;
    }
    .articles-page .pruadviser-root .oh-exp-figure::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background: linear-gradient(
            135deg,
            rgba(242,228,218,.85) 0%,
            rgba(242,228,218,.4) 50%,
            transparent 100%
        );
        pointer-events: none;
        z-index: 1;
    }
    .articles-page .pruadviser-root .oh-exp-figure img {
        position: relative;
        z-index: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 20%;
    }
    .articles-page .pruadviser-root .oh-exp-content {
        width: auto;
        max-width: none;
        box-sizing: border-box;
        margin-left: 0;
        padding: 28px 22px 27px;
        background: #f9f0e8;
        border-radius: 16px 16px 0 0;
        margin-top: 12px;
        position: relative;
        z-index: 2;
    }
    .articles-page .pruadviser-root .oh-experience .oh-section-title {
        color: #2f2945;
        font-size: 36px;
        line-height: 36px;
        text-align: center;
        margin: 0 0 16.2px;
        font-weight: 800;
        letter-spacing: 1.2px;
    }
    .articles-page .pruadviser-root .oh-exp-intro {
        color: #d2a37f;
        font-size: 16px;
        line-height: normal;
        margin-bottom: 20px;
        text-align: left;
        font-weight: 100;
        letter-spacing: 0.24px;
    }
    .articles-page .pruadviser-root .oh-exp-panels {
        margin-top: 6px;
        padding-bottom: 24px;
    }
    .articles-page .pruadviser-root .oh-exp-panels hr {
        background: linear-gradient(90deg, #dca479 0%, #c37146 100%);
        height: 2px;
        margin: 0;
    }
    .articles-page .pruadviser-root .oh-exp-acc-head {
        padding: 15px 0;
    }
    .articles-page .pruadviser-root .oh-exp-acc-title {
        color: #2f2945;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0.24px;
        font-weight: 800;
        max-width: calc(100% - 38px);
    }
    .articles-page .pruadviser-root .oh-exp-acc-icon {
        width: 30px;
        height: 30px;
    }
    .articles-page .pruadviser-root .oh-exp-acc-icon::before,
    .articles-page .pruadviser-root .oh-exp-acc-icon::after {
        width: 18px;
        background-color: #2f2945;
    }
    .articles-page .pruadviser-root .oh-exp-acc-body {
        color: #2f2945;
        font-size: 16px;
    }
    .articles-page .pruadviser-root .oh-exp-acc-body p {
        font-size: 16px;
        margin-bottom: 20px;
        line-height: normal;
        letter-spacing: 0.24px;
    }
    .articles-page .pruadviser-root .oh-exp-acc-body h5 {
        color: #d8a073;
        font-size: 16px;
        margin-bottom: 0;
        line-height: normal;
        letter-spacing: 1.2px;
        font-weight: 400;
    }
    .articles-page .pruadviser-root .oh-exp-acc-body ul li {
        line-height: normal;
        margin-bottom: 0;
        font-size: 16px;
        letter-spacing: 0.24px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .articles-page .pruadviser-root .oh-experience {
        padding-bottom: 5.2632em;
    }

    .articles-page .pruadviser-root .oh-experience .oh-container {
        width: 100%;
        max-width: 100%;
    }

    .articles-page .pruadviser-root .oh-exp-figure {
        height: 872px;
    }

    .articles-page .pruadviser-root .oh-exp-figure::before {
        background: linear-gradient(
            135deg,
            rgba(242,228,218,.48) 0%,
            rgba(242,228,218,.12) 52%,
            transparent 100%
        );
    }

    .articles-page .pruadviser-root .oh-exp-content {
        margin-top: -5.2632em;
        width: 80%;
        max-width: none;
        padding: 0;
        margin-left: auto;
        margin-right: auto;
        border-radius: 0;
    }

    .articles-page .pruadviser-root .oh-exp-content .oh-section-title {
        width: 100%;
        font-size: 2.25em;
        line-height: 1em;
        margin-bottom: .45em;
        letter-spacing: .02807em;
    }

    .articles-page .pruadviser-root .oh-exp-intro {
        max-width: none;
        width: 100%;
        font-size: 1em;
        line-height: normal;
        margin-bottom: 0;
        letter-spacing: .015em;
    }

    .articles-page .pruadviser-root .oh-exp-acc-head {
        display: block;
        position: relative;
        padding: .78947em 0;
    }

    .articles-page .pruadviser-root .oh-exp-acc-title,
    .articles-page .pruadviser-root .oh-exp-acc-body h5 {
        font-size: 1em;
        line-height: normal;
    }

    .articles-page .pruadviser-root .oh-exp-acc-title {
        letter-spacing: .015em;
        max-width: none;
    }

    .articles-page .pruadviser-root .oh-exp-acc-icon {
        position: absolute;
        top: 50%;
        right: 0;
        width: 1.57895em;
        height: 1.57895em;
        transform: translateY(-50%);
    }

    .articles-page .pruadviser-root .oh-exp-acc-icon::before,
    .articles-page .pruadviser-root .oh-exp-acc-icon::after {
        width: .94737em;
    }

    .articles-page .pruadviser-root .oh-exp-acc-body h5 {
        letter-spacing: .06316em;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-exp-acc-body,
    .articles-page .pruadviser-root .oh-exp-acc-body p,
    .articles-page .pruadviser-root .oh-exp-acc-body ul li {
        font-size: 1em;
        line-height: normal;
        letter-spacing: .015em;
    }

    .articles-page .pruadviser-root .oh-exp-acc-body p {
        margin-bottom: 1.05263em;
    }

    .articles-page .pruadviser-root .oh-exp-acc-body ul li {
        margin-bottom: 0;
    }
}

/* opus-home-privileges.css */

/* ─── Desktop ────────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-privileges {
    background: #efebe6;
    position: relative;
    overflow: hidden;
    min-height: 0;
}
.articles-page .pruadviser-root .oh-privileges .oh-container {
    position: relative;
    width: 88%;
    max-width: 1640px;
    margin: 0 auto;
    padding: 0;
    min-height: 0;
    display: flex;
    align-items: center;
}
.articles-page .pruadviser-root .oh-priv-image {
    position: absolute;
    inset: 0;
    margin: 0;
    overflow: hidden;
    z-index: 0;
    /* Make the background image span the full viewport width even though the node
       lives inside the centered container. */
    width: 100vw;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}
.articles-page .pruadviser-root .oh-priv-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.articles-page .pruadviser-root .oh-priv-image::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        rgba(239,235,230,0.94) 0%,
        rgba(239,235,230,0.88) 20%,
        rgba(239,235,230,0.58) 40%,
        rgba(239,235,230,0.18) 62%,
        transparent 100%
    );
    pointer-events: none;
    z-index: 1;
}
.articles-page .pruadviser-root .oh-priv-content {
    position: relative;
    z-index: 2;
    width: 450px;
    max-width: 450px;
    padding: 0;
    text-align: left;
    margin-left: 8.8%;
}
.articles-page .pruadviser-root .oh-privileges .oh-section-title {
    font-family: LD;
    color: #353144;
    font-size: 2em;
    line-height: 1;
    margin-bottom: 0.5em; /* live: 21.375px at 42.75px */
    text-align: center;
    font-weight: 800;
    letter-spacing: 0.028em;
}
.articles-page .pruadviser-root .oh-priv-text {
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 0.8889em;
    color: #353144;
    line-height: normal;
    margin-bottom: 19px;
    letter-spacing: 0.015em;
    text-align: justify;
    max-width: 450px;
    font-weight: 100;
}
.articles-page .pruadviser-root .oh-priv-list {
    list-style: none;
    padding: 0;
    margin: 0 0 19px;
    display: inline-block;
    width: 373px;
    max-width: 373px;
}
.articles-page .pruadviser-root .oh-priv-list li {
    display: flex;
    align-items: center;
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 0.8889em;
    color: #353144;
    line-height: normal;
    letter-spacing: 0.015em;
    text-align: left;
    font-weight: 100;
    margin-bottom: 14px;
}
.articles-page .pruadviser-root .oh-priv-list-text {
    display: block;
    flex: 1 1 auto;
    text-align: justify;
    text-justify: auto;
    word-spacing: normal;
    letter-spacing: 0.015em;
}
.articles-page .pruadviser-root .oh-priv-list li:before {
    background: url('articles-page/resources/img/sprite.png') no-repeat 69.9% 77%;
    background-size: 769% auto;
    content: "";
    display: block;
    min-width: 2.2em;
    width: 2.2em;
    height: 2.2em;
    margin-right: 1em;
    flex-shrink: 0;
    margin-top: .1em;
}
.articles-page .pruadviser-root .oh-priv-list li:nth-child(2):before {
    background-position: 69.9% 91.5%;
}
.articles-page .pruadviser-root .oh-priv-list li:nth-child(3):before {
    background-position: 69.9% 62.2%;
}
.articles-page .pruadviser-root .oh-priv-list li:nth-child(4):before {
    background: url('articles-page/resources/img/rate.png') no-repeat;
    background-size: 36px;
}

@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-privileges {
        display: flex;
        padding: 0;
        min-height: 642px;
    }
    .articles-page .pruadviser-root .oh-privileges .oh-container {
        min-height: 642px;
    }
    .articles-page .pruadviser-root .oh-priv-content {
        flex: 0 0 450px;
    }
    .articles-page .pruadviser-root .oh-priv-list {
        margin-left: 38px;
    }
}
@media only screen and (min-width: 1600px) {
    .articles-page .pruadviser-root .oh-privileges .oh-container {
        max-width: 1640px;
    }
    .articles-page .pruadviser-root .oh-priv-content {
        margin-left: 144px;
    }
}

/* ─── Mobile ─────────────────────────────────────────────────────────────────── */
@media only screen and (max-width: 992px) {
    .articles-page .pruadviser-root .oh-priv-image { display: none; }
}
@media only screen and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-privileges {
        background: #efebe6;
        min-height: 0;
        padding: 2.8167em 0;
    }
    .articles-page .pruadviser-root .oh-privileges .oh-container {
        min-height: 0;
        /* Mobile/tablet should not inherit the desktop flex layout */
        display: block;
    }
    .articles-page .pruadviser-root .oh-priv-content {
        padding: 0;
        max-width: none;
        text-align: left;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
        box-sizing: border-box;
    }
    .articles-page .pruadviser-root .oh-privileges .oh-section-title {
        text-align: center;
        font-size: 36px;
        line-height: 36px;
        margin-bottom: 16.2px;
        letter-spacing: 1.2px;
    }
    .articles-page .pruadviser-root .oh-priv-text {
        max-width: none;
        text-align: left;
        font-size: 16px;
        margin-bottom: 16px;
        letter-spacing: 0.24px;
    }
    .articles-page .pruadviser-root .oh-priv-list {
        width: 100%;
        max-width: none;
        margin: 0 0 28px;
        box-sizing: border-box;
    }
    .articles-page .pruadviser-root .oh-priv-list li {
        font-size: 16px;
        align-items: flex-start;
        justify-content: flex-start;
        width: 100%;
        box-sizing: border-box;
        text-align: left;
        letter-spacing: 0.24px;
    }
    .articles-page .pruadviser-root .oh-priv-list-text {
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        text-align: left;
        overflow-wrap: anywhere;
        word-break: normal;
    }
    .articles-page .pruadviser-root .oh-priv-list li:before {
        margin-top: 0;
        margin-right: .875em;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-privileges {
        padding: 5.2547em 0;
    }

    .articles-page .pruadviser-root .oh-priv-content {
        width: 450px;
        max-width: 450px;
        padding: 0;
        margin-left: auto;
        margin-right: auto;
    }

    .articles-page .pruadviser-root .oh-privileges .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
        margin-bottom: .45em;
    }

    .articles-page .pruadviser-root .oh-priv-text {
        max-width: 450px;
        font-size: 1em;
        line-height: normal;
        letter-spacing: .015em;
        margin-bottom: 1em;
        text-align: justify;
    }

    .articles-page .pruadviser-root .oh-priv-list {
        max-width: 450px;
        margin: 0 auto 1em;
    }

    .articles-page .pruadviser-root .oh-priv-list li,
    .articles-page .pruadviser-root .oh-priv-list-text {
        font-size: 1em;
        letter-spacing: .015em;
    }
}

/* opus-home-solutions.css */

.articles-page .pruadviser-root .oh-solutions {
    background-color: #efebe6;
    padding: 6% 0;
    display: block;
}

.articles-page .pruadviser-root .oh-solutions .oh-section-title {
    text-align: center;
    margin-bottom: 1em;
    font-size: 1.375em;
    padding-bottom: 0.6em;
    position: relative;
}

.articles-page .pruadviser-root .oh-solutions .oh-section-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 10em;
    height: 5px;
    background: linear-gradient(90deg, #dca479 0, #c37146);
}

.articles-page .pruadviser-root .oh-sol-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: 0 -2%;
}

.articles-page .pruadviser-root .oh-sol-card {
    display: block;
    width: 50%;
    padding: 2%;
    color: #353144;
    text-align: left;
}

.articles-page .pruadviser-root .oh-sol-card-media-link,
.articles-page .pruadviser-root .oh-sol-card-title-link,
.articles-page .pruadviser-root .oh-sol-card-text-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.articles-page .pruadviser-root .oh-sol-card-img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
    margin-bottom: 0.8em;
}

.articles-page .pruadviser-root .oh-sol-card-img--empty {
    background: #ddd;
}

.articles-page .pruadviser-root .oh-sol-card-body {
    font-size: 1em;
}

.articles-page .pruadviser-root .oh-sol-card-title {
    font-family: LD, 'Libre Baskerville', serif;
    font-size: 1.3em;
    line-height: 1.0577em;
    margin: 0;
    color: #393641;
    font-weight: 800;
    text-align: left;
    letter-spacing: normal;
    transition: color .4s;
}

.articles-page .pruadviser-root .oh-sol-card-title-link {
    padding: 0;
}

.articles-page .pruadviser-root .oh-sol-card:hover .oh-sol-card-title,
.articles-page .pruadviser-root .oh-sol-card-title-link:hover {
    color: #da9c70;
}

.articles-page .pruadviser-root .oh-sol-card-text {
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 1em;
    color: #393641;
    line-height: 1.1em;
    letter-spacing: 0.015em;
    text-align: justify;
    font-weight: 400;
    margin: 0;
    padding-bottom: .9em;
}

@media only screen and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-sol-card {
        width: 100%;
        display: flex;
        align-items: flex-start;
        padding: 0 1.0625em 2.9375em;
    }

    .articles-page .pruadviser-root .oh-sol-card-media-link,
    .articles-page .pruadviser-root .oh-sol-card-img--empty {
        flex: 0 0 34.015%;
        width: 34.015%;
    }

    .articles-page .pruadviser-root .oh-sol-card-img {
        width: 100%;
        aspect-ratio: 1 / 1;
        height: auto;
        object-fit: cover;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-body {
        flex: 1 1 auto;
        min-width: 0;
        padding-left: 1.4756em;
    }

    .articles-page .pruadviser-root .oh-sol-card-title {
        font-size: 1.1375em;
        line-height: 1.20879em;
        margin: 0 0 .4375em;
    }

    .articles-page .pruadviser-root .oh-sol-card-text {
        font-size: .875em;
        line-height: 1.1em;
        letter-spacing: .015em;
        text-align: left;
        padding-bottom: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-solutions {
        padding: 2.5263em 0;
    }

    .articles-page .pruadviser-root .oh-solutions .oh-container {
        width: 80%;
    }

    .articles-page .pruadviser-root .oh-sol-grid {
        margin: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card {
        width: 100%;
        display: flex;
        align-items: flex-start;
        padding: 0 .89474em 3.05263em;
        align-items: start;
    }

    .articles-page .pruadviser-root .oh-sol-card-media-link,
    .articles-page .pruadviser-root .oh-sol-card-img--empty {
        flex: 0 0 147.453px;
        width: 147.453px;
        margin-right: 1.94737em;
    }

    .articles-page .pruadviser-root .oh-sol-card-img {
        width: 147.453px;
        height: 147.453px;
        object-fit: cover;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-body {
        flex: 1 1 auto;
        min-width: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-title {
        font-size: 1.36842em;
        line-height: 1.15789em;
        margin-bottom: .68421em;
    }

    .articles-page .pruadviser-root .oh-sol-card-text {
        font-size: 1.05263em;
        line-height: 1.15789em;
        padding-bottom: 0;
        text-align: left;
    }

    .articles-page .pruadviser-root .oh-sol-card-title-link {
        padding: 0;
    }
}

@media only screen and (min-width: 375px) {
    .articles-page .pruadviser-root .oh-solutions .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        margin-bottom: 2.2em;
        padding-bottom: 0;
        letter-spacing: 1.2px;
    }

    .articles-page .pruadviser-root .oh-solutions .oh-section-title::after {
        top: unset;
        bottom: -1.25em;
    }
}

@media only screen and (min-width: 412px) and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-solutions .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        letter-spacing: 1.2px;
    }
}

@media only screen and (min-width: 600px) {
    .articles-page .pruadviser-root .oh-solutions .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        letter-spacing: 1.2px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-solutions .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
    }
}

@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-solutions {
        padding: 5% 0;
        display: flex;
    }

    .articles-page .pruadviser-root .oh-solutions .oh-container {
        display: block;
        width: 88%;
        max-width: 1640px;
        font-size: 19px;
    }

    .articles-page .pruadviser-root .oh-solutions .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
        text-align: left;
        margin-bottom: 1.2em;
        font-weight: 800;
        padding: 0;
        color: #393641;
        position: relative;
    }

    .articles-page .pruadviser-root .oh-solutions .oh-section-title::after {
        display: block;
        position: absolute;
        left: 0;
        right: auto;
        top: unset;
        bottom: -20px;
        transform: none;
        width: 10em;
        height: .11696em;
        margin: 0;
    }

    .articles-page .pruadviser-root .oh-sol-grid {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -17px;
    }

    .articles-page .pruadviser-root .oh-sol-card {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
        padding: 0 17px;
        margin-bottom: 41px;
    }

    .articles-page .pruadviser-root .oh-sol-card-img {
        height: 100%;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-media-link,
    .articles-page .pruadviser-root .oh-sol-card-img--empty {
        display: block;
        overflow: hidden;
        aspect-ratio: 100 / 57;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-title {
        font-size: 1.5em;
        line-height: 1.01754em;
        margin: 0;
        letter-spacing: -0.025em;
    }

    .articles-page .pruadviser-root .oh-sol-card-title-link {
        padding: .5em 0;
    }

    .articles-page .pruadviser-root .oh-sol-card-text {
        font-size: .9em;
        line-height: 1.1em;
        letter-spacing: 0.015em;
        color: #393641;
        text-align: justify;
        padding: 0 0 .2em;
    }

    .articles-page .pruadviser-root .oh-sol-card-body {
        font-size: 1em;
    }
}

@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pruadviser-root .oh-sol-card-img {
        height: 6em;
    }
    .articles-page .pruadviser-root .oh-sol-card-body {
        font-size: 16px;
    }
}

@media only screen and (min-width: 1600px) {
    .articles-page .pruadviser-root .oh-sol-card-title {
        font-size: 1.5em;
        line-height: 1.01754em;
        letter-spacing: -0.025em;
    }

    .articles-page .pruadviser-root .oh-sol-card-text {
        font-size: .9em;
        line-height: 1.1em;
        letter-spacing: 0.015em;
    }
}

/* opus-home-stories.css */

/* ─── Section wrapper ─────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-stories {
    background-color: #efebe6;
    padding: 6% 0;
    display: block;
    box-shadow: inset 0 5px 9px 0 rgba(0, 0, 0, .05);
}

/* ─── Section title (mobile: centered) ───────────────────────────────────── */
.articles-page .pruadviser-root .oh-stories .oh-section-title {
    text-align: center;
    margin-bottom: 1em;
    font-size: 1.375em;
    padding-bottom: 0.6em;
    position: relative;
}

.articles-page .pruadviser-root .oh-stories .oh-section-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 10em;
    height: 5px;
    background: linear-gradient(90deg, #dca479 0, #c37146);
}

/* ─── Grid ───────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-stories-grid {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0;
    margin-top: 1.5em;
}

/* ─── Card — mobile ──────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-left: 0;
    color: #353144;
}

.articles-page .pruadviser-root .oh-story-media-link,
.articles-page .pruadviser-root .oh-story-title-link,
.articles-page .pruadviser-root .oh-story-excerpt-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

/* ─── Image ───────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-img {
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    margin-bottom: 0.8em;
    flex-shrink: 0;
}

.articles-page .pruadviser-root .oh-story-img--empty {
    background: #ddd;
}

/* ─── Body ────────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-body {
    padding-left: 0;
    font-size: 1em;
}

/* ─── Title ───────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-title {
    font-family: LD, 'Libre Baskerville', serif;
    font-size: 1.3em;
    line-height: 1.0577em;
    margin-bottom: .5em;
    color: #393641;
    font-weight: 800;
    text-align: left;
    letter-spacing: normal;
    transition: color .4s;
}

.articles-page .pruadviser-root .oh-story-title-link {
    padding: .5em 0;
}

.articles-page .pruadviser-root .oh-story-card:hover .oh-story-title,
.articles-page .pruadviser-root .oh-story-title-link:hover {
    color: #da9c70;
}

/* ─── Hidden card — smooth slide down ───────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-card {
    /* All cards carry the transition at all times, including when shown */
    overflow: hidden;
    max-height: 800px;
    /* large enough to fit any card */
    opacity: 1;
    margin-bottom: 8%;
    transition:
        max-height 0.55s ease,
        opacity 0.45s ease,
        margin-bottom 0.55s ease;
}

.articles-page .pruadviser-root .oh-story-card--hidden {
    max-height: 0;
    /* collapse height to zero */
    opacity: 0;
    /* fade out */
    margin-bottom: 0;
    /* remove bottom spacing */
    pointer-events: none;
    /* non-interactive while hidden */
}

/* ─── View More button ────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-stories-viewmore-wrap {
    clear: both;
    display: flex;
    justify-content: center;
    width: 100%;
    text-align: center;
    margin-top: 0;
}

@media only screen and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-story-title-link {
        padding: 0;
    }

    .articles-page .pruadviser-root .oh-stories-viewmore-wrap {
        margin-top: 40px;
    }

    .articles-page .pruadviser-root .oh-story-card--hidden {
        display: none;
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-story-card {
        margin-bottom: 2.3125em;
    }

    .articles-page .pruadviser-root .oh-story-img {
        margin-bottom: 1.875em;
    }

    .articles-page .pruadviser-root .oh-story-title {
        font-size: 1.3em;
        line-height: 1.0577em;
        margin-bottom: .5em;
    }
}

.articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch {
    position: relative;
    display: inline-block;
    background: transparent;
    border: none;
    min-width: 8.4em;
    padding: .7em 1em .65em;
    font-family: LD;
    font-size: 1em;
    font-weight: 800;
    line-height: 1em;
    color: #353144;
    cursor: pointer;
    z-index: 0;
}

.articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch::before {
    content: none;
    display: none;
}

.articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch i {
    background: url('articles-page/resources/img/btn-sprite.png') no-repeat 0 0;
    background-size: auto 100%;
    width: 286px;
    height: 115px;
    position: absolute;
    left: 53%;
    top: 54%;
    transform: translate(-50%, -50%) scale(.741);
    pointer-events: none;
    z-index: -1;
}

.articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch:hover i {
    animation: btnFrames 2s steps(75) both infinite;
}

@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch {
        min-width: 7.96em;
        padding: 13.3px 19px 12.35px 19px;
        font-size: 19px;
        line-height: 19px;
    }
}

/* ─── Excerpt ─────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-story-excerpt {
    font-family: Helvetica-LT, Helvetica, Arial, sans-serif;
    font-size: 1em;
    color: #393641;
    line-height: 1.1em;
    letter-spacing: .015em;
    text-align: justify;
    font-weight: 400;
    padding-bottom: .9em;
}

@media only screen and (min-width: 375px) {
    .articles-page .pruadviser-root .oh-stories .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        margin-bottom: 2.2em;
        padding-bottom: 0;
        letter-spacing: 1.2px;
    }

    .articles-page .pruadviser-root .oh-stories .oh-section-title::after {
        top: unset;
        bottom: -1.25em;
    }
}

@media only screen and (min-width: 412px) {
    .articles-page .pruadviser-root .oh-stories .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        letter-spacing: 1.2px;
    }

    .articles-page .pruadviser-root .oh-story-body {
        font-size: .77778em;
    }

    .articles-page .pruadviser-root .oh-story-title {
        line-height: 1.20192em;
    }
}

@media only screen and (min-width: 500px) {
    .articles-page .pruadviser-root .oh-story-body {
        font-size: .88889em;
    }
}

@media only screen and (min-width: 600px) {
    .articles-page .pruadviser-root .oh-stories .oh-section-title {
        font-size: 36px;
        line-height: 36px;
        letter-spacing: 1.2px;
    }

    .articles-page .pruadviser-root .oh-story-body {
        font-size: 1em;
    }
}

@media only screen and (min-width: 700px) {
    .articles-page .pruadviser-root .oh-story-body {
        font-size: 1.11111em;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-stories .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
    }

    .articles-page .pruadviser-root .oh-story-card {
        display: block;
        margin-bottom: 3.15789em;
    }

    .articles-page .pruadviser-root .oh-story-card.oh-story-card--hidden {
        display: none;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-story-img {
        width: 100%;
        margin-bottom: 1.57895em;
    }

    .articles-page .pruadviser-root .oh-story-body {
        font-size: 1.05263em;
    }

    .articles-page .pruadviser-root .oh-story-title {
        font-size: 1.36842em;
        line-height: 1.31579em;
        margin-bottom: .68421em;
    }

    .articles-page .pruadviser-root .oh-story-excerpt {
        font-size: 1.05263em;
        line-height: 1.15789em;
        padding-bottom: .3em;
    }

    .articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch {
        font-size: .94737em;
        line-height: 1em;
        padding: .66316em .94737em .61579em;
    }

}

/* ─── Desktop (>= 1000px) ─────────────────────────────────────────────────── */
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-stories {
        /* Live at ~1634px wide is ~81.7px top/bottom => ~5% of viewport width */
        padding: 5% 0;
        display: flex;
    }

    .articles-page .pruadviser-root .oh-stories .oh-container {
        display: block;
        width: 88%;
        max-width: 1640px;
        font-size: 19px;
    }

    .articles-page .pruadviser-root .oh-stories .oh-section-title {
        font-size: 2.25em;
        line-height: 1em;
        letter-spacing: .02807em;
        text-align: left;
        margin-bottom: 1.2em;
        font-weight: 800;
        padding: 0;
        color: #393641;
        position: relative;
    }

    .articles-page .pruadviser-root .oh-stories .oh-section-title::after {
        display: block;
        position: absolute;
        left: 0;
        right: auto;
        top: 1.55em;
        bottom: auto;
        transform: none;
        width: 10em;
        height: .11696em;
        margin: 0;
    }

    .articles-page .pruadviser-root .oh-stories-grid {
        display: flex;
        flex-wrap: wrap;
        margin-left: -3.3%;
        margin-top: 0;
    }

    .articles-page .pruadviser-root .oh-story-card {
        flex-direction: column;
        width: 30%;
        margin-left: 3.3%;
        margin-bottom: 3%;
    }

    /* Must re-declare inside media query as the rule above overrides it */
    .articles-page .pruadviser-root .oh-story-card--hidden {
        display: none;
        max-height: 0;
        opacity: 0;
        pointer-events: none;
    }

    .articles-page .pruadviser-root .oh-story-img {
        width: 100%;
        margin-bottom: 0;
        height: auto;
        aspect-ratio: 1 / 0.57;
    }

    .articles-page .pruadviser-root .oh-story-title {
        font-size: 1.5em;
        line-height: 1.01754em;
        margin: 0;
        min-height: 3.05263em;
    }

    .articles-page .pruadviser-root .oh-story-excerpt {
        font-size: .9em;
        line-height: 1.1em;
        letter-spacing: .015em;
        color: #393641;
        text-align: justify;
        min-height: 3.5em;
        padding: 0 0 .2em;
    }

    .articles-page .pruadviser-root .oh-story-body {
        font-size: 1em;
        min-height: 9.228em;
    }

    .articles-page .pruadviser-root .oh-stories-viewmore-wrap {
        margin-left: 0;
        margin-top: 40px;
        margin-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch {
        font-size: 19px;
        line-height: 19px;
        color: #353144;
    }
}

@media only screen and (min-width: 1600px) {
    .articles-page .pruadviser-root .oh-story-title {
        font-size: 1.5em;
        line-height: 1.01754em;
        letter-spacing: normal;
        min-height: 3.05263em;
    }

    .articles-page .pruadviser-root .oh-story-excerpt {
        font-size: .9em;
        line-height: 1.1em;
        letter-spacing: 0.015em;
    }
}


@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pruadviser-root .oh-story-body {
        font-size: 16px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   QUOTE / TAGLINE SECTION  (between Solutions and Stories)
   ═══════════════════════════════════════════════════════════════════════════ */

.articles-page .pruadviser-root .oh-quote {
    background-color: #f7f3ee;
    padding: 4% 0;
}

.articles-page .pruadviser-root .oh-quote-inner {
    display: flex;
    align-items: center;
    gap: 2em;
    width: 82%;
    margin: 0 auto;
}

/* Gradient rule lines on both sides */
.articles-page .pruadviser-root .oh-quote-rule {
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, transparent, #c37146 50%, transparent);
    opacity: 0.6;
}

/* Blockquote containing the text */
.articles-page .pruadviser-root .oh-quote-text {
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    max-width: 65%;
    text-align: center;
}

/* Each line of text */
.articles-page .pruadviser-root .oh-quote-line {
    display: block;
    font-family: LD, 'Libre Baskerville', serif;
    font-style: italic;
    font-size: 1.05em;
    line-height: 1.65;
    color: #7a6a5a;
    letter-spacing: 0.01em;
}

/* Mobile: hide the two rule lines, show text only */
@media only screen and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-quote-rule {
        display: none;
    }

    .articles-page .pruadviser-root .oh-quote-text {
        max-width: 100%;
    }

    .articles-page .pruadviser-root .oh-quote-line {
        font-size: 0.95em;
    }
}

/* Desktop */
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-quote {
        padding: 3% 0;
    }

    .articles-page .pruadviser-root .oh-quote-line {
        font-size: 1.2em;
    }
}

@media only screen and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-story-excerpt {
        font-size: 16px;
        line-height: 17.6px;
        letter-spacing: .015em;
        padding-bottom: .2em;
    }

    .articles-page .pruadviser-root .oh-stories-viewmore-btn.btn-touch {
        font-size: 17px;
        line-height: 17px;
        padding: 11.9px 17px 11.05px;
    }
}
/* opus-home-contact.css */

/* ─── Section wrapper ─────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact,
.opus-home-page .pruadviser-root .oh-contact {
    background-color: #393641;
    padding: 6% 0;
    display: block;
    text-align: left;
    font-size: 18px;
}

/* ─── Container ──────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact .oh-container,
.opus-home-page .pruadviser-root .oh-contact .oh-container {
    display: block !important;
    width: 88%;
    max-width: 1640px;
    margin: 0 auto;
}

.articles-page .pruadviser-root .oh-contact > .oh-container > .oh-section-title,
.articles-page .pruadviser-root .oh-contact > .oh-container > .oh-contact-text,
.opus-home-page .pruadviser-root .oh-contact > .oh-container > .oh-section-title,
.opus-home-page .pruadviser-root .oh-contact > .oh-container > .oh-contact-text {
    display: none;
}

/* ─── Section title "General Enquiries" ──────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact .oh-section-title,
.opus-home-page .pruadviser-root .oh-contact .oh-section-title {
    color: #fff;
    text-align: left;
    font-size: 28px;
    margin-bottom: 0.8em;
    padding-bottom: 0.4em;
    position: relative;
    letter-spacing: -.025em;
}
.articles-page .pruadviser-root .oh-contact .oh-section-title::after,
.opus-home-page .pruadviser-root .oh-contact .oh-section-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 120px;
    height: 3px;
    background: linear-gradient(90deg, #dca479 0, #da9c70);
}

/* ─── Two-column inner ────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact-inner,
.opus-home-page .pruadviser-root .oh-contact-inner {
    display: flex;
    flex-direction: column;
    gap: 2.5em;
}

/* ─── Left: General Enquiries ─────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact-enquiries,
.opus-home-page .pruadviser-root .oh-contact-enquiries {
    width: 100%;
    text-align: left;
    color: #fff;
}

.articles-page .pruadviser-root .oh-contact-enq-title,
.opus-home-page .pruadviser-root .oh-contact-enq-title {
    font-family: LD, 'Libre Baskerville', serif;
    font-size: 1.35em;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.5em;
    padding-bottom: 0.4em;
    position: relative;
    letter-spacing: -.01em;
}
.articles-page .pruadviser-root .oh-contact-enq-title::after,
.opus-home-page .pruadviser-root .oh-contact-enq-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 2px;
    background: #da9c70;
}

.articles-page .pruadviser-root .oh-contact-enq-block,
.opus-home-page .pruadviser-root .oh-contact-enq-block {
    margin-top: 1.4em;
    text-align: left;
}
.articles-page .pruadviser-root .oh-contact-enq-block h6,
.opus-home-page .pruadviser-root .oh-contact-enq-block h6 {
    color: #777584;
    font-size: 31.35px;
    font-weight: 800;
    font-family: LD;
    letter-spacing: normal;
    line-height: 34.485px;
    margin: 0 0 13px;
}
.articles-page .pruadviser-root .oh-contact-enq-block p,
.opus-home-page .pruadviser-root .oh-contact-enq-block p {
    color: #fff;
    font-size: 19px;
    font-weight: 100;
    line-height: normal;
    letter-spacing: 0;
    margin: 0;
    text-align: left;
}
.articles-page .pruadviser-root .oh-contact-enq-phone-group,
.opus-home-page .pruadviser-root .oh-contact-enq-phone-group {
    margin: 0 0 34.2px;
}
.articles-page .pruadviser-root .oh-contact-enq-phone-group:last-child,
.opus-home-page .pruadviser-root .oh-contact-enq-phone-group:last-child {
    margin-bottom: 34.2px;
}
.articles-page .pruadviser-root .oh-contact-enq-number,
.opus-home-page .pruadviser-root .oh-contact-enq-number {
    margin: 0;
}
.articles-page .pruadviser-root .oh-contact-enq-note,
.opus-home-page .pruadviser-root .oh-contact-enq-note {
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 100 !important;
    line-height: normal !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}
.articles-page .pruadviser-root .oh-contact-enq-block a,
.opus-home-page .pruadviser-root .oh-contact-enq-block a {
    color: #fff;
    font-size: 19px;
    font-weight: 100;
    line-height: normal;
    letter-spacing: 0;
    text-decoration: none;
    display: block;
}
.articles-page .pruadviser-root .oh-contact-enq-note-text--nowrap,
.opus-home-page .pruadviser-root .oh-contact-enq-note-text--nowrap {
    white-space: nowrap;
}
.articles-page .pruadviser-root .oh-contact-enq-block a:hover,
.opus-home-page .pruadviser-root .oh-contact-enq-block a:hover {
    color: #dca479;
}

/* ─── Vertical divider (desktop only) ────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact-divider,
.opus-home-page .pruadviser-root .oh-contact-divider {
    display: none;
}

/* ─── Right: Get In Touch ─────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact-form-col,
.opus-home-page .pruadviser-root .oh-contact-form-col {
    width: 100%;
    text-align: left;
    font-size: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.articles-page .pruadviser-root .oh-contact-form-title,
.opus-home-page .pruadviser-root .oh-contact-form-title {
    font-family: LD;
    font-size: 21.92px;
    font-weight: 800;
    line-height: 24.112px;
    color: #da9c70;
    text-align: center;
    margin: 0 0 12px;
    letter-spacing: normal;
}

.articles-page .pruadviser-root .oh-contact-form-subtitle,
.opus-home-page .pruadviser-root .oh-contact-form-subtitle {
    color: #da9c70;
    font-size: 15px;
    font-weight: 800;
    font-style: normal;
    font-family: LD;
    line-height: normal;
    margin-bottom: 7.5px;
    text-align: left;
    max-width: 529px;
}

/* ─── Desktop (>= 1000px) ─────────────────────────────────────────────────── */
@media only screen and (min-width: 1000px) {
    .articles-page .pruadviser-root .oh-contact,
    .opus-home-page .pruadviser-root .oh-contact {
        display: flex;
        padding: 4% 0;
    }

    .articles-page .pruadviser-root .oh-contact .oh-container,
    .opus-home-page .pruadviser-root .oh-contact .oh-container {
        display: block !important;
        width: 88%;
    }

    .articles-page .pruadviser-root .oh-contact .oh-section-title,
    .opus-home-page .pruadviser-root .oh-contact .oh-section-title {
        font-size: 39.6px;
        font-weight: 800;
        letter-spacing: normal;
    }

    .articles-page .pruadviser-root .oh-contact-inner,
    .opus-home-page .pruadviser-root .oh-contact-inner {
        flex-direction: row;
        align-items: flex-start;
        gap: 0;
    }

    .articles-page .pruadviser-root .oh-contact-enquiries,
    .opus-home-page .pruadviser-root .oh-contact-enquiries {
        flex: 0 0 18.061%;
        width: 18.061%;
        padding-left: 0;
        box-sizing: border-box;
        order: 1;
    }

    .articles-page .pruadviser-root .oh-contact-divider,
    .opus-home-page .pruadviser-root .oh-contact-divider {
        display: none;
    }

    .articles-page .pruadviser-root .oh-contact-form-col,
    .opus-home-page .pruadviser-root .oh-contact-form-col {
        position: relative;
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        max-width: none;
        /* Live form panel is a dark block with a left divider and large left padding */
        background: #393641;
        padding-left: 9%;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 0;
        box-sizing: border-box;
        font-size: 16px;
        line-height: normal;
        margin-left: 8.94%;
        order: 2;
    }

    .articles-page .pruadviser-root .oh-contact-form-col::before,
    .opus-home-page .pruadviser-root .oh-contact-form-col::before {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: #da9c70;
    }

    .articles-page .pruadviser-root .oh-contact-form-title,
    .opus-home-page .pruadviser-root .oh-contact-form-title {
        font-size: 39.6px;
        line-height: 43.56px;
        font-weight: 800;
        color: #efebe6;
        width: 412.85px;
        margin: 0 0 33.44px 0;
        text-align: left;
    }

    .articles-page .pruadviser-root .oh-contact-form-subtitle,
    .opus-home-page .pruadviser-root .oh-contact-form-subtitle {
        letter-spacing: -0.01em;
        line-height: 18px;
        margin-bottom: 7.5px;
        white-space: nowrap;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title,
    .opus-home-page .pruadviser-root .oh-contact-enq-title {
        font-size: 29.7px;
        line-height: 32.67px;
        font-weight: 800;
        margin-bottom: 59.565px;
        padding-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title::after,
    .opus-home-page .pruadviser-root .oh-contact-enq-title::after {
        display: block;
        width: 188px;
        height: 3px;
        left: 0;
        right: auto;
        top: calc(100% + 18.8px);
        bottom: auto;
        background: linear-gradient(90deg, #dca479 0, #da9c70);
    }

    .articles-page .pruadviser-root .oh-contact-enq-block h6,
    .opus-home-page .pruadviser-root .oh-contact-enq-block h6 {
        font-size: 29.7px;
        line-height: 32.67px;
        margin-bottom: 13px;
    }

    .articles-page .pruadviser-root .oh-contact-enq-block p,
    .opus-home-page .pruadviser-root .oh-contact-enq-block p,
    .articles-page .pruadviser-root .oh-contact-enq-block a,
    .opus-home-page .pruadviser-root .oh-contact-enq-block a {
        font-size: 18px;
        line-height: normal;
    }
}

/* ─── iPad (1000-1199px) ──────────────────────────────────────────────────── */
@media only screen and (min-width: 1000px) and (max-width: 1199px) {
    .articles-page .pruadviser-root .oh-contact-form-col,
    .opus-home-page .pruadviser-root .oh-contact-form-col {
        padding-left: 9%;
    }
    .articles-page .pruadviser-root .oh-contact-form-title,
    .opus-home-page .pruadviser-root .oh-contact-form-title {
        font-size: 35px;
        line-height: 38.5px;
        width: auto;
    }
    .articles-page .pruadviser-root .oh-contact .oh-section-title,
    .opus-home-page .pruadviser-root .oh-contact .oh-section-title {
        font-size: 35px;
    }
    .articles-page .pruadviser-root .oh-contact-enq-title,
    .opus-home-page .pruadviser-root .oh-contact-enq-title {
        font-size: 26px;
        line-height: 29px;
    }
    .articles-page .pruadviser-root .oh-contact-enq-block h6,
    .opus-home-page .pruadviser-root .oh-contact-enq-block h6 {
        font-size: 26px;
        line-height: 29px;
    }
    .articles-page .pruadviser-root .oh-contact-form-subtitle,
    .opus-home-page .pruadviser-root .oh-contact-form-subtitle {
        white-space: normal;
    }
}

/* ─── Mobile (<= 767px) ───────────────────────────────────────────────────── */
@media only screen and (max-width: 767px) {

    /* Section wrapper */
    .articles-page .pruadviser-root .oh-contact,
    .opus-home-page .pruadviser-root .oh-contact {
        background-color: transparent;
        padding: 0;
    }

    /* Full-width container */
    .articles-page .pruadviser-root .oh-contact .oh-container,
    .opus-home-page .pruadviser-root .oh-contact .oh-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0;
        margin: 0;
    }

    /* Hide outer section title */
    .articles-page .pruadviser-root .oh-contact .oh-section-title,
    .opus-home-page .pruadviser-root .oh-contact .oh-section-title {
        display: none;
    }

    /* Stack: form on top, enquiries below */
    .articles-page .pruadviser-root .oh-contact-inner,
    .opus-home-page .pruadviser-root .oh-contact-inner {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    /* Form col: horizontal padding */
    .articles-page .pruadviser-root .oh-contact-form-col,
    .opus-home-page .pruadviser-root .oh-contact-form-col {
        background-color: #393641;
        padding: 59.0391px 10% 34.4375px;
        box-sizing: border-box;
        width: 100%;
        order: 1;
    }

    /* Enquiries card: full width, light background, below form */
    .articles-page .pruadviser-root .oh-contact-enquiries,
    .opus-home-page .pruadviser-root .oh-contact-enquiries {
        background-color: #efebe6;
        padding: 6.8333em 10% 2.7331em;
        border-radius: 0;
        width: 100%;
        box-sizing: border-box;
        margin: 0;
        text-align: center;
        order: 2;
    }

    /* Inject "General Enquiries" title + orange underline via ::before */
    .articles-page .pruadviser-root .oh-contact-enquiries::before,
    .opus-home-page .pruadviser-root .oh-contact-enquiries::before {
        content: none;
    }

    /* Remove ::after */
    .articles-page .pruadviser-root .oh-contact-enquiries::after,
    .opus-home-page .pruadviser-root .oh-contact-enquiries::after {
        content: none;
    }

    /* h4 (Email, Call Us) */
    .articles-page .pruadviser-root .oh-contact-enq-block h6,
    .opus-home-page .pruadviser-root .oh-contact-enq-block h6 {
        color: #2b2a35;
        font-size: 1.65em;
        text-align: center;
    }

    /* Paragraphs and links */
    .articles-page .pruadviser-root .oh-contact-enq-block p,
    .opus-home-page .pruadviser-root .oh-contact-enq-block p,
    .articles-page .pruadviser-root .oh-contact-enq-block a,
    .opus-home-page .pruadviser-root .oh-contact-enq-block a {
        text-align: center;
        display: block;
        color: #393641;
        font-size: 18.4px;
        letter-spacing: 0.276px;
    }

    .articles-page .pruadviser-root .oh-contact-form-title,
    .opus-home-page .pruadviser-root .oh-contact-form-title {
        margin-bottom: 26.304px;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title,
    .opus-home-page .pruadviser-root .oh-contact-enq-title {
        display: block;
        color: #2b2a35;
        text-align: center;
        font-size: 28px;
        line-height: 30.8px;
        font-weight: 800;
        letter-spacing: normal;
        margin: 0 0 53.2px;
        padding-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-contact-enq-note,
    .opus-home-page .pruadviser-root .oh-contact-enq-note {
        color: #393641 !important;
        font-size: 18.4px !important;
        letter-spacing: 0.276px !important;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title::after,
    .opus-home-page .pruadviser-root .oh-contact-enq-title::after {
        left: 50%;
        right: auto;
        top: calc(100% + 18.8px);
        bottom: auto;
        transform: translateX(-50%);
        width: 60px;
    }

    /* Hide divider */
    .articles-page .pruadviser-root .oh-contact-divider,
    .opus-home-page .pruadviser-root .oh-contact-divider {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-contact,
    .opus-home-page .pruadviser-root .oh-contact {
        background-color: transparent;
        padding: 0;
    }

    .articles-page .pruadviser-root .oh-contact .oh-container,
    .opus-home-page .pruadviser-root .oh-contact .oh-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0;
        margin: 0;
    }

    .articles-page .pruadviser-root .oh-contact-inner,
    .opus-home-page .pruadviser-root .oh-contact-inner {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .articles-page .pruadviser-root .oh-contact-form-col,
    .opus-home-page .pruadviser-root .oh-contact-form-col {
        background-color: #393641;
        padding: 4.85033em 10% 2.82936em;
        width: 100%;
        order: 1;
    }

    .articles-page .pruadviser-root .oh-contact-form-title,
    .opus-home-page .pruadviser-root .oh-contact-form-title {
        font-size: 1.29895em;
        line-height: 1.1em;
        margin-bottom: 1.55747em;
        text-align: center;
        width: 100%;
        align-self: center;
    }

    .articles-page .pruadviser-root .oh-contact-form-subtitle,
    .opus-home-page .pruadviser-root .oh-contact-form-subtitle {
        text-align: left;
        margin-left: 0;
        margin-right: 0;
    }

    .articles-page .pruadviser-root .oh-contact-enquiries,
    .opus-home-page .pruadviser-root .oh-contact-enquiries {
        background-color: #efebe6;
        padding: 4.04194em 10%;
        width: 100%;
        box-sizing: border-box;
        margin: 0;
        text-align: center;
        order: 2;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title,
    .opus-home-page .pruadviser-root .oh-contact-enq-title {
        display: block;
        color: #2b2a35;
        text-align: center;
        font-size: 1.65789em;
        line-height: 1.1em;
        font-weight: 800;
        letter-spacing: normal;
        margin: 0 0 2.8em;
        padding-bottom: 0;
    }

    .articles-page .pruadviser-root .oh-contact-enq-title::after,
    .opus-home-page .pruadviser-root .oh-contact-enq-title::after {
        left: 50%;
        right: auto;
        top: calc(100% + 0.98947em);
        bottom: auto;
        transform: translateX(-50%);
        width: 60px;
    }

    .articles-page .pruadviser-root .oh-contact-enq-block h6,
    .opus-home-page .pruadviser-root .oh-contact-enq-block h6 {
        color: #2b2a35;
        text-align: center;
    }

    .articles-page .pruadviser-root .oh-contact-enq-block p,
    .opus-home-page .pruadviser-root .oh-contact-enq-block p,
    .articles-page .pruadviser-root .oh-contact-enq-block a,
    .opus-home-page .pruadviser-root .oh-contact-enq-block a {
        color: #393641;
        font-size: 1.08947em;
        letter-spacing: 0.015em;
        text-align: center;
        display: block;
    }

    .articles-page .pruadviser-root .oh-contact-enq-note,
    .opus-home-page .pruadviser-root .oh-contact-enq-note {
        color: #393641 !important;
        font-size: 1.08947em !important;
        letter-spacing: 0.015em !important;
    }
}

/* opus-home-contact-form.css */

/* ─── Form wrapper ────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact-form,
.opus-home-page .pruadviser-root .oh-contact-form {
    width: 100%;
    max-width: 529.297px;
    margin-top: 0;
    background: #393641;
    color: #fff;
    padding: 0;
    font-size: 18px;
    font-weight: 100;
}

/* ─── Two-col row (First/Last Name) ──────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-row,
.opus-home-page .pruadviser-root .oh-cf-row {
    display: block;
    gap: 0;
}
.articles-page .pruadviser-root .oh-cf-row .oh-cf-field,
.opus-home-page .pruadviser-root .oh-cf-row .oh-cf-field {
    flex: none;
}

/* ─── Field ───────────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-field,
.opus-home-page .pruadviser-root .oh-cf-field {
    margin-bottom: 0;
}
.articles-page .pruadviser-root .oh-cf-field input,
.opus-home-page .pruadviser-root .oh-cf-field input {
    width: 100%;
    max-width: 529.297px;
    box-sizing: border-box;
    background: transparent;
    border: none;
    border-bottom: 1px solid #777584;
    color: #efebe6;
    font-size: 18px;
    font-weight: 400;
    padding: 13.3px 0;
    outline: none;
    font-family: inherit;
    transition: border-color 0.2s;
    display: block;
    margin-bottom: 15.2px;
}
.articles-page .pruadviser-root .oh-cf-field input::placeholder,
.opus-home-page .pruadviser-root .oh-cf-field input::placeholder {
    color: rgba(239, 235, 230, 0.54);
}
.articles-page .pruadviser-root .oh-cf-field input:focus,
.opus-home-page .pruadviser-root .oh-cf-field input:focus {
    border-bottom-color: #da9c70;
}

/* ─── Checkbox group ──────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-check-group,
.opus-home-page .pruadviser-root .oh-cf-check-group {
    margin-top: 20px;
    margin-bottom: 0;
}
.articles-page .pruadviser-root .oh-cf-pru-fields + .oh-cf-check-group,
.opus-home-page .pruadviser-root .oh-cf-pru-fields + .oh-cf-check-group,
.articles-page .pruadviser-root .oh-cf-eu-text + .oh-cf-check-group,
.opus-home-page .pruadviser-root .oh-cf-eu-text + .oh-cf-check-group {
    margin-top: 9.5px;
}
.articles-page .pruadviser-root .oh-cf-check-label,
.opus-home-page .pruadviser-root .oh-cf-check-label {
    color: #fff;
    font-size: 18px;
    font-weight: 100;
    line-height: 1;
    margin: 0 0 9.5px;
    padding-top: 7.6px;
    display: block;
}
.articles-page .pruadviser-root .oh-cf-check-group > label,
.opus-home-page .pruadviser-root .oh-cf-check-group > label {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: #fff;
    font-size: 18px;
    font-weight: 100;
    margin: 0 47.5px 9.5px 0;
    padding: 9.5px 0;
    cursor: pointer;
    position: relative;
}
.articles-page .pruadviser-root .oh-cf-choice,
.opus-home-page .pruadviser-root .oh-cf-choice {
    user-select: none;
}
.articles-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label,
.opus-home-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    width: 100%;
    max-width: 529.297px;
    margin: 0 0 9.5px;
    padding: 7.6px 0 9.5px;
}
.articles-page .pruadviser-root .oh-cf-check-group input[type="checkbox"],
.opus-home-page .pruadviser-root .oh-cf-check-group input[type="checkbox"],
.articles-page .pruadviser-root .oh-cf-check-group input[type="radio"],
.opus-home-page .pruadviser-root .oh-cf-check-group input[type="radio"] {
    width: 13px;
    height: 13px;
    accent-color: auto;
    margin: 0;
    cursor: pointer;
    flex-shrink: 0;
    border-radius: 0;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: none;
}
.articles-page .pruadviser-root .oh-cf-choice-mark,
.opus-home-page .pruadviser-root .oh-cf-choice-mark {
    width: 19px;
    height: 19px;
    border: 1px solid #da9c70;
    border-radius: 3px;
    background: transparent;
    box-sizing: border-box;
    position: relative;
    flex: 0 0 19px;
}
.articles-page .pruadviser-root .oh-cf-choice input[type="radio"]:checked + .oh-cf-choice-mark::after,
.opus-home-page .pruadviser-root .oh-cf-choice input[type="radio"]:checked + .oh-cf-choice-mark::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #da9c70;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.articles-page .pruadviser-root .oh-cf-choice-text,
.opus-home-page .pruadviser-root .oh-cf-choice-text {
    display: inline-block;
}

/* ─── Declaration ─────────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-decl-label,
.opus-home-page .pruadviser-root .oh-cf-decl-label {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    color: #fff;
    font-size: 18px;
    font-weight: 100;
    margin: 0 0 9.5px;
    padding: 7.6px 0 9.5px;
    line-height: 19px;
    position: relative;
    box-sizing: border-box;
}
.articles-page .pruadviser-root .oh-cf-decl-label input[type="checkbox"],
.opus-home-page .pruadviser-root .oh-cf-decl-label input[type="checkbox"] {
    width: 13px;
    height: 13px;
    margin: 0;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 11px;
    z-index: 1;
}
.articles-page .pruadviser-root .oh-cf-checkmark,
.opus-home-page .pruadviser-root .oh-cf-checkmark {
    width: 19px;
    height: 19px;
    border: 1px solid #da9c70;
    border-radius: 3px;
    background: transparent;
    box-sizing: border-box;
    position: relative;
    left: auto;
    top: auto;
    flex: 0 0 19px;
}
.articles-page .pruadviser-root .oh-cf-decl-label input[type="checkbox"]:checked + .oh-cf-checkmark::after,
.opus-home-page .pruadviser-root .oh-cf-decl-label input[type="checkbox"]:checked + .oh-cf-checkmark::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #da9c70;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* ─── Consent toggle link ─────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-consent-toggle,
.opus-home-page .pruadviser-root .oh-cf-consent-toggle {
    color: inherit;
    text-decoration: underline;
    cursor: pointer;
    transition: color 0.2s;
}
.articles-page .pruadviser-root .oh-cf-consent-toggle:hover,
.opus-home-page .pruadviser-root .oh-cf-consent-toggle:hover {
    color: #da9c70;
}

/* ─── Consent body (collapsible) ─────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-consent-body,
.opus-home-page .pruadviser-root .oh-cf-consent-body {
    display: none;
    margin-top: 14px;
    /* REMOVED: background, border-left, padding */
    color: #ccc;
    font-size: 12px;
    line-height: 1.7;
}
.articles-page .pruadviser-root .oh-cf-consent-body.is-open,
.opus-home-page .pruadviser-root .oh-cf-consent-body.is-open {
    display: block;
}

/* ─── Consent title ───────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-consent-title,
.opus-home-page .pruadviser-root .oh-cf-consent-title {
    display: block;
    text-decoration: underline;
    color: #ccc;
    margin-bottom: 10px;
    font-size: 12px;   /* same as body size, not bumped up */
    font-weight: normal; /* live site uses normal weight */
}
.articles-page .pruadviser-root .oh-cf-consent-body p,
.opus-home-page .pruadviser-root .oh-cf-consent-body p {
    margin: 0 0 10px;
}
.articles-page .pruadviser-root .oh-cf-consent-body p:last-child,
.opus-home-page .pruadviser-root .oh-cf-consent-body p:last-child {
    margin-bottom: 0;
}
.articles-page .pruadviser-root .oh-cf-consent-body a,
.opus-home-page .pruadviser-root .oh-cf-consent-body a {
    color: #da9c70;
    text-decoration: underline;
}
.articles-page .pruadviser-root .oh-cf-consent-body strong,
.opus-home-page .pruadviser-root .oh-cf-consent-body strong {
    color: #ccc;
}

/* ─── Validation errors ───────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-err,
.opus-home-page .pruadviser-root .oh-cf-err {
    display: block;
    color: #da9c70;
    font-size: 0.78em;
    min-height: 0;
    margin-top: 4px;
}
.articles-page .pruadviser-root .oh-cf-invalid,
.opus-home-page .pruadviser-root .oh-cf-invalid {
    border-bottom-color: #da9c70 !important;
}
.articles-page .pruadviser-root .oh-cf-err--decl,
.opus-home-page .pruadviser-root .oh-cf-err--decl,
.articles-page .pruadviser-root .oh-cf-err--captcha,
.opus-home-page .pruadviser-root .oh-cf-err--captcha {
    display: block;
    color: #da9c70;
    font-size: 0.78em;
    margin-top: 6px;
}

/* ─── reCAPTCHA wrapper ───────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-recaptcha-wrap,
.opus-home-page .pruadviser-root .oh-cf-recaptcha-wrap {
    margin-top: 14.4px;
}

/* ─── Submit wrapper ──────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-submit-wrap,
.opus-home-page .pruadviser-root .oh-cf-submit-wrap {
    margin-top: 36.8px;
}

/* ─── Submit button ───────────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-submit.btn-touch,
.opus-home-page .pruadviser-root .oh-cf-submit.btn-touch {
    position: relative;
    display: inline-block;
    vertical-align: top;
    background: transparent;
    border: none;
    min-width: 8.4em;
    padding: 0;
    font-family: LD;
    font-size: 16px;
    font-weight: 800;
    line-height: 23px;
    height: 23px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    z-index: 0;
}
.articles-page .pruadviser-root .oh-cf-submit.btn-touch i,
.opus-home-page .pruadviser-root .oh-cf-submit.btn-touch i {
    background: url('articles-page/resources/img/btn-sprite.png') no-repeat 0 0;
    background-size: auto 100%;
    width: 286px;
    height: 115px;
    position: absolute;
    left: 53%;
    top: 54%;
    transform: translate(-50%, -50%) scale(.6);
    pointer-events: none;
    z-index: -1;
    filter: none;
}

.articles-page .pruadviser-root .oh-cf-submit.btn-touch:hover i,
.opus-home-page .pruadviser-root .oh-cf-submit.btn-touch:hover i {
    animation: btnFrames 2s steps(75) both infinite;
}

@media only screen and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-contact-form,
    .opus-home-page .pruadviser-root .oh-contact-form {
        font-size: 16px;
        padding: 0;
    }

    .articles-page .pruadviser-root .oh-cf-field input,
    .opus-home-page .pruadviser-root .oh-cf-field input,
    .articles-page .pruadviser-root .oh-cf-dob-wrap input[type="date"],
    .opus-home-page .pruadviser-root .oh-cf-dob-wrap input[type="date"] {
        font-size: 16px;
        padding: 11.2px 0;
        margin-bottom: 12.8px;
    }

    .articles-page .pruadviser-root .oh-cf-check-group,
    .opus-home-page .pruadviser-root .oh-cf-check-group {
        margin-top: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-check-label,
    .opus-home-page .pruadviser-root .oh-cf-check-label,
    .articles-page .pruadviser-root .oh-cf-check-group > label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label,
    .articles-page .pruadviser-root .oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-decl-label,
    .articles-page .pruadviser-root .oh-cf-decl-heading,
    .opus-home-page .pruadviser-root .oh-cf-decl-heading {
        font-size: 16px;
        line-height: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-check-label,
    .opus-home-page .pruadviser-root .oh-cf-check-label {
        margin: 0 0 8px;
        padding-top: 6px;
    }

    .articles-page .pruadviser-root .oh-cf-check-group > label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label {
        gap: 12px;
        margin: 0 36px 8px 0;
        padding: 8px 0;
    }

    .articles-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label,
    .articles-page .pruadviser-root .oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-decl-label {
        gap: 14px;
        margin: 0 0 8px;
        padding: 6px 0 8px;
    }

    .articles-page .pruadviser-root .oh-cf-decl-text,
    .opus-home-page .pruadviser-root .oh-cf-decl-text {
        margin: 0 0 12px;
    }

    .articles-page .pruadviser-root .oh-cf-recaptcha-wrap,
    .opus-home-page .pruadviser-root .oh-cf-recaptcha-wrap {
        margin-top: 12px;
    }

    .articles-page .pruadviser-root .oh-cf-submit-wrap,
    .opus-home-page .pruadviser-root .oh-cf-submit-wrap {
        margin-top: 28px;
    }
}

@media only screen and (min-width: 412px) {
    .articles-page .pruadviser-root .oh-cf-submit.btn-touch,
    .opus-home-page .pruadviser-root .oh-cf-submit.btn-touch {
        font-size: 17px;
    }
}

@media only screen and (min-width: 700px) {
    .articles-page .pruadviser-root .oh-cf-submit.btn-touch,
    .opus-home-page .pruadviser-root .oh-cf-submit.btn-touch {
        font-size: 18px;
    }

    .articles-page .pruadviser-root .oh-cf-submit.btn-touch i,
    .opus-home-page .pruadviser-root .oh-cf-submit.btn-touch i {
        transform: translate(-50%, -50%) scale(.74125);
    }
}

@media only screen and (min-width: 1200px) {
    .articles-page .pruadviser-root .oh-cf-submit.btn-touch,
    .opus-home-page .pruadviser-root .oh-cf-submit.btn-touch {
        font-size: 18px;
    }
}

/* ─── Full width when no enquiries column ─────────────────────────────────── */
.articles-page .pruadviser-root .oh-contact--no-enq .oh-contact-form-col,
.opus-home-page .pruadviser-root .oh-contact--no-enq .oh-contact-form-col {
    max-width: 680px;
}

/* ─── Declaration heading (label text beside checkbox) ───────────────────── */
.articles-page .pruadviser-root .oh-cf-decl-heading,
.opus-home-page .pruadviser-root .oh-cf-decl-heading {
    font-size: 18px;
    font-weight: 100;
    color: #fff;
    line-height: 19px;
    display: inline-block;
    letter-spacing: normal;
    transform: translateY(1px);
}

/* ─── Declaration sub-text ────────────────────────────────────────────────── */
.articles-page .pruadviser-root .oh-cf-decl-text,
.opus-home-page .pruadviser-root .oh-cf-decl-text {
    color: #fff;
    font-size: 12px;
    margin: 0 0 14.4px;
    line-height: normal;
    max-width: 529.297px;
}

/* ─── Hide AEM screen-reader "(opens in a new tab)" spans ────────────────── */
.articles-page .pruadviser-root .cmp-link__screen-reader-only,
.opus-home-page .pruadviser-root .cmp-link__screen-reader-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.articles-page .pruadviser-root .oh-cf-dob-wrap input[type="date"],
.opus-home-page .pruadviser-root .oh-cf-dob-wrap input[type="date"] {
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    border: none;
    border-bottom: 1px solid #777584;
    color: #efebe6;
    font-size: 19px;
    padding: 13.3px 0;
    outline: none;
    font-family: inherit;
    color-scheme: dark;
}
.articles-page .pruadviser-root .oh-cf-dob-wrap input[type="date"]:focus,
.opus-home-page .pruadviser-root .oh-cf-dob-wrap input[type="date"]:focus {
    border-bottom-color: #da9c70;
}
.oh-cf-message {
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 0.9em;
    line-height: 1.5;
}
.oh-cf-message--success {
    background: rgba(255,255,255,0.08);
    border-left: 3px solid #c37146;
    color: #fff;
}
.articles-page .pruadviser-root .oh-cf-success-band,
.opus-home-page .pruadviser-root .oh-cf-success-band {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    box-sizing: border-box;
    background: #3b3544;
    border-left: 0;
    border-radius: 0;
    color: #fff;
    padding: 38px 0 44px;
}
.articles-page .pruadviser-root .oh-cf-success-band__inner,
.opus-home-page .pruadviser-root .oh-cf-success-band__inner {
    max-width: none;
    margin: 0;
    padding: 0 24px 0 12vw;
    color: #fff;
    font-size: 34px;
    font-weight: 400;
    line-height: 1.25;
}
.oh-cf-message--error {
    background: rgba(220,50,50,0.1);
    border-left: 3px solid #e05555;
    color: #f88;
}

@media only screen and (max-width: 767px) {
    .articles-page .pruadviser-root .oh-cf-success-band,
    .opus-home-page .pruadviser-root .oh-cf-success-band {
        padding: 28px 0 32px;
    }

    .articles-page .pruadviser-root .oh-cf-success-band__inner,
    .opus-home-page .pruadviser-root .oh-cf-success-band__inner {
        padding-left: 24px;
        font-size: 26px;
        line-height: 1.3;
    }

    .articles-page .pruadviser-root .oh-contact-form,
    .opus-home-page .pruadviser-root .oh-contact-form {
        max-width: none;
        font-size: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-field input,
    .opus-home-page .pruadviser-root .oh-cf-field input,
    .articles-page .pruadviser-root .oh-cf-dob-wrap input[type="date"],
    .opus-home-page .pruadviser-root .oh-cf-dob-wrap input[type="date"] {
        font-size: 16px;
        padding: 11.2px 0;
        margin-bottom: 12.8px;
    }

    .articles-page .pruadviser-root .oh-cf-check-group,
    .opus-home-page .pruadviser-root .oh-cf-check-group {
        margin-top: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-check-label,
    .opus-home-page .pruadviser-root .oh-cf-check-label,
    .articles-page .pruadviser-root .oh-cf-check-group > label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label,
    .articles-page .pruadviser-root .oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-decl-label,
    .articles-page .pruadviser-root .oh-cf-decl-heading,
    .opus-home-page .pruadviser-root .oh-cf-decl-heading {
        font-size: 16px;
        line-height: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-check-label,
    .opus-home-page .pruadviser-root .oh-cf-check-label {
        margin: 0 0 8px;
        padding-top: 6px;
    }

    .articles-page .pruadviser-root .oh-cf-check-group > label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label {
        gap: 12px;
        margin: 0 36px 8px 0;
        padding: 8px 0;
    }

    .articles-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label.oh-cf-decl-label,
    .articles-page .pruadviser-root .oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-decl-label {
        gap: 14px;
        margin: 0 0 8px;
        padding: 6px 0 8px;
    }

    .articles-page .pruadviser-root .oh-cf-decl-text,
    .opus-home-page .pruadviser-root .oh-cf-decl-text {
        margin: 0 0 12px;
    }

    .articles-page .pruadviser-root .oh-cf-recaptcha-wrap,
    .opus-home-page .pruadviser-root .oh-cf-recaptcha-wrap {
        margin-top: 12px;
    }

    .articles-page .pruadviser-root .oh-cf-submit-wrap,
    .opus-home-page .pruadviser-root .oh-cf-submit-wrap {
        margin-top: 28px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
    .articles-page .pruadviser-root .oh-contact-form,
    .opus-home-page .pruadviser-root .oh-contact-form {
        max-width: none;
        font-size: 18px;
        padding: 0;
    }

    .articles-page .pruadviser-root .oh-cf-field input,
    .opus-home-page .pruadviser-root .oh-cf-field input,
    .articles-page .pruadviser-root .oh-cf-dob-wrap input[type="date"],
    .opus-home-page .pruadviser-root .oh-cf-dob-wrap input[type="date"] {
        font-size: 18px;
        padding: 12.6px 0;
        margin-bottom: 14.4px;
    }

    .articles-page .pruadviser-root .oh-cf-check-group,
    .opus-home-page .pruadviser-root .oh-cf-check-group {
        margin-top: 16px;
    }

    .articles-page .pruadviser-root .oh-cf-check-label,
    .opus-home-page .pruadviser-root .oh-cf-check-label,
    .articles-page .pruadviser-root .oh-cf-check-group > label,
    .opus-home-page .pruadviser-root .oh-cf-check-group > label,
    .articles-page .pruadviser-root .oh-cf-decl-label,
    .opus-home-page .pruadviser-root .oh-cf-decl-label,
    .articles-page .pruadviser-root .oh-cf-decl-heading,
    .opus-home-page .pruadviser-root .oh-cf-decl-heading {
        font-size: 18px;
        line-height: 18px;
    }

    .articles-page .pruadviser-root .oh-cf-decl-text,
    .opus-home-page .pruadviser-root .oh-cf-decl-text {
        margin: 0 0 13px;
    }

    .articles-page .pruadviser-root .oh-cf-recaptcha-wrap,
    .opus-home-page .pruadviser-root .oh-cf-recaptcha-wrap {
        margin-top: 12px;
    }

    .articles-page .pruadviser-root .oh-cf-submit-wrap,
    .opus-home-page .pruadviser-root .oh-cf-submit-wrap {
        margin-top: 28px;
    }
}