/*
=========================================================
 PETER DENG GROUP
 ABOUT PAGE V6
=========================================================
*/

body.page-id-106 {
    --ab-green-950: #052d19;
    --ab-green-900: #083b21;
    --ab-green-800: #14572f;
    --ab-green-700: #195227;

    --ab-gold: #d4b36a;

    --ab-ink: #112018;
    --ab-copy: #647069;
    --ab-muted: #7c8980;

    --ab-line: #dde6df;
    --ab-soft: #f5f8f6;
}


/* =======================================================
   HERO — NARROWER
======================================================= */

body.page-id-106 .pd-about-hero {
    position: relative !important;

    isolation: isolate;

    overflow: hidden;

    min-height: 0 !important;

    height: auto !important;

    /*
     * V5 was still too tall.
     */
    padding:
        28px
        0 !important;

    background:
        radial-gradient(
            circle at 87% 20%,
            rgba(212,179,106,.13),
            transparent 26%
        ),
        linear-gradient(
            115deg,
            #052d19 0%,
            #083b21 58%,
            #14572f 100%
        ) !important;
}


/*
 * Don't double-render the generic banknote plugin.
 */
body.page-id-106
.pd-about-hero
> .pd-banknote-art {
    display: none !important;
}


/*
 * Banknote abstract
 */
body.page-id-106 .pd-about-hero::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 0;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat:
        no-repeat;

    background-size:
        103% auto;

    background-position:
        65% 50%;

    opacity:
        .27;

    mix-blend-mode:
        screen;

    pointer-events:
        none;
}


/*
 * Security print rosette
 */
body.page-id-106 .pd-about-hero::after {
    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    right: -105px;
    top: -160px;

    border-radius: 50%;

    border:
        1px solid rgba(212,179,106,.20);

    box-shadow:
        0 0 0 22px rgba(212,179,106,.020),
        0 0 0 44px rgba(219,233,223,.018),
        0 0 0 68px rgba(212,179,106,.014);

    pointer-events:
        none;
}


/* =======================================================
   HERO LAYOUT
======================================================= */

body.page-id-106 .pd-about-hero-grid {
    position: relative;

    z-index: 2;

    display: grid !important;

    grid-template-columns:
        minmax(0,1.32fr)
        minmax(220px,.55fr) !important;

    align-items:
        center !important;

    gap:
        46px !important;

    width:
        min(calc(100% - 48px),1180px) !important;

    max-width:
        1180px !important;

    margin:
        0
        auto !important;
}


/* =======================================================
   SMALLER HERO HEADING
======================================================= */

body.page-id-106 .pd-about-hero h1 {
    max-width:
        610px !important;

    margin:
        0
        0
        12px !important;

    font-size:
        clamp(36px,4vw,48px) !important;

    line-height:
        1.01 !important;

    letter-spacing:
        -.043em !important;

    color:
        #fff !important;
}


body.page-id-106 .pd-about-hero p {
    max-width:
        575px !important;

    margin:
        0 !important;

    font-size:
        14px !important;

    line-height:
        1.58 !important;

    color:
        rgba(255,255,255,.74) !important;
}


body.page-id-106 .pd-about-hero-actions {
    margin-top:
        17px !important;
}


/* smaller image */
body.page-id-106 .pd-about-hero-image {
    max-width:
        260px !important;

    margin-left:
        auto !important;
}


body.page-id-106 .pd-about-hero-image img {
    display: block;

    width: 100% !important;

    height:
        195px !important;

    max-height:
        none !important;

    object-fit:
        cover !important;

    border-radius:
        12px !important;

    box-shadow:
        0 14px 34px rgba(0,0,0,.21),
        8px 8px 0 rgba(212,179,106,.12)
        !important;
}


/* =======================================================
   OUR STORY — REAL TWO-COLUMN CONTENT LAYOUT
======================================================= */

body.page-id-106 .pd-about-story-grid {
    display: grid !important;

    grid-template-columns:
        minmax(240px,.58fr)
        minmax(0,1.42fr)
        !important;

    align-items:
        start !important;

    gap:
        68px !important;

    width:
        min(calc(100% - 48px),1180px) !important;

    max-width:
        1180px !important;

    margin:
        0
        auto !important;

    padding:
        60px
        0
        66px !important;

    transform:
        none !important;
}


/*
 * Neutralize Gutenberg inline flex-basis values.
 */
body.page-id-106
.pd-about-story-grid
> .wp-block-column {
    flex:
        none !important;

    flex-basis:
        auto !important;

    width:
        auto !important;

    max-width:
        none !important;

    min-width:
        0 !important;

    margin:
        0 !important;
}


/* =======================================================
   STORY INTRO
======================================================= */

body.page-id-106
.pd-about-v6-intro {
    position:
        sticky;

    top:
        115px;

    align-self:
        start;
}


body.page-id-106
.pd-about-v6-intro
.pd-about-eyebrow {
    margin:
        0
        0
        14px !important;

    font-size:
        10px !important;

    line-height:
        1 !important;

    font-weight:
        800 !important;

    letter-spacing:
        .16em !important;

    text-transform:
        uppercase !important;

    color:
        var(--ab-green-700) !important;
}


body.page-id-106
.pd-about-v6-intro
h2 {
    position:
        relative;

    width:
        auto !important;

    max-width:
        330px !important;

    height:
        auto !important;

    min-height:
        0 !important;

    max-height:
        none !important;

    overflow:
        visible !important;

    margin:
        0 !important;

    padding:
        0 !important;

    white-space:
        normal !important;

    font-size:
        clamp(34px,3.5vw,46px) !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.043em !important;

    color:
        var(--ab-ink) !important;
}


body.page-id-106
.pd-about-v6-intro
h2::after {
    content: "";

    display: block;

    width:
        48px;

    height:
        3px;

    margin-top:
        21px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            var(--ab-gold),
            var(--ab-green-700)
        );
}


/* =======================================================
   RIGHT CONTENT
======================================================= */

body.page-id-106
.pd-about-v6-content {
    width:
        100% !important;

    max-width:
        none !important;
}


body.page-id-106
.pd-about-v6-blocks {
    display:
        grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        17px;
}


/* =======================================================
   STORY CARDS
======================================================= */

body.page-id-106
.pd-about-v6-card {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        235px;

    padding:
        25px
        26px;

    border:
        1px solid
        var(--ab-line);

    border-radius:
        14px;

    background:
        linear-gradient(
            145deg,
            #fff 0%,
            #fafcfa 100%
        );

    box-shadow:
        0 10px 27px
        rgba(5,45,25,.035);
}


/* banknote circle */
body.page-id-106
.pd-about-v6-card::after {
    content: "";

    position:
        absolute;

    width:
        190px;

    height:
        190px;

    right:
        -105px;

    bottom:
        -110px;

    border-radius:
        50%;

    border:
        1px solid
        rgba(25,82,39,.05);

    box-shadow:
        0 0 0 16px rgba(25,82,39,.010),
        0 0 0 32px rgba(212,179,106,.012);

    pointer-events:
        none;
}


body.page-id-106
.pd-about-v6-card-top {
    display:
        flex;

    align-items:
        center;

    gap:
        13px;

    margin-bottom:
        18px;
}


body.page-id-106
.pd-about-v6-number {
    width:
        34px;

    height:
        34px;

    flex:
        0 0 34px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid rgba(25,82,39,.13);

    border-radius:
        50%;

    background:
        #f0f6f2;

    font-size:
        10px;

    font-weight:
        800;

    color:
        var(--ab-green-700);
}


body.page-id-106
.pd-about-v6-card
h3 {
    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        none !important;

    font-size:
        18px !important;

    line-height:
        1.2 !important;

    letter-spacing:
        -.02em;

    color:
        var(--ab-ink) !important;
}


body.page-id-106
.pd-about-v6-card
h3::before {
    display:
        none !important;
}


body.page-id-106
.pd-about-v6-card-body
p {
    margin:
        0
        0
        12px !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        transparent !important;

    font-size:
        14px !important;

    line-height:
        1.68 !important;

    color:
        var(--ab-copy) !important;
}


body.page-id-106
.pd-about-v6-card-body
p:last-child {
    margin-bottom:
        0 !important;
}


/* =======================================================
   MISSION STATEMENT
======================================================= */

body.page-id-106
.pd-about-v6-mission {
    grid-column:
        1 / -1;

    display:
        grid;

    grid-template-columns:
        210px
        minmax(0,1fr);

    gap:
        28px;

    min-height:
        0;

    border-top:
        2px solid
        var(--ab-gold);

    background:
        linear-gradient(
            110deg,
            #f5f9f6 0%,
            #ffffff 58%,
            #fbf7ed 100%
        );
}


body.page-id-106
.pd-about-v6-mission
.pd-about-v6-card-top {
    display:
        block;

    margin:
        0;
}


body.page-id-106
.pd-about-v6-mission
.pd-about-v6-number {
    margin-bottom:
        17px;
}


body.page-id-106
.pd-about-v6-mission
h3 {
    font-size:
        22px !important;
}


body.page-id-106
.pd-about-v6-mission
.pd-about-v6-card-body {
    column-count:
        2;

    column-gap:
        30px;
}


/* =======================================================
   OUR APPROACH
======================================================= */

body.page-id-106 .pd-values {
    position:
        relative;

    overflow:
        hidden;

    padding:
        52px
        0
        58px !important;

    background:
        #f5f8f6 !important;
}


body.page-id-106 .pd-values::before {
    content: "";

    position:
        absolute;

    width:
        620px;

    height:
        280px;

    right:
        -200px;

    top:
        -80px;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat:
        no-repeat;

    background-size:
        100% auto;

    opacity:
        .035;

    mix-blend-mode:
        multiply;

    pointer-events:
        none;
}


body.page-id-106
.pd-values
> .pd-container {
    position:
        relative;

    z-index:
        2;
}


body.page-id-106
.pd-values-grid {
    gap:
        17px !important;

    border:
        0 !important;
}


body.page-id-106
.pd-values-grid
article {
    min-height:
        175px !important;

    padding:
        24px !important;

    border:
        1px solid
        var(--ab-line) !important;

    border-radius:
        14px !important;

    background:
        #fff !important;

    box-shadow:
        0 9px 24px
        rgba(5,45,25,.03);
}


body.page-id-106
.pd-values-grid
article > span {
    display:
        block !important;

    width:
        auto !important;

    height:
        auto !important;

    margin:
        0
        0
        13px !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        none !important;

    font-size:
        17px !important;

    font-weight:
        500 !important;

    color:
        #78a283 !important;
}


/* =======================================================
   REMOVE LEGACY SPACING
======================================================= */

body.page-id-106
.pd-about-main {
    padding:
        0 !important;
}


/* =======================================================
   TABLET
======================================================= */

@media (max-width: 900px) {

    body.page-id-106
    .pd-about-hero-grid {
        grid-template-columns:
            1fr
            220px !important;

        gap:
            30px !important;
    }


    body.page-id-106
    .pd-about-story-grid {
        grid-template-columns:
            1fr !important;

        gap:
            32px !important;
    }


    body.page-id-106
    .pd-about-v6-intro {
        position:
            static;
    }


    body.page-id-106
    .pd-about-v6-intro
    h2 {
        max-width:
            620px !important;
    }


    body.page-id-106
    .pd-about-v6-mission
    .pd-about-v6-card-body {
        column-count:
            1;
    }
}


/* =======================================================
   MOBILE
======================================================= */

@media (max-width: 650px) {

    body.page-id-106
    .pd-about-hero {
        padding:
            32px
            0 !important;
    }


    body.page-id-106
    .pd-about-hero-grid {
        width:
            min(calc(100% - 30px),1180px)
            !important;

        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-hero h1 {
        font-size:
            37px !important;
    }


    body.page-id-106
    .pd-about-hero-image {
        max-width:
            100% !important;

        margin:
            6px
            0
            0 !important;
    }


    body.page-id-106
    .pd-about-hero-image img {
        height:
            220px !important;
    }


    body.page-id-106
    .pd-about-story-grid {
        width:
            min(calc(100% - 30px),1180px)
            !important;

        padding:
            44px
            0
            48px !important;
    }


    body.page-id-106
    .pd-about-v6-intro
    h2 {
        font-size:
            35px !important;
    }


    body.page-id-106
    .pd-about-v6-blocks {
        grid-template-columns:
            1fr;
    }


    body.page-id-106
    .pd-about-v6-card {
        min-height:
            0;
    }


    body.page-id-106
    .pd-about-v6-mission {
        grid-column:
            auto;

        grid-template-columns:
            1fr;

        gap:
            17px;
    }


    body.page-id-106
    .pd-about-v6-mission
    .pd-about-v6-card-body {
        column-count:
            1;
    }


    body.page-id-106
    .pd-values {
        padding:
            46px
            0
            52px !important;
    }
}


/* =======================================================
   ABOUT STORY — PROFESSIONAL FINAL DESIGN
======================================================= */

body.page-id-106
.pd-about-story-grid {
    display: grid !important;

    grid-template-columns:
        minmax(240px,.62fr)
        minmax(0,1.38fr)
        !important;

    width:
        min(calc(100% - 48px),1180px) !important;

    max-width:
        1180px !important;

    margin:
        0
        auto !important;

    padding:
        58px
        0
        64px !important;

    gap:
        66px !important;

    align-items:
        start !important;

    transform:
        none !important;
}


/* -------------------------------------------------------
   INTRO
------------------------------------------------------- */

body.page-id-106
.pd-about-story-intro-pro {
    position: sticky;

    top: 112px;

    align-self: start;

    min-width: 0;
}


body.page-id-106
.pd-about-story-intro-pro
.pd-about-eyebrow {
    margin:
        0
        0
        14px !important;

    font-size:
        10px !important;

    font-weight:
        800 !important;

    line-height:
        1 !important;

    letter-spacing:
        .17em !important;

    text-transform:
        uppercase !important;

    color:
        var(--ab-green-700) !important;
}


body.page-id-106
.pd-about-story-intro-pro
h2 {
    width:
        auto !important;

    max-width:
        350px !important;

    height:
        auto !important;

    min-height:
        0 !important;

    max-height:
        none !important;

    overflow:
        visible !important;

    margin:
        0 !important;

    padding:
        0 !important;

    white-space:
        normal !important;

    font-size:
        clamp(34px,3.5vw,46px) !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.045em !important;

    color:
        var(--ab-ink) !important;
}


body.page-id-106
.pd-about-story-intro-pro
h2::after {
    content: "";

    display: block;

    width: 48px;
    height: 3px;

    margin-top: 22px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            var(--ab-gold),
            var(--ab-green-700)
        );
}


/* -------------------------------------------------------
   RIGHT SIDE
------------------------------------------------------- */

body.page-id-106
.pd-about-story-content-pro {
    width: 100% !important;

    max-width: none !important;

    min-width: 0;
}


body.page-id-106
.pd-about-professional-cards {
    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 18px;
}


/* -------------------------------------------------------
   CARDS
------------------------------------------------------- */

body.page-id-106
.pd-about-professional-card {
    position: relative;

    overflow: hidden;

    min-height: 225px;

    padding:
        27px
        27px
        29px;

    border:
        1px solid var(--ab-line);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            #fff 0%,
            #f8fbf9 100%
        );

    box-shadow:
        0 10px 28px
        rgba(5,45,25,.035);
}


body.page-id-106
.pd-about-professional-card::after {
    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -108px;
    bottom: -112px;

    border-radius: 50%;

    border:
        1px solid rgba(25,82,39,.05);

    box-shadow:
        0 0 0 17px rgba(25,82,39,.010),
        0 0 0 34px rgba(212,179,106,.011);

    pointer-events: none;
}


body.page-id-106
.pd-about-professional-card-top {
    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 18px;
}


body.page-id-106
.pd-about-professional-number {
    width: 36px;
    height: 36px;

    flex:
        0
        0
        36px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(25,82,39,.13);

    border-radius: 50%;

    background:
        #f0f6f2;

    font-size: 10px;

    font-weight: 800;

    color:
        var(--ab-green-700);
}


body.page-id-106
.pd-about-professional-card
h3 {
    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    background: none !important;

    font-size: 18px !important;

    line-height: 1.2 !important;

    letter-spacing: -.02em;

    color:
        var(--ab-ink) !important;
}


body.page-id-106
.pd-about-professional-card
h3::before {
    display: none !important;
}


body.page-id-106
.pd-about-professional-body
p {
    margin:
        0
        0
        13px !important;

    padding: 0 !important;

    border: 0 !important;

    background:
        transparent !important;

    font-size: 14px !important;

    line-height: 1.7 !important;

    color:
        var(--ab-copy) !important;
}


body.page-id-106
.pd-about-professional-body
p:last-child {
    margin-bottom: 0 !important;
}


/* -------------------------------------------------------
   MISSION FEATURE PANEL
------------------------------------------------------- */

body.page-id-106
.pd-about-professional-mission {
    grid-column:
        1 / -1;

    display: grid;

    grid-template-columns:
        220px
        minmax(0,1fr);

    gap: 30px;

    min-height: 0;

    padding:
        30px
        32px;

    border-top:
        2px solid var(--ab-gold);

    background:
        linear-gradient(
            110deg,
            #f5f9f6 0%,
            #fff 60%,
            #fbf7ed 100%
        );
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-card-top {
    display: block;

    margin: 0;
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-number {
    margin-bottom: 17px;
}


body.page-id-106
.pd-about-professional-mission
h3 {
    font-size:
        23px !important;
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-body {
    max-width: 650px;
}


/* =======================================================
   RESPONSIVE
======================================================= */

@media (max-width: 900px) {

    body.page-id-106
    .pd-about-story-grid {
        grid-template-columns:
            1fr !important;

        gap:
            30px !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro {
        position: static;
    }


    body.page-id-106
    .pd-about-story-intro-pro h2 {
        max-width:
            620px !important;
    }
}


@media (max-width: 650px) {

    body.page-id-106
    .pd-about-story-grid {
        width:
            min(calc(100% - 30px),1180px)
            !important;

        padding:
            44px
            0
            48px !important;
    }


    body.page-id-106
    .pd-about-professional-cards {
        grid-template-columns:
            1fr;
    }


    body.page-id-106
    .pd-about-professional-card {
        min-height:
            0;
    }


    body.page-id-106
    .pd-about-professional-mission {
        grid-column:
            auto;

        grid-template-columns:
            1fr;

        gap:
            18px;

        padding:
            27px;
    }
}


/* =======================================================
   ABOUT FINAL TYPOGRAPHY + BANKNOTE CARD REFINEMENT
======================================================= */


/* =======================================================
   HERO — MORE PROPORTIONAL
======================================================= */

body.page-id-106 .pd-about-hero {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}


/*
 * Reduce the oversized homepage-style heading.
 * Keep it substantial, but appropriate for an inner page.
 */
body.page-id-106 .pd-about-hero h1 {
    max-width: 560px !important;

    font-size:
        clamp(32px, 3.15vw, 42px) !important;

    line-height: 1.025 !important;

    letter-spacing: -.038em !important;

    margin-bottom: 12px !important;
}


/* Supporting copy stays visually secondary */
body.page-id-106 .pd-about-hero p {
    max-width: 540px !important;

    font-size: 13.5px !important;

    line-height: 1.55 !important;
}


body.page-id-106 .pd-about-hero-actions {
    margin-top: 16px !important;
}


/*
 * Slightly smaller image keeps the banner compact.
 */
body.page-id-106 .pd-about-hero-image {
    max-width: 245px !important;
}


body.page-id-106 .pd-about-hero-image img {
    height: 182px !important;

    border-radius: 11px !important;
}


/* =======================================================
   OUR STORY LEFT HEADING
======================================================= */

/*
 * Current heading is too large for a narrow editorial column.
 * Aim for roughly three balanced lines on desktop.
 */
body.page-id-106
.pd-about-story-intro-pro
h2 {
    max-width: 340px !important;

    font-size:
        clamp(29px, 2.45vw, 36px) !important;

    line-height: 1.045 !important;

    letter-spacing: -.036em !important;
}


/* Slightly smaller accent rule */
body.page-id-106
.pd-about-story-intro-pro
h2::after {
    width: 42px !important;

    height: 2px !important;

    margin-top: 18px !important;
}


/* =======================================================
   PROFESSIONAL CARDS — BANKNOTE ARTWORK
======================================================= */

body.page-id-106
.pd-about-professional-card {
    isolation: isolate;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.97) 0%,
            rgba(249,252,250,.97) 100%
        ) !important;
}


/*
 * Real guilloche engraving rather than only a circular outline.
 */
body.page-id-106
.pd-about-professional-card::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 0;

    pointer-events: none;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat: no-repeat;

    background-size: 165% auto;

    background-position: 78% 76%;

    opacity: .055;

    mix-blend-mode: multiply;
}


/*
 * Existing circular engraving detail can remain,
 * but make it quieter.
 */
body.page-id-106
.pd-about-professional-card::after {
    opacity: .65;
}


/*
 * Everything readable stays above the artwork.
 */
body.page-id-106
.pd-about-professional-card
> * {
    position: relative;

    z-index: 2;
}


/* -------------------------------------------------------
   CARD 01
------------------------------------------------------- */

body.page-id-106
.pd-about-professional-card-1::before {
    background-size: 175% auto;

    background-position: 22% 74%;

    opacity: .052;
}


/* -------------------------------------------------------
   CARD 02
------------------------------------------------------- */

body.page-id-106
.pd-about-professional-card-2::before {
    background-size: 160% auto;

    background-position: 88% 30%;

    opacity: .055;
}


/* =======================================================
   MISSION FEATURE — STRONGER BANKNOTE COMPOSITION
======================================================= */

body.page-id-106
.pd-about-professional-mission::before {
    background-size: 115% auto;

    background-position: 74% 58%;

    opacity: .075;
}


body.page-id-106
.pd-about-professional-mission {
    background:
        linear-gradient(
            110deg,
            rgba(245,249,246,.97) 0%,
            rgba(255,255,255,.96) 58%,
            rgba(251,247,237,.96) 100%
        ) !important;
}


/* =======================================================
   CARD TYPOGRAPHY
======================================================= */

body.page-id-106
.pd-about-professional-card
h3 {
    font-size: 17px !important;

    line-height: 1.2 !important;
}


body.page-id-106
.pd-about-professional-body
p {
    font-size: 13.5px !important;

    line-height: 1.68 !important;
}


body.page-id-106
.pd-about-professional-mission
h3 {
    font-size: 21px !important;
}


/* =======================================================
   RESPONSIVE
======================================================= */

@media (max-width: 900px) {

    body.page-id-106
    .pd-about-hero h1 {
        font-size:
            clamp(31px, 4.5vw, 39px) !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro
    h2 {
        max-width: 560px !important;

        font-size:
            clamp(29px, 4vw, 35px) !important;
    }


    body.page-id-106
    .pd-about-hero-image {
        max-width: 225px !important;
    }
}


@media (max-width: 650px) {

    body.page-id-106
    .pd-about-hero {
        padding-top: 30px !important;

        padding-bottom: 30px !important;
    }


    body.page-id-106
    .pd-about-hero h1 {
        max-width: 100% !important;

        font-size: 34px !important;
    }


    body.page-id-106
    .pd-about-hero-image {
        max-width: 100% !important;
    }


    body.page-id-106
    .pd-about-hero-image img {
        height: 215px !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro
    h2 {
        max-width: 100% !important;

        font-size: 31px !important;
    }


    body.page-id-106
    .pd-about-professional-card::before {
        background-size: 210% auto;

        opacity: .04;
    }
}



/* =======================================================
   ABOUT PAGE — FINAL CORRECTION
   Actual block classes + Gutenberg breakout
======================================================= */


/* =======================================================
   REAL ABOUT HERO
======================================================= */

body.page-id-106 .pd-about-block-hero,
body.page-id-106 .pd-about-hero {
    position: relative !important;

    min-height: 0 !important;
    height: auto !important;

    padding-top: 22px !important;
    padding-bottom: 22px !important;

    overflow: hidden;
    isolation: isolate;
}


/* =======================================================
   REAL HERO GRID
======================================================= */

body.page-id-106 .pd-about-block-hero-grid,
body.page-id-106 .pd-about-hero-grid {
    width:
        min(calc(100vw - 48px), 1180px) !important;

    max-width:
        1180px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    grid-template-columns:
        minmax(0,1.42fr)
        minmax(205px,.58fr)
        !important;

    gap: 40px !important;

    align-items: center !important;
}


/* =======================================================
   HERO H1 — ACTUALLY SMALLER
======================================================= */

body.page-id-106 .pd-about-block-hero h1,
body.page-id-106 .pd-about-hero h1 {
    width: auto !important;

    max-width: 510px !important;

    margin:
        0
        0
        10px !important;

    font-size:
        clamp(29px, 2.75vw, 38px) !important;

    line-height: 1.035 !important;

    letter-spacing: -.035em !important;

    white-space: normal !important;
}


/* supporting text */
body.page-id-106 .pd-about-block-hero p,
body.page-id-106 .pd-about-hero p {
    max-width: 520px !important;

    font-size: 13px !important;

    line-height: 1.55 !important;
}


/* actions */
body.page-id-106 .pd-about-block-actions,
body.page-id-106 .pd-about-hero-actions {
    margin-top: 15px !important;
}


/* =======================================================
   HERO IMAGE
======================================================= */

body.page-id-106 .pd-about-block-hero-image,
body.page-id-106 .pd-about-hero-image {
    width: 100% !important;

    max-width: 225px !important;

    margin-left: auto !important;
}


body.page-id-106 .pd-about-block-hero-image img,
body.page-id-106 .pd-about-hero-image img {
    display: block;

    width: 100% !important;

    height: 168px !important;

    max-height: none !important;

    object-fit: cover !important;

    border-radius: 11px !important;
}


/* =======================================================
   HERO BANKNOTE ABSTRACT
======================================================= */

body.page-id-106 .pd-about-block-hero::before,
body.page-id-106 .pd-about-hero::before {
    content: "" !important;

    position: absolute !important;

    inset: 0 !important;

    z-index: 0 !important;

    background-image:
        url("./peterdeng-guilloche.svg") !important;

    background-repeat:
        no-repeat !important;

    background-size:
        102% auto !important;

    background-position:
        65% 53% !important;

    opacity: .25 !important;

    mix-blend-mode:
        screen !important;

    pointer-events:
        none !important;
}


body.page-id-106 .pd-about-block-hero > *,
body.page-id-106 .pd-about-hero > * {
    position: relative;

    z-index: 2;
}


/* =======================================================
   OUR STORY — BREAK OUT OF GUTENBERG NARROW COLUMN
======================================================= */

body.page-id-106 .pd-about-story-grid {
    display: grid !important;

    /*
     * Force same full content rail used by site.
     * This is the important correction.
     */
    width:
        min(calc(100vw - 48px), 1180px) !important;

    max-width:
        1180px !important;

    margin-left:
        50% !important;

    margin-right:
        0 !important;

    transform:
        translateX(-50%) !important;

    grid-template-columns:
        minmax(220px,.54fr)
        minmax(0,1.46fr)
        !important;

    gap:
        54px !important;

    align-items:
        start !important;

    padding-top:
        52px !important;

    padding-bottom:
        58px !important;
}


/* =======================================================
   FORCE INTRO COLUMN VISIBLE
======================================================= */

body.page-id-106
.pd-about-story-grid
> .wp-block-column:first-child {
    display: block !important;

    visibility: visible !important;

    opacity: 1 !important;

    width: auto !important;

    min-width: 0 !important;
}


body.page-id-106
.pd-about-story-intro-pro {
    display: block !important;

    position: static !important;

    visibility: visible !important;

    opacity: 1 !important;
}


/* =======================================================
   OUR STORY EYEBROW
======================================================= */

body.page-id-106
.pd-about-story-intro-pro
.pd-about-eyebrow {
    display: block !important;

    margin:
        0
        0
        12px !important;

    font-size: 9px !important;

    font-weight: 800 !important;

    letter-spacing: .17em !important;

    text-transform: uppercase !important;

    color: #195227 !important;
}


/* =======================================================
   OUR STORY H2 — SMALLER / PROPORTIONAL
======================================================= */

body.page-id-106
.pd-about-story-intro-pro
h2 {
    display: block !important;

    width: auto !important;

    max-width: 270px !important;

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    overflow: visible !important;

    margin: 0 !important;

    padding: 0 !important;

    font-size:
        clamp(27px, 2.25vw, 33px) !important;

    line-height: 1.055 !important;

    letter-spacing: -.033em !important;

    white-space: normal !important;

    color: #112018 !important;
}


body.page-id-106
.pd-about-story-intro-pro
h2::after {
    content: "";

    display: block !important;

    width: 40px !important;

    height: 2px !important;

    margin-top: 17px !important;

    background:
        linear-gradient(
            90deg,
            #d4b36a,
            #195227
        ) !important;
}


/* =======================================================
   RIGHT COLUMN — USE ALL AVAILABLE WIDTH
======================================================= */

body.page-id-106
.pd-about-story-content-pro {
    display: block !important;

    width: 100% !important;

    max-width: none !important;

    min-width: 0 !important;
}


body.page-id-106
.pd-about-professional-cards {
    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        repeat(2,minmax(0,1fr))
        !important;

    gap: 18px !important;
}


/* =======================================================
   ABOUT CARDS
======================================================= */

body.page-id-106
.pd-about-professional-card {
    position: relative;

    isolation: isolate;

    overflow: hidden;

    width: auto !important;

    min-width: 0 !important;

    min-height: 210px !important;

    padding:
        24px
        25px
        26px !important;

    border:
        1px solid #dde6df !important;

    border-radius:
        14px !important;

    background:
        rgba(255,255,255,.94) !important;

    box-shadow:
        0
        10px
        28px
        rgba(5,45,25,.035)
        !important;
}


/* =======================================================
   REAL BANKNOTE ART INSIDE CARDS
======================================================= */

body.page-id-106
.pd-about-professional-card::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 0;

    pointer-events: none;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat:
        no-repeat;

    background-size:
        125% auto;

    background-position:
        62% 68%;

    opacity:
        .10;

    mix-blend-mode:
        multiply;
}


/*
 * soft white layer prevents design from hurting readability
 */
body.page-id-106
.pd-about-professional-card::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,.91) 0%,
            rgba(255,255,255,.82) 57%,
            rgba(247,250,248,.70) 100%
        );

    pointer-events: none;
}


body.page-id-106
.pd-about-professional-card
> * {
    position: relative;

    z-index: 3;
}


/* =======================================================
   DIFFERENT BANKNOTE CROP — CARD 1
======================================================= */

body.page-id-106
.pd-about-professional-card-1::before {
    background-size:
        138% auto;

    background-position:
        14% 72%;

    opacity:
        .105;
}


/* =======================================================
   DIFFERENT BANKNOTE CROP — CARD 2
======================================================= */

body.page-id-106
.pd-about-professional-card-2::before {
    background-size:
        132% auto;

    background-position:
        92% 30%;

    opacity:
        .10;
}


/* =======================================================
   MISSION
======================================================= */

body.page-id-106
.pd-about-professional-mission {
    grid-column:
        1 / -1 !important;

    display: grid !important;

    grid-template-columns:
        190px
        minmax(0,1fr)
        !important;

    gap:
        27px !important;

    min-height:
        0 !important;

    padding:
        27px
        29px !important;

    border-top:
        2px solid #d4b36a !important;
}


body.page-id-106
.pd-about-professional-mission::before {
    background-size:
        93% auto;

    background-position:
        65% 52%;

    opacity:
        .13;
}


body.page-id-106
.pd-about-professional-mission::after {
    background:
        linear-gradient(
            105deg,
            rgba(246,250,247,.91) 0%,
            rgba(255,255,255,.82) 53%,
            rgba(251,247,237,.72) 100%
        );
}


/* =======================================================
   CARD TYPOGRAPHY
======================================================= */

body.page-id-106
.pd-about-professional-number {
    width: 32px !important;

    height: 32px !important;

    flex-basis: 32px !important;

    font-size: 9px !important;
}


body.page-id-106
.pd-about-professional-card h3 {
    font-size:
        16px !important;

    line-height:
        1.2 !important;
}


body.page-id-106
.pd-about-professional-body p {
    font-size:
        13px !important;

    line-height:
        1.66 !important;
}


body.page-id-106
.pd-about-professional-mission h3 {
    font-size:
        19px !important;
}


/* =======================================================
   TABLET
======================================================= */

@media (max-width: 900px) {

    body.page-id-106
    .pd-about-story-grid {
        grid-template-columns:
            1fr !important;

        gap:
            28px !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro h2 {
        max-width:
            500px !important;
    }


    body.page-id-106
    .pd-about-block-hero h1,
    body.page-id-106
    .pd-about-hero h1 {
        font-size:
            34px !important;
    }
}


/* =======================================================
   MOBILE
======================================================= */

@media (max-width: 650px) {

    body.page-id-106
    .pd-about-story-grid {
        width:
            min(calc(100vw - 30px),1180px)
            !important;

        padding-top:
            40px !important;

        padding-bottom:
            45px !important;
    }


    body.page-id-106
    .pd-about-professional-cards {
        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-professional-mission {
        grid-column:
            auto !important;

        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-block-hero-grid,
    body.page-id-106
    .pd-about-hero-grid {
        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-block-hero h1,
    body.page-id-106
    .pd-about-hero h1 {
        max-width:
            100% !important;

        font-size:
            32px !important;
    }


    body.page-id-106
    .pd-about-block-hero-image,
    body.page-id-106
    .pd-about-hero-image {
        max-width:
            100% !important;
    }


    body.page-id-106
    .pd-about-block-hero-image img,
    body.page-id-106
    .pd-about-hero-image img {
        height:
            215px !important;
    }
}



/* =======================================================
   ABOUT STORY — FINAL CLEAN RESET
======================================================= */

body.page-id-106 .pd-about-story {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding:
        54px
        0
        58px !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdfb 100%
        );

    overflow: hidden;
}


body.page-id-106 .pd-about-story::before {
    content: "";

    position: absolute;

    width: 640px;
    height: 340px;

    left: -300px;
    bottom: -160px;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat: no-repeat;

    background-size:
        100% auto;

    background-position:
        center;

    opacity: .03;

    mix-blend-mode:
        multiply;

    pointer-events: none;
}


body.page-id-106 .pd-about-story-grid {
    position: relative;

    z-index: 2;

    display: grid !important;

    grid-template-columns:
        280px
        minmax(0, 1fr)
        !important;

    gap:
        48px !important;

    align-items:
        start !important;

    width:
        min(calc(100% - 48px), 1180px) !important;

    max-width:
        1180px !important;

    margin:
        0
        auto !important;

    padding:
        0 !important;

    transform:
        none !important;
}


body.page-id-106
.pd-about-story-grid
> .wp-block-column {
    flex:
        none !important;

    flex-basis:
        auto !important;

    width:
        auto !important;

    max-width:
        none !important;

    min-width:
        0 !important;

    margin:
        0 !important;
}


body.page-id-106
.pd-about-story-intro-pro {
    position: sticky !important;

    top:
        110px !important;

    align-self:
        start !important;

    display:
        block !important;

    width:
        100% !important;
}


body.page-id-106
.pd-about-story-intro-pro
.pd-about-eyebrow {
    display:
        block !important;

    margin:
        0
        0
        13px !important;

    padding:
        0 !important;

    font-size:
        9px !important;

    line-height:
        1 !important;

    font-weight:
        800 !important;

    letter-spacing:
        .17em !important;

    text-transform:
        uppercase !important;

    color:
        #195227 !important;
}


body.page-id-106
.pd-about-story-intro-pro
h2 {
    display:
        block !important;

    width:
        100% !important;

    max-width:
        270px !important;

    height:
        auto !important;

    min-height:
        0 !important;

    max-height:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    overflow:
        visible !important;

    white-space:
        normal !important;

    font-size:
        clamp(27px, 2.1vw, 34px) !important;

    line-height:
        1.05 !important;

    letter-spacing:
        -.035em !important;

    color:
        #112018 !important;
}


body.page-id-106
.pd-about-story-intro-pro
h2::after {
    content: "";

    display:
        block !important;

    width:
        42px !important;

    height:
        2px !important;

    margin-top:
        18px !important;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            #d4b36a,
            #195227
        ) !important;
}


body.page-id-106
.pd-about-story-content-pro {
    width:
        100% !important;

    max-width:
        none !important;

    min-width:
        0 !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


body.page-id-106
.pd-about-professional-cards {
    display:
        grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;

    gap:
        18px !important;

    width:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


body.page-id-106
.pd-about-professional-card {
    position:
        relative;

    isolation:
        isolate;

    overflow:
        hidden;

    width:
        auto !important;

    min-width:
        0 !important;

    min-height:
        220px !important;

    padding:
        26px
        27px
        28px !important;

    margin:
        0 !important;

    border:
        1px
        solid
        #dce5df !important;

    border-radius:
        14px !important;

    background:
        #ffffff !important;

    box-shadow:
        0
        12px
        30px
        rgba(5,45,25,.045)
        !important;
}


body.page-id-106
.pd-about-professional-card::before {
    content: "";

    position:
        absolute;

    inset:
        0;

    z-index:
        0;

    background-image:
        url("./peterdeng-guilloche.svg");

    background-repeat:
        no-repeat;

    background-size:
        135% auto;

    background-position:
        72% 70%;

    opacity:
        .085;

    mix-blend-mode:
        multiply;

    pointer-events:
        none;
}


body.page-id-106
.pd-about-professional-card::after {
    content: "";

    position:
        absolute;

    inset:
        0;

    z-index:
        1;

    background:
        linear-gradient(
            115deg,
            rgba(255,255,255,.94) 0%,
            rgba(255,255,255,.86) 62%,
            rgba(247,250,248,.73) 100%
        );

    pointer-events:
        none;
}


body.page-id-106
.pd-about-professional-card
> * {
    position:
        relative;

    z-index:
        3;
}


body.page-id-106
.pd-about-professional-card-1::before {
    background-size:
        145% auto;

    background-position:
        15% 74%;

    opacity:
        .09;
}


body.page-id-106
.pd-about-professional-card-2::before {
    background-size:
        138% auto;

    background-position:
        91% 28%;

    opacity:
        .085;
}


body.page-id-106
.pd-about-professional-card-top {
    display:
        flex !important;

    align-items:
        center !important;

    gap:
        13px !important;

    margin:
        0
        0
        18px !important;
}


body.page-id-106
.pd-about-professional-number {
    width:
        34px !important;

    height:
        34px !important;

    flex:
        0
        0
        34px !important;

    display:
        grid !important;

    place-items:
        center !important;

    border:
        1px
        solid
        rgba(25,82,39,.14) !important;

    border-radius:
        50% !important;

    background:
        #f0f6f2 !important;

    font-size:
        9px !important;

    font-weight:
        800 !important;

    color:
        #195227 !important;
}


body.page-id-106
.pd-about-professional-card
h3 {
    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        transparent !important;

    font-size:
        17px !important;

    line-height:
        1.2 !important;

    letter-spacing:
        -.02em !important;

    color:
        #112018 !important;
}


body.page-id-106
.pd-about-professional-body
p {
    margin:
        0
        0
        12px !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        transparent !important;

    font-size:
        13.5px !important;

    line-height:
        1.68 !important;

    color:
        #647069 !important;
}


body.page-id-106
.pd-about-professional-body
p:last-child {
    margin-bottom:
        0 !important;
}


body.page-id-106
.pd-about-professional-mission {
    grid-column:
        1 / -1 !important;

    display:
        grid !important;

    grid-template-columns:
        190px
        minmax(0,1fr)
        !important;

    gap:
        30px !important;

    min-height:
        0 !important;

    padding:
        28px
        30px !important;

    border-top:
        2px
        solid
        #d4b36a !important;

    background:
        #fff !important;
}


body.page-id-106
.pd-about-professional-mission::before {
    background-size:
        100% auto;

    background-position:
        66% 54%;

    opacity:
        .12;
}


body.page-id-106
.pd-about-professional-mission::after {
    background:
        linear-gradient(
            110deg,
            rgba(246,250,247,.94) 0%,
            rgba(255,255,255,.86) 56%,
            rgba(251,247,237,.73) 100%
        );
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-card-top {
    display:
        block !important;

    margin:
        0 !important;
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-number {
    margin-bottom:
        17px !important;
}


body.page-id-106
.pd-about-professional-mission
h3 {
    font-size:
        21px !important;
}


body.page-id-106
.pd-about-professional-mission
.pd-about-professional-body {
    max-width:
        680px !important;
}


@media (max-width: 900px) {

    body.page-id-106
    .pd-about-story-grid {
        grid-template-columns:
            1fr !important;

        gap:
            30px !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro {
        position:
            static !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro
    h2 {
        max-width:
            560px !important;
    }
}


@media (max-width: 650px) {

    body.page-id-106
    .pd-about-story {
        padding:
            42px
            0
            48px !important;
    }


    body.page-id-106
    .pd-about-story-grid {
        width:
            min(calc(100% - 30px),1180px)
            !important;

        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-story-intro-pro
    h2 {
        max-width:
            100% !important;

        font-size:
            29px !important;
    }


    body.page-id-106
    .pd-about-professional-cards {
        grid-template-columns:
            1fr !important;
    }


    body.page-id-106
    .pd-about-professional-card {
        min-height:
            0 !important;
    }


    body.page-id-106
    .pd-about-professional-mission {
        grid-column:
            auto !important;

        grid-template-columns:
            1fr !important;

        gap:
            18px !important;
    }
}