/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 24 2026 | 10:49:58 */
/* =========================================================
   DSM PREMIUM SINGLE BLOG DESIGN
   Applies to ALL single WordPress blog posts
   Does NOT affect:
   - Blog listing
   - Products
   - Pages
   ========================================================= */


/* =========================================================
   GLOBAL VARIABLES
   ========================================================= */

body.single-post {
    --dsm-navy: #102a56;
    --dsm-navy-dark: #081a38;

    --dsm-blue: #234f92;

    --dsm-accent: #2563eb;
    --dsm-accent-light: #60a5fa;

    --dsm-text: #182230;
    --dsm-muted: #667085;

    --dsm-border: #dce2ea;
    --dsm-page-bg: #eef1f5;

    background: var(--dsm-page-bg) !important;
}


/* =========================================================
   PAGE WIDTH / SPACING
   ========================================================= */

body.single-post #content.site-content {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding-top: 24px !important;
    padding-bottom: 70px !important;

    padding-left: 48px !important;
    padding-right: 48px !important;

    box-sizing: border-box;
}


body.single-post #content.site-content > .col-full,
body.single-post #content.site-content .col-full {
    width: 100% !important;
    max-width: none !important;

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

    padding-left: 0 !important;
    padding-right: 0 !important;

    box-sizing: border-box;
}


/* =========================================================
   DESKTOP
   CONTENT LEFT + SIDEBAR RIGHT
   ========================================================= */

@media (min-width: 992px) {

    body.single-post #content.site-content > .col-full::after {
        content: "";
        display: table;
        clear: both;
    }


    body.single-post #primary {
        float: left !important;

        clear: none !important;

        width: calc(100% - 364px) !important;
        max-width: calc(100% - 364px) !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    body.single-post #secondary {
        float: right !important;

        clear: none !important;

        width: 330px !important;
        max-width: 330px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

}


/* =========================================================
   BREADCRUMB
   ========================================================= */

body.single-post .shoptimizer-archive .archive-header {
    padding-top: 14px;
    padding-bottom: 18px;

    background: transparent !important;

    border: 0 !important;
}


body.single-post .woocommerce-breadcrumb {
    color: #8490a2;

    font-size: 13px;
    font-weight: 500;

    letter-spacing: .01em;
}


body.single-post .woocommerce-breadcrumb a {
    color: #5d6d84;

    text-decoration: none;

    transition: color .2s ease;
}


body.single-post .woocommerce-breadcrumb a:hover {
    color: var(--dsm-accent);
}


/* =========================================================
   MAIN ARTICLE CARD
   IMPORTANT:
   targets ANY WordPress post ID automatically
   ========================================================= */

body.single-post #primary [id^="post-"] {
    position: relative;

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

    margin: 0 !important;

    overflow: hidden;

    background: #ffffff !important;

    border: 1px solid #d8dee8 !important;
    border-radius: 18px !important;

    box-shadow:
        0 2px 4px rgba(16, 24, 40, .025),
        0 14px 38px rgba(16, 24, 40, .055) !important;

    box-sizing: border-box;

    isolation: isolate;
}


/* =========================================================
   FEATURED IMAGE
   ========================================================= */

body.single-post #primary [id^="post-"] > img.wp-post-image {
    display: block !important;

    width: 100% !important;
    height: auto !important;

    max-height: 560px;

    margin: 0 !important;

    object-fit: cover;

    border-radius: 0 !important;

    transition:
        transform .7s cubic-bezier(.2,.8,.2,1),
        filter .4s ease;

    filter:
        saturate(1.02)
        contrast(1.02);
}


body.single-post #primary [id^="post-"]:hover > img.wp-post-image {
    transform: scale(1.008);
}


/* =========================================================
   ARTICLE HERO / HEADER
   ========================================================= */

body.single-post #primary [id^="post-"] .entry-header {
    position: relative;

    margin: 0 !important;

    padding:
        42px
        48px
        38px !important;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 95% 0%,
            rgba(96,165,250,.20),
            transparent 33%
        ),

        radial-gradient(
            circle at 0% 100%,
            rgba(37,99,235,.20),
            transparent 36%
        ),

        linear-gradient(
            135deg,
            #081a38 0%,
            #102a56 55%,
            #174079 100%
        ) !important;
}


/* subtle premium background grid */

body.single-post #primary [id^="post-"] .entry-header::before {
    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    background-image:

        linear-gradient(
            rgba(255,255,255,.022) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.022) 1px,
            transparent 1px
        );

    background-size:
        36px 36px;
}


/* blue accent line */

body.single-post #primary [id^="post-"] .entry-header::after {
    content: "";

    position: absolute;

    left: 48px;
    bottom: 0;

    width: 68px;
    height: 4px;

    border-radius:
        8px 8px 0 0;

    background:
        linear-gradient(
            90deg,
            var(--dsm-accent),
            var(--dsm-accent-light)
        );
}


/* =========================================================
   ARTICLE TITLE
   ========================================================= */

body.single-post #primary [id^="post-"] .entry-title {
    position: relative;

    z-index: 2;

    max-width: 920px;

    margin:
        0 0 20px !important;

    color: #ffffff !important;

    font-size:
        clamp(
            32px,
            3.4vw,
            52px
        ) !important;

    line-height: 1.1 !important;

    font-weight: 760 !important;

    letter-spacing: -1.3px;

    text-wrap: balance;
}


/* title links */

body.single-post #primary [id^="post-"] .entry-title a {
    color: #ffffff !important;

    text-decoration: none !important;
}


/* =========================================================
   POST DATE + READING TIME
   ========================================================= */

body.single-post #primary [id^="post-"] .posted-on {
    position: relative;

    z-index: 2;

    display: flex !important;

    align-items: center;

    flex-wrap: wrap;

    gap: 9px;

    width: fit-content;

    color:
        rgba(
            255,
            255,
            255,
            .82
        ) !important;

    font-size: 12.5px;

    font-weight: 600;
}


/* remove duplicate update date */

body.single-post .posted-on .updated {
    display: none !important;
}


/* date pill */

body.single-post .posted-on .entry-date {
    display: inline-flex;

    align-items: center;

    padding:
        7px 12px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .14
        );

    border-radius: 999px;

    background:
        rgba(
            255,
            255,
            255,
            .075
        );

    backdrop-filter: blur(8px);

    -webkit-backdrop-filter: blur(8px);
}


/* reading time */

body.single-post .dsm-read-time {
    display: inline-flex;

    align-items: center;

    padding:
        7px 12px;

    border:
        1px solid
        rgba(
            96,
            165,
            250,
            .28
        );

    border-radius: 999px;

    background:
        rgba(
            37,
            99,
            235,
            .16
        );

    color: #ffffff;

    font-size: 12px;

    font-weight: 700;
}


/* =========================================================
   ARTICLE CONTENT
   ========================================================= */

body.single-post #primary [id^="post-"] .entry-content {
    padding:
        44px
        48px
        54px !important;

    background: #ffffff !important;

    color: var(--dsm-text);

    font-size: 17px;

    line-height: 1.82;
}


/* normal paragraphs */

body.single-post #primary [id^="post-"] .entry-content p {
    margin-top: 0;

    margin-bottom: 24px;

    color: #4d596b;

    font-size: 17px;

    line-height: 1.82;
}


/* =========================================================
   LEAD PARAGRAPH
   ========================================================= */

body.single-post .entry-content .dsm-lead {
    margin-bottom:
        32px !important;

    padding:
        20px
        22px
        20px
        24px !important;

    border:
        1px solid
        #e1e7f0;

    border-left:
        4px solid
        var(--dsm-accent);

    border-radius:
        0 13px 13px 0;

    background:
        linear-gradient(
            90deg,
            rgba(37,99,235,.045),
            rgba(16,42,86,.015)
        );

    color:
        #2c3b50 !important;

    font-size:
        17.5px !important;
}


/* =========================================================
   SECTION HEADINGS
   JS detects:
   <p><strong>Heading</strong></p>
   ========================================================= */

body.single-post .entry-content .dsm-section-title {
    position: relative;

    margin-top:
        46px !important;

    margin-bottom:
        18px !important;

    padding-left: 18px;

    color:
        var(--dsm-navy) !important;

    font-size:
        clamp(
            22px,
            1.8vw,
            28px
        ) !important;

    line-height:
        1.27 !important;

    font-weight:
        760 !important;

    letter-spacing:
        -.4px;
}


body.single-post .entry-content .dsm-section-title::before {
    content: "";

    position: absolute;

    left: 0;

    top: 3px;

    bottom: 3px;

    width: 4px;

    border-radius: 10px;

    background:
        linear-gradient(
            180deg,
            var(--dsm-accent),
            var(--dsm-accent-light)
        );

    box-shadow:
        0 4px 12px
        rgba(
            37,
            99,
            235,
            .15
        );
}


body.single-post .entry-content .dsm-section-title strong {
    color: inherit !important;

    font-weight: inherit !important;
}


/* =========================================================
   LINKS
   ========================================================= */

body.single-post .entry-content a {
    color: #1f5fc4;

    font-weight: 600;

    text-decoration: none;

    transition:
        color .2s ease;
}


body.single-post .entry-content a:hover {
    color:
        var(--dsm-accent);

    text-decoration:
        underline;

    text-underline-offset:
        3px;
}


/* =========================================================
   LISTS
   ========================================================= */

body.single-post .entry-content ul,
body.single-post .entry-content ol {
    margin:
        18px 0 28px;

    padding-left: 28px;
}


body.single-post .entry-content li {
    margin-bottom: 9px;

    color: #4d596b;
}


/* =========================================================
   BLOCKQUOTE
   ========================================================= */

body.single-post .entry-content blockquote {
    margin:
        32px 0;

    padding:
        25px 28px;

    border:
        1px solid
        #e1e7f0;

    border-radius: 14px;

    background:
        #f7f9fc;

    color:
        var(--dsm-navy);

    font-size: 18px;

    line-height: 1.7;
}


/* =========================================================
   CONTENT IMAGES
   ========================================================= */

body.single-post .entry-content img {
    max-width: 100%;

    height: auto;

    border-radius: 14px;

    box-shadow:
        0 12px 30px
        rgba(
            16,
            24,
            40,
            .08
        );
}


/* =========================================================
   RESOURCE / CTA BOX
   ========================================================= */

body.single-post .entry-content .dsm-resource-box {
    margin-top:
        42px !important;

    margin-bottom:
        0 !important;

    padding:
        28px 30px !important;

    border-radius:
        16px;

    background:

        radial-gradient(
            circle at 100% 0%,
            rgba(37,99,235,.25),
            transparent 44%
        ),

        linear-gradient(
            135deg,
            #091a36,
            #102a56
        );

    color:
        rgba(
            255,
            255,
            255,
            .88
        ) !important;

    box-shadow:
        0 16px 34px
        rgba(
            16,
            42,
            86,
            .14
        );
}


body.single-post .entry-content .dsm-resource-box strong {
    color:
        #ffffff !important;
}


body.single-post .entry-content .dsm-resource-box a {
    color:
        #a8ccff !important;
}


/* =========================================================
   AUTHOR / POST META
   ========================================================= */

body.single-post #primary [id^="post-"] > .entry-meta {
    margin:
        0 48px 44px !important;

    padding-top: 24px;

    border-top:
        1px solid
        var(--dsm-border);
}


body.single-post .entry-meta a {
    color:
        var(--dsm-navy);

    font-weight: 600;

    text-decoration: none;
}


body.single-post .entry-meta a:hover {
    color:
        var(--dsm-accent);
}


/* =========================================================
   SIDEBAR BASE
   ========================================================= */

body.single-post #secondary .widget {
    margin-bottom:
        20px !important;

    padding:
        0 !important;

    overflow: hidden;

    border:
        1px solid
        #d8dee8 !important;

    border-radius:
        14px !important;

    background:
        #ffffff !important;

    box-shadow:
        0 5px 18px
        rgba(
            16,
            24,
            40,
            .045
        ) !important;

    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        transform .22s ease;
}


body.single-post #secondary .widget:hover {
    border-color:
        #ccd5e2 !important;

    box-shadow:
        0 10px 26px
        rgba(
            16,
            24,
            40,
            .065
        ) !important;
}


/* =========================================================
   SIDEBAR TITLES
   ========================================================= */

body.single-post #secondary .widget-title,
body.single-post #secondary .gamma {
    position: relative;

    display: block !important;

    width: 100%;

    margin: 0 !important;

    padding:
        16px
        18px
        14px
        21px !important;

    box-sizing:
        border-box;

    border-bottom:
        1px solid
        #e8ecf2;

    background:
        #ffffff !important;

    color:
        #102a56 !important;

    font-size:
        15.5px !important;

    line-height:
        1.25 !important;

    font-weight:
        760 !important;

    text-transform:
        none !important;

    letter-spacing:
        -.1px !important;
}


/* blue side accent */

body.single-post #secondary .widget-title::before,
body.single-post #secondary .gamma::before {
    content: "";

    position: absolute;

    left: 0;

    top: 12px;

    bottom: 12px;

    width: 4px;

    border-radius:
        0 4px 4px 0;

    background:
        linear-gradient(
            180deg,
            #2563eb,
            #60a5fa
        );
}


body.single-post #secondary .widget-title::after,
body.single-post #secondary .gamma::after {
    display:
        none !important;
}


/* =========================================================
   SIDEBAR NORMAL CONTENT
   ========================================================= */

body.single-post #secondary .widget > ul,
body.single-post #secondary .widget > ol,
body.single-post #secondary .widget > form {
    margin:
        0 !important;

    padding:
        8px 18px 12px !important;
}


body.single-post #secondary p,
body.single-post #secondary li,
body.single-post #secondary a {
    font-size:
        13.5px;

    line-height:
        1.55;
}


/* =========================================================
   DSM ABOUT SIDEBAR
   ========================================================= */

body.single-post #secondary .widget.dsm-about-widget {
    padding:
        22px 22px 20px !important;
}


body.single-post #secondary .widget.dsm-about-widget img {
    display: block;

    width: auto !important;

    max-width:
        205px !important;

    max-height:
        78px !important;

    object-fit: contain;

    margin:
        0 auto 18px !important;

    border-radius:
        0 !important;

    box-shadow:
        none !important;
}


body.single-post #secondary .widget.dsm-about-widget h2,
body.single-post #secondary .widget.dsm-about-widget h3,
body.single-post #secondary .widget.dsm-about-widget h4 {
    margin:
        0 0 10px !important;

    color:
        #111827 !important;

    font-size:
        18px !important;

    line-height:
        1.3 !important;

    font-weight:
        760 !important;
}


body.single-post #secondary .widget.dsm-about-widget p {
    margin:
        0 !important;

    color:
        #536174 !important;

    font-size:
        13.5px !important;

    line-height:
        1.62 !important;
}


/* =========================================================
   CATEGORIES
   ========================================================= */

body.single-post #secondary .widget_categories ul {
    list-style:
        none !important;

    margin:
        0 !important;

    padding:
        5px 18px 8px !important;
}


body.single-post #secondary .widget_categories li {
    position:
        relative;

    margin:
        0 !important;

    padding:
        11px
        20px
        11px
        1px !important;

    border-bottom:
        1px solid
        #eef1f5;
}


body.single-post #secondary .widget_categories li:last-child {
    border-bottom:
        0;
}


body.single-post #secondary .widget_categories li::after {
    content: "›";

    position: absolute;

    right: 2px;

    top: 50%;

    transform:
        translateY(-52%);

    color:
        #9ba6b5;

    font-size:
        18px;

    line-height:
        1;
}


body.single-post #secondary .widget_categories a {
    display: block;

    color:
        #3d4a5c !important;

    font-size:
        13.5px !important;

    font-weight:
        600 !important;

    text-decoration:
        none !important;

    transition:
        color .2s ease,
        transform .2s ease;
}


body.single-post #secondary .widget_categories li:hover a {
    color:
        var(--dsm-accent) !important;

    transform:
        translateX(3px);
}


/* =========================================================
   TAG CLOUD
   ========================================================= */

body.single-post #secondary .tagcloud {
    display:
        flex !important;

    flex-wrap:
        wrap;

    gap:
        7px !important;

    margin:
        0 !important;

    padding:
        16px 18px 18px !important;
}


body.single-post #secondary .tagcloud a {
    display:
        inline-flex !important;

    align-items:
        center;

    min-height:
        29px;

    padding:
        6px 9px !important;

    border:
        1px solid
        #dce2ea !important;

    border-radius:
        7px !important;

    background:
        #f7f8fa !important;

    color:
        #536174 !important;

    font-size:
        11px !important;

    line-height:
        1.15 !important;

    font-weight:
        600 !important;

    transition:
        all .2s ease;
}


body.single-post #secondary .tagcloud a:hover {
    border-color:
        #bfd2ff !important;

    background:
        #eef4ff !important;

    color:
        #1d4ed8 !important;

    transform:
        translateY(-1px);
}


/* =========================================================
   SIDEBAR SEARCH
   ========================================================= */

body.single-post #secondary input[type="search"],
body.single-post #secondary input[type="text"] {
    width: 100%;

    padding:
        10px 12px;

    border:
        1px solid
        #dfe5ec;

    border-radius:
        8px;

    background:
        #fbfcfe;

    outline:
        none;
}


body.single-post #secondary input[type="search"]:focus,
body.single-post #secondary input[type="text"]:focus {
    border-color:
        #8ab4ff;

    box-shadow:
        0 0 0 3px
        rgba(
            37,
            99,
            235,
            .08
        );
}


/* =========================================================
   COMMENTS
   ========================================================= */

body.single-post #comments {
    margin-top:
        30px;

    padding:
        30px;

    border:
        1px solid
        #dfe5ec;

    border-radius:
        16px;

    background:
        #ffffff;

    box-shadow:
        0 8px 26px
        rgba(
            16,
            24,
            40,
            .045
        );
}


body.single-post #comments input[type="text"],
body.single-post #comments input[type="email"],
body.single-post #comments input[type="url"],
body.single-post #comments textarea {
    width: 100%;

    padding:
        12px 14px;

    border:
        1px solid
        #dfe5ec;

    border-radius:
        9px;

    background:
        #fbfcfe;

    outline:
        none;
}


body.single-post #comments input:focus,
body.single-post #comments textarea:focus {
    border-color:
        #8ab4ff;

    box-shadow:
        0 0 0 4px
        rgba(
            37,
            99,
            235,
            .08
        );
}


body.single-post #comments input[type="submit"] {
    padding:
        11px 20px;

    border:
        0;

    border-radius:
        9px;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #3b82f6
        );

    color:
        #ffffff;

    font-weight:
        700;

    cursor:
        pointer;
}


/* =========================================================
   READING PROGRESS
   ========================================================= */

body.single-post #dsm-reading-progress {
    position:
        fixed;

    top: 0;
    left: 0;
    right: 0;

    z-index:
        999999;

    height:
        3px;

    background:
        rgba(
            16,
            42,
            86,
            .08
        );

    pointer-events:
        none;
}


body.single-post #dsm-reading-progress span {
    display:
        block;

    width:
        100%;

    height:
        100%;

    transform:
        scaleX(0);

    transform-origin:
        left center;

    background:
        linear-gradient(
            90deg,
            #2563eb,
            #60a5fa
        );
}


/* =========================================================
   SCROLL REVEAL
   ========================================================= */

body.single-post .dsm-reveal {
    opacity:
        0;

    transform:
        translateY(14px);

    transition:
        opacity .55s ease,
        transform .55s cubic-bezier(.2,.7,.2,1);
}


body.single-post .dsm-reveal.is-visible {
    opacity:
        1;

    transform:
        translateY(0);
}


/* =========================================================
   BACK TO TOP
   ========================================================= */

body.single-post #dsm-back-to-top {
    position:
        fixed;

    right:
        22px;

    bottom:
        24px;

    z-index:
        9999;

    width:
        45px;

    height:
        45px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0;

    border:
        0;

    border-radius:
        50%;

    background:
        linear-gradient(
            135deg,
            #102a56,
            #081a38
        );

    color:
        #ffffff;

    font-size:
        20px;

    cursor:
        pointer;

    box-shadow:
        0 9px 24px
        rgba(
            16,
            42,
            86,
            .24
        );

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translateY(10px);

    transition:
        opacity .22s ease,
        visibility .22s ease,
        transform .22s ease,
        background .22s ease;
}


body.single-post #dsm-back-to-top.is-visible {
    opacity:
        1;

    visibility:
        visible;

    transform:
        translateY(0);
}


body.single-post #dsm-back-to-top:hover {
    background:
        linear-gradient(
            135deg,
            #2563eb,
            #3b82f6
        );

    transform:
        translateY(-2px);
}


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

@media (max-width: 991px) {

    body.single-post #content.site-content {
        padding-left:
            28px !important;

        padding-right:
            28px !important;
    }


    body.single-post #primary,
    body.single-post #secondary {
        float:
            none !important;

        clear:
            both !important;

        width:
            100% !important;

        max-width:
            100% !important;
    }


    body.single-post #secondary {
        margin-top:
            28px !important;
    }


    body.single-post #primary [id^="post-"] .entry-header {
        padding:
            36px
            34px
            33px !important;
    }


    body.single-post #primary [id^="post-"] .entry-header::after {
        left:
            34px;
    }


    body.single-post #primary [id^="post-"] .entry-content {
        padding:
            38px
            34px
            46px !important;
    }

}


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

@media (max-width: 600px) {

    body.single-post #content.site-content {
        padding-top:
            12px !important;

        padding-bottom:
            50px !important;

        padding-left:
            15px !important;

        padding-right:
            15px !important;
    }


    body.single-post #primary [id^="post-"] {
        border-radius:
            14px !important;
    }


    body.single-post #primary [id^="post-"] .entry-header {
        padding:
            27px
            21px !important;
    }


    body.single-post #primary [id^="post-"] .entry-header::after {
        left:
            21px;

        width:
            52px;
    }


    body.single-post #primary [id^="post-"] .entry-title {
        font-size:
            29px !important;

        line-height:
            1.13 !important;

        letter-spacing:
            -.8px;
    }


    body.single-post #primary [id^="post-"] .entry-content {
        padding:
            29px
            21px
            36px !important;

        font-size:
            16px;
    }


    body.single-post #primary [id^="post-"] .entry-content p {
        font-size:
            16px;

        line-height:
            1.76;
    }


    body.single-post #primary [id^="post-"] > .entry-meta {
        margin-left:
            21px !important;

        margin-right:
            21px !important;
    }


    body.single-post #secondary .widget.dsm-about-widget {
        padding:
            20px !important;
    }


    body.single-post #secondary .widget.dsm-about-widget img {
        max-width:
            185px !important;
    }


    body.single-post #comments {
        padding:
            22px 18px;
    }


    body.single-post #dsm-back-to-top {
        right:
            14px;

        bottom:
            15px;

        width:
            43px;

        height:
            43px;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    body.single-post *,
    body.single-post *::before,
    body.single-post *::after {
        scroll-behavior:
            auto !important;
    }


    body.single-post .dsm-reveal {
        opacity:
            1 !important;

        transform:
            none !important;

        transition:
            none !important;
    }

}/* =========================================================
   MOBILE — REDUCE CARD ROUNDNESS
   ========================================================= */

@media (max-width: 600px) {

    /* Main article card */
    body.single-post #primary [id^="post-"] {
        border-radius: 8px !important;
    }

    /* Sidebar cards */
    body.single-post #secondary .widget {
        border-radius: 8px !important;
    }

    /* Comments card */
    body.single-post #comments {
        border-radius: 8px !important;
    }

    /* Content images */
    body.single-post .entry-content img {
        border-radius: 8px !important;
    }

    /* Blockquotes */
    body.single-post .entry-content blockquote {
        border-radius: 8px !important;
    }

    /* CTA / resource box */
    body.single-post .entry-content .dsm-resource-box {
        border-radius: 10px !important;
    }

}
/* =========================================================
   DSM MOBILE PREMIUM UPGRADE
   Add at VERY BOTTOM of existing CSS
   ========================================================= */

@media (max-width: 600px) {

    /* =====================================================
       PAGE BACKGROUND + SPACING
       ===================================================== */

    body.single-post {
        background:
            linear-gradient(
                180deg,
                #edf2f8 0%,
                #f5f7fa 45%,
                #eef2f6 100%
            ) !important;
    }

    body.single-post #content.site-content {
        padding-top: 10px !important;
        padding-bottom: 55px !important;

        padding-left: 12px !important;
        padding-right: 12px !important;
    }


    /* =====================================================
       BREADCRUMB
       ===================================================== */

    body.single-post .shoptimizer-archive .archive-header {
        padding-top: 8px !important;
        padding-bottom: 13px !important;
    }

    body.single-post .woocommerce-breadcrumb {
        font-size: 11.5px !important;
        line-height: 1.5;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;

        color: #7f8da2 !important;
    }


    /* =====================================================
       MAIN ARTICLE CARD
       ===================================================== */

    body.single-post #primary [id^="post-"] {
        border-radius: 8px !important;

        border:
            1px solid rgba(16, 42, 86, .10) !important;

        background: #ffffff !important;

        box-shadow:
            0 3px 8px rgba(16, 24, 40, .04),
            0 18px 45px rgba(16, 42, 86, .09) !important;

        overflow: hidden;
    }


    /* =====================================================
       FEATURED IMAGE
       ===================================================== */

    body.single-post #primary [id^="post-"] > img.wp-post-image {
        width: 100% !important;

        aspect-ratio: 16 / 10;

        height: auto !important;

        max-height: none !important;

        object-fit: cover;

        border-radius: 0 !important;

        filter:
            saturate(1.04)
            contrast(1.025);
    }


    /* =====================================================
       PREMIUM MOBILE HERO
       ===================================================== */

    body.single-post #primary [id^="post-"] .entry-header {
        position: relative;

        padding:
            28px
            21px
            27px !important;

        background:

            radial-gradient(
                circle at 92% 0%,
                rgba(96, 165, 250, .28),
                transparent 40%
            ),

            radial-gradient(
                circle at -5% 110%,
                rgba(37, 99, 235, .24),
                transparent 48%
            ),

            linear-gradient(
                145deg,
                #07172f 0%,
                #102c5a 55%,
                #16477e 100%
            ) !important;
    }


    /* subtle spotlight */

    body.single-post #primary [id^="post-"] .entry-header::before {
        background:

            linear-gradient(
                115deg,
                transparent 0%,
                rgba(255,255,255,.035) 45%,
                transparent 70%
            ),

            linear-gradient(
                rgba(255,255,255,.022) 1px,
                transparent 1px
            ),

            linear-gradient(
                90deg,
                rgba(255,255,255,.022) 1px,
                transparent 1px
            ) !important;

        background-size:
            100% 100%,
            30px 30px,
            30px 30px !important;
    }


    /* stronger blue accent */

    body.single-post #primary [id^="post-"] .entry-header::after {
        left: 21px !important;

        width: 64px !important;
        height: 4px !important;

        background:
            linear-gradient(
                90deg,
                #2f73ff,
                #71b7ff
            ) !important;

        box-shadow:
            0 0 14px
            rgba(65, 137, 255, .35);
    }


    /* =====================================================
       TITLE
       ===================================================== */

    body.single-post #primary [id^="post-"] .entry-title {
        margin-bottom: 18px !important;

        font-size: clamp(
            28px,
            8.3vw,
            34px
        ) !important;

        line-height: 1.08 !important;

        font-weight: 780 !important;

        letter-spacing: -.9px !important;

        color: #ffffff !important;

        text-wrap: balance;
    }


    body.single-post #primary [id^="post-"] .entry-title a {
        color: #ffffff !important;
    }


    /* =====================================================
       DATE + READ TIME PILLS
       ===================================================== */

    body.single-post #primary [id^="post-"] .posted-on {
        gap: 7px !important;
    }


    body.single-post .posted-on .entry-date,
    body.single-post .dsm-read-time {
        min-height: 31px;

        padding:
            6px 10px !important;

        border-radius:
            6px !important;

        font-size:
            11px !important;

        font-weight:
            650 !important;
    }


    body.single-post .posted-on .entry-date {
        border:
            1px solid
            rgba(255,255,255,.15) !important;

        background:
            rgba(255,255,255,.08) !important;
    }


    body.single-post .dsm-read-time {
        border:
            1px solid
            rgba(109,174,255,.28) !important;

        background:
            rgba(37,99,235,.18) !important;
    }


    /* =====================================================
       ARTICLE CONTENT
       ===================================================== */

    body.single-post #primary [id^="post-"] .entry-content {
        padding:
            27px
            20px
            36px !important;

        background:
            #ffffff !important;

        font-size:
            15.7px !important;

        line-height:
            1.75 !important;
    }


    body.single-post #primary [id^="post-"] .entry-content p {
        margin-bottom:
            20px !important;

        color:
            #475467 !important;

        font-size:
            15.7px !important;

        line-height:
            1.75 !important;
    }


    /* =====================================================
       LEAD PARAGRAPH
       ===================================================== */

    body.single-post .entry-content .dsm-lead {
        position: relative;

        margin:
            0 0 28px !important;

        padding:
            18px 17px
            18px 18px !important;

        border:
            1px solid
            #dce7f7 !important;

        border-left:
            4px solid
            #3478ef !important;

        border-radius:
            0 8px 8px 0 !important;

        background:
            linear-gradient(
                105deg,
                #f3f7ff 0%,
                #f9fbff 100%
            ) !important;

        box-shadow:
            0 6px 18px
            rgba(37,99,235,.055);

        color:
            #26364c !important;

        font-size:
            15.8px !important;

        line-height:
            1.7 !important;
    }


    /* =====================================================
       SECTION HEADINGS
       ===================================================== */

    body.single-post .entry-content .dsm-section-title {
        margin-top:
            35px !important;

        margin-bottom:
            16px !important;

        padding-left:
            14px !important;

        color:
            #102a56 !important;

        font-size:
            21px !important;

        line-height:
            1.22 !important;

        font-weight:
            780 !important;

        letter-spacing:
            -.45px !important;
    }


    body.single-post .entry-content .dsm-section-title::before {
        top: 2px !important;
        bottom: 2px !important;

        width: 4px !important;

        background:
            linear-gradient(
                180deg,
                #2f73ff,
                #64adff
            ) !important;

        box-shadow:
            0 4px 10px
            rgba(37,99,235,.18);
    }


    /* =====================================================
       LINKS
       ===================================================== */

    body.single-post .entry-content a {
        color:
            #155ac5 !important;

        text-decoration:
            underline;

        text-decoration-color:
            rgba(37,99,235,.30);

        text-underline-offset:
            3px;

        text-decoration-thickness:
            1px;
    }


    /* =====================================================
       LISTS
       ===================================================== */

    body.single-post .entry-content ul,
    body.single-post .entry-content ol {
        margin:
            15px 0 23px !important;

        padding-left:
            21px !important;
    }


    body.single-post .entry-content li {
        margin-bottom:
            8px !important;

        padding-left:
            3px;

        color:
            #475467 !important;

        line-height:
            1.65;
    }


    /* =====================================================
       BLOCKQUOTE
       ===================================================== */

    body.single-post .entry-content blockquote {
        margin:
            27px 0 !important;

        padding:
            20px 18px !important;

        border:
            1px solid
            #dce5f0 !important;

        border-radius:
            8px !important;

        background:
            linear-gradient(
                135deg,
                #f8fafc,
                #f2f6fb
            ) !important;

        color:
            #203a64 !important;

        font-size:
            16px !important;

        line-height:
            1.65 !important;

        box-shadow:
            0 6px 18px
            rgba(16,42,86,.04);
    }


    /* =====================================================
       ARTICLE IMAGES
       ===================================================== */

    body.single-post .entry-content img {
        border-radius:
            7px !important;

        box-shadow:
            0 8px 22px
            rgba(16,24,40,.10) !important;
    }


    /* =====================================================
       RESOURCE / CTA BOX
       ===================================================== */

    body.single-post .entry-content .dsm-resource-box {
        position: relative;

        margin-top:
            34px !important;

        padding:
            22px 19px !important;

        border:
            1px solid
            rgba(105,163,255,.18);

        border-radius:
            8px !important;

        background:

            radial-gradient(
                circle at 100% 0%,
                rgba(70,135,255,.32),
                transparent 45%
            ),

            linear-gradient(
                145deg,
                #071a39,
                #11386d
            ) !important;

        box-shadow:
            0 14px 28px
            rgba(8,31,68,.16) !important;
    }


    body.single-post .entry-content .dsm-resource-box a {
        color:
            #b9d7ff !important;
    }


    /* =====================================================
       AUTHOR META
       ===================================================== */

    body.single-post #primary [id^="post-"] > .entry-meta {
        margin:
            0 20px 30px !important;

        padding-top:
            19px !important;

        border-top:
            1px solid
            #e5eaf0 !important;
    }


    /* =====================================================
       SIDEBAR
       ===================================================== */

    body.single-post #secondary {
        margin-top:
            22px !important;
    }


    body.single-post #secondary .widget {
        margin-bottom:
            14px !important;

        border:
            1px solid
            #d9e1eb !important;

        border-radius:
            8px !important;

        box-shadow:
            0 7px 20px
            rgba(16,24,40,.05) !important;
    }


    /* sidebar headings */

    body.single-post #secondary .widget-title,
    body.single-post #secondary .gamma {
        padding:
            14px
            17px
            13px
            20px !important;

        border-bottom:
            1px solid
            #e6ebf1 !important;

        color:
            #102a56 !important;

        font-size:
            15px !important;

        font-weight:
            760 !important;

        background:
            linear-gradient(
                90deg,
                #ffffff,
                #f8fbff
            ) !important;
    }


    body.single-post #secondary .widget-title::before,
    body.single-post #secondary .gamma::before {
        top:
            10px !important;

        bottom:
            10px !important;

        width:
            4px !important;

        background:
            linear-gradient(
                180deg,
                #2563eb,
                #69afff
            ) !important;
    }


    /* =====================================================
       ABOUT DSM CARD
       ===================================================== */

    body.single-post #secondary .widget.dsm-about-widget {
        padding:
            20px 18px !important;

        background:
            linear-gradient(
                145deg,
                #ffffff 0%,
                #f8faff 100%
            ) !important;
    }


    body.single-post #secondary .widget.dsm-about-widget img {
        max-width:
            170px !important;

        max-height:
            67px !important;

        margin:
            0 auto 15px !important;
    }


    body.single-post #secondary .widget.dsm-about-widget h2,
    body.single-post #secondary .widget.dsm-about-widget h3,
    body.single-post #secondary .widget.dsm-about-widget h4 {
        font-size:
            17px !important;

        margin-bottom:
            8px !important;
    }


    body.single-post #secondary .widget.dsm-about-widget p {
        color:
            #536174 !important;

        font-size:
            13px !important;

        line-height:
            1.58 !important;
    }


    /* =====================================================
       CATEGORIES
       ===================================================== */

    body.single-post #secondary .widget_categories ul {
        padding:
            4px
            16px
            7px !important;
    }


    body.single-post #secondary .widget_categories li {
        padding:
            10px
            20px
            10px
            1px !important;
    }


    /* =====================================================
       TAGS
       ===================================================== */

    body.single-post #secondary .tagcloud {
        gap:
            6px !important;

        padding:
            14px
            15px
            16px !important;
    }


    body.single-post #secondary .tagcloud a {
        min-height:
            28px;

        padding:
            6px
            9px !important;

        border-radius:
            6px !important;

        background:
            #f4f7fb !important;

        border:
            1px solid
            #dce3ec !important;

        font-size:
            10.5px !important;
    }


    /* =====================================================
       COMMENTS
       ===================================================== */

    body.single-post #comments {
        margin-top:
            22px !important;

        padding:
            20px 17px !important;

        border-radius:
            8px !important;

        box-shadow:
            0 8px 22px
            rgba(16,24,40,.05);
    }


    /* =====================================================
       BACK TO TOP
       ===================================================== */

    body.single-post #dsm-back-to-top {
        right:
            13px !important;

        bottom:
            14px !important;

        width:
            42px !important;

        height:
            42px !important;

        border:
            1px solid
            rgba(255,255,255,.18);

        background:
            linear-gradient(
                145deg,
                #12376a,
                #2563eb
            ) !important;

        box-shadow:
            0 8px 20px
            rgba(37,99,235,.25) !important;
    }


    /* =====================================================
       READING PROGRESS
       ===================================================== */

    body.single-post #dsm-reading-progress {
        height:
            3px !important;

        background:
            rgba(37,99,235,.08) !important;
    }


    body.single-post #dsm-reading-progress span {
        background:
            linear-gradient(
                90deg,
                #2563eb,
                #70b7ff
            ) !important;

        box-shadow:
            0 0 8px
            rgba(37,99,235,.35);
    }

}
/* =========================================================
   TAG HOVER — RED / BLUE / YELLOW
   ========================================================= */

/* LIGHT RED */
body.single-post #secondary .tagcloud a:nth-child(3n+1):hover {
    background: #ffe8e8 !important;
    border-color: #f5bcbc !important;
    color: #b42318 !important;
    transform: translateY(-2px) !important;
}

/* LIGHT BLUE */
body.single-post #secondary .tagcloud a:nth-child(3n+2):hover {
    background: #e8f2ff !important;
    border-color: #b8d4ff !important;
    color: #175cd3 !important;
    transform: translateY(-2px) !important;
}

/* LIGHT YELLOW */
body.single-post #secondary .tagcloud a:nth-child(3n):hover {
    background: #fff6d8 !important;
    border-color: #f3d98b !important;
    color: #8a6500 !important;
    transform: translateY(-2px) !important;
}


/* =========================================================
   DSM MULTI-COLOR ACCENTS
   RED • BLUE • YELLOW
   ========================================================= */

/* -------------------------
   DATE — LIGHT RED
   ------------------------- */

body.single-post .posted-on .entry-date {
    background: rgba(239, 68, 68, .16) !important;
    border-color: rgba(248, 113, 113, .38) !important;
    color: #ffe5e5 !important;
}


/* -------------------------
   READING TIME — LIGHT YELLOW
   ------------------------- */

body.single-post .dsm-read-time {
    background: rgba(245, 158, 11, .17) !important;
    border-color: rgba(251, 191, 36, .42) !important;
    color: #fff3c4 !important;
}


/* -------------------------
   LEAD PARAGRAPH — LIGHT BLUE
   ------------------------- */

body.single-post .entry-content .dsm-lead {
    border-left: 5px solid #60a5fa !important;

    background:
        linear-gradient(
            105deg,
            #eef6ff 0%,
            #f8fbff 100%
        ) !important;
}


/* -------------------------
   SECTION HEADING ACCENTS
   Alternate RED / BLUE / YELLOW
   ------------------------- */

body.single-post .entry-content .dsm-section-title:nth-of-type(3n+1)::before {
    background: #ef6b6b !important;
    box-shadow: 0 4px 10px rgba(239, 107, 107, .18) !important;
}

body.single-post .entry-content .dsm-section-title:nth-of-type(3n+2)::before {
    background: #60a5fa !important;
    box-shadow: 0 4px 10px rgba(96, 165, 250, .18) !important;
}

body.single-post .entry-content .dsm-section-title:nth-of-type(3n)::before {
    background: #f2c94c !important;
    box-shadow: 0 4px 10px rgba(242, 201, 76, .18) !important;
}


/* =========================================================
   TAG HOVERS — RED / BLUE / YELLOW
   ========================================================= */

/* Light Red */
body.single-post #secondary .tagcloud a:nth-child(3n+1):hover {
    background: #ffe8e8 !important;
    border-color: #f5bcbc !important;
    color: #b42318 !important;
    transform: translateY(-2px) !important;
}

/* Light Blue */
body.single-post #secondary .tagcloud a:nth-child(3n+2):hover {
    background: #e8f2ff !important;
    border-color: #b8d4ff !important;
    color: #175cd3 !important;
    transform: translateY(-2px) !important;
}

/* Light Yellow */
body.single-post #secondary .tagcloud a:nth-child(3n):hover {
    background: #fff6d8 !important;
    border-color: #f3d98b !important;
    color: #8a6500 !important;
    transform: translateY(-2px) !important;
}