.elementor-24 .elementor-element.elementor-element-b39f015{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--overlay-opacity:0.36;--margin-top:-108px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:176px;--padding-bottom:84px;--padding-left:16px;--padding-right:16px;--z-index:100;}.elementor-24 .elementor-element.elementor-element-b39f015:not(.elementor-motion-effects-element-type-background), .elementor-24 .elementor-element.elementor-element-b39f015 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, var( --e-global-color-secondary ) 0%, #8A1226 100%);}.elementor-24 .elementor-element.elementor-element-b39f015::before, .elementor-24 .elementor-element.elementor-element-b39f015 > .elementor-background-video-container::before, .elementor-24 .elementor-element.elementor-element-b39f015 > .e-con-inner > .elementor-background-video-container::before, .elementor-24 .elementor-element.elementor-element-b39f015 > .elementor-background-slideshow::before, .elementor-24 .elementor-element.elementor-element-b39f015 > .e-con-inner > .elementor-background-slideshow::before, .elementor-24 .elementor-element.elementor-element-b39f015 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://dbnfinancial.com/wp-content/uploads/2026/09/ChatGPT-Image-Sep-25-2026-03_37_31-PM-e1790330913115.webp");--background-overlay:'';background-position:center right;background-repeat:no-repeat;background-size:auto;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-24 .elementor-element.elementor-element-bc28cd5{text-align:center;}.elementor-24 .elementor-element.elementor-element-bc28cd5 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:48px;font-weight:700;-webkit-text-stroke-width:0.2px;stroke-width:0.2px;-webkit-text-stroke-color:#000000B8;stroke:#000000B8;text-shadow:0px 1px 11px rgba(71.21269243579773, 71.21269243579773, 71.21269243579773, 0.45);color:#FFFFFF;}.elementor-24 .elementor-element.elementor-element-b42be50 .eael-breadcrumbs .eael-breadcrumbs__content{background-color:#f8f8fa;font-size:12px;}.elementor-24 .elementor-element.elementor-element-b42be50 .eael-breadcrumbs .eael-breadcrumb-separator svg path{fill:#A5A4B0;}.elementor-24 .elementor-element.elementor-element-b42be50 .eael-breadcrumbs .eael-breadcrumb-separator{color:#A5A4B0;margin:0 10px;}.elementor-24 .elementor-element.elementor-element-baeb7e4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:0px 0px 12px 12px;--padding-top:64px;--padding-bottom:64px;--padding-left:16px;--padding-right:16px;--z-index:100;}.elementor-24 .elementor-element.elementor-element-baeb7e4:not(.elementor-motion-effects-element-type-background), .elementor-24 .elementor-element.elementor-element-baeb7e4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-4c9c2ab );}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button{background-color:var( --e-global-color-3ff16e2 );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-3ff16e2 );border-radius:4px 4px 4px 4px;}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button:hover, .elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button:focus{background-color:#02010100;color:var( --e-global-color-3ff16e2 );}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button:hover svg, .elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button:focus svg{fill:var( --e-global-color-3ff16e2 );}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}}@media(max-width:767px){.elementor-24 .elementor-element.elementor-element-b39f015{--padding-top:144px;--padding-bottom:16px;--padding-left:16px;--padding-right:16px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-24 .elementor-element.elementor-element-bc28cd5 .elementor-heading-title{font-size:36px;}.elementor-24 .elementor-element.elementor-element-baeb7e4{--padding-top:32px;--padding-bottom:36px;--padding-left:16px;--padding-right:16px;}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-24 .elementor-element.elementor-element-4d2bf4a .elementor-button{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}}/* Start custom CSS for shortcode, class: .elementor-element-b6824f1 *//* =========================================================
   DBN FINANCIAL - LIVE GOLD PRICES
   RESPONSIVE VERSION
   ========================================================= */

.dbn-gold-rates {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;

    padding: 70px 48px 55px;

    background: #ffffff;
    border-radius: 0;

    /* IMPORTANT:
       Do not clip the price or cards */
    overflow: visible;
}


/* =========================================================
   HEADING
   ========================================================= */

.dbn-gold-heading {
    margin-bottom: 48px;
}

.dbn-gold-eyebrow {
    margin-bottom: 12px;

    font-family: inherit;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.02em;

    color: #8f0b25;
    text-transform: uppercase;
}

.dbn-gold-heading h2 {
    margin: 0;

    font-size: clamp(42px, 4vw, 64px);
    line-height: 1.05;
    font-weight: 500;
    letter-spacing: -0.035em;

    color: #111111;
}

.dbn-gold-subtitle {
    margin: 18px 0 0;

    font-size: 17px;
    line-height: 1.6;

    color: #5d6470;
}


/* =========================================================
   PRICE GRID
   ========================================================= */

.dbn-gold-grid {
    width: 100%;
    max-width: 100%;

    display: grid;

    /*
     * minmax(0, 1fr) is important.
     * It allows each column to actually shrink.
     */
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 20px;

    box-sizing: border-box;
}


/* =========================================================
   PRICE CARDS
   ========================================================= */

.dbn-gold-card {
    position: relative;

    width: 100%;
    min-width: 0;

    min-height: 225px;

    padding: 34px 32px;

    box-sizing: border-box;

    background: #ffffff;

    border: 1px solid #e4e5e7;
    border-top: 3px solid #8f0b25;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    /*
     * Allows font sizing using the actual
     * width of this individual card.
     */
    container-type: inline-size;

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

.dbn-gold-card:hover {
    transform: translateY(-4px);

    border-color: #8f0b25;

    box-shadow:
        0 16px 35px rgba(0, 0, 0, 0.07);
}


/* =========================================================
   CARD LABEL
   ========================================================= */

.dbn-gold-card-label {
    min-width: 0;

    font-size: 18px;
    line-height: 1.3;
    font-weight: 500;

    color: #8f0b25;
}


/* =========================================================
   PRICE
   ========================================================= */

.dbn-gold-price {
    min-width: 0;
    max-width: 100%;

    margin-top: 28px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    /*
     * THIS is the important change.
     *
     * cqw = 1% of the actual card width.
     *
     * So the price scales according to the
     * card rather than the browser viewport.
     */
    font-size: clamp(28px, 11cqw, 48px);

    line-height: 1;

    letter-spacing: -0.025em;

    color: #111d2b;

    /*
     * Keep the price on one line.
     * It will now scale down before it
     * becomes wider than the card.
     */
    white-space: nowrap;

    overflow: visible;
}


/* =========================================================
   UNIT
   ========================================================= */

.dbn-gold-unit {
    margin-top: 14px;

    font-size: 14px;
    line-height: 1.4;

    letter-spacing: 0.08em;
    text-transform: uppercase;

    color: #8a929e;
}


/* =========================================================
   FOOTER
   ========================================================= */

.dbn-gold-footer {
    width: 100%;
    box-sizing: border-box;

    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 30px;

    margin-top: 34px;
    padding-top: 22px;

    border-top: 1px solid #e7e7e7;

    font-size: 13px;
    line-height: 1.6;

    color: #747b85;
}

.dbn-gold-updated {
    white-space: nowrap;

    font-weight: 500;

    color: #555c66;
}


/* =========================================================
   API ERROR
   ========================================================= */

.dbn-gold-error {
    padding: 30px;

    background: #fafafa;

    border: 1px solid #e4e4e4;

    color: #555;

    font-size: 16px;
}


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

@media (max-width: 1024px) {

    .dbn-gold-rates {
        padding: 55px 35px 45px;
    }

    .dbn-gold-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    .dbn-gold-card {
        min-height: 210px;

        padding: 32px 28px;
    }

    /*
     * Card-based sizing still applies.
     * No viewport-based font override here.
     */

    .dbn-gold-footer {
        flex-direction: column;

        align-items: flex-start;

        gap: 8px;
    }

}


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

@media (max-width: 767px) {

    .dbn-gold-rates {
        padding: 45px 22px 35px;
    }

    .dbn-gold-heading {
        margin-bottom: 32px;
    }

    .dbn-gold-eyebrow {
        font-size: 13px;
    }

    .dbn-gold-heading h2 {
        font-size: 40px;
        line-height: 1.05;
    }

    .dbn-gold-subtitle {
        font-size: 15px;

        margin-top: 14px;
    }

    .dbn-gold-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .dbn-gold-card {
        min-height: 185px;

        padding: 28px 24px;
    }

    .dbn-gold-card-label {
        font-size: 17px;
    }

    /*
     * cqw automatically scales this according
     * to the width of the mobile card.
     */
    .dbn-gold-price {
        font-size: clamp(32px, 13cqw, 42px);

        margin-top: 20px;
    }

    .dbn-gold-footer {
        margin-top: 25px;

        padding-top: 18px;

        font-size: 12px;
    }

}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 380px) {

    .dbn-gold-card {
        padding: 24px 20px;
    }

    .dbn-gold-price {
        font-size: clamp(30px, 14cqw, 38px);
    }

}/* End custom CSS */