/**
 * DGCHEME — Product Detail / Product Explorer
 *
 * Loaded only on product-detail posts.
 *
 * This bundle is intentionally separate from single-post.css because product
 * pages contain repeated catalogue, family-selector, product-card and viewer
 * components.
 *
 * v1.7.18
 */

/* =========================================================
   PRODUCT SHOWCASE — PHOSPHORESCENT
========================================================= */

.dgproduct-showcase,
.dgproduct-showcase * {
    box-sizing: border-box;
}

.dgproduct-showcase {
    position: relative;
    width: 100%;
    padding: 64px 20px;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%, rgba(127, 255, 111, .075), transparent 25%),
        linear-gradient(145deg, #071d16 0%, #0a2e23 52%, #0d3a2c 100%);
}

.dgproduct-showcase::before {
    content: "";
    position: absolute;
    top: -160px;
    left: -110px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(196, 218, 92, .08);
    border-radius: 50%;
    box-shadow:
        0 0 0 52px rgba(196, 218, 92, .018),
        0 0 0 104px rgba(196, 218, 92, .01);
    pointer-events: none;
}

.dgproduct-showcase__inner {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgproduct-showcase__shell {
    display: grid;
    grid-template-columns: minmax(340px, .92fr) minmax(0, 1.08fr);
    gap: 28px;
    align-items: stretch;
}

.dgproduct-showcase__media {
    position: relative;
    min-height: 500px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 22px;
    background: #071812;
    box-shadow: 0 28px 60px rgba(0,0,0,.22);
}

.dgproduct-showcase__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 500px;
    object-fit: cover;
    object-position: center;
    filter: saturate(.94) contrast(1.04);
    transform: scale(1.002);
    transition: transform 650ms cubic-bezier(.22,1,.36,1), filter 650ms ease;
}

.dgproduct-showcase__media:hover .dgproduct-showcase__image {
    transform: scale(1.025);
    filter: saturate(1.05) contrast(1.05);
}

.dgproduct-showcase__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 42%, rgba(4,18,13,.76) 100%),
        linear-gradient(90deg, rgba(114,255,112,.06), transparent 44%);
}

.dgproduct-showcase__media-panel {
    position: absolute;
    right: 18px;
    bottom: 18px;
    left: 18px;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    background: rgba(5,36,26,.72);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.dgproduct-showcase__media-kicker {
    display: block;
    margin-bottom: 5px;
    color: #c8dc63;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-showcase__media-panel strong {
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-showcase__media-code {
    flex: 0 0 auto;
    color: rgba(255,255,255,.48);
    direction: ltr;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .07em;
}

.dgproduct-showcase__content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 38px 38px 34px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 24px 60px rgba(0,0,0,.10);
}

.dgproduct-showcase__content::before {
    content: "";
    position: absolute;
    top: 0;
    right: 38px;
    width: 84px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #70d86b 0%, #d8bd59 100%);
}

.dgproduct-showcase__topline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    color: rgba(220,232,227,.56);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-showcase__topline > span:nth-child(2) {
    width: 34px;
    height: 1px;
    background: linear-gradient(90deg, rgba(112,216,107,.25), #d8bd59);
}

.dgproduct-showcase__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.9;
}

.dgproduct-showcase__text {
    margin: 18px 0 0;
    color: rgba(230,238,234,.74);
    font-size: 14px;
    font-weight: 400;
    line-height: 2.12;
    text-align: justify;
}

.dgproduct-showcase__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 26px;
}

.dgproduct-showcase__metric {
    min-width: 0;
    padding: 14px 13px 12px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
}

.dgproduct-showcase__metric > span {
    display: block;
    margin-bottom: 12px;
    color: #d8bd59;
    direction: ltr;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-showcase__metric strong {
    display: block;
    margin-bottom: 6px;
    color: #b8e87d;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: .06em;
}

.dgproduct-showcase__metric small {
    display: block;
    color: rgba(229,238,233,.58);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.75;
}

.dgproduct-showcase__note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 18px;
    padding-top: 17px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgproduct-showcase__note-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-top: 9px;
    border-radius: 50%;
    background: #87ec72;
    box-shadow: 0 0 0 5px rgba(135,236,114,.08), 0 0 18px rgba(135,236,114,.35);
}

.dgproduct-showcase__note p {
    margin: 0;
    color: rgba(230,238,234,.64);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.95;
}

.dgproduct-showcase__rail {
    display: grid;
    grid-template-columns: auto minmax(30px,1fr) auto minmax(30px,1fr) auto;
    align-items: center;
    gap: 12px;
    margin-top: 20px;
    color: rgba(214,229,221,.40);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .11em;
}

.dgproduct-showcase__rail > span:nth-child(2),
.dgproduct-showcase__rail > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(112,216,107,.18), rgba(216,189,89,.44));
}

@media (max-width: 900px) {
    .dgproduct-showcase {
        padding: 48px 16px;
    }

    .dgproduct-showcase__shell {
        grid-template-columns: 1fr;
    }

    .dgproduct-showcase__media,
    .dgproduct-showcase__image {
        min-height: 430px;
    }
}

@media (max-width: 620px) {
    .dgproduct-showcase {
        padding: 38px 14px;
    }

    .dgproduct-showcase__media,
    .dgproduct-showcase__image {
        min-height: 350px;
    }

    .dgproduct-showcase__content {
        padding: 28px 20px 24px;
        border-radius: 17px;
    }

    .dgproduct-showcase__content::before {
        right: 20px;
    }

    .dgproduct-showcase__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-showcase__text {
        font-size: 13px;
        line-height: 2.05;
    }

    .dgproduct-showcase__media-panel {
        right: 12px;
        bottom: 12px;
        left: 12px;
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .dgproduct-showcase__rail {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 7px;
    }

    .dgproduct-showcase__rail > span:nth-child(2),
    .dgproduct-showcase__rail > span:nth-child(4) {
        width: 28px;
    }
}


/* =========================================================
   PRODUCT APPLICATIONS MAP
   v1.7.19
========================================================= */

.dgproduct-applications-map,
.dgproduct-applications-map * {
    box-sizing: border-box;
}

.dgproduct-applications-map {
    position: relative;
    width: 100%;
    padding: 72px 20px 62px;
    background:
        linear-gradient(180deg, #f7faf8 0%, #ffffff 58%, #f8fbf9 100%);
}

.dgproduct-applications-map__inner {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgproduct-applications-map__head {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
    gap: 28px;
    align-items: stretch;
    margin-bottom: 24px;
}

.dgproduct-applications-map__chapter {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 28px 30px;
    border: 1px solid #dfe9e3;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(11, 54, 39, .06);
}

.dgproduct-applications-map__chapter-index {
    flex: 0 0 auto;
    color: #cfb44d;
    direction: ltr;
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-applications-map__eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #8e9d95;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-applications-map__title {
    margin: 0;
    color: #103f31;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.9;
}

.dgproduct-applications-map__intro {
    max-width: 760px;
    margin: 13px 0 0;
    color: #687a71;
    font-size: 13px;
    line-height: 2.08;
    text-align: justify;
}

.dgproduct-applications-map__signature {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 26px 28px;
    border: 1px solid #173f32;
    border-radius: 20px;
    background:
        radial-gradient(circle at 88% 18%, rgba(207,180,77,.10), transparent 32%),
        linear-gradient(145deg, #0b2e23 0%, #103f31 100%);
    box-shadow: 0 18px 48px rgba(11, 54, 39, .10);
}

.dgproduct-applications-map__signature-label {
    margin-bottom: 20px;
    color: rgba(255,255,255,.42);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-applications-map__signature-flow {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr auto;
    align-items: center;
    gap: 7px;
    color: rgba(255,255,255,.60);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-applications-map__signature-flow > span:nth-child(2),
.dgproduct-applications-map__signature-flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(111,221,105,.24), rgba(207,180,77,.60));
}

.dgproduct-applications-map__signature-flow strong {
    color: #bce27b;
    font-size: 8px;
}

.dgproduct-applications-map__signature-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 22px;
}

.dgproduct-applications-map__signature-tags span {
    padding: 6px 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.70);
    background: rgba(255,255,255,.04);
    direction: ltr;
    font-size: 7px;
    font-weight: 700;
}

.dgproduct-applications-map__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.dgproduct-applications-map__item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 144px;
    padding: 20px 18px;
    border: 1px solid #dce8e1;
    border-radius: 17px;
    color: inherit;
    text-decoration: none;
    background: #fff;
    box-shadow: 0 12px 34px rgba(11, 54, 39, .045);
    transition:
        transform 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease;
}

.dgproduct-applications-map__item::before {
    content: "";
    position: absolute;
    top: 0;
    right: 18px;
    width: 46px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #276d52, #d0b64e);
}

.dgproduct-applications-map__item:hover {
    transform: translateY(-4px);
    border-color: #b9d2c4;
    box-shadow: 0 18px 40px rgba(11, 54, 39, .08);
}

.dgproduct-applications-map__number {
    align-self: flex-start;
    color: #c7aa3f;
    direction: ltr;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-applications-map__copy {
    min-width: 0;
}

.dgproduct-applications-map__copy h3 {
    margin: 0;
    color: #154636;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-applications-map__copy > span {
    display: block;
    margin-top: 6px;
    color: #8b9b93;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .06em;
}

.dgproduct-applications-map__copy small {
    display: block;
    margin-top: 11px;
    color: #6f8178;
    direction: ltr;
    font-size: 8px;
    font-weight: 600;
    line-height: 1.6;
}

.dgproduct-applications-map__arrow {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid #d6e4dc;
    border-radius: 50%;
    color: #28634c;
    background: #f6faf8;
    font-size: 13px;
    font-weight: 800;
}

.dgproduct-applications-map__bridge {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
    gap: 24px;
    align-items: center;
    margin-top: 22px;
    padding: 28px 30px;
    overflow: hidden;
    border: 1px solid #173f32;
    border-radius: 20px;
    background:
        radial-gradient(circle at 8% 50%, rgba(112,228,107,.08), transparent 26%),
        linear-gradient(135deg, #08251c 0%, #0d372a 56%, #123f31 100%);
    box-shadow: 0 22px 54px rgba(11, 54, 39, .13);
}

.dgproduct-applications-map__bridge::after {
    content: "SERIES";
    position: absolute;
    left: -6px;
    bottom: -23px;
    color: rgba(255,255,255,.025);
    direction: ltr;
    font-size: 76px;
    font-weight: 900;
    letter-spacing: .02em;
    pointer-events: none;
}

.dgproduct-applications-map__bridge-copy {
    position: relative;
    z-index: 1;
}

.dgproduct-applications-map__bridge-kicker {
    display: block;
    margin-bottom: 8px;
    color: #b7d976;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-applications-map__bridge h3 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.85;
}

.dgproduct-applications-map__bridge p {
    margin: 10px 0 0;
    color: rgba(233,241,237,.64);
    font-size: 12px;
    line-height: 1.95;
}

.dgproduct-applications-map__bridge-action {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 88px;
    padding: 18px 20px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 15px;
    color: #fff;
    text-decoration: none;
    background: rgba(255,255,255,.06);
    transition:
        background 220ms ease,
        transform 220ms ease,
        border-color 220ms ease;
}

.dgproduct-applications-map__bridge-action:hover {
    transform: translateY(-2px);
    border-color: rgba(197,220,104,.42);
    background: rgba(255,255,255,.09);
}

.dgproduct-applications-map__bridge-action small {
    display: block;
    margin-bottom: 6px;
    color: #d3b954;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-applications-map__bridge-action strong {
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-applications-map__bridge-icon {
    display: grid;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 50%;
    color: #0d372a;
    background: linear-gradient(145deg, #cae76f, #d2b54d);
    font-size: 15px;
    font-weight: 900;
}

@media (max-width: 960px) {
    .dgproduct-applications-map__head,
    .dgproduct-applications-map__bridge {
        grid-template-columns: 1fr;
    }

    .dgproduct-applications-map__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .dgproduct-applications-map {
        padding: 48px 14px 44px;
    }

    .dgproduct-applications-map__chapter {
        padding: 22px 20px;
    }

    .dgproduct-applications-map__chapter-index {
        font-size: 23px;
    }

    .dgproduct-applications-map__grid {
        grid-template-columns: 1fr;
    }

    .dgproduct-applications-map__item {
        min-height: 126px;
    }

    .dgproduct-applications-map__bridge {
        padding: 24px 20px;
    }

    .dgproduct-applications-map__bridge::after {
        font-size: 54px;
    }
}

/* END — PRODUCT APPLICATIONS MAP v1.7.19 */


/* =========================================================
   PRODUCT APPLICATION CASE MODULE
   v1.7.20
========================================================= */

.dgproduct-application,
.dgproduct-application * {
    box-sizing: border-box;
}

.dgproduct-application {
    position: relative;
    width: 100%;
    padding: 66px 20px;
    background:
        radial-gradient(circle at 92% 16%, rgba(43, 111, 82, .055), transparent 27%),
        #ffffff;
}

.dgproduct-application__inner {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgproduct-application__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
    gap: 28px;
    align-items: stretch;
}

.dgproduct-application__content {
    position: relative;
    padding: 34px 36px 30px;
    border: 1px solid #dfe9e3;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 18px 46px rgba(12, 58, 42, .06);
}

.dgproduct-application__content::before {
    content: "";
    position: absolute;
    top: 0;
    right: 36px;
    width: 76px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #276c51 0%, #d2b64f 100%);
}

.dgproduct-application__meta {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 18px;
}

.dgproduct-application__number {
    color: #c9aa3e;
    direction: ltr;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-application__eyebrow,
.dgproduct-application__series {
    display: block;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-application__eyebrow {
    margin-bottom: 5px;
    color: #55756a;
}

.dgproduct-application__series {
    color: #a0ada7;
}

.dgproduct-application__title {
    margin: 0;
    color: #154636;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.85;
}

.dgproduct-application__text {
    margin: 14px 0 0;
    color: #687a72;
    font-size: 13px;
    line-height: 2.08;
    text-align: justify;
}

.dgproduct-application__uses {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 24px;
}

.dgproduct-application__use {
    min-width: 0;
    padding: 14px 13px;
    border: 1px solid #e0eae4;
    border-radius: 13px;
    background:
        linear-gradient(160deg, #fbfdfc 0%, #f4f8f6 100%);
}

.dgproduct-application__use-index {
    display: block;
    margin-bottom: 10px;
    color: #c5a83d;
    direction: ltr;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-application__use strong {
    display: block;
    margin-bottom: 7px;
    color: #1b5a44;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .06em;
}

.dgproduct-application__use p {
    margin: 0;
    color: #75857d;
    font-size: 9px;
    line-height: 1.85;
}

.dgproduct-application__footnote {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #e3ebe7;
}

.dgproduct-application__footnote-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-top: 8px;
    border-radius: 50%;
    background: #2b7757;
    box-shadow: 0 0 0 5px rgba(43,119,87,.07);
}

.dgproduct-application__footnote p {
    margin: 0;
    color: #7b8982;
    font-size: 10px;
    line-height: 1.9;
}

.dgproduct-application__media {
    position: relative;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 20px;
    background: #0b2e23;
    box-shadow: 0 20px 48px rgba(12, 58, 42, .09);
}

.dgproduct-application__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 460px;
    object-fit: cover;
    object-position: center;
    transition: transform 600ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-application__media:hover .dgproduct-application__image {
    transform: scale(1.025);
}

.dgproduct-application__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,25,18,.015) 46%, rgba(5,31,22,.80) 100%);
}

.dgproduct-application__media-card {
    position: absolute;
    right: 16px;
    bottom: 16px;
    left: 16px;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 13px;
    background: rgba(5,40,28,.72);
    backdrop-filter: blur(13px);
    -webkit-backdrop-filter: blur(13px);
}

.dgproduct-application__media-card span:first-child {
    display: block;
    margin-bottom: 4px;
    color: #cadf72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-application__media-card strong {
    display: block;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.75;
}

.dgproduct-application__media-code {
    flex: 0 0 auto;
    color: rgba(255,255,255,.43);
    direction: ltr;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .06em;
}

.dgproduct-application__techline {
    display: grid;
    grid-template-columns: auto minmax(24px,1fr) auto minmax(24px,1fr) auto;
    align-items: center;
    gap: 11px;
    margin-top: 18px;
    color: #93a49c;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-application__techline > span:nth-child(2),
.dgproduct-application__techline > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(42,108,81,.22), rgba(202,170,62,.48));
}

.dgproduct-application__techline strong {
    color: #2d6e54;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid {
        grid-template-columns: 1fr;
    }

    .dgproduct-application__media,
    .dgproduct-application__image {
        min-height: 420px;
    }
}

@media (max-width: 680px) {
    .dgproduct-application {
        padding: 46px 14px;
    }

    .dgproduct-application__content {
        padding: 28px 20px 24px;
    }

    .dgproduct-application__content::before {
        right: 20px;
    }

    .dgproduct-application__uses {
        grid-template-columns: 1fr;
    }

    .dgproduct-application__media,
    .dgproduct-application__image {
        min-height: 340px;
    }

    .dgproduct-application__media-card {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .dgproduct-application__techline {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 7px;
    }

    .dgproduct-application__techline > span:nth-child(2),
    .dgproduct-application__techline > span:nth-child(4) {
        width: 30px;
    }
}

/* END — PRODUCT APPLICATION CASE MODULE v1.7.20 */


/* =========================================================
   PRODUCT APPLICATION CHILD NAVIGATION
   v1.7.21
========================================================= */

a.dgproduct-application__use {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform 220ms ease,
        border-color 220ms ease,
        background 220ms ease,
        box-shadow 220ms ease;
}

a.dgproduct-application__use:hover,
a.dgproduct-application__use:focus-visible {
    transform: translateY(-3px);
    border-color: #b9d0c4;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(14, 71, 51, .08);
    outline: none;
}

.dgproduct-application__use-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid #e2ebe6;
    color: #2b6b51;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.5;
}

.dgproduct-application__use-action > span {
    display: inline-grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    color: #184b39;
    background: #edf5f0;
    font-size: 10px;
    transition:
        transform 220ms ease,
        background 220ms ease;
}

a.dgproduct-application__use:hover .dgproduct-application__use-action > span,
a.dgproduct-application__use:focus-visible .dgproduct-application__use-action > span {
    transform: translateY(2px);
    background: #dfeee5;
}

/* END — PRODUCT APPLICATION CHILD NAVIGATION v1.7.21 */


/* =========================================================
   PRODUCT APPLICATION — MASTERBATCH SPLIT MEDIA
   v1.7.22
========================================================= */

.dgproduct-application__grid--masterbatch {
    grid-template-columns: minmax(380px, 1fr) minmax(0, .98fr);
    align-items: stretch;
}

.dgproduct-application__content--masterbatch {
    align-self: stretch;
}

.dgproduct-dual-media,
.dgproduct-dual-media * {
    box-sizing: border-box;
}

.dgproduct-dual-media {
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 22px 22px 18px;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 24%, rgba(118, 255, 125, .12), transparent 24%),
        linear-gradient(145deg, #02110d 0%, #071b14 58%, #0a251c 100%);
    box-shadow: 0 22px 52px rgba(12, 58, 42, .10);
}

.dgproduct-dual-media::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255,255,255,.03), transparent 24%),
        radial-gradient(circle at 76% 26%, rgba(110,255,130,.08), transparent 28%);
}

.dgproduct-dual-media__topline {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto minmax(28px,1fr) auto;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: rgba(220,231,226,.74);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-dual-media__topline > span:nth-child(2) {
    height: 1px;
    background: linear-gradient(90deg, rgba(112,216,107,.16), rgba(214,184,83,.92));
}

.dgproduct-dual-media__topline strong {
    color: #d6b44a;
    font-size: 8px;
    font-weight: 800;
}

.dgproduct-dual-media__shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #000000;
}

.dgproduct-dual-media__shell::before {
    content: "";
    position: absolute;
    top: 18px;
    bottom: 18px;
    left: 50%;
    width: 1px;
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.22), rgba(255,255,255,.04));
    transform: translateX(-50%);
    z-index: 2;
    pointer-events: none;
}

.dgproduct-dual-media__pane {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #000000;
}

.dgproduct-dual-media__image-wrap {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1.06 / .86;
    background: #040404;
}

.dgproduct-dual-media__image-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.05)),
        linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.22));
}

.dgproduct-dual-media__pane--glow .dgproduct-dual-media__image-wrap::after {
    background:
        linear-gradient(180deg, rgba(111,255,118,.02), rgba(0,0,0,.08)),
        radial-gradient(circle at 50% 56%, rgba(111,255,118,.16), transparent 42%),
        linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.22));
}

.dgproduct-dual-media__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition:
        transform 650ms cubic-bezier(.22,1,.36,1),
        filter 650ms ease;
}

.dgproduct-dual-media__pane:hover .dgproduct-dual-media__image {
    transform: scale(1.03);
}

.dgproduct-dual-media__pane--glow:hover .dgproduct-dual-media__image {
    filter: saturate(1.05) brightness(1.04);
}

.dgproduct-dual-media__caption {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 16px 14px 15px;
    border-top: 1px solid rgba(255,255,255,.06);
    text-align: center;
    background:
        linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.18));
}

.dgproduct-dual-media__caption strong {
    display: block;
    color: #ffffff;
    direction: ltr;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.dgproduct-dual-media__caption span {
    display: block;
    color: rgba(235,242,238,.56);
    font-size: 9px;
    line-height: 1.7;
}

.dgproduct-dual-media__notes {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto minmax(28px,1fr) auto;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    color: rgba(188,205,197,.58);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-dual-media__notes > span:nth-child(2) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.06), rgba(111,255,118,.22), rgba(214,184,83,.65));
}

.dgproduct-application__uses--masterbatch {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1080px) {
    .dgproduct-application__grid--masterbatch {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-dual-media {
        padding: 18px 16px 15px;
    }

    .dgproduct-dual-media__shell {
        grid-template-columns: 1fr;
        gap: 1px;
    }

    .dgproduct-dual-media__shell::before {
        top: 50%;
        right: 18px;
        left: 18px;
        bottom: auto;
        width: auto;
        height: 1px;
        transform: none;
    }

    .dgproduct-dual-media__image-wrap {
        aspect-ratio: 1.22 / .88;
    }

    .dgproduct-dual-media__caption strong {
        font-size: 14px;
    }

    .dgproduct-dual-media__notes,
    .dgproduct-dual-media__topline {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-dual-media__notes > span:nth-child(2),
    .dgproduct-dual-media__topline > span:nth-child(2) {
        width: 34px;
    }

    .dgproduct-application__uses--masterbatch {
        grid-template-columns: 1fr;
    }
}

/* END — PRODUCT APPLICATION — MASTERBATCH SPLIT MEDIA v1.7.22 */


/* =========================================================
   MASTERBATCH REFINEMENT
   v1.7.23
========================================================= */

/* Informational cards in the Masterbatch child section are not navigation. */
.dgproduct-application__uses--masterbatch .dgproduct-application__use--static {
    cursor: default;
    transition: none;
}

.dgproduct-application__uses--masterbatch .dgproduct-application__use--static:hover,
.dgproduct-application__uses--masterbatch .dgproduct-application__use--static:focus-visible {
    transform: none;
    border-color: #e0eae4;
    background: linear-gradient(160deg, #fbfdfc 0%, #f4f8f6 100%);
    box-shadow: none;
    outline: none;
}

/* Use the empty lower area of the dark visual card as a technical visual guide. */
.dgproduct-dual-media {
    display: flex;
    flex-direction: column;
}

.dgproduct-dual-media__insight {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    min-height: 170px;
    margin-top: 18px;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    background:
        radial-gradient(circle at 82% 28%, rgba(110,255,118,.08), transparent 28%),
        linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.018));
}

.dgproduct-dual-media__insight-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 15px;
}

.dgproduct-dual-media__insight-head span {
    color: rgba(213,228,221,.48);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .10em;
}

.dgproduct-dual-media__insight-head strong {
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-dual-media__insight-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.dgproduct-dual-media__insight-grid > div {
    min-width: 0;
    padding: 11px 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-dual-media__insight-grid span {
    display: block;
    margin-bottom: 8px;
    color: #d6b84f;
    direction: ltr;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-dual-media__insight-grid strong {
    display: block;
    margin-bottom: 5px;
    color: #bce67b;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .06em;
}

.dgproduct-dual-media__insight-grid small {
    display: block;
    color: rgba(229,238,234,.56);
    font-size: 8px;
    line-height: 1.7;
}

.dgproduct-dual-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-dual-media__flow > span:nth-child(2),
.dgproduct-dual-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(112,232,116,.25), rgba(214,184,79,.58));
}

.dgproduct-dual-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 680px) {
    .dgproduct-dual-media__insight {
        min-height: 0;
    }

    .dgproduct-dual-media__insight-grid {
        grid-template-columns: 1fr;
    }

    .dgproduct-dual-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-dual-media__flow > span:nth-child(2),
    .dgproduct-dual-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — MASTERBATCH REFINEMENT v1.7.23 */


/* =========================================================
   MASTERBATCH TECH CARDS — SOURCE-ONLY CLEANUP
   v1.7.24
========================================================= */

.dgproduct-application__uses--masterbatch {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 680px) {
    .dgproduct-application__uses--masterbatch {
        grid-template-columns: 1fr;
    }
}

/* END — MASTERBATCH TECH CARDS SOURCE-ONLY CLEANUP v1.7.24 */


/* =========================================================
   PLASTIC INDUSTRIES — SAFETY SIGNS CHILD
   v1.7.25
========================================================= */

.dgproduct-application__grid--safety {
    grid-template-columns: minmax(0, 1.06fr) minmax(360px, .94fr);
}

.dgproduct-application__uses--safety {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-safety-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 78% 18%, rgba(118,255,125,.10), transparent 28%),
        linear-gradient(145deg, #03110d 0%, #08271d 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-safety-media__image {
    display: block;
    width: 100%;
    min-height: 390px;
    flex: 1 1 auto;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-safety-media:hover .dgproduct-safety-media__image {
    transform: scale(1.025);
}

.dgproduct-safety-media::after {
    content: "";
    position: absolute;
    inset: 0 0 92px;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(2,16,11,.02) 45%, rgba(2,23,16,.76) 100%);
}

.dgproduct-safety-media__caption {
    position: absolute;
    right: 16px;
    bottom: 72px;
    left: 16px;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 13px;
    background: rgba(4,36,25,.74);
    backdrop-filter: blur(13px);
    -webkit-backdrop-filter: blur(13px);
}

.dgproduct-safety-media__caption span:first-child {
    display: block;
    margin-bottom: 5px;
    color: #c8df72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-safety-media__caption strong {
    display: block;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-safety-media__code {
    flex: 0 0 auto;
    color: rgba(255,255,255,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .06em;
}

.dgproduct-safety-media__strip {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: auto minmax(22px,1fr) auto minmax(22px,1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 0 18px;
    border-top: 1px solid rgba(255,255,255,.07);
    color: rgba(219,231,225,.46);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
    background: rgba(3,22,16,.96);
}

.dgproduct-safety-media__strip > span:nth-child(2),
.dgproduct-safety-media__strip > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(114,230,113,.25), rgba(210,181,77,.62));
}

.dgproduct-safety-media__strip strong {
    color: #d3b64d;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--safety {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--safety {
        grid-template-columns: 1fr;
    }

    .dgproduct-safety-media__image {
        min-height: 330px;
    }

    .dgproduct-safety-media__caption {
        align-items: flex-start;
        flex-direction: column;
        bottom: 122px;
        gap: 8px;
    }

    .dgproduct-safety-media__strip {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
        min-height: 108px;
        padding: 14px;
    }

    .dgproduct-safety-media__strip > span:nth-child(2),
    .dgproduct-safety-media__strip > span:nth-child(4) {
        width: 30px;
    }
}

/* END — PLASTIC INDUSTRIES — SAFETY SIGNS CHILD v1.7.25 */


/* =========================================================
   APPLICATION 02 — PRINTING INDUSTRIES
   v1.7.28
========================================================= */

.dgproduct-application__grid--printing {
    grid-template-columns: minmax(0, 1.04fr) minmax(360px, .96fr);
}

.dgproduct-application__uses--printing {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-print-media,
.dgproduct-print-media * {
    box-sizing: border-box;
}

.dgproduct-print-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 82% 18%, rgba(112,235,116,.09), transparent 27%),
        linear-gradient(145deg, #061711 0%, #0a3023 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-print-media__visual {
    position: relative;
    overflow: hidden;
}

.dgproduct-print-media__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 44%, rgba(4,29,20,.65) 100%);
}

.dgproduct-print-media__image {
    display: block;
    width: 100%;
    min-height: 345px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-print-media:hover .dgproduct-print-media__image {
    transform: scale(1.025);
}

.dgproduct-print-media__badge {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(4,36,25,.74);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dgproduct-print-media__badge span {
    display: block;
    margin-bottom: 4px;
    color: #c8df72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-print-media__badge strong {
    display: block;
    color: #ffffff;
    direction: ltr;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-print-media__caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
}

.dgproduct-print-media__caption-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.dgproduct-print-media__caption-head span {
    color: rgba(219,231,225,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-print-media__caption-head strong {
    color: #ffffff;
    direction: ltr;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-print-media__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 15px;
}

.dgproduct-print-media__matrix > div {
    padding: 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-print-media__matrix span {
    display: block;
    margin-bottom: 7px;
    color: #d4b74e;
    direction: ltr;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-print-media__matrix strong {
    display: block;
    margin-bottom: 4px;
    color: #bde37d;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
}

.dgproduct-print-media__matrix small {
    display: block;
    color: rgba(230,238,234,.52);
    direction: ltr;
    font-size: 7px;
    line-height: 1.5;
}

.dgproduct-print-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-print-media__flow > span:nth-child(2),
.dgproduct-print-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(112,232,116,.24), rgba(214,184,79,.58));
}

.dgproduct-print-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--printing {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--printing,
    .dgproduct-print-media__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-print-media__image {
        min-height: 280px;
    }

    .dgproduct-print-media__caption-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .dgproduct-print-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-print-media__flow > span:nth-child(2),
    .dgproduct-print-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — APPLICATION 02 — PRINTING INDUSTRIES v1.7.28 */


/* =========================================================
   APPLICATION 03 — GLASS MAKING INDUSTRIES
   v1.7.29
========================================================= */

.dgproduct-application__grid--glass {
    grid-template-columns: minmax(360px, .96fr) minmax(0, 1.04fr);
}

.dgproduct-application__uses--glass {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-glass-media,
.dgproduct-glass-media * {
    box-sizing: border-box;
}

.dgproduct-glass-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 18% 20%, rgba(111,255,121,.08), transparent 26%),
        linear-gradient(145deg, #061712 0%, #0a2c22 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-glass-media__visual {
    position: relative;
    overflow: hidden;
}

.dgproduct-glass-media__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 45%, rgba(4,29,20,.62) 100%);
}

.dgproduct-glass-media__image {
    display: block;
    width: 100%;
    min-height: 350px;
    aspect-ratio: 1.6 / 1;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-glass-media:hover .dgproduct-glass-media__image {
    transform: scale(1.025);
}

.dgproduct-glass-media__badge {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(4,36,25,.74);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dgproduct-glass-media__badge span {
    display: block;
    margin-bottom: 4px;
    color: #c7de72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-glass-media__badge strong {
    display: block;
    color: #fff;
    direction: ltr;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-glass-media__caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
}

.dgproduct-glass-media__caption-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.dgproduct-glass-media__caption-head span {
    color: rgba(219,231,225,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-glass-media__caption-head strong {
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-glass-media__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 15px;
}

.dgproduct-glass-media__matrix > div {
    padding: 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-glass-media__matrix span {
    display: block;
    margin-bottom: 7px;
    color: #d3b74e;
    direction: ltr;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-glass-media__matrix strong {
    display: block;
    margin-bottom: 4px;
    color: #bde37d;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
}

.dgproduct-glass-media__matrix small {
    display: block;
    color: rgba(230,238,234,.54);
    font-size: 7px;
    line-height: 1.6;
}

.dgproduct-glass-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-glass-media__flow > span:nth-child(2),
.dgproduct-glass-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(112,232,116,.24), rgba(214,184,79,.58));
}

.dgproduct-glass-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--glass {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--glass,
    .dgproduct-glass-media__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-glass-media__image {
        min-height: 290px;
    }

    .dgproduct-glass-media__caption-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .dgproduct-glass-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-glass-media__flow > span:nth-child(2),
    .dgproduct-glass-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — APPLICATION 03 — GLASS MAKING INDUSTRIES v1.7.29 */


/* =========================================================
   APPLICATION 04 — CERAMIC INDUSTRIES
   v1.7.30
========================================================= */

.dgproduct-application__grid--ceramic {
    grid-template-columns: minmax(0, 1.04fr) minmax(360px, .96fr);
}

.dgproduct-application__uses--ceramic {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-ceramic-media,
.dgproduct-ceramic-media * {
    box-sizing: border-box;
}

.dgproduct-ceramic-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 78% 18%, rgba(112,235,116,.08), transparent 28%),
        linear-gradient(145deg, #071812 0%, #0a3023 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-ceramic-media__visual {
    position: relative;
    overflow: hidden;
}

.dgproduct-ceramic-media__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 46%, rgba(4,29,20,.64) 100%);
}

.dgproduct-ceramic-media__image {
    display: block;
    width: 100%;
    min-height: 350px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-ceramic-media:hover .dgproduct-ceramic-media__image {
    transform: scale(1.025);
}

.dgproduct-ceramic-media__badge {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(4,36,25,.74);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dgproduct-ceramic-media__badge span {
    display: block;
    margin-bottom: 4px;
    color: #c7de72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-ceramic-media__badge strong {
    display: block;
    color: #fff;
    direction: ltr;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-ceramic-media__caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
}

.dgproduct-ceramic-media__caption-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.dgproduct-ceramic-media__caption-head span {
    color: rgba(219,231,225,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-ceramic-media__caption-head strong {
    color: #fff;
    direction: ltr;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-ceramic-media__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 15px;
}

.dgproduct-ceramic-media__matrix > div {
    padding: 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-ceramic-media__matrix span {
    display: block;
    margin-bottom: 7px;
    color: #d3b74e;
    direction: ltr;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-ceramic-media__matrix strong {
    display: block;
    margin-bottom: 4px;
    color: #bde37d;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
}

.dgproduct-ceramic-media__matrix small {
    display: block;
    color: rgba(230,238,234,.54);
    direction: ltr;
    font-size: 7px;
    line-height: 1.6;
}

.dgproduct-ceramic-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-ceramic-media__flow > span:nth-child(2),
.dgproduct-ceramic-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(112,232,116,.24), rgba(214,184,79,.58));
}

.dgproduct-ceramic-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--ceramic {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--ceramic,
    .dgproduct-ceramic-media__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-ceramic-media__image {
        min-height: 290px;
    }

    .dgproduct-ceramic-media__caption-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .dgproduct-ceramic-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-ceramic-media__flow > span:nth-child(2),
    .dgproduct-ceramic-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — APPLICATION 04 — CERAMIC INDUSTRIES v1.7.30 */


/* =========================================================
   APPLICATION 05 — TRAFFIC PAINTS & SIGNS
   v1.7.31
========================================================= */

.dgproduct-application__grid--traffic {
    grid-template-columns: minmax(360px, .96fr) minmax(0, 1.04fr);
}

.dgproduct-application__uses--traffic {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-application__text--secondary {
    margin-top: 12px;
}

.dgproduct-traffic-media,
.dgproduct-traffic-media * {
    box-sizing: border-box;
}

.dgproduct-traffic-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 16% 16%, rgba(187,255,88,.09), transparent 25%),
        linear-gradient(145deg, #061610 0%, #0a2d21 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-traffic-media__visual {
    position: relative;
    overflow: hidden;
}

.dgproduct-traffic-media__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 44%, rgba(4,29,20,.68) 100%);
}

.dgproduct-traffic-media__image {
    display: block;
    width: 100%;
    min-height: 360px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-traffic-media:hover .dgproduct-traffic-media__image {
    transform: scale(1.025);
}

.dgproduct-traffic-media__badge {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(4,36,25,.76);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dgproduct-traffic-media__badge span {
    display: block;
    margin-bottom: 4px;
    color: #d4e86e;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-traffic-media__badge strong {
    display: block;
    color: #fff;
    direction: ltr;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-traffic-media__caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
}

.dgproduct-traffic-media__caption-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.dgproduct-traffic-media__caption-head span {
    color: rgba(219,231,225,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-traffic-media__caption-head strong {
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-traffic-media__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 15px;
}

.dgproduct-traffic-media__matrix > div {
    padding: 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-traffic-media__matrix span {
    display: block;
    margin-bottom: 7px;
    color: #d3b74e;
    direction: ltr;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-traffic-media__matrix strong {
    display: block;
    margin-bottom: 4px;
    color: #c8eb72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
}

.dgproduct-traffic-media__matrix small {
    display: block;
    color: rgba(230,238,234,.54);
    font-size: 7px;
    line-height: 1.6;
}

.dgproduct-traffic-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-traffic-media__flow > span:nth-child(2),
.dgproduct-traffic-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(185,238,91,.26), rgba(214,184,79,.60));
}

.dgproduct-traffic-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--traffic {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--traffic,
    .dgproduct-traffic-media__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-traffic-media__image {
        min-height: 290px;
    }

    .dgproduct-traffic-media__caption-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .dgproduct-traffic-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-traffic-media__flow > span:nth-child(2),
    .dgproduct-traffic-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — APPLICATION 05 — TRAFFIC PAINTS & SIGNS v1.7.31 */


/* =========================================================
   APPLICATION 06 — INTERIOR & EXTERIOR DECORATION
   v1.7.32
========================================================= */

.dgproduct-application__grid--decoration {
    grid-template-columns: minmax(0, 1.04fr) minmax(360px, .96fr);
}

.dgproduct-application__uses--decoration {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dgproduct-decoration-media,
.dgproduct-decoration-media * {
    box-sizing: border-box;
}

.dgproduct-decoration-media {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 22px;
    background:
        radial-gradient(circle at 78% 18%, rgba(112,235,116,.09), transparent 28%),
        linear-gradient(145deg, #061711 0%, #0a3023 100%);
    box-shadow: 0 22px 52px rgba(12,58,42,.10);
}

.dgproduct-decoration-media__visual {
    position: relative;
    overflow: hidden;
}

.dgproduct-decoration-media__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,18,13,.02) 44%, rgba(4,29,20,.64) 100%);
}

.dgproduct-decoration-media__image {
    display: block;
    width: 100%;
    min-height: 360px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
    transition: transform 650ms cubic-bezier(.22,1,.36,1);
}

.dgproduct-decoration-media:hover .dgproduct-decoration-media__image {
    transform: scale(1.025);
}

.dgproduct-decoration-media__badge {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(4,36,25,.74);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dgproduct-decoration-media__badge span {
    display: block;
    margin-bottom: 4px;
    color: #c7de72;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-decoration-media__badge strong {
    display: block;
    color: #fff;
    direction: ltr;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-decoration-media__caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
}

.dgproduct-decoration-media__caption-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.dgproduct-decoration-media__caption-head span {
    color: rgba(219,231,225,.44);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-decoration-media__caption-head strong {
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-decoration-media__matrix {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 15px;
}

.dgproduct-decoration-media__matrix > div {
    padding: 10px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.dgproduct-decoration-media__matrix span {
    display: block;
    margin-bottom: 7px;
    color: #d3b74e;
    direction: ltr;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.dgproduct-decoration-media__matrix strong {
    display: block;
    margin-bottom: 4px;
    color: #bde37d;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
}

.dgproduct-decoration-media__matrix small {
    display: block;
    color: rgba(230,238,234,.54);
    direction: ltr;
    font-size: 7px;
    line-height: 1.6;
}

.dgproduct-decoration-media__flow {
    display: grid;
    grid-template-columns: auto minmax(20px,1fr) auto minmax(20px,1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    color: rgba(215,228,222,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-decoration-media__flow > span:nth-child(2),
.dgproduct-decoration-media__flow > span:nth-child(4) {
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(112,232,116,.24), rgba(214,184,79,.58));
}

.dgproduct-decoration-media__flow strong {
    color: #d5b64e;
    font-size: 7px;
}

@media (max-width: 960px) {
    .dgproduct-application__grid--decoration {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-application__uses--decoration,
    .dgproduct-decoration-media__matrix {
        grid-template-columns: 1fr;
    }

    .dgproduct-decoration-media__image {
        min-height: 290px;
    }

    .dgproduct-decoration-media__caption-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .dgproduct-decoration-media__flow {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .dgproduct-decoration-media__flow > span:nth-child(2),
    .dgproduct-decoration-media__flow > span:nth-child(4) {
        width: 30px;
    }
}

/* END — APPLICATION 06 — INTERIOR & EXTERIOR DECORATION v1.7.32 */


/* =========================================================
   PRODUCT EXPLORER + YG PRODUCT VIEWER — v1.7.34
========================================================= */

.dgproduct-explorer {
    --dgpe-ink: #17231b;
    --dgpe-muted: #6f7c73;
    --dgpe-line: #dde5df;
    --dgpe-soft: #f4f7f5;
    --dgpe-dark: #08130d;
    --dgpe-dark-2: #102019;
    --dgpe-glow: #a8ff34;
    --dgpe-glow-soft: #d8ff8f;
    --dgpe-gold: #c3a518;
    width: 100%;
    padding: 46px 22px 54px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfb 100%);
}

.dgproduct-explorer__inner {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.dgproduct-explorer__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 16px;
}

.dgproduct-explorer__kicker {
    display: block;
    margin-bottom: 5px;
    color: #8a958e;
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .12em;
    text-align: right;
}

.dgproduct-explorer__title {
    margin: 0 0 6px;
    color: var(--dgpe-ink);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.85;
}

.dgproduct-explorer__lead {
    max-width: 760px;
    margin: 0;
    color: var(--dgpe-muted);
    font-size: 12px;
    line-height: 2;
}

.dgproduct-explorer__head-meta {
    display: flex;
    align-items: baseline;
    gap: 6px;
    color: #8c968f;
    direction: ltr;
    white-space: nowrap;
}

.dgproduct-explorer__head-meta span {
    color: #233129;
    font-size: 18px;
    font-weight: 900;
}

.dgproduct-explorer__head-meta small {
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-tabs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
    padding: 5px;
    margin-bottom: 17px;
    border: 1px solid #e1e7e3;
    border-radius: 15px;
    background: #f3f6f4;
}

.dgproduct-tabs__tab {
    min-width: 0;
    padding: 10px 9px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #606d64;
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.dgproduct-tabs__tab:hover {
    background: rgba(255,255,255,.76);
    color: #223028;
}

.dgproduct-tabs__tab.is-active {
    background: #fff;
    color: #1b2a20;
    box-shadow: 0 7px 18px rgba(17,44,27,.07), inset 0 -2px 0 var(--dgpe-gold);
}

.dgproduct-tabs__code,
.dgproduct-tabs__label {
    display: block;
}

.dgproduct-tabs__code {
    margin-bottom: 1px;
    color: #909a93;
    direction: ltr;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .05em;
}

.dgproduct-tabs__tab.is-active .dgproduct-tabs__code {
    color: #77950b;
}

.dgproduct-tabs__label {
    font-size: 11px;
    font-weight: 750;
    line-height: 1.8;
}

.dgproduct-mobile-select {
    display: none;
    position: relative;
    z-index: 30;
    margin-bottom: 16px;
}

.dgproduct-mobile-select__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    padding: 11px 13px;
    border: 1px solid #dfe6e1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 7px 21px rgba(16,40,24,.07);
    color: #1d2a21;
    cursor: pointer;
    text-align: right;
}

.dgproduct-mobile-select__copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.dgproduct-mobile-select__copy small {
    color: #98a29a;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-mobile-select__copy strong {
    font-size: 12px;
    font-weight: 800;
}

.dgproduct-mobile-select__chevron {
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    border-radius: 9px;
    background: #f1f5f2;
}

.dgproduct-mobile-select__chevron svg {
    width: 18px;
    height: 18px;
    fill: #718078;
    transition: transform 180ms ease;
}

.dgproduct-mobile-select__trigger[aria-expanded="true"] .dgproduct-mobile-select__chevron svg {
    transform: rotate(180deg);
}

.dgproduct-mobile-select__menu {
    position: absolute;
    top: calc(100% + 7px);
    right: 0;
    left: 0;
    overflow: hidden;
    padding: 5px;
    border: 1px solid #dfe6e1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(14,36,21,.13);
}

.dgproduct-mobile-select__menu[hidden] {
    display: none;
}

.dgproduct-mobile-select__option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #4d5a51;
    cursor: pointer;
    font-size: 11px;
    text-align: right;
}

.dgproduct-mobile-select__option span {
    min-width: 52px;
    color: #929d95;
    direction: ltr;
    font-size: 8px;
    font-weight: 900;
}

.dgproduct-mobile-select__option:hover,
.dgproduct-mobile-select__option.is-active {
    background: #eef7e9;
    color: #1e2b22;
}

.dgproduct-mobile-select__option.is-active {
    font-weight: 800;
}

.dgproduct-mobile-select__option.is-active span {
    color: #6e8d09;
}

.dgproduct-family-panel[hidden] {
    display: none;
}

.dgproduct-family-divider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 94px;
    margin-bottom: 14px;
    overflow: hidden;
    padding: 17px 21px;
    border-radius: 15px;
    background: radial-gradient(circle at 9% 50%, rgba(190,255,113,.14), transparent 33%), linear-gradient(102deg, #0d1b13 0%, #16351d 53%, #3c721f 100%);
    color: #fff;
}

.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, #aafc3c, transparent);
    box-shadow: 0 0 16px rgba(170,252,60,.48);
}

.dgproduct-family-divider__identity {
    display: flex;
    align-items: center;
    gap: 13px;
}

.dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 11px;
    background: rgba(255,255,255,.07);
    color: #d8ff8b;
    direction: ltr;
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-family-divider__micro {
    display: block;
    margin-bottom: 2px;
    color: rgba(255,255,255,.5);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .1em;
    text-align: right;
}

.dgproduct-family-divider h3 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-family-divider__latin {
    direction: ltr;
    text-align: left;
}

.dgproduct-family-divider__latin strong,
.dgproduct-family-divider__latin span {
    display: block;
}

.dgproduct-family-divider__latin strong {
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-family-divider__latin span {
    margin-top: 2px;
    color: rgba(255,255,255,.52);
    font-size: 7px;
    font-weight: 750;
    letter-spacing: .08em;
}

.dgproduct-family-intro {
    display: grid;
    grid-template-columns: minmax(320px, .88fr) minmax(0, 1.12fr);
    grid-template-areas: "media content";
    gap: 24px;
    margin-bottom: 26px;
    padding: 10px;
    border: 1px solid var(--dgpe-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(18,42,26,.05);
    direction: ltr;
}

.dgproduct-family-intro__media {
    grid-area: media;
    margin: 0;
    min-width: 0;
    direction: ltr;
}

.dgproduct-family-intro__visual {
    position: relative;
    min-height: 370px;
    overflow: hidden;
    border-radius: 12px;
    background: #07110b;
}

.dgproduct-family-intro__visual > img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 370px;
    object-fit: cover;
}

.dgproduct-family-intro__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 52%, rgba(3,13,7,.72));
    pointer-events: none;
}

.dgproduct-family-intro__badge {
    position: absolute;
    z-index: 2;
    right: 14px;
    bottom: 14px;
    padding: 9px 11px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 9px;
    background: rgba(4,25,13,.71);
    backdrop-filter: blur(8px);
    color: #fff;
}

.dgproduct-family-intro__badge span,
.dgproduct-family-intro__badge strong {
    display: block;
    direction: ltr;
}

.dgproduct-family-intro__badge span {
    margin-bottom: 2px;
    color: rgba(255,255,255,.56);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-family-intro__badge strong {
    color: #d9ff88;
    font-size: 9px;
    font-weight: 900;
}

.dgproduct-family-intro__media figcaption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 2px 0;
    color: #8b968e;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .07em;
}

.dgproduct-family-intro__content {
    grid-area: content;
    padding: 26px 26px 22px 15px;
    direction: rtl;
    text-align: right;
}

.dgproduct-family-intro__eyebrow {
    display: block;
    margin-bottom: 7px;
    color: #7c8b81;
    direction: ltr;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .08em;
    text-align: right;
}

.dgproduct-family-intro__content h3 {
    margin: 0 0 10px;
    color: var(--dgpe-ink);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.9;
}

.dgproduct-family-intro__content p {
    margin: 0 0 10px;
    color: #4d5a51;
    font-size: 12px;
    line-height: 2.05;
    text-align: justify;
}

.dgproduct-family-intro__content p strong {
    color: #27362c;
    font-weight: 800;
}

.dgproduct-family-intro__points {
    margin: 15px 0 0;
    padding: 0;
    list-style: none;
}

.dgproduct-family-intro__points li {
    position: relative;
    margin-bottom: 7px;
    padding-right: 17px;
    color: #56635a;
    font-size: 11px;
    line-height: 2;
    text-align: justify;
}

.dgproduct-family-intro__points li::before {
    content: "";
    position: absolute;
    top: .9em;
    right: 2px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #96c63d;
    box-shadow: 0 0 0 4px #eef6e8;
}

.dgproduct-products-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 11px;
}

.dgproduct-products-head > div:first-child > span {
    display: block;
    margin-bottom: 2px;
    color: #8d9991;
    direction: ltr;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .1em;
}

.dgproduct-products-head h3 {
    margin: 0;
    color: var(--dgpe-ink);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.8;
}

.dgproduct-products-head__count {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: #8d978f;
    direction: ltr;
}

.dgproduct-products-head__count strong {
    color: #253229;
    font-size: 17px;
    font-weight: 900;
}

.dgproduct-products-head__count small {
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dgproduct-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dfe5e1;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 5px 17px rgba(15,36,22,.045);
    cursor: pointer;
    outline: none;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.dgproduct-card:hover,
.dgproduct-card:focus-visible {
    transform: translateY(-2px);
    border-color: #ccd9d0;
    box-shadow: 0 10px 24px rgba(15,36,22,.09);
}

.dgproduct-card:focus-visible {
    box-shadow: 0 0 0 3px rgba(195,165,24,.22), 0 10px 24px rgba(15,36,22,.09);
}

.dgproduct-card__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1.52 / 1;
    background: #07110b;
}

.dgproduct-card__media > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 360ms cubic-bezier(.22,1,.36,1), filter 220ms ease;
}

.dgproduct-card:hover .dgproduct-card__media > img,
.dgproduct-card:focus-visible .dgproduct-card__media > img {
    transform: scale(1.025);
    filter: saturate(1.04);
}

.dgproduct-card__series {
    position: absolute;
    z-index: 4;
    top: 8px;
    right: 8px;
    min-width: 31px;
    padding: 5px 7px;
    border: 1px solid rgba(216,255,143,.22);
    border-radius: 7px;
    background: rgba(4,23,13,.7);
    color: #dcff92;
    direction: ltr;
    font-size: 7px;
    font-weight: 900;
    text-align: center;
    backdrop-filter: blur(7px);
}

.dgproduct-card__open {
    position: absolute;
    z-index: 4;
    right: 8px;
    bottom: 8px;
    padding: 5px 7px;
    border-radius: 6px;
    background: rgba(4,20,12,.66);
    color: rgba(255,255,255,.78);
    direction: ltr;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .07em;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.dgproduct-card:hover .dgproduct-card__open,
.dgproduct-card:focus-visible .dgproduct-card__open {
    opacity: 1;
    transform: translateY(0);
}

.dgproduct-card__body {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    padding: 9px 10px 10px;
    direction: ltr;
    color: #18251d;
}

.dgproduct-card__body span {
    color: #7b867f;
    font-size: 9px;
    font-weight: 700;
}

.dgproduct-card__body strong {
    font-size: 11px;
    font-weight: 900;
}

.dgproduct-watermark {
    position: absolute;
    z-index: 3;
    inset: -45%;
    pointer-events: none;
    transform: rotate(-34deg);
    opacity: .28;
}

.dgproduct-watermark::before,
.dgproduct-watermark::after {
    content: "www.dgcheme.com    www.dgcheme.com    www.dgcheme.com    www.dgcheme.com    www.dgcheme.com";
    position: absolute;
    right: 0;
    left: 0;
    color: rgba(255,255,255,.42);
    font-size: 14px;
    font-weight: 800;
    line-height: 5;
    text-align: center;
    white-space: nowrap;
}

.dgproduct-watermark::before {
    top: 28%;
}

.dgproduct-watermark::after {
    top: 55%;
}

.dgproduct-family-placeholder {
    padding: 34px 20px;
    border: 1px dashed #d5dfd8;
    border-radius: 15px;
    background: #f8faf9;
    color: #738078;
    text-align: center;
}

.dgproduct-family-placeholder span {
    display: block;
    margin-bottom: 5px;
    color: #7c897f;
    direction: ltr;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgproduct-family-placeholder p {
    margin: 0;
    font-size: 12px;
    line-height: 2;
}

/* ---------- Product viewer ---------- */
html.dgproduct-viewer-open,
body.dgproduct-viewer-open {
    overflow: hidden;
}

.dgproduct-viewer[hidden],
.dgproduct-fullscreen[hidden] {
    display: none;
}

.dgproduct-viewer {
    position: fixed;
    z-index: 99990;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.dgproduct-viewer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2,8,5,.79);
    backdrop-filter: blur(12px);
}

.dgproduct-viewer__dialog {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
    grid-template-areas: "info media";
    gap: 18px;
    width: min(1420px, 100%);
    max-height: calc(100vh - 36px);
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.23);
    border-radius: 15px;
    background: radial-gradient(circle at 58% 32%, rgba(44,110,51,.16), transparent 32%), rgba(24,27,25,.95);
    box-shadow: 0 28px 80px rgba(0,0,0,.46);
    direction: ltr;
}

.dgproduct-viewer__close {
    position: absolute;
    z-index: 20;
    top: 8px;
    left: 11px;
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
    text-shadow: 0 2px 8px #000;
}

.dgproduct-viewer__info {
    grid-area: info;
    min-width: 0;
    overflow: hidden;
    padding: 2px 2px 2px 10px;
    color: #fff;
    direction: ltr;
}

.dgproduct-viewer__brand-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    margin-bottom: 14px;
    padding: 10px 15px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 12px;
    background: linear-gradient(100deg, rgba(119,123,120,.52), rgba(78,84,80,.54));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.dgproduct-viewer__logo {
    width: min(150px, 38%);
    height: auto;
    object-fit: contain;
}

.dgproduct-viewer__brand-card strong {
    color: #fff;
    font-size: 17px;
    font-weight: 900;
    text-align: right;
}

.dgproduct-viewer__scroll {
    max-height: calc(100vh - 165px);
    overflow-y: auto;
    padding: 0 7px 12px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.32) rgba(255,255,255,.05);
}

.dgproduct-viewer__scroll::-webkit-scrollbar {
    width: 7px;
}

.dgproduct-viewer__scroll::-webkit-scrollbar-track {
    border-radius: 10px;
    background: rgba(255,255,255,.05);
}

.dgproduct-viewer__scroll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(255,255,255,.28);
}

.dgproduct-viewer__spec-wrap {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 11px;
    background: rgba(105,109,106,.26);
}

.dgproduct-viewer__spec-table {
    width: 100%;
    border-collapse: collapse;
    color: #fff;
    table-layout: fixed;
}

.dgproduct-viewer__spec-table th,
.dgproduct-viewer__spec-table td {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(255,255,255,.14);
    color: #fff;
    font-size: 11px;
    line-height: 1.55;
    text-align: left;
    vertical-align: top;
}

.dgproduct-viewer__spec-table tr:last-child th,
.dgproduct-viewer__spec-table tr:last-child td {
    border-bottom: 0;
}

.dgproduct-viewer__spec-table th {
    width: 39%;
    background: rgba(132,136,133,.26);
    font-weight: 800;
}

.dgproduct-viewer__spec-table td {
    font-weight: 650;
}

.dgproduct-viewer__applications {
    margin-top: 18px;
}

.dgproduct-viewer__applications h4 {
    margin: 0 0 8px;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.5;
}

.dgproduct-viewer__applications ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dgproduct-viewer__applications li {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
    color: #f2f5f3;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.5;
}

.dgproduct-viewer__applications li img {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    object-fit: contain;
    opacity: .86;
}

.dgproduct-viewer__star {
    color: #ffd84f;
    font-size: 10px;
    font-weight: 900;
}

.dgproduct-viewer__note {
    margin: 14px 0 0;
    padding-top: 11px;
    border-top: 1px solid rgba(255,255,255,.13);
    color: #ffd84f;
    font-size: 10px;
    font-style: italic;
    font-weight: 750;
}

.dgproduct-viewer__media {
    grid-area: media;
    min-width: 0;
    align-self: center;
}

.dgproduct-viewer__image-stage {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    background: #020703;
    cursor: crosshair;
    touch-action: none;
}

.dgproduct-viewer__main-image {
    display: block;
    width: 100%;
    max-height: calc(100vh - 160px);
    aspect-ratio: 1.5 / 1;
    object-fit: contain;
    transform-origin: center center;
}

.dgproduct-watermark--viewer {
    z-index: 4;
    opacity: .34;
}

.dgproduct-viewer__tool {
    position: absolute;
    z-index: 12;
    right: 11px;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
    background: rgba(5,10,7,.22);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(5px);
}

.dgproduct-viewer__tool svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.dgproduct-viewer__tool--zoom {
    top: 10px;
}

.dgproduct-viewer__tool--fullscreen {
    top: 47px;
}

.dgproduct-viewer__tool[aria-pressed="true"] {
    border-color: rgba(216,255,142,.45);
    color: #dcff91;
    background: rgba(28,75,35,.48);
}

.dgproduct-viewer__zoom-lens {
    position: absolute;
    z-index: 15;
    display: none;
    width: 156px;
    height: 156px;
    overflow: hidden;
    border: 2px solid rgba(255,255,255,.9);
    border-radius: 50%;
    background: #07120b;
    box-shadow: 0 8px 26px rgba(0,0,0,.34);
    pointer-events: none;
    opacity: 0;
    transition: opacity 120ms ease;
}

.dgproduct-viewer__zoom-lens.is-active {
    display: block;
    opacity: 1;
}

.dgproduct-viewer__zoom-lens img {
    position: absolute;
    max-width: none;
    object-fit: fill;
}

.dgproduct-viewer__thumbnails {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 8px;
    min-height: 58px;
    padding-top: 9px;
}

.dgproduct-viewer__thumb {
    width: 62px;
    padding: 3px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 7px;
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

.dgproduct-viewer__thumb.is-active {
    border-color: #d0b137;
    box-shadow: 0 0 0 1px rgba(208,177,55,.32);
}

.dgproduct-viewer__thumb img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / .72;
    border-radius: 4px;
    object-fit: cover;
}

.dgproduct-viewer__thumb span {
    display: block;
    padding: 3px 0 1px;
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    text-align: center;
}

.dgproduct-fullscreen {
    position: fixed;
    z-index: 100020;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: rgba(0,0,0,.94);
    touch-action: none;
}

.dgproduct-fullscreen__image {
    position: relative;
    z-index: 2;
    max-width: 95%;
    max-height: 94%;
    object-fit: contain;
    transform-origin: center center;
}

.dgproduct-fullscreen__close {
    position: absolute;
    z-index: 15;
    top: 40px;
    right: 20px;
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    font-size: 30px;
    line-height: 1;
}

.dgproduct-watermark--fullscreen {
    z-index: 4;
    opacity: .28;
}

@media (max-width: 1100px) {
    .dgproduct-tabs {
        display: none;
    }

    .dgproduct-mobile-select {
        display: block;
    }

    .dgproduct-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .dgproduct-family-intro {
        grid-template-columns: minmax(280px, .86fr) minmax(0, 1.14fr);
    }

    .dgproduct-viewer__dialog {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "info";
        overflow-y: auto;
        max-height: calc(100vh - 24px);
        padding: 14px;
    }

    .dgproduct-viewer__media {
        width: 100%;
    }

    .dgproduct-viewer__main-image {
        max-height: 54vh;
    }

    .dgproduct-viewer__info {
        padding: 0;
    }

    .dgproduct-viewer__scroll {
        max-height: none;
        overflow: visible;
        padding: 0 0 8px;
    }

    .dgproduct-viewer__close {
        position: fixed;
        top: 18px;
        right: 24px;
        left: auto;
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer {
        padding: 36px 13px 44px;
    }

    .dgproduct-explorer__head {
        display: block;
    }

    .dgproduct-explorer__head-meta {
        margin-top: 7px;
    }

    .dgproduct-family-divider {
        min-height: auto;
        padding: 13px;
        align-items: flex-start;
    }

    .dgproduct-family-divider__latin {
        display: none;
    }

    .dgproduct-family-divider__index {
        width: 38px;
        height: 38px;
    }

    .dgproduct-family-intro {
        grid-template-columns: 1fr;
        grid-template-areas:
            "content"
            "media";
        gap: 0;
        padding: 7px;
    }

    .dgproduct-family-intro__content {
        padding: 17px 11px 18px;
    }

    .dgproduct-family-intro__visual,
    .dgproduct-family-intro__visual > img {
        min-height: 280px;
    }

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

    .dgproduct-viewer {
        align-items: flex-start;
        padding: 10px;
        overflow-y: auto;
    }

    .dgproduct-viewer__dialog {
        margin: auto 0;
        width: 100%;
        max-height: none;
    }

    .dgproduct-viewer__main-image {
        max-height: none;
        aspect-ratio: 1.25 / 1;
    }

    .dgproduct-viewer__tool--zoom {
        display: none;
    }

    .dgproduct-viewer__tool--fullscreen {
        top: 40px;
    }

    .dgproduct-viewer__brand-card {
        min-height: 58px;
    }

    .dgproduct-viewer__spec-table th,
    .dgproduct-viewer__spec-table td {
        padding: 9px;
        font-size: 10px;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-divider h3,
    .dgproduct-family-intro__content h3,
    .dgproduct-products-head h3 {
        font-size: 14px;
    }

    .dgproduct-family-intro__content p {
        font-size: 11px;
    }

    .dgproduct-family-intro__points li {
        font-size: 10px;
    }

    .dgproduct-grid {
        grid-template-columns: 1fr;
    }

    .dgproduct-card__media {
        aspect-ratio: 1.55 / 1;
    }

    .dgproduct-viewer__dialog {
        padding: 10px;
        border-radius: 12px;
    }

    .dgproduct-viewer__brand-card {
        margin-top: 2px;
        padding: 9px 10px;
    }

    .dgproduct-viewer__brand-card strong {
        font-size: 14px;
    }

    .dgproduct-viewer__applications h4 {
        font-size: 14px;
    }
}

/* END — PRODUCT EXPLORER + YG PRODUCT VIEWER v1.7.34 */


/* =========================================================
   PRODUCT EXPLORER — PREMIUM CATALOG / VIEWER UPGRADE v1.7.35
   Cards: richer technical summaries + centered 3/2 layout.
   Viewer: industrial product-console treatment, same behavior.
========================================================= */

/* ---------- Product catalogue header ---------- */
.dgproduct-products-head {
    position: relative;
    padding: 0 2px 12px;
    margin-bottom: 14px;
}

.dgproduct-products-head::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0, #dfe7e1 16%, #dfe7e1 84%, transparent 100%);
}

/* ---------- Premium 5-card catalogue geometry ---------- */
.dgproduct-grid--yg {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
}

.dgproduct-grid--yg > .dgproduct-card {
    grid-column: span 2;
}

.dgproduct-grid--yg > .dgproduct-card:nth-child(4) {
    grid-column: 2 / span 2;
}

.dgproduct-grid--yg > .dgproduct-card:nth-child(5) {
    grid-column: 4 / span 2;
}

.dgproduct-card {
    position: relative;
    overflow: hidden;
    border: 1px solid #dce5de;
    border-radius: 16px;
    background:
        linear-gradient(180deg, #ffffff 0%, #fbfdfb 100%);
    box-shadow:
        0 12px 34px rgba(12,36,21,.055),
        0 2px 8px rgba(12,36,21,.035);
    isolation: isolate;
    transition:
        transform 220ms cubic-bezier(.2,.7,.2,1),
        box-shadow 220ms ease,
        border-color 220ms ease;
}

.dgproduct-card::before {
    content: "";
    position: absolute;
    z-index: 8;
    top: 0;
    right: 18%;
    left: 18%;
    height: 2px;
    opacity: 0;
    background: linear-gradient(90deg, transparent, #b9ff4f, transparent);
    box-shadow: 0 0 18px rgba(168,255,52,.6);
    transition: opacity 220ms ease, right 220ms ease, left 220ms ease;
}

.dgproduct-card:hover,
.dgproduct-card:focus-visible {
    transform: translateY(-4px);
    border-color: #cad9ce;
    box-shadow:
        0 22px 54px rgba(11,40,23,.105),
        0 4px 14px rgba(11,40,23,.055);
}

.dgproduct-card:hover::before,
.dgproduct-card:focus-visible::before {
    right: 7%;
    left: 7%;
    opacity: 1;
}

.dgproduct-card:focus-visible {
    outline: 2px solid rgba(195,165,24,.55);
    outline-offset: 3px;
}

.dgproduct-card__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1.48 / 1;
    margin: 8px 8px 0;
    border-radius: 12px;
    background: #030804;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}

.dgproduct-card__media::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(1,6,3,.02) 48%, rgba(1,8,4,.62) 100%),
        radial-gradient(circle at 50% 45%, transparent 48%, rgba(0,0,0,.18) 100%);
}

.dgproduct-card__night {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 520ms cubic-bezier(.2,.7,.2,1), filter 320ms ease;
}

.dgproduct-card:hover .dgproduct-card__night,
.dgproduct-card:focus-visible .dgproduct-card__night {
    transform: scale(1.038);
    filter: saturate(1.06) contrast(1.02);
}

.dgproduct-card__series {
    top: 10px;
    right: 10px;
    z-index: 5;
    min-width: 0;
    height: 25px;
    padding: 0 9px;
    border: 1px solid rgba(207,255,137,.2);
    border-radius: 8px;
    background: rgba(4,18,10,.7);
    color: #d9ff9a;
    backdrop-filter: blur(8px);
    font-size: 7px;
    letter-spacing: .08em;
}

.dgproduct-card__night-badge {
    position: absolute;
    z-index: 5;
    right: 10px;
    bottom: 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: rgba(255,255,255,.8);
    direction: ltr;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .08em;
}

.dgproduct-card__night-badge i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #b5ff4a;
    box-shadow: 0 0 9px rgba(181,255,74,.9);
}

.dgproduct-card__open {
    top: 10px;
    right: auto;
    left: 10px;
    bottom: auto;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 25px;
    padding: 0 8px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 8px;
    background: rgba(4,13,8,.58);
    color: rgba(255,255,255,.9);
    backdrop-filter: blur(8px);
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .07em;
    opacity: .72;
    transform: none;
}

.dgproduct-card__open svg {
    width: 12px;
    height: 12px;
    fill: currentColor;
}

.dgproduct-card:hover .dgproduct-card__open,
.dgproduct-card:focus-visible .dgproduct-card__open {
    opacity: 1;
    transform: none;
    border-color: rgba(205,255,136,.28);
    color: #e4ffb2;
}

.dgproduct-card__day-preview {
    position: absolute;
    z-index: 7;
    left: 10px;
    bottom: 10px;
    width: 54px;
    padding: 3px;
    border: 1px solid rgba(255,255,255,.38);
    border-radius: 8px;
    background: rgba(250,252,250,.93);
    box-shadow: 0 8px 20px rgba(0,0,0,.2);
    backdrop-filter: blur(5px);
}

.dgproduct-card__day-preview img {
    display: block;
    width: 100%;
    aspect-ratio: 1.12 / 1;
    border-radius: 5px;
    object-fit: cover;
}

.dgproduct-card__day-preview em {
    display: block;
    padding: 2px 0 0;
    color: #48534c;
    direction: ltr;
    font-size: 6px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .09em;
    text-align: center;
}

.dgproduct-card__body {
    display: block;
    padding: 13px 13px 12px;
    direction: ltr;
    color: #18251d;
}

.dgproduct-card__identity {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e9eeea;
}

.dgproduct-card__identity > div {
    min-width: 0;
}

.dgproduct-card__identity > div > span {
    display: block;
    margin-bottom: 1px;
    color: #98a29b;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .09em;
}

.dgproduct-card__identity strong {
    display: block;
    color: #142019;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .01em;
}

.dgproduct-card__glow-name {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 7px;
    border: 1px solid #e2ebdc;
    border-radius: 999px;
    background: #f5faef;
    color: #516541;
    font-size: 7px;
    font-weight: 800;
    white-space: nowrap;
}

.dgproduct-card__glow-name i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #a9e746;
    box-shadow: 0 0 0 3px rgba(169,231,70,.12);
}

.dgproduct-card__quick-specs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 9px;
}

.dgproduct-card__quick-specs > span {
    min-width: 0;
    padding: 7px 7px 6px;
    border: 1px solid #e7ece8;
    border-radius: 9px;
    background: linear-gradient(180deg, #f9fbf9, #f5f8f6);
}

.dgproduct-card__quick-specs small,
.dgproduct-card__quick-specs b {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dgproduct-card__quick-specs small {
    margin-bottom: 2px;
    color: #9ba49e;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .06em;
}

.dgproduct-card__quick-specs b {
    color: #354239;
    font-size: 8px;
    font-weight: 800;
}

.dgproduct-card__apps {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    min-height: 30px;
    margin-top: 9px;
}

.dgproduct-card__app {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    max-width: 100%;
    padding: 4px 6px;
    border: 1px solid #e6ebe7;
    border-radius: 7px;
    background: #fff;
    color: #657169;
    font-size: 7px;
    font-weight: 700;
    line-height: 1.2;
}

.dgproduct-card__app b {
    color: #c3a518;
    font-size: 8px;
    line-height: 1;
}

.dgproduct-card__app--more {
    border-color: #e2e8df;
    background: #f3f7f2;
    color: #78837b;
    font-weight: 850;
}

.dgproduct-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid #edf1ee;
    color: #7b867e;
    direction: rtl;
    font-size: 8px;
    font-weight: 700;
}

.dgproduct-card__footer svg {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    fill: #a79022;
    transform: rotate(180deg);
    transition: transform 180ms ease;
}

.dgproduct-card:hover .dgproduct-card__footer svg,
.dgproduct-card:focus-visible .dgproduct-card__footer svg {
    transform: rotate(180deg) translateX(-2px);
}

/* ---------- Premium viewer shell ---------- */
.dgproduct-viewer {
    padding: 22px;
}

.dgproduct-viewer__backdrop {
    background:
        radial-gradient(circle at 50% 18%, rgba(30,77,42,.23), transparent 32%),
        rgba(2,8,5,.86);
    backdrop-filter: blur(15px) saturate(.88);
}

.dgproduct-viewer__dialog {
    grid-template-columns: minmax(340px, .82fr) minmax(0, 1.18fr);
    gap: 20px;
    width: min(1460px, 100%);
    padding: 18px;
    border: 1px solid rgba(210,232,217,.16);
    border-radius: 18px;
    background:
        radial-gradient(circle at 79% 22%, rgba(76,160,65,.13), transparent 30%),
        linear-gradient(145deg, rgba(23,29,25,.985), rgba(12,17,14,.985));
    box-shadow:
        0 38px 100px rgba(0,0,0,.58),
        inset 0 1px 0 rgba(255,255,255,.045);
}

.dgproduct-viewer__dialog::before {
    content: "";
    position: absolute;
    z-index: 3;
    top: 0;
    right: 25%;
    left: 25%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(190,255,107,.65), transparent);
    box-shadow: 0 0 20px rgba(168,255,52,.26);
}

.dgproduct-viewer__close {
    top: 11px;
    left: 12px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 10px;
    background: rgba(255,255,255,.055);
    color: rgba(255,255,255,.9);
    font-size: 22px;
    text-shadow: none;
    backdrop-filter: blur(8px);
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.dgproduct-viewer__close:hover {
    transform: rotate(3deg);
    border-color: rgba(255,255,255,.24);
    background: rgba(255,255,255,.09);
}

.dgproduct-viewer__info {
    padding: 0 3px 0 0;
}

.dgproduct-viewer__brand-card {
    min-height: 72px;
    margin-bottom: 13px;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background:
        linear-gradient(110deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.dgproduct-viewer__brand-side {
    display: flex;
    align-items: center;
    gap: 11px;
}

.dgproduct-viewer__brand-side > span {
    color: rgba(255,255,255,.4);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: .09em;
}

.dgproduct-viewer__logo {
    width: min(126px, 34%);
}

.dgproduct-viewer__product-id {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    padding-left: 38px;
}

.dgproduct-viewer__product-id > span {
    color: #b5d68a;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .08em;
}

.dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: .01em;
}

.dgproduct-viewer__scroll {
    max-height: calc(100vh - 170px);
    padding: 0 6px 12px 0;
}

.dgproduct-viewer__section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0 8px;
    direction: ltr;
}

.dgproduct-viewer__section-head > div span,
.dgproduct-viewer__section-head > div strong {
    display: block;
}

.dgproduct-viewer__section-head > div span {
    margin-bottom: 1px;
    color: #8ea197;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .11em;
}

.dgproduct-viewer__section-head > div strong {
    color: #f5f8f6;
    font-size: 11px;
    font-weight: 800;
}

.dgproduct-viewer__section-head > small {
    color: rgba(255,255,255,.27);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-viewer__section-head--apps {
    margin-top: 17px;
}

.dgproduct-viewer__spec-wrap {
    border: 1px solid rgba(255,255,255,.105);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-viewer__spec-table th,
.dgproduct-viewer__spec-table td {
    padding: 9px 11px;
    border-color: rgba(255,255,255,.08);
    font-size: 10px;
}

.dgproduct-viewer__spec-table th {
    width: 37%;
    background: rgba(255,255,255,.035);
    color: rgba(255,255,255,.58);
    font-size: 8px;
    font-weight: 750;
    letter-spacing: .015em;
}

.dgproduct-viewer__spec-table td {
    color: #f2f6f3;
    font-size: 10px;
    font-weight: 750;
}

.dgproduct-viewer__applications {
    margin-top: 0;
}

.dgproduct-viewer__applications ul {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.dgproduct-viewer__applications li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 6px 8px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 9px;
    background: rgba(255,255,255,.035);
    color: rgba(255,255,255,.84);
    font-size: 9px;
    font-weight: 650;
}

.dgproduct-viewer__applications li img {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
    opacity: .82;
}

.dgproduct-viewer__star {
    color: #f3cf42;
    font-size: 8px;
}

.dgproduct-viewer__note {
    margin-top: 11px;
    padding: 9px 10px;
    border: 1px solid rgba(227,196,60,.14);
    border-radius: 9px;
    background: rgba(227,196,60,.055);
    color: #f4d65c;
    font-size: 9px;
    font-style: normal;
}

/* ---------- Viewer image console ---------- */
.dgproduct-viewer__media {
    position: relative;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
    padding: 2px 0 0;
}

.dgproduct-viewer__image-stage {
    border: 1px solid rgba(196,228,202,.13);
    border-radius: 13px;
    background: #010503;
    box-shadow:
        0 20px 50px rgba(0,0,0,.24),
        inset 0 0 0 1px rgba(255,255,255,.015);
}

.dgproduct-viewer__image-stage::after {
    content: "";
    position: absolute;
    z-index: 5;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(168,255,52,.82), transparent);
    box-shadow: 0 0 18px rgba(168,255,52,.35);
}

.dgproduct-viewer__main-image {
    max-height: calc(100vh - 190px);
    aspect-ratio: 1.52 / 1;
}

.dgproduct-viewer__media-status {
    position: absolute;
    z-index: 13;
    top: 11px;
    left: 11px;
    display: flex;
    align-items: center;
    gap: 7px;
    height: 29px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    background: rgba(2,11,6,.58);
    backdrop-filter: blur(8px);
    direction: ltr;
}

.dgproduct-viewer__media-status span {
    color: #dcff9f;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .07em;
}

.dgproduct-viewer__media-status small {
    color: rgba(255,255,255,.42);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: .07em;
}

.dgproduct-viewer__tool {
    right: 11px;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 9px;
    background: rgba(3,12,7,.62);
    backdrop-filter: blur(8px);
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.dgproduct-viewer__tool:hover {
    transform: translateY(-1px);
    border-color: rgba(211,255,148,.26);
    background: rgba(20,52,27,.66);
    color: #e4ffb4;
}

.dgproduct-viewer__tool--zoom {
    top: 40px;
    right:-1px;
}

.dgproduct-viewer__tool--fullscreen {
    top: 80px;
    right:-1px;
}

.dgproduct-viewer__tool[aria-pressed="true"] {
    border-color: rgba(210,255,142,.5);
    color: #e1ffac;
    background: rgba(30,88,39,.62);
    box-shadow: 0 0 18px rgba(168,255,52,.12);
}

.dgproduct-viewer__zoom-lens {
    width: 168px;
    height: 168px;
    border-color: rgba(226,255,195,.92);
    box-shadow:
        0 12px 32px rgba(0,0,0,.44),
        0 0 0 4px rgba(168,255,52,.06);
}

.dgproduct-viewer__media-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    padding: 9px 3px 0;
    direction: ltr;
}

.dgproduct-viewer__media-footer > div span,
.dgproduct-viewer__media-footer > div strong {
    display: block;
}

.dgproduct-viewer__media-footer > div span {
    margin-bottom: 1px;
    color: #6f8176;
    font-size: 6px;
    font-weight: 850;
    letter-spacing: .09em;
}

.dgproduct-viewer__media-footer > div strong {
    color: #d8efc3;
    font-size: 9px;
    font-weight: 800;
}

.dgproduct-viewer__media-footer p {
    margin: 0;
    color: rgba(255,255,255,.36);
    direction: rtl;
    font-size: 8px;
    line-height: 1.7;
}

.dgproduct-viewer__thumbnails {
    justify-content: flex-start;
    gap: 7px;
    min-height: 62px;
    padding-top: 8px;
    direction: ltr;
}

.dgproduct-viewer__thumb {
    width: 72px;
    padding: 3px;
    border-color: rgba(255,255,255,.12);
    border-radius: 9px;
    background: rgba(255,255,255,.04);
    opacity: .72;
    transition: opacity 160ms ease, border-color 160ms ease, transform 160ms ease, background 160ms ease;
}

.dgproduct-viewer__thumb:hover {
    opacity: .95;
    transform: translateY(-1px);
}

.dgproduct-viewer__thumb.is-active {
    opacity: 1;
    border-color: rgba(195,165,24,.75);
    background: rgba(195,165,24,.07);
    box-shadow: 0 0 0 1px rgba(195,165,24,.13);
}

.dgproduct-viewer__thumb img {
    aspect-ratio: 1.25 / .82;
    border-radius: 6px;
}

.dgproduct-viewer__thumb span {
    color: rgba(255,255,255,.68);
    font-size: 6px;
    letter-spacing: .06em;
}

/* ---------- Responsive catalogue/viewer refinement ---------- */
@media (max-width: 1100px) {
    .dgproduct-grid--yg {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dgproduct-grid--yg > .dgproduct-card,
    .dgproduct-grid--yg > .dgproduct-card:nth-child(4),
    .dgproduct-grid--yg > .dgproduct-card:nth-child(5) {
        grid-column: auto;
    }

    .dgproduct-grid--yg > .dgproduct-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        width: min(520px, 100%);
        justify-self: center;
    }
}

@media (max-width: 900px) {
    .dgproduct-viewer {
        padding: 10px;
    }

    .dgproduct-viewer__dialog {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "info";
        gap: 13px;
        max-height: calc(100vh - 20px);
        overflow-y: auto;
        padding: 12px;
        border-radius: 16px;
    }

    .dgproduct-viewer__close {
        position: absolute;
        top: 12px;
        right: 12px;
        left: auto;
        z-index: 30;
    }

    .dgproduct-viewer__info {
        padding: 0;
    }

    .dgproduct-viewer__scroll {
        max-height: none;
        overflow: visible;
        padding: 0 0 5px;
    }

    .dgproduct-viewer__main-image {
        max-height: 52vh;
        aspect-ratio: 1.45 / 1;
    }

    .dgproduct-viewer__brand-card {
        margin-bottom: 11px;
    }
}

@media (max-width: 640px) {
    .dgproduct-grid--yg {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dgproduct-grid--yg > .dgproduct-card,
    .dgproduct-grid--yg > .dgproduct-card:last-child:nth-child(odd) {
        grid-column: auto;
        width: 100%;
    }

    .dgproduct-card__media {
        aspect-ratio: 1.5 / 1;
    }

    .dgproduct-card__quick-specs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dgproduct-card__footer {
        font-size: 7px;
    }

    .dgproduct-viewer__brand-card {
        min-height: 64px;
        padding: 9px 10px;
    }

    .dgproduct-viewer__brand-side > span {
        display: none;
    }

    .dgproduct-viewer__logo {
        width: 104px;
    }

    .dgproduct-viewer__product-id {
        padding-left: 42px;
    }

    .dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
        font-size: 15px;
    }

    .dgproduct-viewer__media-footer {
        display: block;
    }

    .dgproduct-viewer__media-footer p {
        margin-top: 3px;
        text-align: left;
    }

    .dgproduct-viewer__main-image {
        max-height: none;
        aspect-ratio: 1.25 / 1;
    }

    .dgproduct-viewer__tool--zoom {
        display: none;
    }

    .dgproduct-viewer__tool--fullscreen {
        top: 40px;
        right:-1px;
    }

    .dgproduct-viewer__media-status {
        top: 11px;
        left: 11px;
    }

    .dgproduct-viewer__applications li {
        font-size: 8px;
    }
}

@media (max-width: 420px) {
    .dgproduct-card__day-preview {
        width: 49px;
    }

    .dgproduct-card__quick-specs b {
        font-size: 7px;
    }

    .dgproduct-card__app {
        font-size: 6.5px;
    }

    .dgproduct-viewer__section-head > small,
    .dgproduct-viewer__media-footer p {
        display: none;
    }

    .dgproduct-viewer__thumb {
        width: 64px;
    }
}

/* END — PREMIUM CATALOG / VIEWER UPGRADE v1.7.35 */


/* =========================================================
   DGCHEME — Product Explorer / Viewer Refinement Overrides
   v1.7.36
========================================================= */

.dgproduct-explorer {
    padding: 34px 18px 52px;
    background:
        radial-gradient(circle at 92% 0%, rgba(168,255,52,.08), transparent 19%),
        radial-gradient(circle at 6% 100%, rgba(31,80,41,.05), transparent 18%),
        linear-gradient(180deg, #f6faf7 0%, #f2f6f3 100%);
}

.dgproduct-explorer__inner {
    position: relative;
    overflow: hidden;
    padding: 30px 28px 34px;
    border: 1px solid #e2e9e3;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, #fbfdfb 100%);
    box-shadow: 0 16px 42px rgba(14, 36, 21, .06);
}

.dgproduct-explorer__inner::before {
    content: "";
    position: absolute;
    top: -140px;
    left: -110px;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(168,255,52,.12) 0%, rgba(168,255,52,0) 72%);
    pointer-events: none;
}

.dgproduct-explorer__head {
    margin-bottom: 24px;
    padding: 0 2px 18px;
    border-bottom: 1px solid rgba(20,39,26,.08);
}

.dgproduct-explorer__head-copy {
    position: relative;
    padding-right: 18px;
}

.dgproduct-explorer__head-copy::before {
    content: "";
    position: absolute;
    top: 2px;
    right: 0;
    bottom: 4px;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--dgpe-glow) 0%, var(--dgpe-gold) 100%);
    box-shadow: 0 0 18px rgba(168,255,52,.24);
}

.dgproduct-explorer__kicker {
    margin-bottom: 7px;
    font-size: 9px;
    letter-spacing: .16em;
}

.dgproduct-explorer__title {
    margin-bottom: 8px;
    font-size: 26px;
    line-height: 1.55;
}

.dgproduct-explorer__lead {
    max-width: 820px;
    font-size: 14px;
    line-height: 2.05;
}

.dgproduct-explorer__head-meta {
    align-self: center;
    padding: 14px 18px;
    border: 1px solid rgba(20,39,26,.08);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f7faf8 100%);
    box-shadow: 0 10px 24px rgba(16,34,23,.05);
}

.dgproduct-explorer__head-meta span {
    font-size: 28px;
    line-height: 1;
}

.dgproduct-explorer__head-meta small {
    font-size: 9px;
    letter-spacing: .16em;
}

.dgproduct-tabs {
    position: relative;
    padding: 10px;
    gap: 10px;
    margin-bottom: 22px;
    border: 1px solid #dfe7e1;
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(243,247,244,.98) 100%),
        linear-gradient(90deg, rgba(168,255,52,.04), rgba(0,0,0,0));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.8),
        0 12px 28px rgba(15,35,22,.04);
}

.dgproduct-tabs__tab {
    min-height: 78px;
    padding: 14px 12px 13px;
    border: 1px solid transparent;
    border-radius: 16px;
    text-align: center;
}

.dgproduct-tabs__tab:hover {
    transform: translateY(-1px);
    border-color: rgba(23,43,29,.08);
}

.dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(17,44,27,.08), inset 0 -3px 0 var(--dgpe-gold);
}

.dgproduct-tabs__code {
    margin-bottom: 4px;
    font-size: 9px;
    letter-spacing: .14em;
}

.dgproduct-tabs__label {
    font-size: 13px;
    line-height: 1.65;
}

.dgproduct-tabs__tab[data-dgproduct-series="yg"].is-active {
    border-color: rgba(167, 222, 57, .18);
    background: linear-gradient(180deg, #ffffff 0%, #f2f9ea 100%);
}

.dgproduct-tabs__tab[data-dgproduct-series="yg"].is-active .dgproduct-tabs__code {
    color: #7f9309;
}

.dgproduct-tabs__tab[data-dgproduct-series="bg"].is-active {
    border-color: rgba(92, 214, 255, .18);
    background: linear-gradient(180deg, #ffffff 0%, #eef8ff 100%);
}

.dgproduct-tabs__tab[data-dgproduct-series="bg"].is-active .dgproduct-tabs__code {
    color: #1789b5;
}

.dgproduct-tabs__tab[data-dgproduct-series="sb"].is-active {
    border-color: rgba(133, 173, 255, .18);
    background: linear-gradient(180deg, #ffffff 0%, #eef2ff 100%);
}

.dgproduct-tabs__tab[data-dgproduct-series="sb"].is-active .dgproduct-tabs__code {
    color: #4966c3;
}

.dgproduct-tabs__tab[data-dgproduct-series="color"].is-active {
    border-color: rgba(255, 130, 145, .18);
    background: linear-gradient(180deg, #ffffff 0%, #fff0f3 100%);
}

.dgproduct-tabs__tab[data-dgproduct-series="color"].is-active .dgproduct-tabs__code {
    color: #cc4b74;
}

.dgproduct-tabs__tab[data-dgproduct-series="special"].is-active {
    border-color: rgba(255, 214, 112, .22);
    background: linear-gradient(180deg, #ffffff 0%, #fff8e8 100%);
}

.dgproduct-tabs__tab[data-dgproduct-series="special"].is-active .dgproduct-tabs__code {
    color: #c38a13;
}

.dgproduct-mobile-select__trigger,
.dgproduct-mobile-select__menu {
    border-radius: 18px;
    border-color: #e0e7e1;
    background: linear-gradient(180deg, #ffffff 0%, #f6faf7 100%);
    box-shadow: 0 12px 28px rgba(15,35,22,.07);
}

.dgproduct-mobile-select__trigger {
    padding: 14px 15px;
}

.dgproduct-mobile-select__copy strong {
    font-size: 14px;
}

.dgproduct-mobile-select__option {
    min-height: 46px;
    border-radius: 12px;
}

.dgproduct-mobile-select__option.is-active {
    background: linear-gradient(180deg, #f6fbef 0%, #edf7df 100%);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] {
    --dgproduct-family-accent: #bff661;
    --dgproduct-family-accent-soft: rgba(191,246,97,.18);
    --dgproduct-family-start: #0d1810;
    --dgproduct-family-mid: #15351b;
    --dgproduct-family-end: #4b8c22;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] {
    --dgproduct-family-accent: #78e0ff;
    --dgproduct-family-accent-soft: rgba(120,224,255,.18);
    --dgproduct-family-start: #0b1520;
    --dgproduct-family-mid: #123044;
    --dgproduct-family-end: #168cb3;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] {
    --dgproduct-family-accent: #8bb7ff;
    --dgproduct-family-accent-soft: rgba(139,183,255,.18);
    --dgproduct-family-start: #111528;
    --dgproduct-family-mid: #1c315b;
    --dgproduct-family-end: #4f6fcb;
}

.dgproduct-family-panel[data-dgproduct-family="color"] {
    --dgproduct-family-accent: #ff8ea4;
    --dgproduct-family-accent-soft: rgba(255,142,164,.18);
    --dgproduct-family-start: #24111a;
    --dgproduct-family-mid: #5d2034;
    --dgproduct-family-end: #c84f78;
}

.dgproduct-family-panel[data-dgproduct-family="special"] {
    --dgproduct-family-accent: #ffd56b;
    --dgproduct-family-accent-soft: rgba(255,213,107,.18);
    --dgproduct-family-start: #1d170b;
    --dgproduct-family-mid: #49340e;
    --dgproduct-family-end: #a46b10;
}

.dgproduct-family-divider {
    min-height: 108px;
    margin-bottom: 18px;
    padding: 18px 20px 18px 18px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 20px;
    background:
        radial-gradient(circle at 8% 50%, var(--dgproduct-family-accent-soft) 0%, transparent 30%),
        linear-gradient(90deg, var(--dgproduct-family-start) 0%, var(--dgproduct-family-mid) 54%, var(--dgproduct-family-end) 100%);
    box-shadow: 0 14px 30px rgba(11, 21, 16, .18);
}

.dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.04), transparent 30%, transparent 70%, rgba(255,255,255,.06));
    pointer-events: none;
}

.dgproduct-family-divider::after {
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--dgproduct-family-accent), transparent);
    box-shadow: 0 0 24px var(--dgproduct-family-accent-soft);
}

.dgproduct-family-divider__identity,
.dgproduct-family-divider__latin {
    position: relative;
    z-index: 2;
}

.dgproduct-family-divider__index {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
    color: var(--dgproduct-family-accent);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
    font-size: 14px;
}

.dgproduct-family-divider__micro {
    margin-bottom: 5px;
    font-size: 8px;
    letter-spacing: .18em;
    color: rgba(255,255,255,.72);
}

.dgproduct-family-divider h3 {
    font-size: 20px;
    line-height: 1.65;
}

.dgproduct-family-divider__latin strong {
    font-size: 20px;
    letter-spacing: .02em;
}

.dgproduct-family-divider__latin span {
    margin-top: 4px;
    color: rgba(255,255,255,.66);
    font-size: 10px;
    letter-spacing: .18em;
}

.dgproduct-products-head {
    margin-bottom: 16px;
}

.dgproduct-products-head span {
    font-size: 9px;
    letter-spacing: .15em;
}

.dgproduct-products-head h3 {
    font-size: 20px;
}

.dgproduct-products-head__count strong {
    font-size: 20px;
}

.dgproduct-card__body {
    padding: 14px 14px 15px;
}

.dgproduct-card__identity span {
    font-size: 8px;
    letter-spacing: .14em;
}

.dgproduct-card__identity strong {
    font-size: 18px;
}

.dgproduct-card__glow-name {
    font-size: 11px;
}

.dgproduct-card__quick-specs {
    gap: 8px;
    margin-top: 10px;
}

.dgproduct-card__quick-specs span {
    padding: 8px 9px;
}

.dgproduct-card__quick-specs small {
    font-size: 7px;
    letter-spacing: .12em;
}

.dgproduct-card__quick-specs b {
    font-size: 12px;
}

.dgproduct-card__apps {
    gap: 7px;
    margin-top: 11px;
}

.dgproduct-card__app {
    min-height: 30px;
    padding: 6px 9px;
    font-size: 10px;
}

.dgproduct-viewer__section-head {
    margin-bottom: 12px;
}

.dgproduct-viewer__section-head strong {
    font-size: 20px;
}

.dgproduct-viewer__section-head span,
.dgproduct-viewer__section-head small {
    font-size: 9px;
    letter-spacing: .16em;
}

.dgproduct-viewer__spec-wrap {
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(122,126,123,.20) 100%);
}

.dgproduct-viewer__spec-table th,
.dgproduct-viewer__spec-table td {
    padding: 14px 16px;
    font-size: 13px;
    line-height: 1.7;
}

.dgproduct-viewer__spec-table th {
    width: 34%;
    color: rgba(255,255,255,.82);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
}

.dgproduct-viewer__spec-table td {
    color: #ffffff;
    font-size: 14px;
    font-weight: 750;
}

.dgproduct-viewer__applications {
    margin-top: 18px;
}

.dgproduct-viewer__applications ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.dgproduct-viewer__applications li {
    display: grid;
    grid-template-columns: 24px minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.055) 0%, rgba(255,255,255,.035) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
    color: #f4f7f5;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.55;
}

.dgproduct-viewer__applications li img {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
    opacity: .95;
}

.dgproduct-viewer__applications li span {
    display: block;
}

.dgproduct-viewer__star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    height: 26px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 214, 79, .16);
    color: #ffd84f;
    font-size: 10px;
    font-weight: 900;
}

.dgproduct-viewer__note {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid rgba(255,255,255,.11);
    color: #ffd85a;
    font-size: 13px;
    font-style: italic;
}

.dgproduct-viewer__media-status span {
    font-size: 11px;
    letter-spacing: .18em;
}

.dgproduct-viewer__media-status small {
    font-size: 9px;
    letter-spacing: .14em;
}

.dgproduct-viewer__media-footer p {
    font-size: 13px;
    line-height: 1.9;
}

@media (max-width: 1180px) {
    .dgproduct-explorer__title {
        font-size: 24px;
    }

    .dgproduct-tabs__tab {
        min-height: 74px;
    }

    .dgproduct-family-divider h3 {
        font-size: 18px;
    }
}

@media (max-width: 860px) {
    .dgproduct-explorer__inner {
        padding: 22px 18px 26px;
        border-radius: 22px;
    }

    .dgproduct-explorer__head {
        display: block;
    }

    .dgproduct-explorer__head-meta {
        display: inline-flex;
        margin-top: 14px;
    }

    .dgproduct-explorer__title {
        font-size: 22px;
    }

    .dgproduct-explorer__lead {
        font-size: 13px;
    }

    .dgproduct-family-divider {
        min-height: 96px;
        padding: 16px 16px 16px 14px;
    }

    .dgproduct-family-divider h3 {
        font-size: 17px;
    }

    .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-viewer__spec-table th,
    .dgproduct-viewer__spec-table td {
        padding: 12px 13px;
        font-size: 12px;
    }

    .dgproduct-viewer__spec-table td {
        font-size: 13px;
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer {
        padding: 26px 12px 38px;
    }

    .dgproduct-explorer__head-copy {
        padding-right: 14px;
    }

    .dgproduct-explorer__title {
        font-size: 20px;
    }

    .dgproduct-products-head,
    .dgproduct-family-divider {
        gap: 14px;
    }

    .dgproduct-family-divider {
        flex-wrap: wrap;
    }

    .dgproduct-family-divider__latin {
        display: block;
        width: 100%;
        padding-top: 3px;
        text-align: right;
        direction: rtl;
    }

    .dgproduct-viewer__applications li {
        grid-template-columns: 22px minmax(0,1fr) auto;
        min-height: 48px;
        padding: 11px 12px;
        font-size: 12px;
    }

    .dgproduct-viewer__applications li img {
        width: 22px;
        height: 22px;
        flex-basis: 22px;
    }

    .dgproduct-viewer__star {
        min-width: 50px;
        font-size: 9px;
    }
}

@media (max-width: 560px) {
    .dgproduct-tabs {
        display: none;
    }

    .dgproduct-mobile-select {
        display: block;
        margin-bottom: 18px;
    }

    .dgproduct-explorer__head-meta {
        padding: 12px 14px;
    }

    .dgproduct-explorer__head-meta span {
        font-size: 24px;
    }

    .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
    }

    .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-divider__latin strong {
        font-size: 15px;
    }

    .dgproduct-viewer__section-head strong {
        font-size: 18px;
    }

    .dgproduct-viewer__spec-table th,
    .dgproduct-viewer__spec-table td {
        padding: 11px 10px;
        font-size: 11px;
    }

    .dgproduct-viewer__spec-table th {
        width: 40%;
        font-size: 10px;
    }

    .dgproduct-viewer__spec-table td {
        font-size: 12px;
    }

    .dgproduct-viewer__applications ul {
        gap: 8px;
    }

    .dgproduct-viewer__applications li {
        grid-template-columns: 20px minmax(0,1fr) auto;
        gap: 9px;
        font-size: 11px;
    }

    .dgproduct-viewer__applications li img {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }
}


/* =========================================================
   DGCHEME — YG Family Banner Match
   v1.7.38
   Legacy color reference: linear-gradient(90deg, #fff, #3CFF00)
========================================================= */

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
    min-height: 104px;
    padding: 18px 30px;
    border: 1px solid rgba(20, 45, 24, .10);
    border-radius: 17px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #f7fff2 23%, #caffb8 55%, #76ff4a 78%, #3CFF00 100%);
    box-shadow: 0 7px 20px rgba(12, 31, 15, .24);
    color: #fff;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0) 46%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider::after {
    display: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
    width: min(660px, 56%);
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    color: #0b4313;
    font-size: 20px;
    font-weight: 850;
    line-height: 1.6;
    text-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    color: #155d1e;
    font-size: 17px;
    font-weight: 850;
    line-height: 1.7;
    text-align: right;
    text-shadow: none;
}

@media (max-width: 860px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        min-height: 92px;
        padding: 16px 22px;
        background-image: linear-gradient(90deg, #ffffff 0%, #ebffe3 24%, #95ff71 68%, #3CFF00 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
        width: min(610px, 66%);
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 14px;
    }
}

@media (max-width: 560px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        min-height: 88px;
        padding: 14px 16px;
        border-radius: 14px;
        background-image: linear-gradient(90deg, #ffffff 0%, #ddffd2 20%, #6fff40 64%, #3CFF00 100%);
        box-shadow: 0 5px 16px rgba(12, 31, 15, .18);
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
        width: 100%;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        margin-bottom: 4px;
        color: #0b4313;
        font-size: 16px;
        line-height: 1.65;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        color: #155d1e;
        font-size: 12px;
        line-height: 1.6;
    }
}


/* =========================================================
   DGCHEME — YG Family Banner Final Premium Layout
   v1.7.39
========================================================= */

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 118px;
    padding: 20px 22px 20px 18px;
    overflow: hidden;
    border: 1px solid rgba(31, 96, 19, .12);
    border-radius: 18px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #f4ffef 22%, #cfffba 52%, #83ff56 76%, #3CFF00 100%);
    box-shadow: 0 12px 28px rgba(12, 31, 15, .16);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 13% 50%, rgba(60,255,0,.13) 0%, rgba(60,255,0,0) 32%),
        radial-gradient(circle at 86% 18%, rgba(255,255,255,.26) 0%, rgba(255,255,255,0) 28%),
        linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 45%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(6,72,18,0), rgba(6,72,18,.16), rgba(255,255,255,.58), rgba(6,72,18,0));
    box-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta,
.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
    direction: ltr;
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 0 0 auto;
    min-width: 250px;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border: 1px solid rgba(7, 75, 17, .16);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.75) 0%, rgba(228,255,219,.92) 100%);
    color: #0f641d;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 8px 18px rgba(12,31,15,.08);
    font-size: 16px;
    font-weight: 900;
    letter-spacing: .02em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__micro {
    display: block;
    margin: 0 0 4px;
    color: rgba(16, 69, 22, .56);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .18em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin strong {
    margin: 0;
    color: #0c4f17;
    font-size: 24px;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: .01em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 6px;
    color: rgba(12, 79, 23, .82);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .18em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 10px 4px 10px 26px;
    border-radius: 16px;
    background: linear-gradient(90deg, rgba(11,67,19,0) 0%, rgba(11,67,19,.08) 100%);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    color: #ffffff;
    font-size: 25px;
    font-weight: 900;
    line-height: 1.42;
    text-shadow: 0 1px 2px rgba(9, 54, 16, .14);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    color: rgba(255,255,255,.94);
    font-size: 18px;
    font-weight: 850;
    line-height: 1.55;
    text-align: right;
    text-shadow: 0 1px 2px rgba(9, 54, 16, .12);
}

@media (max-width: 900px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        min-height: 106px;
        padding: 18px 18px 18px 16px;
        gap: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
        min-width: 214px;
        gap: 12px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin strong {
        font-size: 20px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin em {
        font-size: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 21px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 680px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        flex-wrap: wrap;
        align-items: flex-start;
        min-height: auto;
        padding: 16px;
        gap: 14px;
        background-image: linear-gradient(120deg, #ffffff 0%, #f3ffed 24%, #bbff9f 55%, #76ff43 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        justify-content: flex-end;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
        width: 100%;
        padding: 0;
        background: none;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 18px;
        line-height: 1.5;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__index {
        width: 42px;
        height: 42px;
        font-size: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — YG Family Banner Layout Fix
   v1.7.40
========================================================= */

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
    direction: ltr;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 124px;
    padding: 18px 22px;
    background-image: linear-gradient(90deg, #ffffff 0%, #eefce7 24%, #bbff9d 58%, #66ff2b 100%);
    box-shadow: 0 12px 28px rgba(12, 31, 15, .14);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider::before {
    background:
        radial-gradient(circle at 12% 50%, rgba(60,255,0,.11) 0%, rgba(60,255,0,0) 30%),
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 28%),
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 44%);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    min-width: 255px;
    gap: 14px;
    align-items: center;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__index {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 15px;
    border: 1px solid rgba(10, 73, 17, .12);
    background: linear-gradient(180deg, rgba(255,255,255,.88) 0%, rgba(230,255,220,.96) 100%);
    color: #0b5a19;
    box-shadow: 0 8px 18px rgba(12,31,15,.08), inset 0 1px 0 rgba(255,255,255,.88);
    font-size: 18px;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__micro {
    margin: 0 0 5px;
    color: rgba(10, 72, 18, .62);
    font-size: 8px;
    letter-spacing: .2em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin strong {
    color: #084a15;
    font-size: 22px;
    line-height: 1.05;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin em {
    margin-top: 7px;
    color: rgba(8,74,21,.82);
    font-size: 10px;
    letter-spacing: .22em;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    border-radius: 0;
    background: none;
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    color: #ffffff;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.38;
    text-align: right;
    text-shadow: 0 2px 10px rgba(9, 57, 16, .18);
}

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    color: rgba(255,255,255,.96);
    font-size: 18px;
    font-weight: 850;
    line-height: 1.5;
    text-align: right;
    text-shadow: 0 1px 8px rgba(9, 57, 16, .14);
}

@media (max-width: 920px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        min-height: 112px;
        gap: 18px;
        padding: 18px 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
        min-width: 220px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 22px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        flex-wrap: wrap;
        min-height: auto;
        gap: 16px;
        padding: 16px;
        background-image: linear-gradient(120deg, #ffffff 0%, #eefce7 28%, #b3ff94 64%, #55ff17 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 18px;
        line-height: 1.45;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__meta {
        gap: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — YG Family Banner Right Text Color Sync
   v1.7.41
========================================================= */

.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3,
.dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
    color: #084a15;
    text-shadow: none;
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider h3,
    .dgproduct-family-panel[data-dgproduct-family="yg"] .dgproduct-family-divider__subtitle {
        color: #084a15;
        text-shadow: none;
    }
}


/* =========================================================
   DGCHEME — Product Card Series Badge Vertical Alignment Fix
   v1.7.42
========================================================= */

.dgproduct-card__series {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    line-height: 1;
    white-space: nowrap;
}


/* =========================================================
   DGCHEME — BG Family Banner & Card Accent
   v1.7.43
========================================================= */

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 124px;
    padding: 18px 22px;
    overflow: hidden;
    border: 1px solid rgba(0, 111, 112, .12);
    border-radius: 18px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #f0fffd 24%, #bffcf8 58%, #67fff4 82%, #00FFEF 100%);
    box-shadow: 0 12px 28px rgba(8, 34, 33, .12);
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 12% 50%, rgba(0,255,239,.10) 0%, rgba(0,255,239,0) 30%),
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 28%),
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 44%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(6,77,76,0), rgba(6,77,76,.18), rgba(255,255,255,.62), rgba(6,77,76,0));
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__meta,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 255px;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__index {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    border: 1px solid rgba(4, 86, 86, .12);
    background: linear-gradient(180deg, rgba(255,255,255,.88) 0%, rgba(225,255,252,.96) 100%);
    color: #005b5c;
    box-shadow: 0 8px 18px rgba(8,34,33,.08), inset 0 1px 0 rgba(255,255,255,.88);
    font-size: 18px;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__micro {
    margin: 0 0 5px;
    color: rgba(0, 79, 80, .62);
    font-size: 8px;
    letter-spacing: .2em;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin strong,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin em,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider h3,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__subtitle {
    color: #084a4b;
    text-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin strong {
    font-size: 22px;
    line-height: 1.05;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin em {
    margin-top: 7px;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .22em;
    color: rgba(8,74,75,.82);
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    background: none;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.38;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.5;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__badge {
    background: linear-gradient(180deg, rgba(2, 68, 69, .78) 0%, rgba(0, 95, 96, .88) 100%);
    border-color: rgba(120, 255, 247, .24);
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__badge strong,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__eyebrow,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__content h3,
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-products-head h3 {
    color: #0a4344;
}

.dgproduct-grid--bg .dgproduct-card__series {
    border-color: rgba(133,255,247,.22);
    background: rgba(4,18,18,.74);
    color: #a8fffa;
}

.dgproduct-grid--bg .dgproduct-card__night-badge i,
.dgproduct-grid--bg .dgproduct-card__glow-name i {
    background: #00efe0;
    box-shadow: 0 0 10px rgba(0,255,239,.52);
}

@media (max-width: 920px) {
    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider {
        min-height: 112px;
        gap: 18px;
        padding: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__meta {
        min-width: 220px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider h3 {
        font-size: 22px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider {
        flex-wrap: wrap;
        min-height: auto;
        gap: 16px;
        padding: 16px;
        background-image: linear-gradient(120deg, #ffffff 0%, #eefffe 28%, #a9fffa 64%, #00FFEF 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider h3 {
        font-size: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__meta {
        gap: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — YG/BG Consistency Fixes
   v1.7.44
========================================================= */

/* Make YG and BG product grids consistent: 4 cards per row on desktop */
.dgproduct-grid--yg,
.dgproduct-grid--bg {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dgproduct-grid--yg > .dgproduct-card,
.dgproduct-grid--bg > .dgproduct-card,
.dgproduct-grid--yg > .dgproduct-card:nth-child(4),
.dgproduct-grid--yg > .dgproduct-card:nth-child(5) {
    grid-column: auto;
}

/* Keep BG visual badge aligned with YG, but improve Blue Green readability */
.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__badge {
    padding: 9px 11px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 9px;
    background: rgba(4,25,13,.71);
    backdrop-filter: blur(8px);
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__badge span {
    color: rgba(255,255,255,.56);
}

.dgproduct-family-panel[data-dgproduct-family="bg"] .dgproduct-family-intro__badge strong {
    color: #b8fffb;
    text-shadow: 0 1px 8px rgba(0, 255, 239, .18);
}

/* Enforce correct reading order in narrow family banners */
.dgproduct-family-divider h3 bdi {
    direction: ltr;
    unicode-bidi: isolate;
}

@media (max-width: 1180px) {
    .dgproduct-grid--yg,
    .dgproduct-grid--bg {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .dgproduct-grid--yg,
    .dgproduct-grid--bg {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .dgproduct-grid--yg,
    .dgproduct-grid--bg {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   DGCHEME — Family Banner Title Order Fix
   v1.7.45
========================================================= */

.dgproduct-family-divider h3 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    direction: ltr;
}

.dgproduct-family-divider__title-text {
    direction: rtl;
}

.dgproduct-family-divider__title-code {
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .dgproduct-family-divider h3 {
        gap: 6px;
    }
}


/* =========================================================
   DGCHEME — Family Banner RTL Title Order FINAL Fix
   v1.7.46
   Required visual order: پیگمنت‌های فسفرسنت سری YG / BG
========================================================= */

.dgproduct-family-divider h3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    direction: rtl;
    text-align: right;
}

.dgproduct-family-divider__title-text {
    order: 0;
    direction: rtl;
    unicode-bidi: isolate;
}

.dgproduct-family-divider__title-code {
    order: 1;
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .dgproduct-family-divider h3 {
        justify-content: flex-start;
        gap: 6px;
        direction: rtl;
    }
}


/* =========================================================
   DGCHEME — SB Family Banner & Card Accent
   v1.7.47
========================================================= */

.dgproduct-grid--sb {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dgproduct-grid--sb > .dgproduct-card {
    grid-column: auto;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 124px;
    padding: 18px 22px;
    overflow: hidden;
    border: 1px solid rgba(2, 100, 98, .12);
    border-radius: 18px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #effdfb 24%, #c2f9f5 58%, #69e4db 82%, #02C2B7 100%);
    box-shadow: 0 12px 28px rgba(8, 31, 33, .12);
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 12% 50%, rgba(2,194,183,.10) 0%, rgba(2,194,183,0) 30%),
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 28%),
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 44%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(4,88,87,0), rgba(4,88,87,.18), rgba(255,255,255,.62), rgba(4,88,87,0));
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__meta,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 255px;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__index {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    border: 1px solid rgba(4, 80, 78, .12);
    background: linear-gradient(180deg, rgba(255,255,255,.88) 0%, rgba(226,251,249,.96) 100%);
    color: #065654;
    box-shadow: 0 8px 18px rgba(8,31,33,.08), inset 0 1px 0 rgba(255,255,255,.88);
    font-size: 18px;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__micro {
    margin: 0 0 5px;
    color: rgba(6, 86, 84, .62);
    font-size: 8px;
    letter-spacing: .2em;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin strong,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider h3,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__subtitle {
    color: #084847;
    text-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin strong {
    font-size: 22px;
    line-height: 1.05;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin em {
    margin-top: 7px;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .22em;
    color: rgba(8,72,71,.82);
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    background: none;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.38;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.5;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-intro__badge {
    background: rgba(4, 25, 18, .71);
    border-color: rgba(128, 248, 239, .22);
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-intro__badge span {
    color: rgba(255,255,255,.56);
}

.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-intro__badge strong,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-intro__eyebrow,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-intro__content h3,
.dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-products-head h3 {
    color: #0a4442;
}

.dgproduct-grid--sb .dgproduct-card__series {
    border-color: rgba(128,248,239,.22);
    background: rgba(4,18,17,.74);
    color: #b6fdf8;
}

.dgproduct-grid--sb .dgproduct-card__night-badge i,
.dgproduct-grid--sb .dgproduct-card__glow-name i {
    background: #02c2b7;
    box-shadow: 0 0 10px rgba(2,194,183,.52);
}

@media (max-width: 1180px) {
    .dgproduct-grid--sb {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider {
        min-height: 112px;
        gap: 18px;
        padding: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__meta {
        min-width: 220px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider h3 {
        font-size: 22px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 860px) {
    .dgproduct-grid--sb {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider {
        flex-wrap: wrap;
        min-height: auto;
        gap: 16px;
        padding: 16px;
        background-image: linear-gradient(120deg, #ffffff 0%, #eefdfb 28%, #aaf4ef 64%, #02C2B7 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider h3 {
        font-size: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 560px) {
    .dgproduct-grid--sb {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__meta {
        gap: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="sb"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — Colorful Family Section
   v1.7.48
========================================================= */

.dgproduct-grid--color {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dgproduct-grid--color > .dgproduct-card {
    grid-column: auto;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 124px;
    padding: 18px 22px;
    overflow: hidden;
    border: 1px solid rgba(175, 108, 164, .12);
    border-radius: 18px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #fff7fb 20%, #F291C6 42%, #5794E6 63%, #31BD3D 81%, #EBE321 100%);
    box-shadow: 0 12px 28px rgba(34, 20, 33, .12);
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 14% 50%, rgba(242,145,198,.14) 0%, rgba(242,145,198,0) 24%),
        radial-gradient(circle at 48% 25%, rgba(87,148,230,.12) 0%, rgba(87,148,230,0) 20%),
        radial-gradient(circle at 76% 35%, rgba(49,189,61,.12) 0%, rgba(49,189,61,0) 20%),
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 44%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(74,40,70,0), rgba(74,40,70,.18), rgba(255,255,255,.62), rgba(74,40,70,0));
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__meta,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 255px;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__index {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    border: 1px solid rgba(105, 74, 101, .12);
    background: linear-gradient(180deg, rgba(255,255,255,.88) 0%, rgba(255,247,251,.96) 100%);
    color: #694264;
    box-shadow: 0 8px 18px rgba(34,20,33,.08), inset 0 1px 0 rgba(255,255,255,.88);
    font-size: 18px;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__micro {
    margin: 0 0 5px;
    color: rgba(89, 65, 86, .66);
    font-size: 8px;
    letter-spacing: .2em;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin strong,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider h3,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__subtitle {
    color: #51354d;
    text-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin strong {
    font-size: 22px;
    line-height: 1.05;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin em {
    margin-top: 7px;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .22em;
    color: rgba(81,53,77,.82);
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    background: none;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.38;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.5;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-intro__badge {
    background: linear-gradient(135deg, rgba(55, 28, 61, .82) 0%, rgba(48, 63, 116, .78) 32%, rgba(29, 109, 56, .78) 68%, rgba(125, 98, 19, .84) 100%);
    border-color: rgba(255,255,255,.2);
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-intro__badge span {
    color: rgba(255,255,255,.64);
}

.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-intro__badge strong,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-intro__eyebrow,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-intro__content h3,
.dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-products-head h3 {
    color: #4e374e;
}

.dgproduct-grid--color .dgproduct-card__series {
    border-color: rgba(255,255,255,.18);
    background: linear-gradient(135deg, rgba(77,30,65,.86) 0%, rgba(55,78,138,.82) 35%, rgba(28,116,58,.82) 68%, rgba(155,128,33,.86) 100%);
    color: #ffffff;
}

.dgproduct-grid--color .dgproduct-card__night-badge i,
.dgproduct-grid--color .dgproduct-card__glow-name i {
    background: linear-gradient(135deg, #F291C6 0%, #5794E6 42%, #31BD3D 70%, #EBE321 100%);
    box-shadow: 0 0 10px rgba(242,145,198,.34);
}

@media (max-width: 1180px) {
    .dgproduct-grid--color {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider {
        min-height: 112px;
        gap: 18px;
        padding: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__meta {
        min-width: 220px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider h3 {
        font-size: 22px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 860px) {
    .dgproduct-grid--color {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider {
        flex-wrap: wrap;
        min-height: auto;
        gap: 16px;
        padding: 16px;
        background-image: linear-gradient(120deg, #ffffff 0%, #fff8fb 20%, #F291C6 42%, #5794E6 63%, #31BD3D 81%, #EBE321 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider h3 {
        font-size: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 560px) {
    .dgproduct-grid--color {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__meta {
        gap: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="color"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — Special Family Section
   v1.7.49
========================================================= */

.dgproduct-grid--special {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dgproduct-grid--special > .dgproduct-card,
.dgproduct-grid--special > .dgproduct-card:nth-child(5) {
    grid-column: auto;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 124px;
    padding: 18px 22px;
    overflow: hidden;
    border: 1px solid rgba(116, 83, 167, .12);
    border-radius: 18px;
    background-color: #fff;
    background-image: linear-gradient(90deg, #ffffff 0%, #faf7ff 20%, #e2d5f3 48%, #A580D1 72%, #9042ED 100%);
    box-shadow: 0 12px 28px rgba(29, 20, 38, .12);
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 12% 50%, rgba(165,128,209,.16) 0%, rgba(165,128,209,0) 28%),
        radial-gradient(circle at 82% 24%, rgba(144,66,237,.14) 0%, rgba(144,66,237,0) 22%),
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 44%);
    pointer-events: none;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(69,47,96,0), rgba(69,47,96,.18), rgba(255,255,255,.62), rgba(69,47,96,0));
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__meta,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 255px;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__index {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    border: 1px solid rgba(96, 69, 137, .12);
    background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(245,240,252,.96) 100%);
    color: #5a3f7c;
    box-shadow: 0 8px 18px rgba(29,20,38,.08), inset 0 1px 0 rgba(255,255,255,.88);
    font-size: 18px;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__micro {
    margin: 0 0 5px;
    color: rgba(80, 58, 108, .66);
    font-size: 8px;
    letter-spacing: .2em;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin strong,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider h3,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__subtitle {
    color: #493263;
    text-shadow: none;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin strong {
    font-size: 22px;
    line-height: 1.05;
    font-weight: 900;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin em {
    margin-top: 7px;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .22em;
    color: rgba(73,50,99,.82);
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    background: none;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    font-size: 27px;
    font-weight: 900;
    line-height: 1.38;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.5;
    text-align: right;
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__badge {
    background: linear-gradient(135deg, rgba(43, 25, 64, .82) 0%, rgba(81, 48, 122, .82) 58%, rgba(144, 66, 237, .86) 100%);
    border-color: rgba(255,255,255,.18);
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__badge span {
    color: rgba(255,255,255,.62);
}

.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__badge strong,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__eyebrow,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__content h3,
.dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-products-head h3 {
    color: #4a3568;
}

.dgproduct-grid--special .dgproduct-card__series {
    border-color: rgba(206,182,255,.24);
    background: rgba(28,17,40,.76);
    color: #eadcff;
}

.dgproduct-grid--special .dgproduct-card__night-badge i,
.dgproduct-grid--special .dgproduct-card__glow-name i {
    background: #b783ff;
    box-shadow: 0 0 10px rgba(183,131,255,.5);
}

@media (max-width: 1180px) {
    .dgproduct-grid--special {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider {
        min-height: 112px;
        gap: 18px;
        padding: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__meta {
        min-width: 220px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider h3 {
        font-size: 22px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__subtitle {
        font-size: 15px;
    }
}

@media (max-width: 860px) {
    .dgproduct-grid--special {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider {
        flex-wrap: wrap;
        min-height: auto;
        gap: 16px;
        padding: 16px;
        background-image: linear-gradient(120deg, #ffffff 0%, #faf7ff 24%, #e0d2f2 58%, #A580D1 82%, #9042ED 100%);
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider h3 {
        font-size: 18px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 560px) {
    .dgproduct-grid--special {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider {
        padding: 14px;
        border-radius: 14px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__meta {
        gap: 10px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__index {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin strong {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__latin em {
        font-size: 9px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider h3 {
        font-size: 16px;
    }

    .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider__subtitle {
        font-size: 12px;
    }
}


/* =========================================================
   DGCHEME — Mobile Media-First Flow
   v1.7.50
   Desktop/tablet two-column composition remains untouched.
   Once a section collapses to one column, media must appear
   before the text block. Product-family intro follows the
   same media-first rule after its family divider/title.
========================================================= */

/* Product showcase: when stacked, image/media first. */
@media (max-width: 900px) {
    .dgproduct-showcase__shell > .dgproduct-showcase__media {
        order: 1;
    }

    .dgproduct-showcase__shell > .dgproduct-showcase__content {
        order: 2;
    }
}

/* Base application and all application-specific media modules. */
@media (max-width: 1080px) {
    .dgproduct-application__grid--masterbatch > .dgproduct-dual-media {
        order: 1;
    }

    .dgproduct-application__grid--masterbatch > .dgproduct-application__content {
        order: 2;
    }
}

@media (max-width: 960px) {
    .dgproduct-application__grid > .dgproduct-application__media,
    .dgproduct-application__grid > .dgproduct-safety-media,
    .dgproduct-application__grid > .dgproduct-print-media,
    .dgproduct-application__grid > .dgproduct-glass-media,
    .dgproduct-application__grid > .dgproduct-ceramic-media,
    .dgproduct-application__grid > .dgproduct-traffic-media,
    .dgproduct-application__grid > .dgproduct-decoration-media {
        order: 1;
    }

    .dgproduct-application__grid > .dgproduct-application__content {
        order: 2;
    }
}

/* Product Explorer family intro: family divider/title remains above;
   inside the intro card, image comes before the explanatory copy. */
@media (max-width: 760px) {
    .dgproduct-family-intro {
        grid-template-areas:
            "media"
            "content";
    }
}

/* =========================================================
   GOLDEN METALLIC — INTRO / TECHNICAL PROFILE
   post 4386
   v1.7.53
========================================================= */

/* The page H1 lives inside the first product section after the slider. */
.postid-4386 .dg-article__header {
    display: none;
}

.dggold-intro,
.dggold-intro * {
    box-sizing: border-box;
}

.dggold-intro {
    position: relative;
    width: 100%;
    padding: 48px 20px 54px;
    overflow: hidden;
    background:
        radial-gradient(circle at 0% 100%, rgba(18, 91, 68, .045), transparent 24%),
        linear-gradient(180deg, #fbfcfb 0%, #f6f8f7 100%);
}

.dggold-intro::after {
    content: "";
    position: absolute;
    right: -92px;
    bottom: -135px;
    width: 260px;
    height: 260px;
    border: 1px solid rgba(180, 148, 38, .10);
    border-radius: 50%;
    box-shadow:
        0 0 0 38px rgba(180, 148, 38, .025),
        0 0 0 76px rgba(18, 91, 68, .018);
    pointer-events: none;
}

.dggold-intro__inner {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    margin: 0 auto;
}

/* Keep the requested desktop composition physically fixed:
   technical card on the left / article copy on the right. */
.dggold-intro__grid {
    display: grid;
    grid-template-columns: 346px minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
    direction: ltr;
}

.dggold-intro__copy,
.dggold-intro__profile {
    direction: rtl;
}

.dggold-intro__copy {
    position: relative;
    grid-column: 2;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid #dde5e1;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 14px 38px rgba(23, 50, 40, .055);
}

.dggold-intro__copy::before {
    content: "";
    position: absolute;
    top: 0;
    right: 84px;
    width: 64px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #174d3a 0%, #d1aa2f 100%);
}

.dggold-intro__copy p {
    margin: 0;
    color: #51645d;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.22;
    text-align: justify;
    text-align-last: right;
}

.dggold-intro__copy a {
    color: #174d3a;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid rgba(23,77,58,.25);
}

.dggold-intro__copy a:hover,
.dggold-intro__copy a:focus-visible {
    color: #a88417;
    border-bottom-color: currentColor;
}

.dggold-intro__profile {
    position: relative;
    grid-column: 1;
    display: flex;
    flex-direction: column;
    min-height: 560px;
    padding: 34px 26px 26px;
    overflow: hidden;
    border-radius: 19px;
    background:
        radial-gradient(circle at 15% 100%, rgba(207,171,47,.08), transparent 28%),
        linear-gradient(155deg, #123f31 0%, #063f31 54%, #074b39 100%);
    box-shadow: 0 18px 44px rgba(11, 56, 42, .12);
    color: #fff;
}

.dggold-intro__profile::before {
    content: "";
    position: absolute;
    left: -84px;
    bottom: -82px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(211,172,47,.20);
    border-radius: 50%;
    box-shadow: 0 0 0 35px rgba(211,172,47,.025);
    pointer-events: none;
}

.dggold-intro__eyebrow {
    display: grid;
    grid-template-columns: auto minmax(26px, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    direction: ltr;
    color: #d8b83d;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.dggold-intro__eyebrow::after {
    content: "";
    height: 1px;
    background: linear-gradient(90deg, #d8b83d, rgba(216,184,61,.06));
}

.dggold-intro__title {
    margin: 0 0 26px;
    color: #fff;
    font-size: 21px;
    font-weight: 900;
    line-height: 1.8;
    text-align: right;
}

.dggold-intro__tech {
    position: relative;
    padding: 17px 16px 15px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dggold-intro__tech-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    direction: ltr;
}

.dggold-intro__tech-head strong,
.dggold-intro__tech-head span {
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .08em;
}

.dggold-intro__tech-head strong {
    color: #d8b83d;
}

.dggold-intro__tech-head span {
    color: rgba(255,255,255,.36);
}

.dggold-intro__formula {
    display: grid;
    grid-template-columns: auto 24px auto 24px auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 24px 0 20px;
    direction: ltr;
}

.dggold-intro__formula strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 32px;
    padding: 7px 9px;
    border: 1px solid rgba(216,184,61,.42);
    border-radius: 6px;
    background: rgba(216,184,61,.07);
    color: #f0d56f;
    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
}

.dggold-intro__formula i {
    position: relative;
    display: block;
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, rgba(216,184,61,.45), #d8b83d);
}

.dggold-intro__formula i::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #d8b83d;
    border-right: 1px solid #d8b83d;
    transform: translateY(-50%) rotate(45deg);
}

.dggold-intro__formula-caption {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: -6px;
    padding-bottom: 15px;
    color: rgba(255,255,255,.42);
    direction: ltr;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .04em;
}

.dggold-intro__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

.dggold-intro__spec {
    min-width: 0;
    min-height: 54px;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 9px;
    background: rgba(255,255,255,.022);
    direction: ltr;
}

.dggold-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #d8b83d;
    font-size: 6px;
    font-weight: 900;
    letter-spacing: .07em;
}

.dggold-intro__spec strong {
    display: block;
    color: rgba(255,255,255,.74);
    font-size: 8px;
    font-weight: 700;
    line-height: 1.55;
}

.dggold-intro__tags {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 28px;
    direction: ltr;
}

.dggold-intro__tags span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: rgba(255,255,255,.64);
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .dggold-intro {
        padding: 38px 16px 44px;
    }

    .dggold-intro__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    /* Mobile rule: the technical visual comes before the body copy. */
    .dggold-intro__profile {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
    }

    .dggold-intro__copy {
        grid-column: 1;
        grid-row: 2;
    }

    .dggold-intro__tags {
        margin-top: 26px;
    }
}

@media (max-width: 560px) {
    .dggold-intro {
        padding: 30px 12px 36px;
    }

    .dggold-intro__profile {
        padding: 26px 18px 20px;
        border-radius: 16px;
    }

    .dggold-intro__title {
        margin-bottom: 20px;
        font-size: 19px;
    }

    .dggold-intro__copy {
        padding: 23px 20px 21px;
        border-radius: 16px;
    }

    .dggold-intro__copy::before {
        right: 20px;
    }

    .dggold-intro__copy p {
        font-size: 13px;
        line-height: 2.08;
    }

    .dggold-intro__formula {
        grid-template-columns: 1fr auto 1fr;
        gap: 7px;
        padding: 20px 0 16px;
    }

    .dggold-intro__formula strong:last-of-type {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, 160px);
        margin-top: 7px;
    }

    .dggold-intro__formula i:last-of-type {
        display: none;
    }

    .dggold-intro__formula-caption {
        justify-content: center;
        text-align: center;
    }

    .dggold-intro__specs {
        grid-template-columns: 1fr;
    }
}

/* END — GOLDEN METALLIC INTRO v1.7.53 */

/* =========================================================
   GOLDEN METALLIC — INTRO DESKTOP ORDER + COPY BALANCE
   post 4386
   v1.7.54
========================================================= */

/* Desktop only: technical profile on the RIGHT, article copy on the LEFT. */
@media (min-width: 901px) {
    .dggold-intro__grid {
        grid-template-columns: minmax(0, 1fr) 346px;
    }

    .dggold-intro__copy {
        grid-column: 1;
    }

    .dggold-intro__profile {
        grid-column: 2;
    }
}

/* Keep the editorial rhythm close to the reference section. */
.dggold-intro__copy p + p {
    margin-top: 22px;
}

/* END — GOLDEN METALLIC INTRO v1.7.54 */

/* =========================================================
   GOLDEN METALLIC — INTRO SAME ROW FIX
   post 4386
   v1.7.55
========================================================= */
@media (min-width: 901px) {
    .dggold-intro__profile,
    .dggold-intro__copy {
        grid-row: 1;
        align-self: stretch;
    }
}
/* END — GOLDEN METALLIC INTRO v1.7.55 */


/* =========================================================
   DGCHEME — Golden Metallic / Optical Reflection Section
   v1.7.56
========================================================= */

.dggold-optics {
    position: relative;
    padding: 12px 0 0;
}

.dggold-optics__inner {
    width: min(1280px, calc(100% - 32px));
    margin: 0 auto;
}

.dggold-optics__section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.dggold-optics__section-copy {
    max-width: 780px;
}

.dggold-optics__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: #6e7a74;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .18em;
}

.dggold-optics__title {
    margin: 0 0 10px;
    color: #113b30;
    font-size: 34px;
    line-height: 1.35;
    font-weight: 900;
}

.dggold-optics__lead {
    margin: 0;
    color: #52635d;
    font-size: 17px;
    line-height: 2;
}

.dggold-optics__meta {
    flex: 0 0 auto;
    min-width: 240px;
    padding: 16px 18px;
    border: 1px solid rgba(17,59,48,.08);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(247,250,248,.96) 0%, rgba(239,245,242,.96) 100%);
    box-shadow: 0 10px 24px rgba(17,59,48,.06);
    text-align: left;
    direction: ltr;
}

.dggold-optics__meta span {
    display: block;
    margin-bottom: 6px;
    color: #7a8a84;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
}

.dggold-optics__meta strong {
    display: block;
    color: #173d32;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 900;
}

.dggold-optics__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.dggold-optics__card {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(17,59,48,.10);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247,250,248,.98) 100%);
    box-shadow: 0 16px 34px rgba(17,59,48,.08);
}

.dggold-optics__card::before {
    content: "";
    position: absolute;
    inset-inline: 20px;
    top: 0;
    height: 3px;
    border-radius: 0 0 999px 999px;
}

.dggold-optics__card--common::before {
    background: linear-gradient(90deg, #a2b0a6 0%, #d0d8d3 100%);
}

.dggold-optics__card--pearlescent::before {
    background: linear-gradient(90deg, #86c5c1 0%, #c2e4f2 48%, #d4c9ff 100%);
}

.dggold-optics__card--metallic::before {
    background: linear-gradient(90deg, #b9932f 0%, #e4c45b 48%, #8b6a15 100%);
}

.dggold-optics__image-wrap {
    position: relative;
    padding: 18px 18px 12px;
    background: linear-gradient(180deg, rgba(248,250,249,.94) 0%, rgba(243,247,245,.94) 100%);
}

.dggold-optics__image-wrap img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px;
    background: #fff;
}

.dggold-optics__body {
    padding: 18px 20px 22px;
}

.dggold-optics__card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.dggold-optics__index {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    border: 1px solid rgba(17,59,48,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(239,245,242,.95) 100%);
    color: #163d32;
    font-size: 16px;
    font-weight: 900;
}

.dggold-optics__label {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(17,59,48,.10);
    background: rgba(240,245,242,.88);
    color: #587067;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.dggold-optics__card-title {
    margin: 0 0 10px;
    color: #123a30;
    font-size: 22px;
    line-height: 1.6;
    font-weight: 900;
}

.dggold-optics__card-text {
    margin: 0;
    color: #586964;
    font-size: 15px;
    line-height: 2;
}

.dggold-optics__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.dggold-optics__chips span {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(17,59,48,.10);
    background: rgba(244,248,246,.95);
    color: #204438;
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 1080px) {
    .dggold-optics__section-head {
        flex-direction: column;
        align-items: stretch;
    }

    .dggold-optics__meta {
        min-width: 0;
        width: 100%;
    }

    .dggold-optics__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dggold-optics__inner {
        width: min(100%, calc(100% - 20px));
    }

    .dggold-optics__title {
        font-size: 24px;
    }

    .dggold-optics__lead {
        font-size: 15px;
        line-height: 1.95;
    }

    .dggold-optics__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dggold-optics__image-wrap {
        padding: 14px 14px 10px;
    }

    .dggold-optics__body {
        padding: 16px;
    }

    .dggold-optics__card-title {
        font-size: 18px;
    }

    .dggold-optics__card-text {
        font-size: 14px;
    }
}


/* =========================================================
   DGCHEME — Golden Metallic / Optical Reflection 800x800 Media
   v1.7.57
========================================================= */

.dggold-optics__image-wrap {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.dggold-optics__image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* =========================================================
   DGCHEME — Golden Metallic / Immediate Reflection Trio
   v1.7.58
   Exact section after the intro: Metallic / Pearlescent / Common
========================================================= */

.dggold-optics--reflection-trio {
    padding-top: 18px;
}

.dggold-optics--reflection-trio .dggold-optics__section-head {
    margin-bottom: 20px;
}

.dggold-optics--reflection-trio .dggold-optics__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.dggold-optics--reflection-trio .dggold-optics__card {
    min-width: 0;
    height: 100%;
}

.dggold-optics--reflection-trio .dggold-optics__image-wrap {
    aspect-ratio: 1 / 1;
    min-height: 0;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-bottom: 1px solid rgba(17,59,48,.08);
}

.dggold-optics--reflection-trio .dggold-optics__image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 14px;
    background: #fff;
}

.dggold-optics--reflection-trio .dggold-optics__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 18px 20px 20px;
}

.dggold-optics--reflection-trio .dggold-optics__card-title {
    margin-bottom: 9px;
}

.dggold-optics--reflection-trio .dggold-optics__card-text {
    flex: 1;
}

.dggold-optics--reflection-trio .dggold-optics__chips {
    margin-top: 16px;
}

.dggold-optics--reflection-trio .dggold-optics__card--metallic .dggold-optics__index,
.dggold-optics--reflection-trio .dggold-optics__card--metallic .dggold-optics__label {
    border-color: rgba(184,146,45,.22);
    background: rgba(250,246,231,.92);
    color: #7b6115;
}

.dggold-optics--reflection-trio .dggold-optics__card--pearlescent .dggold-optics__index,
.dggold-optics--reflection-trio .dggold-optics__card--pearlescent .dggold-optics__label {
    border-color: rgba(91,170,175,.18);
    background: rgba(239,249,249,.92);
    color: #276e72;
}

.dggold-optics--reflection-trio .dggold-optics__card--common .dggold-optics__index,
.dggold-optics--reflection-trio .dggold-optics__card--common .dggold-optics__label {
    border-color: rgba(91,108,99,.16);
    background: rgba(244,247,245,.94);
    color: #52635d;
}

@media (max-width: 1080px) {
    .dggold-optics--reflection-trio .dggold-optics__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dggold-optics--reflection-trio .dggold-optics__grid {
        grid-template-columns: 1fr;
    }

    .dggold-optics--reflection-trio .dggold-optics__image-wrap {
        aspect-ratio: 1 / 1;
        padding: 14px;
    }
}

/* =========================================================
   DGCHEME — Golden Metallic / Reflection Trio Refinement
   v1.7.59
   - alternating green section background
   - compact/minimal cards
   - project heading scale
========================================================= */

.dggold-optics--reflection-trio {
    padding: 42px 20px 46px;
    background:
        radial-gradient(circle at 88% 12%, rgba(21,70,54,.045), transparent 28%),
        linear-gradient(180deg, #eef5f0 0%, #f5f8f6 100%);
}

.dggold-optics--reflection-trio .dggold-optics__inner {
    width: min(100%, 1180px);
}

.dggold-optics--reflection-trio .dggold-optics__section-head {
    align-items: flex-end;
    margin-bottom: 18px;
}

.dggold-optics--reflection-trio .dggold-optics__eyebrow {
    margin-bottom: 7px;
    color: #55756a;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .10em;
}

.dggold-optics--reflection-trio .dggold-optics__title {
    margin: 0 0 8px;
    color: #154636;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.85;
}

.dggold-optics--reflection-trio .dggold-optics__lead {
    max-width: 760px;
    margin: 0;
    color: #687a72;
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
}

.dggold-optics--reflection-trio .dggold-optics__meta {
    min-width: 210px;
    padding: 12px 14px;
    border: 1px solid rgba(21,70,54,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.58);
    box-shadow: none;
}

.dggold-optics--reflection-trio .dggold-optics__meta span {
    margin-bottom: 4px;
    color: #6f8179;
    font-size: 8px;
    letter-spacing: .10em;
}

.dggold-optics--reflection-trio .dggold-optics__meta strong {
    color: #154636;
    font-size: 11px;
    line-height: 1.55;
}

.dggold-optics--reflection-trio .dggold-optics__grid {
    gap: 14px;
}

.dggold-optics--reflection-trio .dggold-optics__card {
    overflow: hidden;
    border: 1px solid rgba(21,70,54,.10);
    border-radius: 15px;
    background: rgba(255,255,255,.90);
    box-shadow: 0 8px 22px rgba(19,61,48,.045);
}

.dggold-optics--reflection-trio .dggold-optics__card::before {
    inset-inline: 14px;
    height: 2px;
}

.dggold-optics--reflection-trio .dggold-optics__image-wrap {
    padding: 10px;
    border-bottom: 1px solid rgba(21,70,54,.07);
    background: rgba(255,255,255,.72);
}

.dggold-optics--reflection-trio .dggold-optics__image-wrap img {
    border-radius: 10px;
}

.dggold-optics--reflection-trio .dggold-optics__body {
    padding: 13px 14px 15px;
}

.dggold-optics--reflection-trio .dggold-optics__card-top {
    gap: 8px;
    margin-bottom: 9px;
}

.dggold-optics--reflection-trio .dggold-optics__index {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 10px;
    box-shadow: none;
}

.dggold-optics--reflection-trio .dggold-optics__label {
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 8px;
    letter-spacing: .08em;
}

.dggold-optics--reflection-trio .dggold-optics__card-title {
    margin: 0 0 7px;
    color: #154636;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.9;
}

.dggold-optics--reflection-trio .dggold-optics__card-text {
    color: #6f8078;
    font-size: 13px;
    line-height: 1.95;
    text-align: justify;
}

.dggold-optics--reflection-trio .dggold-optics__chips {
    gap: 6px;
    margin-top: 11px;
    padding-top: 10px;
    border-top: 1px solid rgba(21,70,54,.07);
}

.dggold-optics--reflection-trio .dggold-optics__chips span {
    min-height: 28px;
    padding: 0 9px;
    border-radius: 999px;
    border-color: rgba(21,70,54,.09);
    background: rgba(240,246,242,.78);
    color: #49675c;
    font-size: 8px;
    font-weight: 800;
}

@media (max-width: 760px) {
    .dggold-optics--reflection-trio {
        padding: 34px 10px 38px;
    }

    .dggold-optics--reflection-trio .dggold-optics__section-head {
        gap: 12px;
        margin-bottom: 14px;
    }

    .dggold-optics--reflection-trio .dggold-optics__title {
        font-size: 16px;
    }

    .dggold-optics--reflection-trio .dggold-optics__lead {
        font-size: 13px;
        line-height: 2;
    }

    .dggold-optics--reflection-trio .dggold-optics__meta {
        padding: 10px 12px;
    }

    .dggold-optics--reflection-trio .dggold-optics__image-wrap {
        padding: 9px;
    }

    .dggold-optics--reflection-trio .dggold-optics__body {
        padding: 12px 13px 14px;
    }

    .dggold-optics--reflection-trio .dggold-optics__card-title {
        font-size: 15px;
    }

    .dggold-optics--reflection-trio .dggold-optics__card-text {
        font-size: 13px;
    }
}


/* =========================================================
   DGCHEME — Golden Metallic / Shade Spectrum Section
   v1.7.60
========================================================= */

.dggold-spectrum {
    position: relative;
    padding: 8px 0 0;
    background: #ffffff;
}

.dggold-spectrum__inner {
    width: min(1280px, calc(100% - 32px));
    margin: 0 auto;
}

.dggold-spectrum__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.dggold-spectrum__copy {
    max-width: 930px;
}

.dggold-spectrum__eyebrow {
    display: inline-flex;
    align-items: center;
    margin-bottom: 8px;
    color: #84724a;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .18em;
}

.dggold-spectrum__title {
    margin: 0 0 10px;
    color: #1e342b;
    font-size: 18px;
    line-height: 1.8;
    font-weight: 900;
}

.dggold-spectrum__lead {
    margin: 0;
    color: #34463f;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
}

.dggold-spectrum__meta {
    flex: 0 0 220px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(107, 94, 58, .12);
    background: linear-gradient(135deg, #fdf8eb 0%, #f6efd9 100%);
    box-shadow: 0 10px 24px rgba(44, 56, 50, .06);
    text-align: left;
    direction: ltr;
}

.dggold-spectrum__meta span,
.dggold-spectrum__meta em {
    color: #8f7a4a;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .18em;
}

.dggold-spectrum__meta strong {
    color: #214133;
    font-size: 14px;
    line-height: 1.6;
    font-weight: 900;
}

.dggold-spectrum__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.dggold-spectrum__card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(24, 51, 41, .08);
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(250,250,248,.98) 100%);
    box-shadow: 0 10px 24px rgba(24, 51, 41, .06);
}

.dggold-spectrum__frame {
    position: relative;
    padding: 12px 12px 0;
}

.dggold-spectrum__frame img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    height: auto;
    object-fit: cover;
    border-radius: 12px;
    background: #f3eee1;
}

.dggold-spectrum__body {
    padding: 12px 14px 15px;
}

.dggold-spectrum__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.dggold-spectrum__index {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    border: 1px solid rgba(24,51,41,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(243,247,245,.92) 100%);
    color: #183529;
    font-size: 13px;
    font-weight: 900;
}

.dggold-spectrum__ratio {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(246, 240, 222, .92);
    border: 1px solid rgba(171, 149, 89, .16);
    color: #6b5a33;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .04em;
    direction: ltr;
}

.dggold-spectrum__card-title {
    margin: 0 0 7px;
    color: #19392d;
    font-size: 16px;
    line-height: 1.6;
    font-weight: 900;
    direction: ltr;
    text-align: left;
}

.dggold-spectrum__card-text {
    margin: 0;
    color: #5b6a64;
    font-size: 13px;
    line-height: 2;
    text-align: justify;
}

.dggold-spectrum__card--red .dggold-spectrum__frame {
    background: linear-gradient(180deg, rgba(241,223,197,.30) 0%, rgba(255,255,255,0) 100%);
}

.dggold-spectrum__card--pale .dggold-spectrum__frame {
    background: linear-gradient(180deg, rgba(238,226,176,.34) 0%, rgba(255,255,255,0) 100%);
}

.dggold-spectrum__card--rich-pale .dggold-spectrum__frame {
    background: linear-gradient(180deg, rgba(231,220,144,.32) 0%, rgba(255,255,255,0) 100%);
}

.dggold-spectrum__card--rich .dggold-spectrum__frame {
    background: linear-gradient(180deg, rgba(201,198,108,.30) 0%, rgba(255,255,255,0) 100%);
}

@media (max-width: 1180px) {
    .dggold-spectrum__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .dggold-spectrum__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dggold-spectrum__meta {
        flex: 0 0 auto;
        width: 100%;
    }
}

@media (max-width: 760px) {
    .dggold-spectrum__inner {
        width: min(100%, calc(100% - 20px));
    }

    .dggold-spectrum__title {
        font-size: 16px;
    }

    .dggold-spectrum__lead,
    .dggold-spectrum__card-text {
        font-size: 13px;
    }

    .dggold-spectrum__grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dggold-spectrum__frame {
        padding: 10px 10px 0;
    }

    .dggold-spectrum__body {
        padding: 12px;
    }

    .dggold-spectrum__card-title {
        font-size: 15px;
    }
}


/* =========================================================
   DGCHEME — Golden Metallic / Shade Spectrum Portrait Images
   Actual source ratio: 887 × 1774
   v1.7.61
========================================================= */
.dggold-spectrum__frame {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dggold-spectrum__frame img {
    width: 100%;
    height: auto;
    aspect-ratio: 887 / 1774;
    object-fit: contain;
    object-position: center;
}
/* END — GOLDEN METALLIC SPECTRUM PORTRAIT v1.7.61 */


/* =========================================================
   DGCHEME — Golden Metallic / Shade Spectrum Landscape Images
   Corrected source ratio: 1774 × 887
   v1.7.62
========================================================= */
.dggold-spectrum__frame img {
    width: 100%;
    height: auto;
    aspect-ratio: 1774 / 887;
    object-fit: contain;
    object-position: center;
}
/* END — GOLDEN METALLIC SPECTRUM LANDSCAPE v1.7.62 */


/* =========================================================
   DGCHEME — Golden Metallic / Spectrum Brand Green Background
   v1.7.63
   - use the same organizational green section language
   - preserve compact cards and heading scale
========================================================= */
.dggold-spectrum {
    padding: 42px 20px 46px;
    background:
        radial-gradient(circle at 88% 12%, rgba(21,70,54,.045), transparent 28%),
        linear-gradient(180deg, #eef5f0 0%, #f5f8f6 100%);
}

.dggold-spectrum__inner {
    width: min(100%, 1180px);
}

.dggold-spectrum__title {
    color: #154636;
}

.dggold-spectrum__eyebrow {
    color: #55756a;
}

.dggold-spectrum__lead {
    color: #5f726a;
}

.dggold-spectrum__meta {
    border-color: rgba(21,70,54,.10);
    background: rgba(255,255,255,.58);
    box-shadow: none;
}

.dggold-spectrum__meta span,
.dggold-spectrum__meta em {
    color: #6f8179;
}

.dggold-spectrum__meta strong {
    color: #154636;
}

.dggold-spectrum__card {
    border-color: rgba(21,70,54,.10);
    background: rgba(255,255,255,.92);
    box-shadow: 0 8px 22px rgba(19,61,48,.045);
}

@media (max-width: 760px) {
    .dggold-spectrum {
        padding: 34px 10px 38px;
    }
}
/* END — GOLDEN METALLIC SPECTRUM GREEN v1.7.63 */

/* =========================================================
   DGCHEME — Golden Metallic / Leafing & Non-Leafing Signature
   v1.7.66
   Dark organizational-green anchor section + premium lab UI
========================================================= */

.dggold-leafing {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 48px 20px 54px;
    background:
        radial-gradient(circle at 10% 8%, rgba(255,225,97,.075), transparent 24%),
        radial-gradient(circle at 92% 72%, rgba(65,144,109,.13), transparent 30%),
        linear-gradient(128deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dggold-leafing::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .42;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 58px 58px;
    pointer-events: none;
}

.dggold-leafing::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 480px;
    height: 480px;
    left: -220px;
    bottom: -310px;
    border: 1px solid rgba(255,225,97,.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 48px rgba(255,225,97,.018),
        0 0 0 96px rgba(255,225,97,.012);
    pointer-events: none;
}

.dggold-leafing__inner {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dggold-leafing__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 26px;
    margin-bottom: 20px;
}

.dggold-leafing__head-copy {
    max-width: 760px;
}

.dggold-leafing__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 7px;
    color: #d6b94c;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .18em;
    direction: ltr;
}

.dggold-leafing__eyebrow::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    opacity: .8;
}

.dggold-leafing__title {
    margin: 0 0 7px;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dggold-leafing__lead {
    margin: 0;
    color: rgba(239,247,242,.74);
    font-size: 13px;
    line-height: 2;
    text-align: justify;
}

.dggold-leafing__head-code {
    flex: 0 0 250px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
    backdrop-filter: blur(10px);
    direction: ltr;
    text-align: left;
}

.dggold-leafing__head-code span,
.dggold-leafing__head-code em {
    color: rgba(238,247,242,.50);
    font-size: 8px;
    line-height: 1.6;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .14em;
}

.dggold-leafing__head-code strong {
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 900;
}

.dggold-leafing__top {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 18px;
    align-items: stretch;
    direction: ltr;
}

.dggold-leafing__lab,
.dggold-leafing__technical {
    min-width: 0;
    border-radius: 22px;
    overflow: hidden;
}

.dggold-leafing__lab {
    position: relative;
    padding: 16px;
    border: 1px solid rgba(20,59,47,.11);
    background:
        radial-gradient(circle at 92% 8%, rgba(255,225,97,.09), transparent 24%),
        linear-gradient(180deg, #f8faf7 0%, #eef5f0 100%);
    box-shadow: 0 22px 54px rgba(0,0,0,.22);
}

.dggold-leafing__lab-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
    direction: ltr;
}

.dggold-leafing__lab-bar > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dggold-leafing__lab-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #caa83d;
    box-shadow: 0 0 0 5px rgba(202,168,61,.10);
}

.dggold-leafing__lab-bar strong {
    color: #153c30;
    font-size: 11px;
    line-height: 1.5;
    font-weight: 900;
}

.dggold-leafing__lab-bar > span {
    color: #718079;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .14em;
}

.dggold-leafing__visual-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
}

.dggold-leafing__visual {
    position: relative;
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(19,59,48,.09);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(17,54,42,.06);
    transition: transform .36s cubic-bezier(.2,.75,.2,1), box-shadow .36s ease, border-color .36s ease;
}

.dggold-leafing__visual:hover {
    transform: translateY(-4px);
    border-color: rgba(202,168,61,.30);
    box-shadow: 0 18px 34px rgba(17,54,42,.12);
}

.dggold-leafing__visual-frame {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: #e7dece;
}

.dggold-leafing__visual-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(7,35,26,0) 58%, rgba(7,35,26,.16) 100%),
        linear-gradient(90deg, rgba(255,255,255,.08), transparent 24%);
}

.dggold-leafing__visual-frame img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
    transform-origin: center center;
    transition: transform .62s cubic-bezier(.2,.75,.2,1), filter .62s ease;
    will-change: transform;
}

/* Upper comparison now uses two independent image files.
   Do not crop one shared image into left/right halves. */
.dggold-leafing__visual--leafing .dggold-leafing__visual-frame img,
.dggold-leafing__visual--nonleafing .dggold-leafing__visual-frame img {
    left: 0;
    right: 0;
}

.dggold-leafing__visual:hover .dggold-leafing__visual-frame img {
    transform: scale(1.07);
    filter: saturate(1.04) contrast(1.02);
}

.dggold-leafing__visual-badge {
    position: absolute;
    top: 10px;
    inset-inline-start: 10px;
    z-index: 2;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 10px;
    background: rgba(8,36,25,.66);
    color: #ffffff;
    font-size: 9px;
    font-weight: 900;
    backdrop-filter: blur(8px);
}

.dggold-leafing__visual figcaption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 64px;
    padding: 10px 11px 11px;
    direction: ltr;
}

.dggold-leafing__visual figcaption > div {
    min-width: 0;
}

.dggold-leafing__visual figcaption strong,
.dggold-leafing__visual figcaption span {
    display: block;
    text-align: left;
}

.dggold-leafing__visual figcaption strong {
    color: #143a2e;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 900;
}

.dggold-leafing__visual figcaption span {
    margin-top: 2px;
    color: #718179;
    font-size: 9px;
    line-height: 1.5;
}

.dggold-leafing__visual figcaption em {
    flex: 0 0 auto;
    padding: 6px 8px;
    border-radius: 999px;
    background: #edf5f0;
    color: #37634f;
    font-size: 7px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .10em;
}

.dggold-leafing__visual--leafing figcaption em {
    background: #f7f0dc;
    color: #806920;
}

.dggold-leafing__observation {
    position: relative;
    margin-top: 13px;
    padding: 14px 15px 13px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    background:
        radial-gradient(circle at 90% 10%, rgba(255,225,97,.09), transparent 24%),
        linear-gradient(135deg, #143f31 0%, #0c3025 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
}

.dggold-leafing__observation::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 3px;
    background: linear-gradient(180deg, #e1c45d, #a98629);
}

.dggold-leafing__observation-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    direction: ltr;
}

.dggold-leafing__observation-head span {
    color: #e1c45d;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .14em;
}

.dggold-leafing__observation-head strong {
    color: rgba(255,255,255,.72);
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
}

.dggold-leafing__observation p {
    margin: 0;
    color: rgba(246,251,248,.90);
    font-size: 13px;
    line-height: 2;
    text-align: justify;
}

.dggold-leafing__observation-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 7px;
    margin-top: 10px;
    direction: ltr;
}

.dggold-leafing__observation-metrics span {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 10px;
    background: rgba(255,255,255,.045);
    color: rgba(245,250,247,.72);
    font-size: 8px;
    font-weight: 800;
}

.dggold-leafing__observation-metrics b {
    color: #e1c45d;
    font-size: 9px;
}

.dggold-leafing__technical {
    position: relative;
    padding: 21px;
    border: 1px solid rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 86% 8%, rgba(255,225,97,.055), transparent 24%),
        linear-gradient(155deg, rgba(20,63,49,.92) 0%, rgba(8,38,27,.94) 100%);
    box-shadow: 0 22px 54px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035);
    color: #fff;
    direction: rtl;
}

.dggold-leafing__technical::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    left: -72px;
    top: -72px;
    border: 1px solid rgba(255,225,97,.075);
    border-radius: 50%;
    pointer-events: none;
}

.dggold-leafing__technical-top {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    direction: ltr;
}

.dggold-leafing__technical-top > span:first-child {
    color: #d5bb56;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .17em;
}

.dggold-leafing__technical-index {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 10px;
    background: rgba(255,255,255,.05);
    color: #ffffff;
    font-size: 10px;
    font-weight: 900;
}

.dggold-leafing__text {
    position: relative;
    z-index: 1;
    margin: 0 0 10px;
    color: rgba(243,249,246,.84);
    font-size: 13px;
    line-height: 2.08;
    text-align: justify;
}

.dggold-leafing__matrix {
    position: relative;
    z-index: 1;
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 15px;
    background: rgba(255,255,255,.035);
    direction: ltr;
}

.dggold-leafing__matrix-head,
.dggold-leafing__matrix-row {
    display: grid;
    grid-template-columns: 1.05fr .8fr 1fr;
    gap: 8px;
    align-items: center;
}

.dggold-leafing__matrix-head {
    padding: 9px 10px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    background: rgba(255,255,255,.045);
}

.dggold-leafing__matrix-head span {
    color: rgba(255,255,255,.47);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}

.dggold-leafing__matrix-row {
    min-height: 43px;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(255,255,255,.055);
}

.dggold-leafing__matrix-row:last-child {
    border-bottom: 0;
}

.dggold-leafing__matrix-row > span {
    color: rgba(255,255,255,.58);
    font-size: 8px;
    font-weight: 800;
}

.dggold-leafing__matrix-row strong {
    color: #ffffff;
    font-size: 9px;
    font-weight: 900;
}

.dggold-leafing__technical-foot {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    direction: ltr;
}

.dggold-leafing__technical-line {
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(225,196,93,.8), rgba(255,255,255,.04));
}

.dggold-leafing__technical-foot span:last-child {
    color: rgba(255,255,255,.40);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .14em;
}

.dggold-leafing__mechanism-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 520px);
    align-items: center;
    gap: 22px;
    margin: 26px 0 18px;
    padding: 18px 22px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.10);
    background:
        linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%),
        linear-gradient(90deg, rgba(225,196,93,.08) 0%, rgba(255,255,255,0) 35%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 16px 34px rgba(5, 25, 18, .14);
    overflow: hidden;
}

.dggold-leafing__mechanism-head::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 8% 50%, rgba(225,196,93,.12) 0%, rgba(225,196,93,0) 26%),
        linear-gradient(90deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,0) 60%);
    pointer-events: none;
}

.dggold-leafing__mechanism-head::after {
    content: "";
    position: absolute;
    top: 16px;
    bottom: 16px;
    right: calc(520px + 11px);
    width: 1px;
    background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.14), rgba(255,255,255,0));
    pointer-events: none;
}

.dggold-leafing__mechanism-head > div {
    position: relative;
    z-index: 1;
    padding-right: 4px;
}

.dggold-leafing__mechanism-head > div > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
    color: #e1c45d;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .20em;
    direction: ltr;
}

.dggold-leafing__mechanism-head > div > span::before {
    content: "";
    width: 26px;
    height: 1px;
    background: linear-gradient(90deg, rgba(225,196,93,.95), rgba(225,196,93,.15));
}

.dggold-leafing__mechanism-head h3 {
    position: relative;
    margin: 0;
    padding-bottom: 10px;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.85;
    font-weight: 900;
}

.dggold-leafing__mechanism-head h3::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 118px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(225,196,93,.95), rgba(44,137,102,.95));
    box-shadow: 0 0 12px rgba(225,196,93,.22);
}

.dggold-leafing__mechanism-head p {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 14px 16px;
    max-width: none;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.08);
    background: linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.025) 100%);
    color: rgba(239,247,242,.82);
    font-size: 12px;
    line-height: 2;
    text-align: justify;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.dggold-leafing__compare {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px;
}

.dggold-leafing__compare-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 22px;
    background: linear-gradient(180deg, #f8faf7 0%, #edf4ef 100%);
    box-shadow: 0 18px 44px rgba(0,0,0,.18);
    transition: transform .38s cubic-bezier(.2,.75,.2,1), box-shadow .38s ease, border-color .38s ease;
}

.dggold-leafing__compare-card:hover {
    transform: translateY(-5px);
    border-color: rgba(225,196,93,.22);
    box-shadow: 0 26px 54px rgba(0,0,0,.25);
}

.dggold-leafing__compare-visual {
    position: relative;
    padding: 12px 12px 0;
}

.dggold-leafing__compare-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1774 / 887;
    border: 1px solid rgba(20,59,47,.08);
    border-radius: 16px;
    background: #ffffff;
}

.dggold-leafing__compare-media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 68%, rgba(7,35,26,.055) 100%);
}

.dggold-leafing__compare-media img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: contain;
    object-position: center;
    transition: transform .62s cubic-bezier(.2,.75,.2,1), filter .62s ease;
    will-change: transform;
}

.dggold-leafing__compare-card:hover .dggold-leafing__compare-media img {
    transform: scale(1.035);
    filter: contrast(1.025) saturate(1.035);
}

.dggold-leafing__compare-mode,
.dggold-leafing__compare-no {
    position: absolute;
    top: 22px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(8,36,25,.70);
    color: #ffffff;
    backdrop-filter: blur(8px);
}

.dggold-leafing__compare-mode {
    left: 22px;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
    direction: ltr;
}

.dggold-leafing__compare-no {
    right: 22px;
    width: 28px;
    justify-content: center;
    border-radius: 9px;
    font-size: 9px;
    font-weight: 900;
}

.dggold-leafing__compare-card--leafing .dggold-leafing__compare-mode {
    color: #ffe161;
}

.dggold-leafing__compare-card--nonleafing .dggold-leafing__compare-mode {
    color: #bfe9d7;
}

.dggold-leafing__compare-body {
    position: relative;
    padding: 14px 16px 16px;
}

.dggold-leafing__compare-body::before {
    content: "";
    position: absolute;
    top: 0;
    right: 16px;
    width: 48px;
    height: 2px;
    border-radius: 999px;
}

.dggold-leafing__compare-card--leafing .dggold-leafing__compare-body::before {
    background: linear-gradient(90deg, #a98629, #e1c45d);
}

.dggold-leafing__compare-card--nonleafing .dggold-leafing__compare-body::before {
    background: linear-gradient(90deg, #1d6c4f, #65ad8a);
}

.dggold-leafing__compare-kicker {
    margin-bottom: 4px;
    color: #708079;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .13em;
    direction: ltr;
}

.dggold-leafing__compare-title {
    margin: 0 0 6px;
    color: #173c30;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dggold-leafing__compare-text {
    margin: 0;
    color: #5c6f67;
    font-size: 13px;
    line-height: 2;
    text-align: justify;
}

.dggold-leafing__specs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 7px;
    margin-top: 11px;
}

.dggold-leafing__specs span {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid rgba(19,59,48,.075);
    border-radius: 11px;
    background: rgba(255,255,255,.58);
    direction: ltr;
    text-align: left;
}

.dggold-leafing__specs small,
.dggold-leafing__specs b {
    display: block;
}

.dggold-leafing__specs small {
    margin-bottom: 2px;
    color: #87948f;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .08em;
}

.dggold-leafing__specs b {
    overflow: hidden;
    color: #244b3b;
    font-size: 9px;
    line-height: 1.55;
    font-weight: 900;
    text-overflow: ellipsis;
}

@media (max-width: 960px) {
    .dggold-leafing__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dggold-leafing__head-code {
        flex: 0 0 auto;
        width: 100%;
    }

    .dggold-leafing__top {
        grid-template-columns: 1fr;
    }

    .dggold-leafing__compare {
        grid-template-columns: 1fr;
    }

    .dggold-leafing__mechanism-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .dggold-leafing__mechanism-head p {
        max-width: none;
    }
}

@media (max-width: 760px) {
    .dggold-leafing {
        padding: 34px 10px 38px;
    }

    .dggold-leafing__title {
        font-size: 18px;
    }

    .dggold-leafing__lead,
    .dggold-leafing__text,
    .dggold-leafing__observation p,
    .dggold-leafing__compare-text {
        font-size: 13px;
    }

    .dggold-leafing__lab,
    .dggold-leafing__technical {
        padding: 13px;
        border-radius: 18px;
    }

    .dggold-leafing__visual-pair {
        grid-template-columns: 1fr;
    }

    .dggold-leafing__visual-frame {
        aspect-ratio: 1.08 / 1;
    }

    .dggold-leafing__observation-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .dggold-leafing__observation-metrics {
        grid-template-columns: 1fr;
    }

    .dggold-leafing__matrix-head,
    .dggold-leafing__matrix-row {
        grid-template-columns: .95fr .78fr 1fr;
    }

    .dggold-leafing__mechanism-head h3,
    .dggold-leafing__compare-title {
        font-size: 16px;
    }

    .dggold-leafing__compare-visual {
        padding: 10px 10px 0;
    }

    .dggold-leafing__compare-mode {
        left: 19px;
        top: 19px;
    }

    .dggold-leafing__compare-no {
        right: 19px;
        top: 19px;
    }

    .dggold-leafing__compare-body {
        padding: 13px 14px 14px;
    }

    .dggold-leafing__specs {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dggold-leafing__visual,
    .dggold-leafing__visual-frame img,
    .dggold-leafing__compare-card,
    .dggold-leafing__compare-media img {
        transition: none;
    }
}

/* END — GOLDEN METALLIC LEAFING SIGNATURE v1.7.66 */


/* =========================================================
   DGCHEME — Golden Metallic Product Explorer / Pale Gold
   Reuses native Product Explorer + Viewer architecture
   v1.7.69
========================================================= */

.dgproduct-explorer--golden {
    --dgpe-ink: #20342b;
    --dgpe-muted: #6c776f;
    --dgpe-line: #e7e3d4;
    --dgpe-soft: #fbfaf4;
    --dgpe-dark: #0c241b;
    --dgpe-dark-2: #15372a;
    --dgpe-glow: #eec404;
    --dgpe-glow-soft: #f7df70;
    --dgpe-gold: #eec404;
    background:
        radial-gradient(circle at 94% 4%, rgba(238,196,4,.085), transparent 22%),
        linear-gradient(180deg, #fff 0%, #fcfcf8 100%);
}

.dgproduct-explorer--golden .dgproduct-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-color: #e9e4d1;
    background: #f7f5ec;
}

.dgproduct-explorer--golden .dgproduct-tabs__tab.is-active {
    box-shadow: 0 8px 22px rgba(92,72,11,.08), inset 0 -2px 0 #eec404;
}

.dgproduct-explorer--golden .dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--golden .dgproduct-mobile-select__option.is-active span {
    color: #a68000;
}

.dgproduct-explorer--golden .dgproduct-mobile-select__option:hover,
.dgproduct-explorer--golden .dgproduct-mobile-select__option.is-active {
    background: #fff8d8;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider {
    min-height: 88px;
    color: #263027;
    background:
        linear-gradient(270deg, #eec404 0%, #f4d844 28%, #faefb2 62%, #ffffff 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.58), 0 12px 28px rgba(133,101,0,.08);
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider::after {
    height: 2px;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(164,126,0,.56), rgba(255,255,255,0));
    box-shadow: none;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__index {
    border-color: rgba(56,48,12,.12);
    background: rgba(255,255,255,.34);
    color: #4f430e;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__micro,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__subtitle,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__latin span,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__latin em {
    color: rgba(39,44,35,.62);
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider h3,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__latin strong {
    color: #263027;
}

.dgproduct-explorer--golden .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 2px;
    direction: ltr;
    font-size: 7px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgproduct-explorer--golden .dgproduct-family-intro {
    border-color: #e8e2cf;
    box-shadow: 0 14px 34px rgba(83,66,14,.055);
}

.dgproduct-explorer--golden .dgproduct-family-intro__visual {
    background: linear-gradient(145deg, #f7f1d7 0%, #e9ddaa 100%);
}

.dgproduct-explorer--golden .dgproduct-family-intro__visual > img {
    object-fit: cover;
    transition: transform .58s cubic-bezier(.2,.75,.2,1), filter .4s ease;
}

.dgproduct-explorer--golden .dgproduct-family-intro__visual:hover > img {
    transform: scale(1.035);
    filter: saturate(1.04) contrast(1.02);
}

.dgproduct-explorer--golden .dgproduct-family-intro__visual::after {
    background: linear-gradient(180deg, rgba(28,26,13,0) 52%, rgba(43,35,8,.68));
}

.dgproduct-explorer--golden .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.24);
    background: rgba(42,34,8,.70);
}

.dgproduct-explorer--golden .dgproduct-family-intro__badge strong {
    color: #ffe86a;
}

.dgproduct-explorer--golden .dgproduct-family-intro__points li::before {
    background: #eec404;
    box-shadow: 0 0 0 4px #fff7cf;
}

.dgproduct-explorer--golden .dgproduct-products-head::after {
    background: linear-gradient(90deg, transparent 0, #e5dfc8 16%, #e5dfc8 84%, transparent 100%);
}

.dgproduct-explorer--golden .dgproduct-grid--pale {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.dgproduct-explorer--golden .dgproduct-card {
    border-color: #e4e0d2;
    background: linear-gradient(180deg, #ffffff 0%, #fdfcf8 100%);
    box-shadow: 0 12px 34px rgba(72,57,14,.05), 0 2px 8px rgba(72,57,14,.025);
}

.dgproduct-explorer--golden .dgproduct-card::before {
    background: linear-gradient(90deg, transparent, #eec404, transparent);
    box-shadow: 0 0 18px rgba(238,196,4,.36);
}

.dgproduct-explorer--golden .dgproduct-card:hover,
.dgproduct-explorer--golden .dgproduct-card:focus-visible {
    border-color: #d9cfaa;
    box-shadow: 0 22px 52px rgba(78,60,6,.10), 0 5px 16px rgba(78,60,6,.045);
}

.dgproduct-explorer--golden .dgproduct-card__media {
    background: #f3edd5;
}

.dgproduct-explorer--golden .dgproduct-card__media::after {
    background: linear-gradient(180deg, rgba(38,31,7,.01) 55%, rgba(38,31,7,.42) 100%);
}

.dgproduct-explorer--golden .dgproduct-card__night {
    object-fit: cover;
}

.dgproduct-explorer--golden .dgproduct-card__series {
    border-color: rgba(255,230,94,.25);
    background: rgba(35,29,7,.72);
    color: #ffe768;
}

.dgproduct-explorer--golden .dgproduct-card__night-badge i {
    background: #eec404;
    box-shadow: 0 0 10px rgba(238,196,4,.9);
}

.dgproduct-explorer--golden .dgproduct-card__open {
    background: rgba(35,29,7,.62);
}

.dgproduct-explorer--golden .dgproduct-card:hover .dgproduct-card__open,
.dgproduct-explorer--golden .dgproduct-card:focus-visible .dgproduct-card__open {
    border-color: rgba(255,228,77,.32);
    color: #fff2a0;
}

.dgproduct-explorer--golden .dgproduct-card__glow-name {
    border-color: #eee4b8;
    background: #fff9dc;
    color: #756013;
}

.dgproduct-explorer--golden .dgproduct-card__glow-name i {
    background: #eec404;
    box-shadow: 0 0 0 3px rgba(238,196,4,.14);
}

.dgproduct-explorer--golden .dgproduct-card__quick-specs > span {
    border-color: #ece7d8;
    background: linear-gradient(180deg, #fffef9, #faf8ef);
}

.dgproduct-explorer--golden .dgproduct-card__footer svg {
    fill: #b28e00;
}

.dgproduct-explorer--golden .dgproduct-family-placeholder {
    border-color: #e0d9bc;
    background: #fffdf5;
}

.dgproduct-explorer--golden .dgproduct-viewer__dialog {
    background:
        radial-gradient(circle at 78% 18%, rgba(238,196,4,.10), transparent 30%),
        linear-gradient(145deg, rgba(22,32,27,.99), rgba(10,17,13,.99));
}

.dgproduct-explorer--golden .dgproduct-viewer__dialog::before {
    background: linear-gradient(90deg, transparent, rgba(238,196,4,.72), transparent);
    box-shadow: 0 0 20px rgba(238,196,4,.22);
}

.dgproduct-explorer--golden .dgproduct-viewer__product-id > span,
.dgproduct-explorer--golden .dgproduct-viewer__media-footer strong {
    color: #f0d659;
}

.dgproduct-explorer--golden .dgproduct-viewer__thumb.is-active {
    border-color: rgba(238,196,4,.72);
    box-shadow: 0 0 0 2px rgba(238,196,4,.12);
}

@media (max-width: 1100px) {
    .dgproduct-explorer--golden .dgproduct-grid--pale {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--golden .dgproduct-tabs {
        display: none;
    }

    .dgproduct-explorer--golden .dgproduct-mobile-select {
        display: block;
    }

    .dgproduct-explorer--golden .dgproduct-grid--pale {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dgproduct-explorer--golden .dgproduct-family-intro {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
    }

    .dgproduct-explorer--golden .dgproduct-family-intro__visual,
    .dgproduct-explorer--golden .dgproduct-family-intro__visual > img {
        min-height: 280px;
    }
}
/* END — Golden Metallic Product Explorer / Pale Gold v1.7.69 */

/* =========================================================
   DGCHEME — Golden Metallic / Pale Gold Family Banner Alignment
   v1.7.70
   Match Product Explorer family-banner hierarchy:
   Persian identity on the right; English meta + index on the left.
========================================================= */

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider {
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__meta,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    flex: 0 0 auto;
    min-width: 260px;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__index {
    order: 1;
    flex: 0 0 auto;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__latin {
    order: 2;
    direction: ltr;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    margin: 0;
    padding: 8px 4px 8px 24px;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy h3,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__title-text,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__title-code {
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    text-align: right;
}

@media (max-width: 680px) {
    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 14px;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        justify-content: flex-end;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy {
        width: 100%;
        padding: 0;
    }
}

/* =========================================================
   DGCHEME — Golden Metallic / Pale Gold Family Banner Fine Alignment
   v1.7.71
   Match phosphorescent family banner: Persian identity flush-right,
   strong English subtitle directly beneath it.
========================================================= */

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__identity {
    direction: ltr;
    justify-content: flex-end;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: 0;
    padding: 8px 4px 8px 24px;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy h3 {
    margin: 0 0 6px;
    direction: rtl;
    text-align: right;
    font-weight: 900;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    text-align: right;
    color: rgba(38,48,39,.88);
    font-size: 16px;
    font-weight: 850;
    line-height: 1.55;
    letter-spacing: 0;
}

@media (max-width: 900px) {
    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__subtitle {
        font-size: 14px;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__identity {
        direction: ltr;
        justify-content: flex-end;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="pale"] .dgproduct-family-divider__copy {
        margin: 0;
        padding: 0;
    }
}


/* =========================================================
   DGCHEME — Golden Metallic / Rich Pale Gold Family Banner
   v1.7.73
   Exact approved Pale Gold / Phosphorescent alignment:
   Persian identity flush-right; index + English meta flush-left.
   ========================================================= */
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 108px;
    overflow: hidden;
    border: 1px solid rgba(238,196,4,.34);
    background: linear-gradient(270deg, #EEC404 0%, #f7df63 30%, #fff7c7 68%, #ffffff 100%);
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(110deg, rgba(255,255,255,.46), rgba(255,255,255,0) 40%);
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__meta,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    flex: 0 0 auto;
    min-width: 300px;
    padding: 18px 14px 18px 20px;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__index {
    order: 1;
    flex: 0 0 auto;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__latin {
    order: 2;
    min-width: 0;
    direction: ltr;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    direction: ltr;
    padding: 18px 20px;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__copy {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: 0;
    padding: 8px 4px 8px 24px;
    display: block;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__copy h3,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__title-text,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__title-code {
    margin: 0;
    direction: rtl;
    text-align: right;
    font-weight: 900;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__copy h3 {
    margin-bottom: 6px;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__subtitle {
    display: block;
    width: 100%;
    margin: 0;
    direction: ltr;
    text-align: right;
    color: rgba(38,48,39,.88);
    font-size: 16px;
    font-weight: 850;
    line-height: 1.55;
    letter-spacing: 0;
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__micro,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__latin span,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__latin em {
    color: rgba(29,41,32,.60);
}

.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider h3,
.dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__latin strong {
    color: #1d2920;
}

@media (max-width: 900px) {
    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__subtitle {
        font-size: 14px;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 14px;
        min-height: 0;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        justify-content: flex-end;
        padding: 16px 16px 8px;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
        padding: 8px 16px 16px;
    }

    .dgproduct-explorer--golden .dgproduct-family-panel[data-dgproduct-family="rich-pale"] .dgproduct-family-divider__copy {
        width: 100%;
        margin: 0;
        padding: 0;
    }
}
/* END — Golden Metallic / Rich Pale Gold Family Banner v1.7.73 */


/* =========================================================
   DGCHEME — Golden Metallic Product Family Banner Geometry Lock
   v1.7.74
   One shared banner system for every Golden Metallic tab.
   Prevents per-family height/alignment/index drift.
========================================================= */
@media (min-width: 681px) {
    .dgproduct-explorer--golden .dgproduct-family-divider {
        width: 100%;
        height: 116px;
        min-height: 116px;
        box-sizing: border-box;
        padding: 17px 20px;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;
        min-width: 300px;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__index {
        order: 1;
        display: grid;
        place-items: center;
        flex: 0 0 50px;
        width: 50px;
        height: 50px;
        box-sizing: border-box;
        border: 1px solid rgba(56,48,12,.12);
        border-radius: 14px;
        background: rgba(255,255,255,.38);
        color: #4f430e;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
        direction: ltr;
        font-size: 14px;
        font-weight: 900;
        line-height: 1;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__copy {
        width: min(760px, 100%);
        margin-left: auto;
        margin-right: 0;
        padding: 0;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__copy h3 {
        margin: 0 0 6px;
        direction: rtl;
        text-align: right;
        font-size: 16px;
        font-weight: 900;
        line-height: 1.8;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__subtitle {
        display: block;
        width: 100%;
        margin: 0;
        direction: ltr;
        text-align: right;
        color: rgba(38,48,39,.88);
        font-size: 16px;
        font-weight: 850;
        line-height: 1.55;
        letter-spacing: 0;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--golden .dgproduct-family-divider {
        width: 100%;
        height: auto;
        min-height: 0;
        box-sizing: border-box;
    }

    .dgproduct-explorer--golden .dgproduct-family-divider__index {
        border-color: rgba(56,48,12,.12);
        background: rgba(255,255,255,.38);
        color: #4f430e;
    }
}
/* END — Golden Metallic Product Family Banner Geometry Lock v1.7.74 */

/* =========================================================
   DGCHEME — Golden Metallic Family Banner Shadow Lock
   v1.7.75
   One shared shadow for every Golden Metallic family banner.
   Uses matching specificity so older family overrides cannot
   make one tab flatter than the others.
========================================================= */
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family]
.dgproduct-family-divider {
    box-shadow:
        0 14px 30px rgba(11, 21, 16, .18),
        inset 0 1px 0 rgba(255,255,255,.58);
}

@media (max-width: 680px) {
    .dgproduct-explorer--golden
    .dgproduct-family-panel[data-dgproduct-family]
    .dgproduct-family-divider {
        box-shadow:
            0 10px 24px rgba(11, 21, 16, .14),
            inset 0 1px 0 rgba(255,255,255,.52);
    }
}
/* END — Golden Metallic Family Banner Shadow Lock v1.7.75 */

/* =========================================================
   DGCHEME — Golden Metallic / Rich Gold Family Accent
   v1.7.76
   Green-shifted brass/gold surface for Rich Gold.
   Shared geometry, index badge, RTL alignment and shadow remain locked globally.
========================================================= */
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(184,170,22,.38);
    background: linear-gradient(270deg, #B8AA16 0%, #D9CE65 30%, #F4F0C5 68%, #FFFFFF 100%);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(110deg, rgba(255,255,255,.48), rgba(255,255,255,0) 40%);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__meta,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__latin span,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__latin em {
    color: rgba(29,41,32,.62);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider h3,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="rich-gold"]
.dgproduct-family-divider__latin strong {
    color: #1D2920;
}
/* END — Golden Metallic / Rich Gold Family Accent v1.7.76 */



/* =========================================================
   DGCHEME — Golden Metallic / Special Gold Family Accent
   v1.7.77
   Oxidized gold / Ducat Gold surface for Special Gold series.
========================================================= */
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(196,105,0,.34);
    background: linear-gradient(270deg, #C46900 0%, #D98A2C 24%, #E8B66F 48%, #F3DEC0 74%, #FFFFFF 100%);
    box-shadow: 0 20px 38px rgba(196,105,0,.10);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(115deg, rgba(255,255,255,.42), rgba(255,255,255,0) 42%);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__meta,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__subtitle,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__latin span,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__latin em {
    color: rgba(44,34,18,.62);
}

.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider h3,
.dgproduct-explorer--golden
.dgproduct-family-panel[data-dgproduct-family="special-gold"]
.dgproduct-family-divider__latin strong {
    color: #2C2212;
}

.dgproduct-explorer--golden .dgproduct-grid--special-gold {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1200px) {
    .dgproduct-explorer--golden .dgproduct-grid--special-gold {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .dgproduct-explorer--golden .dgproduct-grid--special-gold {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .dgproduct-explorer--golden .dgproduct-grid--special-gold {
        grid-template-columns: 1fr;
    }
}
/* END — Golden Metallic / Special Gold Family Accent v1.7.77 */

/* =========================================================
   DGCHEME — SILVER METALLIC INTRO
   post 4432 / silver-metallic-pigments
   v1.7.78
   Signature intro aligned with Golden Metallic composition.
========================================================= */
.postid-4432 .dg-article__header {
    display: none;
}

.dgsilver-intro,
.dgsilver-intro * {
    box-sizing: border-box;
}

.dgsilver-intro {
    position: relative;
    width: 100%;
    padding: 48px 20px 54px;
    overflow: hidden;
    background:
        radial-gradient(circle at 5% 100%, rgba(62, 108, 89, .055), transparent 25%),
        radial-gradient(circle at 96% 4%, rgba(148, 163, 157, .08), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgsilver-intro::after {
    content: "";
    position: absolute;
    left: -92px;
    bottom: -132px;
    width: 260px;
    height: 260px;
    border: 1px solid rgba(142, 160, 153, .14);
    border-radius: 50%;
    box-shadow:
        0 0 0 38px rgba(142, 160, 153, .032),
        0 0 0 76px rgba(18, 91, 68, .018);
    pointer-events: none;
}

.dgsilver-intro__inner {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgsilver-intro__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 346px;
    gap: 18px;
    align-items: stretch;
    direction: ltr;
}

.dgsilver-intro__copy,
.dgsilver-intro__profile {
    min-width: 0;
    direction: rtl;
    grid-row: 1;
}

.dgsilver-intro__copy {
    grid-column: 1;
    position: relative;
    padding: 30px 30px 28px;
    border: 1px solid #dce5e1;
    border-radius: 20px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 14px 38px rgba(23, 50, 40, .06);
}

.dgsilver-intro__copy::before {
    content: "";
    position: absolute;
    top: 0;
    right: 84px;
    width: 64px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #174d3a 0%, #b8c4bf 100%);
}

.dgsilver-intro__copy p {
    margin: 0;
    color: #51645d;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.22;
    text-align: justify;
    text-align-last: right;
}

.dgsilver-intro__copy p + p {
    margin-top: 22px;
}

.dgsilver-intro__copy a {
    color: #174d3a;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid rgba(23,77,58,.25);
}

.dgsilver-intro__copy a:hover,
.dgsilver-intro__copy a:focus-visible {
    color: #59746a;
    border-bottom-color: currentColor;
}

.dgsilver-intro__profile {
    grid-column: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 560px;
    padding: 34px 26px 26px;
    overflow: hidden;
    border-radius: 19px;
    color: #fff;
    background:
        radial-gradient(circle at 13% 12%, rgba(210, 221, 216, .07), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(153, 174, 165, .055), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
    box-shadow: 0 18px 44px rgba(11, 56, 42, .14);
}

.dgsilver-intro__profile::before {
    content: "";
    position: absolute;
    left: -84px;
    bottom: -82px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(192, 207, 201, .18);
    border-radius: 50%;
    box-shadow: 0 0 0 35px rgba(192, 207, 201, .025);
    pointer-events: none;
}

.dgsilver-intro__eyebrow {
    display: grid;
    grid-template-columns: auto minmax(26px, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    direction: ltr;
    color: #cbd8d2;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.dgsilver-intro__eyebrow::after {
    content: "";
    height: 1px;
    background: linear-gradient(90deg, #cbd8d2, rgba(203,216,210,.06));
}

.dgsilver-intro__title {
    margin: 0 0 26px;
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.8;
    text-align: right;
}

.dgsilver-intro__tech {
    position: relative;
    padding: 17px 16px 15px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dgsilver-intro__tech-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    direction: ltr;
}

.dgsilver-intro__tech-head strong,
.dgsilver-intro__tech-head span {
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsilver-intro__tech-head strong {
    color: #d4dfda;
}

.dgsilver-intro__tech-head span {
    color: rgba(255,255,255,.38);
}

.dgsilver-intro__formula {
    display: grid;
    grid-template-columns: auto 24px auto 24px auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 24px 0 20px;
    direction: ltr;
}

.dgsilver-intro__formula strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 32px;
    padding: 7px 9px;
    border: 1px solid rgba(202, 216, 210, .34);
    border-radius: 6px;
    background: rgba(202, 216, 210, .06);
    color: #e4ece8;
    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
}

.dgsilver-intro__formula strong:last-of-type {
    min-width: 82px;
}

.dgsilver-intro__formula i {
    position: relative;
    display: block;
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, rgba(203,216,210,.36), #cbd8d2);
}

.dgsilver-intro__formula i::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #cbd8d2;
    border-right: 1px solid #cbd8d2;
    transform: translateY(-50%) rotate(45deg);
}

.dgsilver-intro__formula-caption {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: -6px;
    padding-bottom: 15px;
    color: rgba(255,255,255,.45);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
}

.dgsilver-intro__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

.dgsilver-intro__spec {
    min-width: 0;
    min-height: 54px;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 9px;
    background: rgba(255,255,255,.022);
    direction: ltr;
}

.dgsilver-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #cbd8d2;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .07em;
}

.dgsilver-intro__spec strong {
    display: block;
    color: rgba(255,255,255,.76);
    font-size: 8px;
    font-weight: 700;
    line-height: 1.55;
}

.dgsilver-intro__tags {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 28px;
    direction: ltr;
}

.dgsilver-intro__tags span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: rgba(255,255,255,.66);
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .dgsilver-intro {
        padding: 38px 16px 44px;
    }

    .dgsilver-intro__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsilver-intro__profile {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
    }

    .dgsilver-intro__copy {
        grid-column: 1;
        grid-row: 2;
    }

    .dgsilver-intro__tags {
        margin-top: 26px;
    }
}

@media (max-width: 560px) {
    .dgsilver-intro {
        padding: 30px 12px 36px;
    }

    .dgsilver-intro__profile {
        padding: 26px 18px 20px;
        border-radius: 16px;
    }

    .dgsilver-intro__title {
        margin-bottom: 20px;
        font-size: 20px;
    }

    .dgsilver-intro__copy {
        padding: 23px 20px 21px;
        border-radius: 16px;
    }

    .dgsilver-intro__copy::before {
        right: 20px;
    }

    .dgsilver-intro__copy p {
        font-size: 13px;
        line-height: 2.08;
    }

    .dgsilver-intro__formula {
        grid-template-columns: 1fr auto 1fr;
        gap: 7px;
        padding: 20px 0 16px;
    }

    .dgsilver-intro__formula strong:last-of-type {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, 160px);
        margin-top: 7px;
    }

    .dgsilver-intro__formula i:last-of-type {
        display: none;
    }

    .dgsilver-intro__formula-caption {
        justify-content: center;
        text-align: center;
    }

    .dgsilver-intro__specs {
        grid-template-columns: 1fr;
    }
}
/* END — SILVER METALLIC INTRO v1.7.78 */

/* =========================================================
   DGCHEME — Silver Metallic Intro / Profile Note
   v1.7.79
========================================================= */
.dgsilver-intro__profile-copy {
    position: relative;
    z-index: 1;
    margin-top: 18px;
    padding: 14px 15px 13px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.018));
}

.dgsilver-intro__profile-copy p {
    margin: 0;
    color: rgba(236,244,240,.70);
    font-size: 13px;
    font-weight: 400;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgsilver-intro__profile-copy strong {
    color: #ffffff;
    font-weight: 800;
}

@media (max-width: 900px) {
    .dgsilver-intro__profile-copy {
        margin-top: 14px;
    }
}
/* END — Silver Metallic Intro / Profile Note v1.7.79 */

/* =========================================================
   DGCHEME — Silver Metallic / Light Reflection Trio
   v1.7.80
   Alternating dark-green section — premium comparison cards
   Typography lock: H2 18 / H3 16 / body 13
========================================================= */
.dgsilver-reflect {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 66px 18px 72px;
    background:
        radial-gradient(circle at 13% 12%, rgba(214,231,224,.075), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(139,173,193,.055), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsilver-reflect::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: .24;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size: 42px 42px;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), transparent 92%);
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), transparent 92%);
}

.dgsilver-reflect::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    left: -210px;
    bottom: -330px;
    z-index: -1;
    border: 1px solid rgba(220,236,229,.07);
    border-radius: 50%;
    box-shadow:
        0 0 0 72px rgba(220,236,229,.018),
        0 0 0 144px rgba(220,236,229,.012);
    pointer-events: none;
}

.dgsilver-reflect__inner {
    width: min(1180px, 100%);
    margin: 0 auto;
}

.dgsilver-reflect__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 218px;
    align-items: end;
    gap: 34px;
    margin-bottom: 25px;
}

.dgsilver-reflect__copy {
    min-width: 0;
    text-align: right;
}

.dgsilver-reflect__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
    color: rgba(206,230,218,.78);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: .16em;
    direction: ltr;
}

.dgsilver-reflect__eyebrow::before {
    content: "";
    width: 24px;
    height: 1px;
    background: rgba(206,230,218,.42);
}

.dgsilver-reflect__title {
    margin: 0 0 8px;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.85;
}

.dgsilver-reflect__lead {
    width: min(790px, 100%);
    margin: 0;
    color: rgba(229,240,235,.74);
    font-size: 13px;
    font-weight: 400;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgsilver-reflect__index {
    position: relative;
    overflow: hidden;
    min-height: 78px;
    padding: 15px 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.026));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
    direction: ltr;
    text-align: left;
}

.dgsilver-reflect__index::after {
    content: "";
    position: absolute;
    width: 52px;
    height: 52px;
    left: -15px;
    bottom: -20px;
    border: 1px solid rgba(229,240,235,.10);
    border-radius: 50%;
}

.dgsilver-reflect__index small,
.dgsilver-reflect__index span,
.dgsilver-reflect__index strong {
    display: block;
}

.dgsilver-reflect__index small {
    margin-bottom: 5px;
    color: rgba(200,223,212,.58);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .14em;
}

.dgsilver-reflect__index strong {
    color: #fff;
    font-size: 16px;
    line-height: 1;
    font-weight: 900;
}

.dgsilver-reflect__index span {
    margin-top: 6px;
    color: rgba(220,236,229,.66);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .11em;
}

.dgsilver-reflect__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.dgsilver-reflect__card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(244,248,246,.98));
    box-shadow:
        0 22px 44px rgba(0,0,0,.17),
        inset 0 1px 0 rgba(255,255,255,.95);
    transition: transform .32s ease, box-shadow .32s ease, border-color .32s ease;
}

.dgsilver-reflect__card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    z-index: 3;
    background: linear-gradient(90deg, transparent, rgba(143,158,151,.82), transparent);
}

.dgsilver-reflect__card:hover {
    transform: translateY(-5px);
    border-color: rgba(255,255,255,.22);
    box-shadow:
        0 28px 54px rgba(0,0,0,.23),
        inset 0 1px 0 rgba(255,255,255,.98);
}

.dgsilver-reflect__card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 48px;
    padding: 10px 12px 9px;
    border-bottom: 1px solid rgba(18,55,40,.08);
}

.dgsilver-reflect__type {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #224437;
    font-size: 8px;
    font-weight: 900;
    line-height: 1.4;
    letter-spacing: .12em;
    direction: ltr;
}

.dgsilver-reflect__type::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #7e9489;
    box-shadow: 0 0 0 4px rgba(126,148,137,.11);
}

.dgsilver-reflect__card--metallic .dgsilver-reflect__type::before {
    background: #b69336;
    box-shadow: 0 0 0 4px rgba(182,147,54,.12);
}

.dgsilver-reflect__card--pearlescent .dgsilver-reflect__type::before {
    background: #6caeb0;
    box-shadow: 0 0 0 4px rgba(108,174,176,.12);
}

.dgsilver-reflect__no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 26px;
    flex: 0 0 auto;
    border: 1px solid rgba(21,63,45,.11);
    border-radius: 8px;
    background: #f5f8f6;
    color: #173e2f;
    font-size: 10px;
    font-weight: 900;
    direction: ltr;
}

.dgsilver-reflect__media {
    position: relative;
    overflow: hidden;
    margin: 10px 10px 0;
    border: 1px solid rgba(18,55,40,.08);
    border-radius: 13px;
    background: #0d1b22;
}

.dgsilver-reflect__media img {
    display: block;
    width: 100%;
    aspect-ratio: 380 / 201;
    object-fit: cover;
    transition: transform .45s ease, filter .45s ease;
}

.dgsilver-reflect__card:hover .dgsilver-reflect__media img {
    transform: scale(1.025);
    filter: saturate(1.04) contrast(1.025);
}

.dgsilver-reflect__media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 28%;
    pointer-events: none;
    background: linear-gradient(to top, rgba(5,22,16,.22), transparent);
}

.dgsilver-reflect__body {
    padding: 16px 16px 15px;
}

.dgsilver-reflect__card-title {
    margin: 0 0 8px;
    color: #123929;
    font-size: 16px;
    font-weight: 900;
    line-height: 1.85;
    text-align: right;
}

.dgsilver-reflect__text {
    margin: 0;
    color: #607168;
    font-size: 13px;
    font-weight: 400;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgsilver-reflect__foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid rgba(18,55,40,.08);
    direction: ltr;
}

.dgsilver-reflect__foot span {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 0 9px;
    border: 1px solid rgba(28,69,52,.10);
    border-radius: 999px;
    background: #eef5f1;
    color: #36594a;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.35;
    white-space: nowrap;
}

.dgsilver-reflect__card--metallic .dgsilver-reflect__foot span:first-child {
    background: #fff8e8;
    border-color: rgba(182,147,54,.18);
    color: #745d20;
}

.dgsilver-reflect__card--pearlescent .dgsilver-reflect__foot span:first-child {
    background: #edf9f9;
    border-color: rgba(108,174,176,.18);
    color: #3e7577;
}

@media (max-width: 980px) {
    .dgsilver-reflect {
        padding: 54px 16px 60px;
    }

    .dgsilver-reflect__head {
        grid-template-columns: 1fr 190px;
        gap: 22px;
    }

    .dgsilver-reflect__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsilver-reflect__card {
        display: grid;
        grid-template-columns: minmax(260px, .85fr) minmax(0, 1.15fr);
    }

    .dgsilver-reflect__card-head {
        grid-column: 1 / -1;
    }

    .dgsilver-reflect__media {
        margin: 10px 0 10px 10px;
        align-self: stretch;
    }

    .dgsilver-reflect__media img {
        height: 100%;
        min-height: 215px;
        aspect-ratio: auto;
    }

    .dgsilver-reflect__body {
        align-self: center;
    }
}

@media (max-width: 680px) {
    .dgsilver-reflect {
        padding: 44px 12px 48px;
    }

    .dgsilver-reflect__head {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .dgsilver-reflect__copy {
        grid-row: 1;
    }

    .dgsilver-reflect__index {
        grid-row: 2;
        width: min(100%, 220px);
        min-height: 70px;
    }

    .dgsilver-reflect__card {
        display: block;
        border-radius: 16px;
    }

    .dgsilver-reflect__media {
        margin: 9px 9px 0;
    }

    .dgsilver-reflect__media img {
        height: auto;
        min-height: 0;
        aspect-ratio: 380 / 201;
    }

    .dgsilver-reflect__body {
        padding: 15px 15px 14px;
    }

    .dgsilver-reflect__title {
        font-size: 18px;
    }

    .dgsilver-reflect__card-title {
        font-size: 16px;
    }

    .dgsilver-reflect__lead,
    .dgsilver-reflect__text {
        font-size: 13px;
    }
}
/* END — Silver Metallic / Light Reflection Trio v1.7.80 */



/* =========================================================
   DGCHEME — SILVER METALLIC / MORPHOLOGY SECTION
   v1.7.81
========================================================= */
.dgsilver-morph {
    position: relative;
    padding: 74px 0;
    background:
        radial-gradient(circle at 12% 16%, rgba(29, 92, 66, .035) 0%, rgba(29, 92, 66, 0) 18%),
        radial-gradient(circle at 86% 82%, rgba(37, 111, 81, .04) 0%, rgba(37, 111, 81, 0) 21%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
    overflow: hidden;
}

.dgsilver-morph__inner {
    width: min(1280px, calc(100% - 32px));
    margin: 0 auto;
}

.dgsilver-morph__shell {
    position: relative;
    padding: 28px;
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(250,252,251,.96) 100%);
    border: 1px solid rgba(23, 72, 52, .08);
    box-shadow: 0 24px 60px rgba(13, 39, 28, .08), inset 0 1px 0 rgba(255,255,255,.9);
}

.dgsilver-morph__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 248px;
    gap: 28px;
    align-items: start;
    margin-bottom: 28px;
}

.dgsilver-morph__copy {
    text-align: right;
}

.dgsilver-morph__eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: #547163;
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .16em;
}

.dgsilver-morph__title {
    margin: 0 0 10px;
    color: #123b2b;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsilver-morph__lead,
.dgsilver-morph__lead p {
    margin: 0;
    color: #4b6458;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
}

.dgsilver-morph__lead p + p {
    margin-top: 10px;
}

.dgsilver-morph__meta {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 12px;
    align-self: start;
gap: 12px;
    align-self: start;
    padding: 20px 18px;
    border-radius: 20px;
    background: linear-gradient(145deg, #f0f4f2 0%, #e7efea 100%);
    border: 1px solid rgba(18, 59, 43, .08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}

.dgsilver-morph__meta span {
    display: block;
    color: #6d8478;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .18em;
}

.dgsilver-morph__meta strong {
    display: block;
    margin-top: 10px;
    color: #133c2c;
    font-size: 14px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsilver-morph__meta em {
    display: block;
    margin-top: auto;
    padding-top: 18px;
    color: #6b8276;
    font-size: 11px;
    line-height: 1.8;
    font-style: normal;
    font-weight: 700;
}

.dgsilver-morph__meta-list {
    display: grid;
    gap: 8px;
    margin-top: 2px;
}

.dgsilver-morph__meta-list span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.52);
    border: 1px solid rgba(18, 59, 43, .08);
    color: #355447;
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .02em;
}

.dgsilver-morph__meta-list span b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    color: #113b2b;
    font-size: 10px;
    font-weight: 900;
    flex: 0 0 20px;
    box-shadow: 0 4px 10px rgba(17, 59, 43, .08);
}

.dgsilver-morph__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.dgsilver-morph__card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    border-radius: 24px;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfb 100%);
    border: 1px solid rgba(18, 59, 43, .09);
    box-shadow: 0 20px 44px rgba(17, 50, 36, .08), inset 0 1px 0 rgba(255,255,255,.92);
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.dgsilver-morph__card:hover {
    transform: translateY(-8px);
    box-shadow: 0 28px 56px rgba(17, 50, 36, .14), inset 0 1px 0 rgba(255,255,255,.95);
    border-color: rgba(18, 59, 43, .16);
}

.dgsilver-morph__media {
    position: relative;
    padding: 12px 12px 0;
}

.dgsilver-morph__image-frame {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #eef3f0;
}

.dgsilver-morph__image-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 30%, rgba(9,22,16,.06) 100%);
    pointer-events: none;
}

.dgsilver-morph__media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    transition: transform .55s ease;
}

.dgsilver-morph__card:hover .dgsilver-morph__media img {
    transform: scale(1.045);
}

.dgsilver-morph__badge {
    position: absolute;
    top: 28px;
    left: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: rgba(255,255,255,.92);
    color: #123b2b;
    font-size: 13px;
    font-weight: 900;
    box-shadow: 0 12px 22px rgba(8, 25, 17, .12);
    z-index: 2;
}

.dgsilver-morph__kicker {
    position: absolute;
    right: 28px;
    top: 28px;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    backdrop-filter: blur(8px);
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
    box-shadow: 0 12px 22px rgba(8, 25, 17, .10);
    z-index: 2;
}

.dgsilver-morph__body {
    display: flex;
    flex-direction: column;
    padding: 18px 20px 20px;
    flex: 1;
}

.dgsilver-morph__card-title {
    margin: 0 0 10px;
    color: #123b2b;
    font-size: 16px;
    line-height: 1.95;
    font-weight: 900;
    text-align: right;
}

.dgsilver-morph__text {
    margin: 0;
    color: #52665b;
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
}

.dgsilver-morph__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(18, 59, 43, .08);
}

.dgsilver-morph__specs span {
    display: block;
    padding: 10px 12px;
    border-radius: 14px;
    background: #f2f6f4;
    border: 1px solid rgba(18, 59, 43, .08);
}

.dgsilver-morph__specs small {
    display: block;
    margin-bottom: 4px;
    color: #70857a;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .16em;
}

.dgsilver-morph__specs b {
    display: block;
    color: #173f2f;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 800;
}

.dgsilver-morph__card--cornflake .dgsilver-morph__kicker {
    color: #355c4b;
    background: rgba(237, 244, 240, .94);
    border: 1px solid rgba(53, 92, 75, .18);
}

.dgsilver-morph__card--silverdollar .dgsilver-morph__kicker {
    color: #1d5568;
    background: rgba(231, 246, 250, .94);
    border: 1px solid rgba(47, 135, 157, .18);
}

.dgsilver-morph__card--vmp .dgsilver-morph__kicker {
    color: #66511b;
    background: rgba(249, 244, 220, .94);
    border: 1px solid rgba(196, 160, 51, .22);
}

@media (max-width: 1100px) {
    .dgsilver-morph__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .dgsilver-morph__head {
        grid-template-columns: 1fr;
    }
    .dgsilver-morph__meta {
        max-width: 280px;
        width: 100%;
    }
}

@media (max-width: 640px) {
    .dgsilver-morph {
        padding: 48px 0;
    }
    .dgsilver-morph__inner {
        width: min(100%, calc(100% - 20px));
    }
    .dgsilver-morph__shell {
        padding: 18px;
        border-radius: 22px;
    }
    .dgsilver-morph__title {
        font-size: 18px;
    }
    .dgsilver-morph__badge {
        top: 22px;
        left: 22px;
        width: 38px;
        height: 38px;
        border-radius: 12px;
    }
    .dgsilver-morph__kicker {
        right: 22px;
        top: 22px;
        min-height: 30px;
        padding: 0 12px;
        font-size: 8px;
    }
    .dgsilver-morph__specs {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   DGCHEME — SILVER METALLIC / LEAFING & NON-LEAFING
   v1.7.83
   Signature comparison section adapted from Golden Metallic.
========================================================= */
.dgsilver-leafing {
    position: relative;
    padding: 76px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 14% 10%, rgba(170,220,194,.08), transparent 26%),
        radial-gradient(circle at 88% 74%, rgba(255,255,255,.035), transparent 28%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsilver-leafing__inner {
    width: min(1280px, calc(100% - 32px));
    margin: 0 auto;
}

.dgsilver-leafing__head {
    display: grid;
    grid-template-columns: minmax(0,1fr) 250px;
    gap: 28px;
    align-items: start;
    margin-bottom: 28px;
}

.dgsilver-leafing__head-copy {
    text-align: right;
}

.dgsilver-leafing__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 7px;
    color: #d5eadf;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 850;
    letter-spacing: .16em;
}

.dgsilver-leafing__eyebrow::before {
    content: "";
    width: 34px;
    height: 1px;
    background: rgba(213,234,223,.58);
}

.dgsilver-leafing__title {
    margin: 0 0 10px;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsilver-leafing__lead {
    margin: 0;
    color: rgba(232,243,237,.84);
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
}

.dgsilver-leafing__meta {
    padding: 17px 18px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    background: rgba(255,255,255,.055);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
    backdrop-filter: blur(8px);
}

.dgsilver-leafing__meta small,
.dgsilver-leafing__meta span {
    display: block;
    color: rgba(216,235,225,.68);
    font-size: 8px;
    font-weight: 850;
    line-height: 1.5;
    letter-spacing: .16em;
}

.dgsilver-leafing__meta strong {
    display: block;
    margin: 7px 0 4px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.7;
}

.dgsilver-leafing__top {
    display: grid;
    grid-template-columns: 1.12fr .88fr;
    gap: 22px;
    align-items: stretch;
}

.dgsilver-leafing__lab,
.dgsilver-leafing__analysis {
    border-radius: 24px;
    overflow: hidden;
}

.dgsilver-leafing__lab {
    padding: 14px;
    background: #f7faf8;
    border: 1px solid rgba(255,255,255,.18);
    box-shadow: 0 24px 46px rgba(0,0,0,.18);
}

.dgsilver-leafing__labbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    padding: 0 2px;
    direction: ltr;
}

.dgsilver-leafing__labbar span,
.dgsilver-leafing__labbar small {
    color: #486154;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsilver-leafing__samples {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.dgsilver-leafing__sample {
    position: relative;
    overflow: hidden;
    border-radius: 17px;
    background: linear-gradient(145deg,#e7ece9,#f9fbfa);
    border: 1px solid rgba(17,59,43,.08);
}

.dgsilver-leafing__sample-media {
    position: relative;
    aspect-ratio: 1.18 / 1;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 40%, rgba(255,255,255,.85), transparent 46%),
        linear-gradient(145deg,#d9dfdc,#eef2f0);
}

.dgsilver-leafing__sample-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dgsilver-leafing__sample-no {
    position: absolute;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: rgba(8,36,25,.84);
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    z-index: 2;
}

.dgsilver-leafing__sample-body {
    padding: 13px 14px 14px;
}

.dgsilver-leafing__sample-body h3 {
    margin: 0 0 3px;
    color: #173d2e;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsilver-leafing__sample-body span {
    display: block;
    color: #71867b;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 750;
}

.dgsilver-leafing__observation {
    margin-top: 12px;
    padding: 15px 16px;
    border-radius: 16px;
    background: linear-gradient(135deg,#0d3a29,#164d38);
    color: #fff;
}

.dgsilver-leafing__observation-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 7px;
    direction: ltr;
}

.dgsilver-leafing__observation-head span,
.dgsilver-leafing__observation-head small {
    color: rgba(224,241,232,.72);
    font-size: 8px;
    line-height: 1.4;
    font-weight: 850;
    letter-spacing: .12em;
}

.dgsilver-leafing__observation p {
    margin: 0;
    color: rgba(244,250,247,.92);
    font-size: 12px;
    line-height: 2;
    text-align: justify;
}

.dgsilver-leafing__analysis {
    display: flex;
    flex-direction: column;
    padding: 22px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.dgsilver-leafing__analysis-kicker {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    direction: ltr;
}

.dgsilver-leafing__analysis-kicker span {
    color: #d8ebdf;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .16em;
}

.dgsilver-leafing__analysis-kicker b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: rgba(255,255,255,.10);
    color: #fff;
    font-size: 9px;
}

.dgsilver-leafing__analysis p {
    margin: 0;
    color: rgba(238,247,242,.88);
    font-size: 13px;
    line-height: 2.06;
    text-align: justify;
}

.dgsilver-leafing__analysis p + p {
    margin-top: 12px;
}

.dgsilver-leafing__table {
    margin-top: 18px;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.10);
}

.dgsilver-leafing__row {
    display: grid;
    grid-template-columns: .85fr 1fr 1.2fr;
    min-height: 45px;
}

.dgsilver-leafing__row + .dgsilver-leafing__row {
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsilver-leafing__row--head {
    background: rgba(255,255,255,.08);
}

.dgsilver-leafing__row span {
    display: flex;
    align-items: center;
    padding: 9px 11px;
    color: rgba(238,247,242,.84);
    font-size: 9px;
    line-height: 1.5;
    font-weight: 720;
    direction: ltr;
    text-align: left;
}

.dgsilver-leafing__row span + span {
    border-left: 1px solid rgba(255,255,255,.07);
}

.dgsilver-leafing__row--head span {
    color: rgba(219,239,228,.62);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsilver-leafing__mechanism-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) 280px;
    gap: 18px;
    align-items: center;
    margin: 24px 0 14px;
    padding: 15px 18px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 17px;
    background: rgba(255,255,255,.055);
}

.dgsilver-leafing__mechanism-copy {
    text-align: right;
}

.dgsilver-leafing__mechanism-copy span {
    display: block;
    margin-bottom: 4px;
    color: rgba(221,239,229,.64);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsilver-leafing__mechanism-copy h3 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
}

.dgsilver-leafing__mechanism-note {
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.07);
    color: rgba(237,247,241,.78);
    font-size: 10px;
    line-height: 1.8;
    text-align: right;
}

.dgsilver-leafing__detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.dgsilver-leafing__detail {
    overflow: hidden;
    border-radius: 20px;
    background: #f7faf8;
    border: 1px solid rgba(255,255,255,.16);
    box-shadow: 0 18px 34px rgba(0,0,0,.14);
}

.dgsilver-leafing__detail-media {
    position: relative;
    padding: 10px 10px 0;
}

.dgsilver-leafing__detail-media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1774 / 887;
    object-fit: cover;
    border-radius: 14px;
}

.dgsilver-leafing__detail-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(9,39,27,.88);
    color: #fff;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsilver-leafing__detail-body {
    padding: 15px 17px 17px;
}

.dgsilver-leafing__detail-body span {
    display: block;
    margin-bottom: 4px;
    color: #708579;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsilver-leafing__detail-body h3 {
    margin: 0 0 8px;
    color: #173d2e;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
}

.dgsilver-leafing__detail-body p {
    margin: 0;
    color: #566d61;
    font-size: 12px;
    line-height: 2;
    text-align: justify;
}

.dgsilver-leafing__facts {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 13px;
}

.dgsilver-leafing__facts span {
    margin: 0;
    padding: 9px 10px;
    border-radius: 11px;
    background: #eef4f0;
    border: 1px solid rgba(18,59,43,.07);
    color: #365747;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    text-align: left;
    direction: ltr;
}

@media (max-width: 980px) {
    .dgsilver-leafing__head,
    .dgsilver-leafing__top,
    .dgsilver-leafing__mechanism-head,
    .dgsilver-leafing__detail-grid {
        grid-template-columns: 1fr;
    }

    .dgsilver-leafing__meta {
        max-width: 280px;
    }
}

@media (max-width: 680px) {
    .dgsilver-leafing {
        padding: 50px 0;
    }

    .dgsilver-leafing__inner {
        width: min(100%, calc(100% - 20px));
    }

    .dgsilver-leafing__samples {
        grid-template-columns: 1fr;
    }

    .dgsilver-leafing__sample-media {
        aspect-ratio: 1.35 / 1;
    }

    .dgsilver-leafing__analysis,
    .dgsilver-leafing__lab {
        border-radius: 18px;
    }

    .dgsilver-leafing__row {
        grid-template-columns: .95fr 1fr 1fr;
    }

    .dgsilver-leafing__facts {
        grid-template-columns: 1fr;
    }

    .dgsilver-leafing__detail-media img {
        aspect-ratio: 1774 / 887;
    }
}
/* END — SILVER METALLIC / LEAFING & NON-LEAFING v1.7.83 */

/* =========================================================
   DGCHEME — SILVER METALLIC / LEAFING IMAGE HOVER ZOOM LOCK
   v1.7.84
   Permanent product-detail behavior: section imagery gently
   zooms on hover without changing card geometry.
========================================================= */
.dgsilver-leafing__sample-media,
.dgsilver-leafing__detail-media {
    overflow: hidden;
}

.dgsilver-leafing__sample-media img,
.dgsilver-leafing__detail-media img {
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
    will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
    .dgsilver-leafing__sample:hover .dgsilver-leafing__sample-media img,
    .dgsilver-leafing__detail:hover .dgsilver-leafing__detail-media img {
        transform: scale(1.055);
        filter: saturate(1.03) contrast(1.015);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsilver-leafing__sample-media img,
    .dgsilver-leafing__detail-media img {
        transition: none;
    }
}
/* END — SILVER METALLIC / LEAFING IMAGE HOVER ZOOM LOCK v1.7.84 */

/* =========================================================
   DGCHEME — SILVER METALLIC / PRODUCT EXPLORER — TAB 01
   v1.7.85
   Shared Product Explorer architecture; silver-specific family
   surface, alignment and product-grid behavior only.
========================================================= */
.dgproduct-explorer--silver {
    --dgsilver-family: #9B9A97;
    --dgsilver-ink: #17241d;
    --dgsilver-muted: #68736d;
}

.dgproduct-explorer--silver .dgproduct-explorer__kicker,
.dgproduct-explorer--silver .dgproduct-family-intro__eyebrow,
.dgproduct-explorer--silver .dgproduct-products-head > div > span {
    color: #51675c;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active {
    border-color: rgba(93, 96, 94, .34);
    background: linear-gradient(180deg, #f3f3f2 0%, #e8e8e6 100%);
    box-shadow: inset 0 -3px 0 #8d8c89;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #25342c;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid rgba(125, 124, 121, .28);
    background: linear-gradient(270deg, #9B9A97 0%, #bdbcb9 30%, #e7e6e4 68%, #ffffff 100%);
    box-shadow:
        0 14px 30px rgba(20, 28, 24, .15),
        inset 0 1px 0 rgba(255,255,255,.58);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 40%, rgba(255,255,255,.18), transparent 24%),
        linear-gradient(110deg, rgba(255,255,255,.42), rgba(255,255,255,0) 42%);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__meta,
.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    flex: 0 0 auto;
    min-width: 300px;
    padding: 18px 14px 18px 20px;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__index {
    order: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    border-radius: 14px;
    border: 1px solid rgba(42,52,47,.14);
    background: rgba(255,255,255,.72);
    color: #2f3d35;
    font-size: 13px;
    line-height: 1;
    font-weight: 900;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__latin {
    order: 2;
    direction: ltr;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__micro {
    color: rgba(34,45,39,.60);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__latin strong {
    color: #1e2b24;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__latin em {
    color: rgba(34,45,39,.56);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    direction: ltr;
    padding: 18px 20px;
    text-align: right;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__copy {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: 0;
    padding: 8px 4px 8px 24px;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__copy h3 {
    margin: 0 0 6px;
    color: #17241d;
    direction: rtl;
    text-align: right;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-powder"]
.dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    text-align: right;
    color: rgba(31,43,36,.82);
    font-size: 14px;
    line-height: 1.55;
    font-weight: 850;
}

.dgproduct-explorer--silver .dgproduct-family-intro__badge {
    background: rgba(242,243,242,.94);
    border-color: rgba(96,100,97,.14);
}

.dgproduct-explorer--silver .dgproduct-family-intro__badge span,
.dgproduct-explorer--silver .dgproduct-family-intro__badge strong {
    color: #37443d;
}

.dgproduct-explorer--silver .dgproduct-grid--silver-powder {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.dgproduct-explorer--silver .dgproduct-card__media {
    overflow: hidden;
}

.dgproduct-explorer--silver .dgproduct-card__media > img {
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover: hover) and (pointer: fine) {
    .dgproduct-explorer--silver .dgproduct-card:hover .dgproduct-card__media > img {
        transform: scale(1.055);
        filter: saturate(1.02) contrast(1.015);
    }
}

.dgproduct-explorer--silver .dgproduct-card__series,
.dgproduct-explorer--silver .dgproduct-card__night-badge {
    background: rgba(245,246,245,.90);
    color: #2f4037;
    border-color: rgba(67,78,72,.12);
}

.dgproduct-explorer--silver .dgproduct-card__glow-name i,
.dgproduct-explorer--silver .dgproduct-card__night-badge i {
    background: #9B9A97;
    box-shadow: 0 0 0 3px rgba(155,154,151,.15);
}

@media (max-width: 1100px) {
    .dgproduct-explorer--silver .dgproduct-grid--silver-powder {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .dgproduct-explorer--silver
    .dgproduct-family-panel[data-dgproduct-family="silver-powder"]
    .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--silver
    .dgproduct-family-panel[data-dgproduct-family="silver-powder"]
    .dgproduct-family-divider {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 12px;
        min-height: 0;
    }

    .dgproduct-explorer--silver
    .dgproduct-family-panel[data-dgproduct-family="silver-powder"]
    .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        justify-content: flex-end;
        padding: 16px 16px 8px;
    }

    .dgproduct-explorer--silver
    .dgproduct-family-panel[data-dgproduct-family="silver-powder"]
    .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
        padding: 8px 16px 16px;
    }

    .dgproduct-explorer--silver
    .dgproduct-family-panel[data-dgproduct-family="silver-powder"]
    .dgproduct-family-divider__copy {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .dgproduct-explorer--silver .dgproduct-grid--silver-powder {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--silver .dgproduct-card__media > img {
        transition: none;
    }
}
/* END — SILVER METALLIC / PRODUCT EXPLORER — TAB 01 v1.7.85 */

/* =========================================================
   DGCHEME — SILVER METALLIC / PRODUCT EXPLORER ALIGNMENT LOCK
   v1.7.86
   Exact family-banner geometry + 4-column product grid + viewer identity lock.
========================================================= */
@media (min-width: 681px) {
    .dgproduct-explorer--silver .dgproduct-family-divider {
        width: 100%;
        height: 116px;
        min-height: 116px;
        box-sizing: border-box;
        padding: 17px 20px;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
        border-radius: 20px;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;
        min-width: 300px;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__index {
        order: 1;
        display: grid;
        place-items: center;
        flex: 0 0 50px;
        width: 50px;
        height: 50px;
        box-sizing: border-box;
        border-radius: 14px;
        font-size: 14px;
        font-weight: 900;
        line-height: 1;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__copy {
        width: min(760px, 100%);
        margin-left: auto;
        margin-right: 0;
        padding: 0;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__copy h3 {
        margin: 0 0 6px;
        font-size: 16px;
        font-weight: 900;
        line-height: 1.8;
    }

    .dgproduct-explorer--silver .dgproduct-family-divider__subtitle {
        display: block;
        width: 100%;
        margin: 0;
        direction: ltr;
        text-align: right;
        font-size: 16px;
        font-weight: 850;
        line-height: 1.55;
        letter-spacing: 0;
    }
}

/* Match the product-card width/density of the other product explorers. */
.dgproduct-explorer--silver .dgproduct-grid--silver-powder {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

/* Viewer top-right identity: keep family and product code on clean single lines. */
.dgproduct-explorer--silver .dgproduct-viewer__brand-card {
    gap: 14px;
}

.dgproduct-explorer--silver .dgproduct-viewer__product-id {
    flex: 0 0 auto;
    min-width: 138px;
    max-width: 170px;
    padding-left: 18px;
    align-items: flex-end;
    text-align: right;
}

.dgproduct-explorer--silver .dgproduct-viewer__product-id > span {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    font-size: 7px;
    line-height: 1.45;
    letter-spacing: .07em;
}

.dgproduct-explorer--silver .dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-align: right;
    font-size: 18px;
    line-height: 1.2;
}

@media (max-width: 1100px) {
    .dgproduct-explorer--silver .dgproduct-grid--silver-powder {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--silver .dgproduct-grid--silver-powder {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dgproduct-explorer--silver .dgproduct-viewer__product-id {
        min-width: 112px;
        max-width: 132px;
        padding-left: 12px;
    }

    .dgproduct-explorer--silver .dgproduct-viewer__product-id > span {
        font-size: 6px;
        letter-spacing: .05em;
    }

    .dgproduct-explorer--silver .dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
        font-size: 15px;
    }
}
/* END — SILVER METALLIC / PRODUCT EXPLORER ALIGNMENT LOCK v1.7.86 */

/* =========================================================
   DGCHEME — SILVER METALLIC / PRODUCT TABS VISUAL LOCK
   v1.7.87
   Exact shared Product Explorer tab geometry. Only the family
   accent changes from gold to silver; shape/surface stays unified.
========================================================= */
.dgproduct-explorer--silver .dgproduct-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 10px;
    margin-bottom: 22px;
    border: 1px solid #e9e4d1;
    border-radius: 24px;
    background: #f7f5ec;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.8),
        0 12px 28px rgba(15,35,22,.04);
}

.dgproduct-explorer--silver .dgproduct-tabs__tab {
    min-height: 78px;
    padding: 14px 12px 13px;
    border: 1px solid transparent;
    border-radius: 16px;
    background: transparent;
    color: #606d64;
    text-align: center;
    transform: none;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab:hover {
    transform: translateY(-1px);
    border-color: rgba(23,43,29,.08);
    background: rgba(255,255,255,.76);
    color: #223028;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    border-color: transparent;
    background: #fff;
    color: #1b2a20;
    box-shadow:
        0 10px 24px rgba(17,44,27,.08),
        inset 0 -3px 0 #9B9A97;
}

.dgproduct-explorer--silver .dgproduct-tabs__code {
    margin-bottom: 4px;
    font-size: 9px;
    letter-spacing: .14em;
}

.dgproduct-explorer--silver .dgproduct-tabs__label {
    font-size: 13px;
    line-height: 1.65;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active .dgproduct-tabs__code {
    color: #777673;
}

.dgproduct-explorer--silver .dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #1b2a20;
}
/* END — SILVER METALLIC / PRODUCT TABS VISUAL LOCK v1.7.87 */

/* =========================================================
   DGCHEME — SILVER METALLIC / PRODUCT EXPLORER — TAB 02
   v1.7.88
   Shared family-banner geometry; paste-specific surface only.
========================================================= */
.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(116,115,113,.30);
    background: linear-gradient(270deg, #747371 0%, #9a9996 28%, #c9c8c5 52%, #ecebea 76%, #ffffff 100%);
    box-shadow:
        0 14px 30px rgba(20,28,24,.15),
        inset 0 1px 0 rgba(255,255,255,.58);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 40%, rgba(255,255,255,.16), transparent 24%),
        linear-gradient(110deg, rgba(255,255,255,.42), rgba(255,255,255,0) 42%);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__meta,
.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__index {
    border-color: rgba(42,52,47,.14);
    background: rgba(255,255,255,.72);
    color: #2f3d35;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__latin em {
    color: rgba(34,45,39,.60);
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__latin strong,
.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__copy h3 {
    color: #17241d;
}

.dgproduct-explorer--silver
.dgproduct-family-panel[data-dgproduct-family="silver-paste"]
.dgproduct-family-divider__subtitle {
    color: rgba(31,43,36,.82);
}

/* Permanent image behavior for Silver Product Explorer family intros. */
.dgproduct-explorer--silver .dgproduct-family-intro__visual {
    overflow: hidden;
}

.dgproduct-explorer--silver .dgproduct-family-intro__visual > img {
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
    will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
    .dgproduct-explorer--silver .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.045);
        filter: saturate(1.02) contrast(1.015);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--silver .dgproduct-family-intro__visual > img {
        transition: none;
    }
}
/* END — SILVER METALLIC / PRODUCT EXPLORER — TAB 02 v1.7.88 */

/* =========================================================
   DGCHEME — PRODUCT FAMILY BANNER MICRO-LABEL LOCK
   v1.7.89
   Silver explorer: third Latin line matches Golden family banner.
   This is a micro descriptor, never a subtitle-sized line.
========================================================= */
.dgproduct-explorer--silver .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 2px;
    direction: ltr;
    font-size: 7px;
    line-height: 1.4;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

@media (max-width: 680px) {
    .dgproduct-explorer--silver .dgproduct-family-divider__latin em {
        font-size: 7px;
    }
}
/* END — PRODUCT FAMILY BANNER MICRO-LABEL LOCK v1.7.89 */



/* =========================================================
   DGCHEME — Copper Metallic Intro
   v1.7.90
   Section below copper metallic hero / slider
   Layout lock: copy left, profile card right
========================================================= */
.dgcopper-intro,
.dgcopper-intro * {
    box-sizing: border-box;
}

.dgcopper-intro {
    position: relative;
    width: 100%;
    padding: 48px 20px 54px;
    overflow: hidden;
    background:
        radial-gradient(circle at 6% 100%, rgba(31, 87, 66, .06), transparent 25%),
        radial-gradient(circle at 95% 6%, rgba(193, 133, 73, .08), transparent 23%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgcopper-intro::after {
    content: "";
    position: absolute;
    left: -92px;
    bottom: -132px;
    width: 260px;
    height: 260px;
    border: 1px solid rgba(83, 125, 108, .14);
    border-radius: 50%;
    box-shadow:
        0 0 0 38px rgba(83, 125, 108, .032),
        0 0 0 76px rgba(21, 78, 57, .018);
    pointer-events: none;
}

.dgcopper-intro__inner {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgcopper-intro__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 346px;
    gap: 18px;
    align-items: stretch;
    direction: ltr;
}

.dgcopper-intro__copy,
.dgcopper-intro__profile {
    min-width: 0;
    direction: rtl;
    grid-row: 1;
}

.dgcopper-intro__copy {
    grid-column: 1;
    position: relative;
    padding: 30px 30px 28px;
    border: 1px solid #dce4df;
    border-radius: 20px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 14px 38px rgba(23, 50, 40, .06);
}

.dgcopper-intro__copy::before {
    content: "";
    position: absolute;
    top: 0;
    right: 84px;
    width: 72px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #154d39 0%, #d8a15d 100%);
}

.dgcopper-intro__copy p {
    margin: 0;
    color: #51645d;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.22;
    text-align: justify;
    text-align-last: right;
}

.dgcopper-intro__copy p + p {
    margin-top: 22px;
}

.dgcopper-intro__copy a {
    color: #154d39;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid rgba(21,77,57,.24);
}

.dgcopper-intro__copy a:hover,
.dgcopper-intro__copy a:focus-visible {
    color: #b56f3d;
    border-bottom-color: currentColor;
}

.dgcopper-intro__profile {
    grid-column: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 598px;
    padding: 34px 26px 26px;
    overflow: hidden;
    border-radius: 19px;
    color: #fff;
    background:
        radial-gradient(circle at 13% 12%, rgba(216, 161, 93, .11), transparent 24%),
        radial-gradient(circle at 88% 43%, rgba(214, 177, 129, .065), transparent 28%),
        linear-gradient(125deg, #072118 0%, #0f3928 50%, #0a291d 100%);
    box-shadow: 0 18px 44px rgba(11, 56, 42, .14);
}

.dgcopper-intro__profile::before {
    content: "";
    position: absolute;
    left: -84px;
    bottom: -82px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(220, 182, 138, .18);
    border-radius: 50%;
    box-shadow: 0 0 0 35px rgba(220, 182, 138, .025);
    pointer-events: none;
}

.dgcopper-intro__eyebrow {
    display: grid;
    grid-template-columns: auto minmax(26px, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    direction: ltr;
    color: #e6d1b8;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.dgcopper-intro__eyebrow::after {
    content: "";
    height: 1px;
    background: linear-gradient(90deg, #e6d1b8, rgba(230,209,184,.06));
}

.dgcopper-intro__title {
    margin: 0 0 26px;
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.8;
    text-align: right;
}

.dgcopper-intro__tech {
    position: relative;
    padding: 17px 16px 15px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dgcopper-intro__tech-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    direction: ltr;
}

.dgcopper-intro__tech-head strong,
.dgcopper-intro__tech-head span {
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgcopper-intro__tech-head strong {
    color: #eedcc7;
}

.dgcopper-intro__tech-head span {
    color: rgba(255,255,255,.38);
}

.dgcopper-intro__formula {
    display: grid;
    grid-template-columns: auto 24px auto 24px auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 24px 0 20px;
    direction: ltr;
}

.dgcopper-intro__formula strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 32px;
    padding: 7px 9px;
    border: 1px solid rgba(231, 204, 174, .34);
    border-radius: 6px;
    background: rgba(216, 161, 93, .09);
    color: #f5e7d7;
    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
}

.dgcopper-intro__formula strong:last-of-type {
    min-width: 98px;
}

.dgcopper-intro__formula i {
    position: relative;
    display: block;
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, rgba(231,204,174,.36), #e6d1b8);
}

.dgcopper-intro__formula i::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #e6d1b8;
    border-right: 1px solid #e6d1b8;
    transform: translateY(-50%) rotate(45deg);
}

.dgcopper-intro__formula-caption {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: -6px;
    padding-bottom: 15px;
    color: rgba(255,255,255,.45);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
}

.dgcopper-intro__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

.dgcopper-intro__spec {
    min-width: 0;
    min-height: 54px;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 9px;
    background: rgba(255,255,255,.022);
    direction: ltr;
}

.dgcopper-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #e6d1b8;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .07em;
}

.dgcopper-intro__spec strong {
    display: block;
    color: rgba(255,255,255,.76);
    font-size: 8px;
    font-weight: 700;
    line-height: 1.55;
}

.dgcopper-intro__profile-copy {
    position: relative;
    z-index: 1;
    margin-top: 18px;
    padding: 14px 15px 13px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.018));
}

.dgcopper-intro__profile-copy p {
    margin: 0;
    color: rgba(236,244,240,.70);
    font-size: 13px;
    font-weight: 400;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgcopper-intro__profile-copy strong {
    color: #ffffff;
    font-weight: 800;
}

.dgcopper-intro__tags {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 28px;
    direction: ltr;
}

.dgcopper-intro__tags span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: rgba(255,255,255,.66);
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .dgcopper-intro {
        padding: 38px 16px 44px;
    }

    .dgcopper-intro__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgcopper-intro__profile {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
    }

    .dgcopper-intro__copy {
        grid-column: 1;
        grid-row: 2;
    }

    .dgcopper-intro__tags {
        margin-top: 26px;
    }
}

@media (max-width: 560px) {
    .dgcopper-intro {
        padding: 30px 12px 36px;
    }

    .dgcopper-intro__profile {
        padding: 26px 18px 20px;
        border-radius: 16px;
    }

    .dgcopper-intro__title {
        margin-bottom: 20px;
        font-size: 20px;
    }

    .dgcopper-intro__copy {
        padding: 23px 20px 21px;
        border-radius: 16px;
    }

    .dgcopper-intro__copy::before {
        right: 20px;
    }

    .dgcopper-intro__copy p {
        font-size: 13px;
        line-height: 2.08;
    }

    .dgcopper-intro__formula {
        grid-template-columns: 1fr auto 1fr;
        gap: 7px;
        padding: 20px 0 16px;
    }

    .dgcopper-intro__formula strong:last-of-type {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, 170px);
        margin-top: 7px;
    }

    .dgcopper-intro__formula i:last-of-type {
        display: none;
    }

    .dgcopper-intro__formula-caption {
        justify-content: center;
        text-align: center;
    }

    .dgcopper-intro__specs {
        grid-template-columns: 1fr;
    }

    .dgcopper-intro__profile-copy {
        margin-top: 14px;
    }
}
/* END — Copper Metallic Intro v1.7.90 */

/* =========================================================
   DGCHEME — Copper Metallic Intro / Copy Note Placement Lock
   v1.7.92
   Rule: explanatory prose stays in the white copy column.
   The green technical profile contains only technical UI.
========================================================= */
.dgcopper-intro__copy-note {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(21,77,57,.10);
    color: #51645d;
    font-size: 13px;
    font-weight: 400;
    line-height: 2.12;
    text-align: justify;
    text-align-last: right;
}

.dgcopper-intro__copy-note strong {
    color: #154d39;
    font-weight: 900;
}

@media (max-width: 560px) {
    .dgcopper-intro__copy-note {
        margin-top: 18px;
        padding-top: 15px;
        font-size: 13px;
        line-height: 2.08;
    }
}
/* END — Copper Metallic Intro / Copy Note Placement Lock v1.7.92 */


/* =========================================================
   Copper Metallic Pigments — Section 02 / Reflection Trio
   Keeps the approved Silver/Gold section structure and only
   adds copper-specific accents + exact 1774x887 landscape ratio.
   ========================================================= */
.dgsilver-reflect--copper .dgsilver-reflect__media img {
    aspect-ratio: 1774 / 887;
}

.dgsilver-reflect--copper .dgsilver-reflect__card--metallic .dgsilver-reflect__type::before {
    background: #b87333;
    box-shadow: 0 0 0 3px rgba(184,115,51,.14);
}

.dgsilver-reflect--copper .dgsilver-reflect__card--metallic .dgsilver-reflect__foot span:first-child {
    border-color: rgba(184,115,51,.22);
    background: rgba(184,115,51,.08);
    color: #8f5629;
}


/* =========================================================
   Copper Metallic — Reflection Header Position Lock
   v1.7.94
   Approved layout: copy on right, compact meta card on left.
========================================================= */
@media (min-width: 681px) {
    .dgsilver-reflect--copper .dgsilver-reflect__head {
        direction: rtl;
    }

    .dgsilver-reflect--copper .dgsilver-reflect__copy {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
        text-align: right;
    }

    .dgsilver-reflect--copper .dgsilver-reflect__index {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        align-self: end;
    }
}

@media (max-width: 680px) {
    .dgsilver-reflect--copper .dgsilver-reflect__copy,
    .dgsilver-reflect--copper .dgsilver-reflect__index {
        grid-column: 1;
    }
}
/* END — Copper Metallic Reflection Header Position Lock v1.7.94 */

/* =========================================================
   DGCHEME — COPPER METALLIC / LEAFING & NON-LEAFING
   v1.7.95
   Reuses approved Leafing architecture; alternating WHITE section.
   Top comparison images intentionally remain independent src="#".
========================================================= */
.dgsilver-leafing--copper-white {
    background:
        radial-gradient(circle at 13% 9%, rgba(20,82,59,.035), transparent 25%),
        radial-gradient(circle at 90% 80%, rgba(184,115,51,.045), transparent 27%),
        linear-gradient(180deg, #ffffff 0%, #f7f9f8 100%);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__eyebrow {
    color: #647b70;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__eyebrow::before {
    background: linear-gradient(90deg, #b87333, rgba(100,123,112,.32));
}

.dgsilver-leafing--copper-white .dgsilver-leafing__title {
    color: #123a2b;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__lead {
    color: #556b60;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__meta {
    border-color: rgba(18,59,43,.09);
    background: linear-gradient(145deg, #f1f5f3 0%, #e9efec 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 10px 26px rgba(17,50,36,.045);
    backdrop-filter: none;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__meta small,
.dgsilver-leafing--copper-white .dgsilver-leafing__meta span {
    color: #748a7e;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__meta strong {
    color: #173e2f;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__lab {
    border-color: rgba(18,59,43,.08);
    box-shadow: 0 20px 46px rgba(17,50,36,.09), inset 0 1px 0 rgba(255,255,255,.95);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__sample-no {
    background: rgba(12,55,39,.90);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__observation {
    background:
        radial-gradient(circle at 92% 20%, rgba(184,115,51,.10), transparent 30%),
        linear-gradient(135deg, #0d3a29, #164d38);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__analysis {
    background:
        radial-gradient(circle at 90% 12%, rgba(184,115,51,.075), transparent 28%),
        linear-gradient(145deg, #0c3425 0%, #124733 100%);
    border-color: rgba(18,59,43,.10);
    box-shadow: 0 20px 46px rgba(17,50,36,.11), inset 0 1px 0 rgba(255,255,255,.055);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__mechanism-head {
    border-color: rgba(18,59,43,.09);
    background: linear-gradient(135deg, #eff4f1 0%, #e7efe9 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__mechanism-copy span {
    color: #8c6b4b;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__mechanism-copy h3 {
    color: #173e2f;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__mechanism-note {
    background: rgba(255,255,255,.62);
    border: 1px solid rgba(18,59,43,.07);
    color: #61756a;
}

.dgsilver-leafing--copper-white .dgsilver-leafing__detail {
    border-color: rgba(18,59,43,.08);
    box-shadow: 0 18px 38px rgba(17,50,36,.08), inset 0 1px 0 rgba(255,255,255,.95);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__detail-badge {
    background: rgba(11,53,38,.90);
}

.dgsilver-leafing--copper-white .dgsilver-leafing__detail:first-child .dgsilver-leafing__detail-badge {
    box-shadow: inset 0 -2px 0 rgba(184,115,51,.72);
}
/* END — COPPER METALLIC / LEAFING & NON-LEAFING v1.7.95 */


/* =========================================================
   DGCHEME — COPPER METALLIC / SINGLE-FAMILY PRODUCT EXPLORER
   v1.7.96
   No tabs. Shared Product Explorer architecture with one family
   and one product card. Family accent: #C3A518 -> white.
========================================================= */
.dgproduct-explorer--copper {
    --dgcopper-family: #C3A518;
    --dgcopper-ink: #17241d;
    --dgcopper-muted: #68736d;
}

.dgproduct-explorer--copper .dgproduct-explorer__kicker,
.dgproduct-explorer--copper .dgproduct-family-intro__eyebrow,
.dgproduct-explorer--copper .dgproduct-products-head > div > span {
    color: #7f6d10;
}

/* No tabs or mobile family selector on the copper page. */
.dgproduct-explorer--copper .dgproduct-tabs,
.dgproduct-explorer--copper .dgproduct-mobile-select {
    display: none;
}

/* Shared family-banner geometry — same shape as Golden/Silver. */
.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider {
    position: relative;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid rgba(195,165,24,.34);
    background: linear-gradient(
        270deg,
        #C3A518 0%,
        #d5bf55 28%,
        #e9dfa2 52%,
        #f6f1d7 76%,
        #ffffff 100%
    );
    box-shadow:
        0 14px 30px rgba(20,28,24,.15),
        inset 0 1px 0 rgba(255,255,255,.58);
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 40%, rgba(255,255,255,.16), transparent 24%),
        linear-gradient(110deg, rgba(255,255,255,.42), rgba(255,255,255,0) 42%);
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__meta,
.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__meta {
    order: 1;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    flex: 0 0 auto;
    min-width: 300px;
    padding: 18px 14px 18px 20px;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__index {
    order: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    border-radius: 14px;
    border: 1px solid rgba(42,52,47,.14);
    background: rgba(255,255,255,.72);
    color: #2f3d35;
    font-size: 13px;
    line-height: 1;
    font-weight: 900;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__latin {
    order: 2;
    direction: ltr;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__micro {
    color: rgba(54,48,18,.62);
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__latin strong {
    color: #252417;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__latin em {
    display: block;
    margin-top: 2px;
    color: rgba(54,48,18,.60);
    direction: ltr;
    font-size: 7px;
    line-height: 1.4;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    direction: ltr;
    padding: 18px 20px;
    text-align: right;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__copy {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: 0;
    padding: 8px 4px 8px 24px;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__copy h3 {
    margin: 0 0 6px;
    color: #17241d;
    direction: rtl;
    text-align: right;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
}

.dgproduct-explorer--copper
.dgproduct-family-panel[data-dgproduct-family="copper-powder"]
.dgproduct-family-divider__subtitle {
    display: block;
    direction: ltr;
    text-align: right;
    color: rgba(31,43,36,.82);
    font-size: 14px;
    line-height: 1.55;
    font-weight: 850;
}

/* Copper family intro placement lock:
   desktop/tablet = media LEFT, Persian content RIGHT.
   Mobile keeps media first, then content. */
.dgproduct-explorer--copper .dgproduct-family-intro {
    grid-template-columns: minmax(320px, .88fr) minmax(0, 1.12fr);
    grid-template-areas: "media content";
}

.dgproduct-explorer--copper .dgproduct-family-intro__visual {
    overflow: hidden;
}

.dgproduct-explorer--copper .dgproduct-family-intro__visual > img {
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
    will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
    .dgproduct-explorer--copper .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.045);
        filter: saturate(1.025) contrast(1.015);
    }
}

.dgproduct-explorer--copper .dgproduct-family-intro__badge {
    background: rgba(247,243,220,.94);
    border-color: rgba(195,165,24,.22);
}

.dgproduct-explorer--copper .dgproduct-family-intro__badge span,
.dgproduct-explorer--copper .dgproduct-family-intro__badge strong {
    color: #544a12;
}

.dgproduct-explorer--copper .dgproduct-family-intro__points li::before {
    background: #C3A518;
    box-shadow: 0 0 0 4px rgba(195,165,24,.13);
}

/* Single card keeps the exact same card width as 4-column explorers. */
.dgproduct-explorer--copper .dgproduct-grid--copper-powder {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.dgproduct-explorer--copper .dgproduct-card__media {
    overflow: hidden;
}

.dgproduct-explorer--copper .dgproduct-card__media > img {
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover: hover) and (pointer: fine) {
    .dgproduct-explorer--copper .dgproduct-card:hover .dgproduct-card__media > img {
        transform: scale(1.055);
        filter: saturate(1.025) contrast(1.015);
    }
}

.dgproduct-explorer--copper .dgproduct-card__series,
.dgproduct-explorer--copper .dgproduct-card__night-badge {
    background: rgba(248,246,233,.92);
    color: #4a431d;
    border-color: rgba(195,165,24,.18);
}

.dgproduct-explorer--copper .dgproduct-card__glow-name i,
.dgproduct-explorer--copper .dgproduct-card__night-badge i {
    background: #C3A518;
    box-shadow: 0 0 0 3px rgba(195,165,24,.15);
}

/* Viewer identity lock — same geometry as approved Silver/Golden popup. */
.dgproduct-explorer--copper .dgproduct-viewer__brand-card {
    gap: 14px;
}

.dgproduct-explorer--copper .dgproduct-viewer__product-id {
    flex: 0 0 auto;
    min-width: 138px;
    max-width: 170px;
    padding-left: 18px;
    align-items: flex-end;
    text-align: right;
}

.dgproduct-explorer--copper .dgproduct-viewer__product-id > span {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    font-size: 7px;
    line-height: 1.45;
    letter-spacing: .07em;
}

.dgproduct-explorer--copper .dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-align: right;
    font-size: 18px;
    line-height: 1.2;
}

@media (max-width: 1100px) {
    .dgproduct-explorer--copper .dgproduct-grid--copper-powder {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .dgproduct-explorer--copper .dgproduct-family-intro {
        grid-template-columns: minmax(0, 1.08fr) minmax(280px, .92fr);
    }

    .dgproduct-explorer--copper
    .dgproduct-family-panel[data-dgproduct-family="copper-powder"]
    .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--copper
    .dgproduct-family-panel[data-dgproduct-family="copper-powder"]
    .dgproduct-family-divider {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 12px;
        min-height: 0;
    }

    .dgproduct-explorer--copper
    .dgproduct-family-panel[data-dgproduct-family="copper-powder"]
    .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        justify-content: flex-end;
        padding: 16px 16px 8px;
    }

    .dgproduct-explorer--copper
    .dgproduct-family-panel[data-dgproduct-family="copper-powder"]
    .dgproduct-family-divider__meta {
        order: 2;
        min-width: 0;
        padding: 8px 16px 16px;
    }

    .dgproduct-explorer--copper
    .dgproduct-family-panel[data-dgproduct-family="copper-powder"]
    .dgproduct-family-divider__copy {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    /* Mobile product-law: title block, media, then body copy. */
    .dgproduct-explorer--copper .dgproduct-family-intro {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 0;
    }

    .dgproduct-explorer--copper .dgproduct-grid--copper-powder {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dgproduct-explorer--copper .dgproduct-viewer__product-id {
        min-width: 112px;
        max-width: 132px;
        padding-left: 12px;
    }

    .dgproduct-explorer--copper .dgproduct-viewer__product-id > span {
        font-size: 6px;
        letter-spacing: .05em;
    }

    .dgproduct-explorer--copper .dgproduct-viewer__brand-card .dgproduct-viewer__product-id strong {
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--copper .dgproduct-family-intro__visual > img,
    .dgproduct-explorer--copper .dgproduct-card__media > img {
        transition: none;
    }
}
/* END — COPPER METALLIC / SINGLE-FAMILY PRODUCT EXPLORER v1.7.96 */

/* =========================================================
   DGCHEME — Solvent Dye / Intro Below Hero
   v1.8.00
   Layout lock: white copy LEFT, green technical card RIGHT.
   Green card contains technical UI only; explanatory prose stays left.
========================================================= */
.dgsolvent-intro,
.dgsolvent-intro * {
    box-sizing: border-box;
}

.dgsolvent-intro {
    position: relative;
    width: 100%;
    padding: 48px 20px 54px;
    overflow: hidden;
    background:
        radial-gradient(circle at 7% 96%, rgba(20,86,62,.055), transparent 24%),
        radial-gradient(circle at 94% 10%, rgba(68,157,139,.055), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolvent-intro::after {
    content: "";
    position: absolute;
    left: -86px;
    bottom: -132px;
    width: 252px;
    height: 252px;
    border: 1px solid rgba(57,116,94,.12);
    border-radius: 50%;
    box-shadow:
        0 0 0 38px rgba(57,116,94,.026),
        0 0 0 76px rgba(21,78,57,.015);
    pointer-events: none;
}

.dgsolvent-intro__inner {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    margin: 0 auto;
}

.dgsolvent-intro__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 346px;
    gap: 18px;
    align-items: stretch;
    direction: ltr;
}

.dgsolvent-intro__copy,
.dgsolvent-intro__profile {
    min-width: 0;
    direction: rtl;
    grid-row: 1;
}

.dgsolvent-intro__copy {
    grid-column: 1;
    position: relative;
    padding: 30px 30px 28px;
    border: 1px solid #dce4df;
    border-radius: 20px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 14px 38px rgba(23,50,40,.06);
}

.dgsolvent-intro__copy::before {
    content: "";
    position: absolute;
    top: 0;
    right: 84px;
    width: 72px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #154d39 0%, #66a99b 100%);
}

.dgsolvent-intro__copy p {
    margin: 0;
    color: #51645d;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.18;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-intro__copy p + p {
    margin-top: 20px;
}

.dgsolvent-intro__copy strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolvent-intro__copy-note {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(21,77,57,.10);
    color: #51645d;
    font-size: 13px;
    font-weight: 400;
    line-height: 2.10;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-intro__copy-note strong {
    color: #154d39;
    font-weight: 900;
}

.dgsolvent-intro__profile {
    grid-column: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 560px;
    padding: 34px 26px 26px;
    overflow: hidden;
    border-radius: 19px;
    color: #fff;
    background:
        radial-gradient(circle at 13% 12%, rgba(109,200,179,.105), transparent 24%),
        radial-gradient(circle at 88% 43%, rgba(87,150,187,.045), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
    box-shadow: 0 18px 44px rgba(11,56,42,.14);
}

.dgsolvent-intro__profile::before {
    content: "";
    position: absolute;
    left: -82px;
    bottom: -78px;
    width: 186px;
    height: 186px;
    border: 1px solid rgba(116,204,184,.17);
    border-radius: 50%;
    box-shadow: 0 0 0 34px rgba(116,204,184,.024);
    pointer-events: none;
}

.dgsolvent-intro__eyebrow {
    display: grid;
    grid-template-columns: auto minmax(26px, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    direction: ltr;
    color: #b7dfd5;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.dgsolvent-intro__eyebrow::after {
    content: "";
    height: 1px;
    background: linear-gradient(90deg, #9fd2c5, rgba(159,210,197,.06));
}

.dgsolvent-intro__title {
    margin: 0 0 26px;
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.8;
    text-align: right;
}

.dgsolvent-intro__tech {
    position: relative;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.dgsolvent-intro__tech-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 0 13px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    direction: ltr;
}

.dgsolvent-intro__tech-head strong,
.dgsolvent-intro__tech-head span {
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolvent-intro__tech-head strong {
    color: #c6e7df;
}

.dgsolvent-intro__tech-head span {
    color: rgba(255,255,255,.40);
}

.dgsolvent-intro__formula {
    display: grid;
    grid-template-columns: auto 24px auto 24px auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 24px 0 20px;
    direction: ltr;
}

.dgsolvent-intro__formula strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 34px;
    padding: 7px 9px;
    border: 1px solid rgba(159,210,197,.30);
    border-radius: 6px;
    background: rgba(96,174,155,.08);
    color: #e7f5f1;
    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
}

.dgsolvent-intro__formula strong:nth-of-type(2) {
    min-width: 92px;
}

.dgsolvent-intro__formula strong:last-of-type {
    min-width: 90px;
}

.dgsolvent-intro__formula i {
    position: relative;
    display: block;
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, rgba(159,210,197,.34), #9fd2c5);
}

.dgsolvent-intro__formula i::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #9fd2c5;
    border-right: 1px solid #9fd2c5;
    transform: translateY(-50%) rotate(45deg);
}

.dgsolvent-intro__formula-caption {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: -6px;
    padding-bottom: 15px;
    color: rgba(255,255,255,.47);
    direction: ltr;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
}

.dgsolvent-intro__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

.dgsolvent-intro__spec {
    min-width: 0;
    min-height: 56px;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 9px;
    background: rgba(255,255,255,.022);
    direction: ltr;
}

.dgsolvent-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #a9d9ce;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .07em;
}

.dgsolvent-intro__spec strong {
    display: block;
    color: rgba(255,255,255,.78);
    font-size: 8px;
    font-weight: 700;
    line-height: 1.55;
}

.dgsolvent-intro__tags {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 28px;
    direction: ltr;
}

.dgsolvent-intro__tags span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: rgba(255,255,255,.68);
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .dgsolvent-intro {
        padding: 38px 16px 44px;
    }

    .dgsolvent-intro__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolvent-intro__profile {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
    }

    .dgsolvent-intro__copy {
        grid-column: 1;
        grid-row: 2;
    }

    .dgsolvent-intro__tags {
        margin-top: 26px;
    }
}

@media (max-width: 560px) {
    .dgsolvent-intro {
        padding: 30px 12px 36px;
    }

    .dgsolvent-intro__profile {
        padding: 26px 18px 20px;
        border-radius: 16px;
    }

    .dgsolvent-intro__title {
        margin-bottom: 20px;
        font-size: 20px;
    }

    .dgsolvent-intro__copy {
        padding: 23px 20px 21px;
        border-radius: 16px;
    }

    .dgsolvent-intro__copy::before {
        right: 20px;
    }

    .dgsolvent-intro__copy p,
    .dgsolvent-intro__copy-note {
        font-size: 13px;
        line-height: 2.08;
    }

    .dgsolvent-intro__formula {
        grid-template-columns: 1fr auto 1fr;
        gap: 7px;
        padding: 20px 0 16px;
    }

    .dgsolvent-intro__formula strong:last-of-type {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, 170px);
        margin-top: 7px;
    }

    .dgsolvent-intro__formula i:last-of-type {
        display: none;
    }

    .dgsolvent-intro__formula-caption {
        justify-content: center;
        text-align: center;
    }

    .dgsolvent-intro__specs {
        grid-template-columns: 1fr;
    }
}
/* END — Solvent Dye / Intro Below Hero v1.8.00 */


/* =========================================================
   DGCHEME — Solvent Dye Intro / Formula Overflow Fix
   v1.8.01
   Remove visible technical wrapper so formula blocks never
   appear to break outside a framed box.
========================================================= */
.dgsolvent-intro__formula {
    max-width: 100%;
}

.dgsolvent-intro__formula strong {
    box-sizing: border-box;
}

@media (max-width: 560px) {
    .dgsolvent-intro__tech {
        padding: 0;
        border: 0;
        background: transparent;
    }
}
/* END — Solvent Dye Intro Formula Overflow Fix v1.8.01 */


/* =========================================================
   DGCHEME — Solvent Dye / What Is Solvent Dye
   v1.8.02
   Alternating dark-green section after the intro.
========================================================= */
.dgsolvent-what,
.dgsolvent-what * {
    box-sizing: border-box;
}

.dgsolvent-what {
    position: relative;
    width: 100%;
    padding: 68px 20px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolvent-what::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .22;
    background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolvent-what__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolvent-what__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolvent-what__meta {
    align-self: start;
    padding: 17px 18px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolvent-what__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolvent-what__meta strong {
    display: block;
    margin-top: 8px;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolvent-what__head-copy {
    text-align: right;
}

.dgsolvent-what__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b9d7c9;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolvent-what__title {
    margin: 0;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolvent-what__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolvent-what__media,
.dgsolvent-what__content {
    direction: rtl;
}

.dgsolvent-what__media {
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    margin: 0;
    overflow: hidden;
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 18px 44px rgba(0,0,0,.18);
    z-index: 2;
}

.dgsolvent-what__media-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 1000 / 470;
    background: #e9efeb;
}

.dgsolvent-what__media-frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transform: scale(1);
    transition: transform .5s cubic-bezier(.22,.61,.36,1), filter .5s ease;
}

.dgsolvent-what__media-badge {
    position: static;
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    min-width: 0;
    padding: 14px 16px 16px;
    border-radius: 0;
    background: #f3f6f4;
    border-top: 1px solid rgba(18,59,43,.09);
    box-shadow: none;
}

.dgsolvent-what__media-badge span {
    color: #6c8277;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolvent-what__media-badge strong {
    color: #173d2e;
    direction: ltr;
    text-align: left;
    font-size: 12px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolvent-what__media-badge em {
    display: block;
    color: #566c61;
    direction: ltr;
    text-align: left;
    font-size: 9px;
    line-height: 1.55;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .02em;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolvent-what__media:hover .dgsolvent-what__media-frame img {
        transform: scale(1.045);
        filter: saturate(1.03) contrast(1.02);
    }
}

.dgsolvent-what__content {
    display: flex;
    flex-direction: column;
    padding: 28px 28px 24px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolvent-what__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-what__content p + p {
    margin-top: 16px;
}

.dgsolvent-what__content strong {
    color: #ffffff;
    font-weight: 850;
}

.dgsolvent-what__fact-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: auto;
    padding-top: 22px;
}

.dgsolvent-what__fact {
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolvent-what__fact span {
    display: block;
    margin-bottom: 5px;
    color: #9fc0b0;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolvent-what__fact b {
    display: block;
    color: #ffffff;
    font-size: 11px;
    line-height: 1.75;
    font-weight: 800;
}

.dgsolvent-what__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(214,180,90,.68);
    border-radius: 12px;
    background: rgba(214,180,90,.055);
}

.dgsolvent-what__note p {
    color: rgba(245,248,246,.82);
}

@media (max-width: 900px) {
    .dgsolvent-what__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolvent-what__meta {
        max-width: 240px;
    }

    .dgsolvent-what__grid {
        grid-template-columns: minmax(300px,.9fr) minmax(0,1.1fr);
    }
}

@media (max-width: 760px) {
    .dgsolvent-what {
        padding: 48px 14px;
    }

    .dgsolvent-what__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    /* Mobile law: section title -> image -> content */
    .dgsolvent-what__media {
        grid-row: 1;
        position: relative;
        top: auto;
    }

    .dgsolvent-what__content {
        grid-row: 2;
    }

    .dgsolvent-what__media-frame,
    .dgsolvent-what__media-frame img {
        min-height: 0;
    }

    .dgsolvent-what__media-frame {
        aspect-ratio: 1000 / 470;
    }

    .dgsolvent-what__media-frame img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
    }

    .dgsolvent-what__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolvent-what__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolvent-what__title {
        font-size: 18px;
    }

    .dgsolvent-what__fact-grid {
        grid-template-columns: 1fr;
    }

    .dgsolvent-what__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolvent-what__media-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / What Is Solvent Dye v1.8.02 */

/* =========================================================
   DGCHEME — Solvent Dye / True Dissolution Evidence
   v1.8.03
   Compact light transition section between intro and What Is Solvent Dye.
========================================================= */
.dgsolvent-dissolve,
.dgsolvent-dissolve * {
    box-sizing: border-box;
}

.dgsolvent-dissolve {
    position: relative;
    width: 100%;
    padding: 56px 20px;
    overflow: hidden;
    background:
        radial-gradient(circle at 10% 18%, rgba(34,94,70,.045), transparent 24%),
        radial-gradient(circle at 90% 78%, rgba(186,154,74,.045), transparent 22%),
        linear-gradient(180deg, #f7faf8 0%, #eef4f0 100%);
}

.dgsolvent-dissolve__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgsolvent-dissolve__shell {
    display: grid;
    grid-template-columns: minmax(330px,.86fr) minmax(0,1.14fr);
    gap: 22px;
    align-items: stretch;
    direction: ltr;
    padding: 14px;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 48px rgba(18,59,43,.075), inset 0 1px 0 rgba(255,255,255,.9);
}

.dgsolvent-dissolve__media,
.dgsolvent-dissolve__content {
    min-width: 0;
    direction: rtl;
}

.dgsolvent-dissolve__media {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #e8efeb;
}

.dgsolvent-dissolve__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
    transform: scale(1);
    transition: transform .5s cubic-bezier(.22,.61,.36,1), filter .5s ease;
}

.dgsolvent-dissolve__media-badge {
    position: absolute;
    left: 16px;
    bottom: 16px;
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
    min-width: 150px;
    padding: 11px 13px;
    border-radius: 13px;
    background: rgba(8,36,25,.84);
    border: 1px solid rgba(255,255,255,.13);
    backdrop-filter: blur(10px);
    box-shadow: 0 10px 22px rgba(0,0,0,.14);
}

.dgsolvent-dissolve__media-badge span {
    color: #a8c8b8;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolvent-dissolve__media-badge strong {
    color: #ffffff;
    font-size: 11px;
    line-height: 1.5;
    font-weight: 900;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolvent-dissolve__media:hover img {
        transform: scale(1.045);
        filter: saturate(1.025) contrast(1.015);
    }
}

.dgsolvent-dissolve__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 26px 30px 24px 20px;
}

.dgsolvent-dissolve__eyebrow {
    display: inline-block;
    align-self: flex-start;
    margin-bottom: 8px;
    color: #527363;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolvent-dissolve__title {
    margin: 0 0 14px;
    color: #123b2b;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
    text-align: right;
}

.dgsolvent-dissolve__quote {
    position: relative;
    margin: 0;
    padding: 18px 18px 18px 20px;
    border-right: 3px solid #c5a749;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(20,65,47,.045), rgba(197,167,73,.055));
    color: #435b50;
    font-size: 14px;
    line-height: 2.15;
    font-weight: 700;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-dissolve__support {
    margin: 16px 0 0;
    color: #66776f;
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-dissolve__signals {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 18px;
}

.dgsolvent-dissolve__signal {
    padding: 10px 11px;
    border: 1px solid rgba(18,59,43,.08);
    border-radius: 12px;
    background: #f6f9f7;
}

.dgsolvent-dissolve__signal span {
    display: block;
    margin-bottom: 4px;
    color: #74877d;
    direction: ltr;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolvent-dissolve__signal strong {
    display: block;
    color: #1b4533;
    font-size: 10px;
    line-height: 1.65;
    font-weight: 800;
}

@media (max-width: 900px) {
    .dgsolvent-dissolve__shell {
        grid-template-columns: minmax(290px,.9fr) minmax(0,1.1fr);
    }

    .dgsolvent-dissolve__signals {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolvent-dissolve {
        padding: 44px 14px;
    }

    .dgsolvent-dissolve__shell {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 12px;
    }

    /* Mobile law: title belongs to content, visual precedes body copy. */
    .dgsolvent-dissolve__media {
        grid-row: 1;
    }

    .dgsolvent-dissolve__content {
        grid-row: 2;
        padding: 22px 10px 8px;
    }

    .dgsolvent-dissolve__media img {
        min-height: 0;
        aspect-ratio: 1 / 1;
    }
}

@media (max-width: 560px) {
    .dgsolvent-dissolve__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolvent-dissolve__title {
        font-size: 18px;
    }

    .dgsolvent-dissolve__quote {
        padding: 15px 14px 15px 16px;
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolvent-dissolve__media img {
        transition: none;
    }
}
/* END — Solvent Dye / True Dissolution Evidence v1.8.03 */


/* =========================================================
   DGCHEME — Solvent Dye / Chemical Structure Navigator
   v1.8.06
   Light section after the green "What is Solvent Dye?" block.
========================================================= */
.dgsolvent-chemnav,
.dgsolvent-chemnav * {
    box-sizing: border-box;
}

.dgsolvent-chemnav {
    position: relative;
    width: 100%;
    padding: 68px 20px 72px;
    overflow: hidden;
    background:
        radial-gradient(circle at 7% 12%, rgba(35, 88, 66, .04), transparent 22%),
        radial-gradient(circle at 92% 86%, rgba(165, 129, 55, .035), transparent 20%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolvent-chemnav__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgsolvent-chemnav__head {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolvent-chemnav__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18, 59, 43, .10);
    background: rgba(255,255,255,.78);
    box-shadow:
        0 10px 24px rgba(18, 59, 43, .055),
        inset 0 1px 0 rgba(255,255,255,.85);
}

.dgsolvent-chemnav__meta span {
    display: block;
    color: #698076;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolvent-chemnav__meta strong {
    display: block;
    margin-top: 7px;
    color: #163f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolvent-chemnav__head-copy {
    text-align: right;
}

.dgsolvent-chemnav__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #5e766b;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolvent-chemnav__title {
    margin: 0;
    color: #153d2e;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolvent-chemnav__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    grid-template-areas: "content nav";
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgsolvent-chemnav__content {
    grid-area: content;
    direction: rtl;
    min-width: 0;
    padding: 30px 30px 28px;
    border-radius: 22px;
    border: 1px solid rgba(18, 59, 43, .09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18, 59, 43, .07),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolvent-chemnav__content p {
    margin: 0;
    color: #51665b;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-chemnav__content p + p {
    margin-top: 16px;
}

.dgsolvent-chemnav__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolvent-chemnav__summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(18, 59, 43, .08);
}

.dgsolvent-chemnav__summary span {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-height: 74px;
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid rgba(18, 59, 43, .075);
    background: #f4f7f5;
}

.dgsolvent-chemnav__summary small {
    color: #70857b;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolvent-chemnav__summary b {
    color: #193f30;
    font-size: 11px;
    line-height: 1.75;
    font-weight: 800;
}

.dgsolvent-chemnav__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid #b6a34c;
    border-radius: 12px;
    background: rgba(182, 163, 76, .07);
}

.dgsolvent-chemnav__note p {
    color: #52665c;
}

.dgsolvent-chemnav__nav {
    grid-area: nav;
    direction: rtl;
    display: grid;
    gap: 10px;
    position: sticky;
    top: 108px;
    align-self: start;
}

.dgsolvent-chemnav__nav-head {
    padding: 16px 17px 14px;
    border-radius: 16px;
    border: 1px solid rgba(18, 59, 43, .09);
    background: linear-gradient(145deg, #eff4f1 0%, #e6eee9 100%);
}

.dgsolvent-chemnav__nav-head span {
    display: block;
    color: #70847a;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolvent-chemnav__nav-head strong {
    display: block;
    margin-top: 5px;
    color: #173e2f;
    font-size: 13px;
    line-height: 1.7;
    font-weight: 900;
}

.dgsolvent-chemnav__card {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0,1fr) 30px;
    gap: 12px;
    align-items: center;
    min-height: 78px;
    padding: 12px 13px;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid rgba(18, 59, 43, .09);
    background: rgba(255,255,255,.96);
    color: inherit;
    text-decoration: none;
    box-shadow: 0 10px 22px rgba(18, 59, 43, .055);
    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease;
}

.dgsolvent-chemnav__card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, #315f4d 0%, #b6a34c 100%);
    opacity: .72;
}

.dgsolvent-chemnav__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    border: 1px solid rgba(18, 59, 43, .10);
    background: #f2f6f3;
    color: #173f2f;
    font-size: 11px;
    line-height: 1;
    font-weight: 900;
}

.dgsolvent-chemnav__identity {
    min-width: 0;
    text-align: right;
}

.dgsolvent-chemnav__identity strong {
    display: block;
    margin-bottom: 3px;
    color: #193e30;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgsolvent-chemnav__identity span {
    display: block;
    color: #74857d;
    direction: ltr;
    text-align: right;
    font-size: 8px;
    line-height: 1.45;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgsolvent-chemnav__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 1px solid rgba(18, 59, 43, .08);
    background: #f4f7f5;
    color: #325947;
    transition: transform .28s ease, background .28s ease, color .28s ease;
}

.dgsolvent-chemnav__arrow svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolvent-chemnav__card:hover {
        transform: translateY(-3px);
        border-color: rgba(49, 95, 77, .20);
        background: #ffffff;
        box-shadow: 0 16px 30px rgba(18, 59, 43, .10);
    }

    .dgsolvent-chemnav__card:hover .dgsolvent-chemnav__arrow {
        transform: translateY(2px);
        background: #173f2f;
        color: #ffffff;
    }
}

.dgsolvent-chemnav__card:focus-visible {
    outline: 2px solid rgba(49, 95, 77, .45);
    outline-offset: 3px;
}

#solvent-dye-azo,
#solvent-dye-anthraquinone,
#solvent-dye-triarylmethane,
#solvent-dye-metal-complex,
#solvent-dye-heterocyclic {
    scroll-margin-top: 112px;
}

@media (max-width: 900px) {
    .dgsolvent-chemnav__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolvent-chemnav__meta {
        max-width: 240px;
    }

    .dgsolvent-chemnav__grid {
        grid-template-columns: minmax(0,1fr) 330px;
    }
}

@media (max-width: 760px) {
    .dgsolvent-chemnav {
        padding: 48px 14px 52px;
    }

    .dgsolvent-chemnav__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "content"
            "nav";
        gap: 14px;
    }

    .dgsolvent-chemnav__nav {
        position: relative;
        top: auto;
    }

    .dgsolvent-chemnav__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolvent-chemnav__summary {
        grid-template-columns: 1fr;
    }

    .dgsolvent-chemnav__card {
        grid-template-columns: 40px minmax(0,1fr) 28px;
        gap: 10px;
        min-height: 72px;
        padding: 10px 11px;
    }

    .dgsolvent-chemnav__index {
        width: 40px;
        height: 40px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolvent-chemnav__card,
    .dgsolvent-chemnav__arrow {
        transition: none;
    }
}
/* END — Solvent Dye / Chemical Structure Navigator v1.8.06 */


/* =========================================================
   DGCHEME — Solvent Dye / Azo Family
   v1.8.07
   Dark-green chemistry section after the light structure index.
   Desktop: molecular card LEFT / content RIGHT.
   Mobile: title -> molecular image -> content -> azo classes.
========================================================= */
.dgsolv-azo,
.dgsolv-azo * {
    box-sizing: border-box;
}

.dgsolv-azo {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-azo::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .20;
    background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-azo__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-azo__head {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-azo__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-azo__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-azo__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-azo__head-copy {
    text-align: right;
}

.dgsolv-azo__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-azo__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-azo__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-azo__grid {
    display: grid;
    grid-template-columns: minmax(340px, .92fr) minmax(0, 1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-azo__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
    height: fit-content;
}

.dgsolv-azo__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-azo__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-azo__media-head span {
    color: #73857c;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-azo__media-head strong {
    color: #173f2f;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-azo__figure {
    margin: 0;
}

.dgsolv-azo__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 24px 22px;
    background:
        radial-gradient(circle at 50% 50%, rgba(28,82,59,.045), transparent 42%),
        #ffffff;
}

.dgsolv-azo__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 392 / 183;
    object-fit: contain;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-azo__image-frame:hover img {
        transform: scale(1.04);
        filter: contrast(1.015);
    }
}

.dgsolv-azo__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f2f6f3;
    direction: rtl;
}

.dgsolv-azo__caption-label {
    margin-bottom: 6px;
    color: #778a80;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-azo__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-azo__caption p {
    margin: 0;
    color: #5c7066;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-azo__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-azo__molecule-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f2f6f3;
    direction: ltr;
}

.dgsolv-azo__molecule-meta span {
    min-width: 0;
    padding: 10px 9px;
    border-radius: 12px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.72);
}

.dgsolv-azo__molecule-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7a8d83;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-azo__molecule-meta b {
    display: block;
    overflow-wrap: anywhere;
    color: #1c4736;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-azo__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-azo__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-azo__content p + p {
    margin-top: 16px;
}

.dgsolv-azo__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-azo__classes-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
    direction: ltr;
}

.dgsolv-azo__classes-head span {
    color: #a5c2b3;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgsolv-azo__classes-head strong {
    color: #fff;
    direction: rtl;
    font-size: 12px;
    line-height: 1.65;
    font-weight: 900;
}

.dgsolv-azo__class-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
    direction: ltr;
}

.dgsolv-azo__class-card {
    position: relative;
    min-width: 0;
    min-height: 176px;
    padding: 16px 14px 14px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);
    direction: rtl;
}

.dgsolv-azo__class-card--active {
    border-color: rgba(207,184,79,.42);
    background:
        radial-gradient(circle at 90% 8%, rgba(207,184,79,.14), transparent 34%),
        rgba(207,184,79,.065);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
}

.dgsolv-azo__class-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    margin-bottom: 13px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.055);
    color: #d8e7df;
    direction: ltr;
    font-size: 9px;
    line-height: 1;
    font-weight: 900;
}

.dgsolv-azo__class-card--active .dgsolv-azo__class-no {
    border-color: rgba(207,184,79,.32);
    background: rgba(207,184,79,.12);
    color: #f0df91;
}

.dgsolv-azo__class-top {
    margin-bottom: 4px;
    color: #a4c1b2;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgsolv-azo__class-card--active .dgsolv-azo__class-top {
    color: #e3cd72;
}

.dgsolv-azo__class-card h3 {
    margin: 0 0 7px;
    color: #fff;
    font-size: 14px;
    line-height: 1.7;
    font-weight: 900;
}

.dgsolv-azo__class-card p {
    margin: 0;
    color: rgba(235,244,239,.67);
    font-size: 11px;
    line-height: 1.9;
}

.dgsolv-azo__class-card p strong {
    color: #fff;
}

@media (max-width: 900px) {
    .dgsolv-azo__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-azo__meta {
        max-width: 240px;
    }

    .dgsolv-azo__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-azo__molecule-meta {
        grid-template-columns: 1fr;
    }

    .dgsolv-azo__class-grid {
        grid-template-columns: 1fr;
    }

    .dgsolv-azo__class-card {
        min-height: 0;
    }
}

@media (max-width: 760px) {
    .dgsolv-azo {
        padding: 48px 14px 52px;
    }

    .dgsolv-azo__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-azo__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-azo__content {
        padding: 22px 20px 20px;
    }

    .dgsolv-azo__class-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .dgsolv-azo__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-azo__image-frame {
        padding: 20px 14px;
    }

    .dgsolv-azo__caption {
        padding: 14px 15px 16px;
    }

    .dgsolv-azo__content p {
        font-size: 13px;
        line-height: 2.05;
    }

    .dgsolv-azo__classes-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-azo__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Azo Family v1.8.07 */


/* =========================================================
   DGCHEME — Solvent Dye / Anthraquinone Family
   v1.8.08
   Light section after Azo. Natural-size sticky media.
========================================================= */
.dgsolv-anthra,
.dgsolv-anthra * {
    box-sizing: border-box;
}

.dgsolv-anthra {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 7% 14%, rgba(43, 91, 72, .045), transparent 23%),
        radial-gradient(circle at 92% 84%, rgba(92, 78, 146, .035), transparent 21%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-anthra__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-anthra__head {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-anthra__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-anthra__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-anthra__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-anthra__head-copy {
    text-align: right;
}

.dgsolv-anthra__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-anthra__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-anthra__subtitle {
    display: block;
    margin-top: 2px;
    color: #75857e;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-anthra__grid {
    display: grid;
    grid-template-columns: minmax(340px, .92fr) minmax(0, 1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-anthra__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-anthra__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.10);
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgsolv-anthra__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgsolv-anthra__media-head span {
    color: #778981;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-anthra__media-head strong {
    color: #5b4c76;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-anthra__figure {
    margin: 0;
}

.dgsolv-anthra__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 50%, rgba(92,76,118,.05), transparent 44%),
        #f8faf9;
}

.dgsolv-anthra__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 398 / 338;
    object-fit: contain;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-anthra__image-frame:hover img {
        transform: scale(1.04);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-anthra__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-anthra__caption-label {
    margin-bottom: 6px;
    color: #788b82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-anthra__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-anthra__caption p {
    margin: 0;
    color: #5e7168;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-anthra__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-anthra__media-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-anthra__media-meta span {
    min-width: 0;
    padding: 10px 9px;
    border-radius: 12px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
}

.dgsolv-anthra__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-anthra__media-meta b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-anthra__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18,59,43,.07),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-anthra__content p {
    margin: 0;
    color: #52665c;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-anthra__content p + p {
    margin-top: 16px;
}

.dgsolv-anthra__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-anthra__traits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsolv-anthra__trait {
    position: relative;
    min-height: 94px;
    padding: 14px 14px 13px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f4f7f5;
}

.dgsolv-anthra__trait span {
    display: block;
    margin-bottom: 6px;
    color: #75658c;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-anthra__trait strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-anthra__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid #75658c;
    border-radius: 12px;
    background: rgba(117,101,140,.065);
}

.dgsolv-anthra__note p {
    color: #56685f;
}

@media (max-width: 900px) {
    .dgsolv-anthra__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-anthra__meta {
        max-width: 240px;
    }

    .dgsolv-anthra__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-anthra__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-anthra {
        padding: 48px 14px 52px;
    }

    .dgsolv-anthra__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-anthra__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-anthra__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-anthra__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-anthra__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-anthra__image-frame {
        padding: 14px;
    }

    .dgsolv-anthra__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-anthra__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Anthraquinone Family v1.8.08 */


/* =========================================================
   DGCHEME — Solvent Dye / Triarylmethane Family
   v1.8.09
   Dark-green section after Anthraquinone.
   Desktop: sticky media LEFT / content RIGHT.
========================================================= */
.dgsolv-triaryl,
.dgsolv-triaryl * {
    box-sizing: border-box;
}

.dgsolv-triaryl {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-triaryl::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .20;
    background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-triaryl__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-triaryl__head {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-triaryl__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-triaryl__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-triaryl__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-triaryl__head-copy {
    text-align: right;
}

.dgsolv-triaryl__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-triaryl__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-triaryl__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-triaryl__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-triaryl__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-triaryl__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-triaryl__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-triaryl__media-head span {
    color: #74877e;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-triaryl__media-head strong {
    color: #173f2f;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-triaryl__figure {
    margin: 0;
}

.dgsolv-triaryl__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 50%, rgba(59,99,80,.045), transparent 44%),
        #fff;
}

.dgsolv-triaryl__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 428 / 367;
    object-fit: contain;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-triaryl__image-frame:hover img {
        transform: scale(1.04);
        filter: contrast(1.015);
    }
}

.dgsolv-triaryl__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-triaryl__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-triaryl__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-triaryl__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-triaryl__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-triaryl__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-triaryl__media-meta span {
    min-width: 0;
    padding: 10px 9px;
    border-radius: 12px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
}

.dgsolv-triaryl__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-triaryl__media-meta b {
    display: block;
    overflow-wrap: anywhere;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-triaryl__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-triaryl__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-triaryl__content p + p {
    margin-top: 16px;
}

.dgsolv-triaryl__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-triaryl__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsolv-triaryl__trait {
    min-height: 94px;
    padding: 14px 14px 13px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolv-triaryl__trait span {
    display: block;
    margin-bottom: 6px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-triaryl__trait strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-triaryl__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(212,190,92,.72);
    border-radius: 12px;
    background: rgba(212,190,92,.055);
}

.dgsolv-triaryl__note p {
    color: rgba(241,248,244,.78);
}

@media (max-width: 900px) {
    .dgsolv-triaryl__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-triaryl__meta {
        max-width: 240px;
    }

    .dgsolv-triaryl__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-triaryl__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-triaryl {
        padding: 48px 14px 52px;
    }

    .dgsolv-triaryl__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-triaryl__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-triaryl__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-triaryl__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-triaryl__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-triaryl__image-frame {
        padding: 14px;
    }

    .dgsolv-triaryl__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-triaryl__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Triarylmethane Family v1.8.09 */


/* =========================================================
   DGCHEME — Solvent Dye / Metal Complex Family
   v1.8.10
   Light section after Triarylmethane.
   Desktop: sticky media LEFT / content RIGHT.
========================================================= */
.dgsolv-metalcomplex,
.dgsolv-metalcomplex * {
    box-sizing: border-box;
}

.dgsolv-metalcomplex {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 7% 14%, rgba(43,91,72,.045), transparent 23%),
        radial-gradient(circle at 92% 84%, rgba(184,151,62,.045), transparent 21%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-metalcomplex__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-metalcomplex__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-metalcomplex__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-metalcomplex__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-metalcomplex__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-metalcomplex__head-copy {
    text-align: right;
}

.dgsolv-metalcomplex__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-metalcomplex__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-metalcomplex__subtitle {
    display: block;
    margin-top: 2px;
    color: #75857e;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-metalcomplex__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-metalcomplex__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-metalcomplex__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.10);
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgsolv-metalcomplex__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgsolv-metalcomplex__media-head span {
    color: #778981;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-metalcomplex__media-head strong {
    color: #9a7e2b;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-metalcomplex__figure {
    margin: 0;
}

.dgsolv-metalcomplex__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 50%, rgba(182,155,75,.06), transparent 44%),
        #f8faf9;
}

.dgsolv-metalcomplex__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-metalcomplex__image-frame:hover img {
        transform: scale(1.04);
        filter: contrast(1.015) saturate(1.025);
    }
}

.dgsolv-metalcomplex__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-metalcomplex__caption-label {
    margin-bottom: 6px;
    color: #788b82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-metalcomplex__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-metalcomplex__caption p {
    margin: 0;
    color: #5e7168;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-metalcomplex__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-metalcomplex__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-metalcomplex__media-meta span {
    min-width: 0;
    padding: 10px 9px;
    border-radius: 12px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
}

.dgsolv-metalcomplex__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-metalcomplex__media-meta b {
    display: block;
    overflow-wrap: anywhere;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-metalcomplex__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18,59,43,.07),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-metalcomplex__content p {
    margin: 0;
    color: #52665c;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-metalcomplex__content p + p {
    margin-top: 16px;
}

.dgsolv-metalcomplex__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-metalcomplex__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsolv-metalcomplex__trait {
    min-height: 94px;
    padding: 14px 14px 13px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f4f7f5;
}

.dgsolv-metalcomplex__trait span {
    display: block;
    margin-bottom: 6px;
    color: #947c32;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-metalcomplex__trait strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-metalcomplex__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid #aa8d35;
    border-radius: 12px;
    background: rgba(170,141,53,.065);
}

.dgsolv-metalcomplex__note p {
    color: #56685f;
}

@media (max-width: 900px) {
    .dgsolv-metalcomplex__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-metalcomplex__meta {
        max-width: 240px;
    }

    .dgsolv-metalcomplex__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-metalcomplex__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-metalcomplex {
        padding: 48px 14px 52px;
    }

    .dgsolv-metalcomplex__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-metalcomplex__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-metalcomplex__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-metalcomplex__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-metalcomplex__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-metalcomplex__image-frame {
        padding: 14px;
    }

    .dgsolv-metalcomplex__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-metalcomplex__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Metal Complex Family v1.8.10 */


/* =========================================================
   DGCHEME — Solvent Dye / Heterocyclic Family
   v1.8.11
   Dark-green section after Metal Complex.
   Desktop: sticky media LEFT / content RIGHT.
========================================================= */
.dgsolv-hetero,
.dgsolv-hetero * {
    box-sizing: border-box;
}

.dgsolv-hetero {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-hetero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .20;
    background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-hetero__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-hetero__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-hetero__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-hetero__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-hetero__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-hetero__head-copy {
    text-align: right;
}

.dgsolv-hetero__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-hetero__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-hetero__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-hetero__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-hetero__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-hetero__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-hetero__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-hetero__media-head span {
    color: #74877e;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-hetero__media-head strong {
    color: #276245;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-hetero__figure {
    margin: 0;
}

.dgsolv-hetero__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 50%, rgba(50,112,80,.06), transparent 44%),
        #fff;
}

.dgsolv-hetero__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 733 / 526;
    object-fit: contain;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-hetero__image-frame:hover img {
        transform: scale(1.04);
        filter: contrast(1.02) saturate(1.035);
    }
}

.dgsolv-hetero__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-hetero__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-hetero__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-hetero__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-hetero__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-hetero__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-hetero__media-meta span {
    min-width: 0;
    padding: 10px 9px;
    border-radius: 12px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
}

.dgsolv-hetero__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-hetero__media-meta b {
    display: block;
    overflow-wrap: anywhere;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-hetero__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-hetero__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-hetero__content p + p {
    margin-top: 16px;
}

.dgsolv-hetero__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-hetero__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsolv-hetero__trait {
    min-height: 94px;
    padding: 14px 14px 13px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolv-hetero__trait span {
    display: block;
    margin-bottom: 6px;
    color: #9dd4b8;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-hetero__trait strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-hetero__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(92,207,144,.60);
    border-radius: 12px;
    background: rgba(92,207,144,.055);
}

.dgsolv-hetero__note p {
    color: rgba(241,248,244,.78);
}

@media (max-width: 900px) {
    .dgsolv-hetero__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-hetero__meta {
        max-width: 240px;
    }

    .dgsolv-hetero__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-hetero__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-hetero {
        padding: 48px 14px 52px;
    }

    .dgsolv-hetero__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-hetero__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-hetero__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-hetero__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-hetero__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-hetero__image-frame {
        padding: 14px;
    }

    .dgsolv-hetero__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-hetero__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Heterocyclic Family v1.8.11 */


/* =========================================================
   DGCHEME — Solvent Dye / Applications Navigator
   v1.8.13
   Main application index only. Printing subcategories live
   inside the Printing section, not in this overview.
========================================================= */
.dgsolv-appnav,
.dgsolv-appnav * {
    box-sizing: border-box;
}

.dgsolv-appnav {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 8% 14%, rgba(35,88,66,.045), transparent 23%),
        radial-gradient(circle at 91% 84%, rgba(166,135,56,.04), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-appnav__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgsolv-appnav__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-appnav__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-appnav__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-appnav__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-appnav__head-copy {
    text-align: right;
}

.dgsolv-appnav__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-appnav__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-appnav__lead {
    max-width: 850px;
    margin: 10px 0 0 auto;
    color: #5a6e64;
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-appnav__layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 320px;
    grid-template-areas: "grid rail";
    gap: 22px;
    align-items: start;
    direction: ltr;
}

.dgsolv-appnav__grid {
    grid-area: grid;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    align-items: stretch;
    direction: rtl;
}

.dgsolv-appnav__item {
    position: relative;
    display: grid;
    grid-template-columns: 54px minmax(0,1fr) 34px;
    gap: 13px;
    align-items: center;
    min-height: 118px;
    padding: 16px;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    color: inherit;
    text-decoration: none;
    box-shadow:
        0 14px 30px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.9);
    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease;
}

.dgsolv-appnav__item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, #315f4d 0%, #b69e43 100%);
    opacity: .78;
}

.dgsolv-appnav__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.10);
    background: #f2f6f3;
    color: #173f2f;
    direction: ltr;
    font-size: 11px;
    line-height: 1;
    font-weight: 900;
}

.dgsolv-appnav__identity {
    min-width: 0;
    text-align: right;
}

.dgsolv-appnav__identity strong {
    display: block;
    margin-bottom: 4px;
    color: #193f30;
    font-size: 14px;
    line-height: 1.7;
    font-weight: 900;
}

.dgsolv-appnav__identity span {
    display: block;
    color: #73857d;
    direction: ltr;
    text-align: right;
    font-size: 8px;
    line-height: 1.45;
    font-weight: 900;
    letter-spacing: .055em;
}

.dgsolv-appnav__identity small {
    display: block;
    margin-top: 6px;
    color: #667970;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 700;
}

.dgsolv-appnav__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(18,59,43,.08);
    background: #f3f7f4;
    color: #315f4d;
    transition: transform .28s ease, background .28s ease, color .28s ease;
}

.dgsolv-appnav__arrow svg {
    width: 15px;
    height: 15px;
    fill: currentColor;
}

.dgsolv-appnav__rail {
    grid-area: rail;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    padding: 18px;
    border-radius: 18px;
    border: 1px solid rgba(18,59,43,.09);
    background: linear-gradient(145deg,#edf3ef 0%,#e5eee8 100%);
}

.dgsolv-appnav__rail-label {
    display: block;
    color: #70847a;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-appnav__rail strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-appnav__rail p {
    margin: 10px 0 0;
    color: #5d7167;
    font-size: 11px;
    line-height: 1.9;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-appnav__rail-list {
    display: grid;
    gap: 7px;
    margin-top: 14px;
}

.dgsolv-appnav__rail-list span {
    display: block;
    padding: 11px 12px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.075);
    background: rgba(255,255,255,.68);
}

.dgsolv-appnav__rail-list b {
    display: block;
    margin-bottom: 4px;
    color: #173f2f;
    font-size: 10px;
    line-height: 1.55;
    font-weight: 900;
}

.dgsolv-appnav__rail-list small {
    display: block;
    color: #687b72;
    direction: rtl;
    text-align: right;
    font-size: 9px;
    line-height: 1.75;
    font-weight: 700;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-appnav__item:hover {
        transform: translateY(-3px);
        border-color: rgba(49,95,77,.19);
        background: #fff;
        box-shadow: 0 18px 34px rgba(18,59,43,.10);
    }

    .dgsolv-appnav__item:hover .dgsolv-appnav__arrow {
        transform: translateY(2px);
        background: #173f2f;
        color: #fff;
    }
}

.dgsolv-appnav__link:focus-visible {
    outline: 2px solid rgba(49,95,77,.45);
    outline-offset: 3px;
}

#solvent-dye-application-plastics,
#solvent-dye-application-petrochemical,
#solvent-dye-application-candle,
#solvent-dye-application-printing,
#solvent-dye-application-printing-ink,
#solvent-dye-application-printing-metallized-film,
#solvent-dye-application-textile,
#solvent-dye-application-ndt {
    scroll-margin-top: 112px;
}

@media (max-width: 980px) {
    .dgsolv-appnav__layout {
        grid-template-columns: minmax(0,1fr) 280px;
    }
}

@media (max-width: 800px) {
    .dgsolv-appnav__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-appnav__meta {
        max-width: 250px;
    }

    .dgsolv-appnav__layout {
        grid-template-columns: 1fr;
        grid-template-areas:
            "grid"
            "rail";
    }

    .dgsolv-appnav__rail {
        position: relative;
        top: auto;
    }
}

@media (max-width: 620px) {
    .dgsolv-appnav {
        padding: 48px 14px 52px;
    }

    .dgsolv-appnav__grid {
        grid-template-columns: 1fr;
    }

    .dgsolv-appnav__item {
        grid-template-columns: 48px minmax(0,1fr) 30px;
        min-height: 104px;
        padding: 14px 13px;
    }

    .dgsolv-appnav__number {
        width: 48px;
        height: 48px;
        border-radius: 13px;
    }

    .dgsolv-appnav__identity strong {
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-appnav__item,
    .dgsolv-appnav__arrow {
        transition: none;
    }
}
/* END — Solvent Dye / Applications Navigator v1.8.13 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 01 — Plastics
   v1.8.15
   Dark-green section after applications index.
   Desktop: sticky image LEFT / content RIGHT.
========================================================= */
.dgsolv-app-plastic,
.dgsolv-app-plastic * {
    box-sizing: border-box;
}

.dgsolv-app-plastic {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-app-plastic::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-app-plastic__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-plastic__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-app-plastic__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-app-plastic__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-plastic__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-plastic__head-copy {
    text-align: right;
}

.dgsolv-app-plastic__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-plastic__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-plastic__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-plastic__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-plastic__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-app-plastic__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-app-plastic__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-app-plastic__media-head span {
    color: #74877e;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-plastic__media-head strong {
    color: #173f2f;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-plastic__figure {
    margin: 0;
}

.dgsolv-app-plastic__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #fff;
}

.dgsolv-app-plastic__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 800 / 533;
    object-fit: cover;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-plastic__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-plastic__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-plastic__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-plastic__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-plastic__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-plastic__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-plastic__polymer-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 7px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-app-plastic__polymer-grid span {
    min-width: 0;
    padding: 10px 7px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
    text-align: center;
}

.dgsolv-app-plastic__polymer-grid b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-app-plastic__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-app-plastic__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-plastic__content p + p {
    margin-top: 16px;
}

.dgsolv-app-plastic__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-app-plastic__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsolv-app-plastic__trait {
    min-height: 96px;
    padding: 14px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolv-app-plastic__trait span {
    display: block;
    margin-bottom: 6px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-plastic__trait strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-plastic__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(212,190,92,.72);
    border-radius: 12px;
    background: rgba(212,190,92,.055);
}

.dgsolv-app-plastic__note p {
    color: rgba(241,248,244,.78);
}

@media (max-width: 900px) {
    .dgsolv-app-plastic__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-plastic__meta {
        max-width: 240px;
    }

    .dgsolv-app-plastic__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-app-plastic__polymer-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgsolv-app-plastic {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-plastic__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-plastic__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-app-plastic__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-plastic__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-plastic__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-plastic__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-plastic__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 01 — Plastics v1.8.15 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 02 — Petrochemical
   v1.8.16
   Light section after Plastics.
   Desktop: sticky image LEFT / content RIGHT.
========================================================= */
.dgsolv-app-petro,
.dgsolv-app-petro * {
    box-sizing: border-box;
}

.dgsolv-app-petro {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 8% 14%, rgba(35,88,66,.045), transparent 23%),
        radial-gradient(circle at 91% 84%, rgba(166,135,56,.04), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-app-petro__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-petro__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-app-petro__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-app-petro__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-petro__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-petro__head-copy {
    text-align: right;
}

.dgsolv-app-petro__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-petro__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-petro__subtitle {
    display: block;
    margin-top: 2px;
    color: #75857e;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-petro__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-petro__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-app-petro__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.10);
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgsolv-app-petro__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgsolv-app-petro__media-head span {
    color: #778981;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-petro__media-head strong {
    color: #173f2f;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-petro__figure {
    margin: 0;
}

.dgsolv-app-petro__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #fff;
}

.dgsolv-app-petro__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1024 / 512;
    object-fit: cover;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-petro__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-petro__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-petro__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-petro__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-petro__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-petro__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-petro__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-app-petro__media-meta span {
    min-width: 0;
    padding: 10px 8px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
    text-align: center;
}

.dgsolv-app-petro__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-petro__media-meta b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-app-petro__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18,59,43,.07),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-app-petro__content p {
    margin: 0;
    color: #52665c;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-petro__content p + p {
    margin-top: 16px;
}

.dgsolv-app-petro__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-petro__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsolv-app-petro__trait {
    min-height: 96px;
    padding: 14px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f4f7f5;
}

.dgsolv-app-petro__trait span {
    display: block;
    margin-bottom: 6px;
    color: #7b6b38;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-petro__trait strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-petro__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid #a88b35;
    border-radius: 12px;
    background: rgba(168,139,53,.065);
}

.dgsolv-app-petro__note p {
    color: #56685f;
}

@media (max-width: 900px) {
    .dgsolv-app-petro__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-petro__meta {
        max-width: 240px;
    }

    .dgsolv-app-petro__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-app-petro__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-app-petro {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-petro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-petro__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-app-petro__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-petro__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-petro__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-petro__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-petro__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 02 — Petrochemical v1.8.16 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 03 — Candle Making
   v1.8.17
   Dark-green section after Petrochemical.
========================================================= */
.dgsolv-app-candle,
.dgsolv-app-candle * {
    box-sizing: border-box;
}

.dgsolv-app-candle {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-app-candle::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-app-candle__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-candle__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-app-candle__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
}

.dgsolv-app-candle__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-candle__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-candle__head-copy {
    text-align: right;
}

.dgsolv-app-candle__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-candle__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-candle__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-candle__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-candle__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-app-candle__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-app-candle__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-app-candle__media-head span,
.dgsolv-app-candle__media-head strong {
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .1em;
}

.dgsolv-app-candle__media-head span {
    color: #74877e;
}

.dgsolv-app-candle__media-head strong {
    color: #173f2f;
}

.dgsolv-app-candle__figure {
    margin: 0;
}

.dgsolv-app-candle__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #fff;
}

.dgsolv-app-candle__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 800 / 533;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-candle__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-candle__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-candle__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-candle__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-candle__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-candle__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-candle__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-app-candle__media-meta span {
    min-width: 0;
    padding: 10px 8px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
    text-align: center;
}

.dgsolv-app-candle__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-candle__media-meta b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-app-candle__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
}

.dgsolv-app-candle__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-candle__content p + p {
    margin-top: 16px;
}

.dgsolv-app-candle__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-app-candle__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsolv-app-candle__trait {
    min-height: 96px;
    padding: 14px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolv-app-candle__trait span {
    display: block;
    margin-bottom: 6px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-candle__trait strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-candle__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(212,190,92,.72);
    border-radius: 12px;
    background: rgba(212,190,92,.055);
}

.dgsolv-app-candle__note p {
    color: rgba(241,248,244,.78);
}

@media (max-width: 900px) {
    .dgsolv-app-candle__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-candle__meta {
        max-width: 240px;
    }

    .dgsolv-app-candle__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-app-candle__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-app-candle {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-candle__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-candle__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-app-candle__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-candle__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-candle__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-candle__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-candle__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 03 — Candle Making v1.8.17 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 04 — Printing
   v1.8.18
   Two-part application section:
   04A Ink Manufacturing / 04B Metallized Films
========================================================= */
.dgsolv-app-print,
.dgsolv-app-print * {
    box-sizing: border-box;
}

.dgsolv-app-print {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 8% 14%, rgba(35,88,66,.045), transparent 23%),
        radial-gradient(circle at 91% 84%, rgba(166,135,56,.04), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-app-print__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-print__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 24px;
}

.dgsolv-app-print__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-app-print__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-print__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-print__head-copy {
    text-align: right;
}

.dgsolv-app-print__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-print__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-print__subtitle {
    display: block;
    margin-top: 2px;
    color: #75857e;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-print__lead {
    margin: 10px 0 0;
    color: #566a60;
    font-size: 13px;
    line-height: 2.05;
    text-align: justify;
    text-align-last: right;
}

/* clickable 04A / 04B navigation */
.dgsolv-app-print__nav {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 26px;
    direction: ltr;
}

.dgsolv-app-print__nav-card {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0,1fr) 34px;
    gap: 13px;
    align-items: center;
    min-height: 108px;
    padding: 15px 16px;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.97);
    color: inherit;
    text-decoration: none;
    box-shadow:
        0 14px 30px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.dgsolv-app-print__nav-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg,#315f4d 0%,#b69e43 100%);
}

.dgsolv-app-print__nav-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.10);
    background: #f2f6f3;
    color: #173f2f;
    direction: ltr;
    font-size: 10px;
    line-height: 1;
    font-weight: 900;
}

.dgsolv-app-print__nav-copy {
    min-width: 0;
    direction: rtl;
    text-align: right;
}

.dgsolv-app-print__nav-copy strong {
    display: block;
    color: #193f30;
    font-size: 14px;
    line-height: 1.7;
    font-weight: 900;
}

.dgsolv-app-print__nav-copy span {
    display: block;
    margin-top: 3px;
    color: #74867d;
    direction: ltr;
    text-align: right;
    font-size: 8px;
    line-height: 1.45;
    font-weight: 900;
    letter-spacing: .05em;
}

.dgsolv-app-print__nav-copy small {
    display: block;
    margin-top: 6px;
    color: #667970;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 700;
}

.dgsolv-app-print__nav-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(18,59,43,.08);
    background: #f3f7f4;
    color: #315f4d;
    transition: transform .28s ease, background .28s ease, color .28s ease;
}

.dgsolv-app-print__nav-arrow svg {
    width: 15px;
    height: 15px;
    fill: currentColor;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-print__nav-card:hover {
        transform: translateY(-3px);
        border-color: rgba(49,95,77,.19);
        box-shadow: 0 18px 34px rgba(18,59,43,.10);
    }

    .dgsolv-app-print__nav-card:hover .dgsolv-app-print__nav-arrow {
        transform: translateY(2px);
        background: #173f2f;
        color: #fff;
    }
}

.dgsolv-app-print__nav-card:focus-visible {
    outline: 2px solid rgba(49,95,77,.45);
    outline-offset: 3px;
}

/* sub-sections */
.dgsolv-app-print__part {
    position: relative;
    padding: 26px;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18,59,43,.07),
        inset 0 1px 0 rgba(255,255,255,.88);
    scroll-margin-top: 112px;
}

.dgsolv-app-print__part + .dgsolv-app-print__part {
    margin-top: 22px;
}

.dgsolv-app-print__part--b {
    background:
        radial-gradient(circle at 88% 16%, rgba(174,146,61,.055), transparent 26%),
        rgba(255,255,255,.97);
}

.dgsolv-app-print__part-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(18,59,43,.08);
}

.dgsolv-app-print__part-id {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.10);
    background: #f2f6f3;
    color: #173f2f;
    direction: ltr;
    font-size: 10px;
    line-height: 1;
    font-weight: 900;
}

.dgsolv-app-print__part-heading {
    flex: 1;
    min-width: 0;
    text-align: right;
}

.dgsolv-app-print__part-heading span {
    display: block;
    color: #74867d;
    direction: ltr;
    text-align: right;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgsolv-app-print__part-heading h3 {
    margin: 4px 0 0;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-print__part-grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 20px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-print__media {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
    overflow: hidden;
    margin: 0;
    border-radius: 18px;
    border: 1px solid rgba(18,59,43,.09);
    background: #fff;
    box-shadow: 0 14px 30px rgba(18,59,43,.07);
}

.dgsolv-app-print__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.dgsolv-app-print__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 800 / 533;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-print__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-print__caption {
    padding: 14px 16px 16px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-print__caption span {
    display: block;
    margin-bottom: 5px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .1em;
}

.dgsolv-app-print__caption strong {
    display: block;
    color: #173f2f;
    font-size: 12px;
    line-height: 1.8;
    font-weight: 900;
}

.dgsolv-app-print__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
}

.dgsolv-app-print__content p {
    margin: 0;
    color: #52665c;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-print__content p + p {
    margin-top: 15px;
}

.dgsolv-app-print__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-print__facts {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin-top: 18px;
    padding-top: 17px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsolv-app-print__fact {
    min-height: 88px;
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f4f7f5;
}

.dgsolv-app-print__fact span {
    display: block;
    margin-bottom: 5px;
    color: #7d6c37;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgsolv-app-print__fact strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

@media (max-width: 900px) {
    .dgsolv-app-print__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-print__meta {
        max-width: 240px;
    }

    .dgsolv-app-print__part-grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }
}

@media (max-width: 760px) {
    .dgsolv-app-print {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-print__nav {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-print__part {
        padding: 18px;
    }

    .dgsolv-app-print__part-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-print__media {
        position: relative;
        top: auto;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-print__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-print__nav-card {
        grid-template-columns: 48px minmax(0,1fr) 30px;
        min-height: 100px;
        padding: 13px;
    }

    .dgsolv-app-print__nav-no {
        width: 48px;
        height: 48px;
        border-radius: 13px;
    }

    .dgsolv-app-print__part-head {
        align-items: flex-start;
    }

    .dgsolv-app-print__facts {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-print__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-print__nav-card,
    .dgsolv-app-print__nav-arrow,
    .dgsolv-app-print__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 04 — Printing v1.8.18 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 05 — Textile
   v1.8.19
   Dark-green section after Printing.
   Desktop: sticky image LEFT / content RIGHT.
========================================================= */
.dgsolv-app-textile,
.dgsolv-app-textile * {
    box-sizing: border-box;
}

.dgsolv-app-textile {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgsolv-app-textile::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgsolv-app-textile__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-textile__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-app-textile__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgsolv-app-textile__meta span {
    display: block;
    color: #a8c5b7;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-textile__meta strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-textile__head-copy {
    text-align: right;
}

.dgsolv-app-textile__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #b7d2c4;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-textile__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-textile__subtitle {
    display: block;
    margin-top: 2px;
    color: rgba(222,238,230,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-textile__grid {
    display: grid;
    grid-template-columns: minmax(340px,.92fr) minmax(0,1.08fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-textile__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-app-textile__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.13);
    background: #f8faf9;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.dgsolv-app-textile__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.09);
    direction: ltr;
}

.dgsolv-app-textile__media-head span,
.dgsolv-app-textile__media-head strong {
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-textile__media-head span {
    color: #74877e;
}

.dgsolv-app-textile__media-head strong {
    color: #173f2f;
}

.dgsolv-app-textile__figure {
    margin: 0;
}

.dgsolv-app-textile__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #fff;
}

.dgsolv-app-textile__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 800 / 534;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-textile__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-textile__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-textile__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-textile__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-textile__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-textile__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-textile__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-app-textile__media-meta span {
    min-width: 0;
    padding: 10px 8px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
    text-align: center;
}

.dgsolv-app-textile__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-textile__media-meta b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-app-textile__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
}

.dgsolv-app-textile__content p {
    margin: 0;
    color: rgba(238,247,242,.78);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-textile__content p + p {
    margin-top: 16px;
}

.dgsolv-app-textile__content strong {
    color: #fff;
    font-weight: 850;
}

.dgsolv-app-textile__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgsolv-app-textile__trait {
    min-height: 96px;
    padding: 14px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.085);
    background: rgba(255,255,255,.035);
}

.dgsolv-app-textile__trait span {
    display: block;
    margin-bottom: 6px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-textile__trait strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-textile__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid rgba(212,190,92,.72);
    border-radius: 12px;
    background: rgba(212,190,92,.055);
}

.dgsolv-app-textile__note p {
    color: rgba(241,248,244,.78);
}

@media (max-width: 900px) {
    .dgsolv-app-textile__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-textile__meta {
        max-width: 240px;
    }

    .dgsolv-app-textile__grid {
        grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
    }

    .dgsolv-app-textile__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-app-textile {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-textile__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-textile__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-app-textile__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-textile__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-textile__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-textile__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-textile__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 05 — Textile v1.8.19 */


/* =========================================================
   DGCHEME — Solvent Dye / Application 06 — NDT Tests
   v1.8.20
   Light section after Textile.
   Desktop: sticky image LEFT / content RIGHT.
========================================================= */
.dgsolv-app-ndt,
.dgsolv-app-ndt * {
    box-sizing: border-box;
}

.dgsolv-app-ndt {
    position: relative;
    width: 100%;
    padding: 68px 20px 74px;
    overflow: visible;
    background:
        radial-gradient(circle at 8% 14%, rgba(35,88,66,.045), transparent 23%),
        radial-gradient(circle at 91% 84%, rgba(166,135,56,.04), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsolv-app-ndt__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    overflow: visible;
}

.dgsolv-app-ndt__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 26px;
}

.dgsolv-app-ndt__meta {
    align-self: start;
    padding: 17px 18px;
    border-radius: 16px;
    border: 1px solid rgba(18,59,43,.10);
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.055),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-app-ndt__meta span {
    display: block;
    color: #6d8178;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .15em;
}

.dgsolv-app-ndt__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 900;
}

.dgsolv-app-ndt__head-copy {
    text-align: right;
}

.dgsolv-app-ndt__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #647a70;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolv-app-ndt__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolv-app-ndt__subtitle {
    display: block;
    margin-top: 2px;
    color: #75857e;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsolv-app-ndt__grid {
    display: grid;
    grid-template-columns: minmax(300px,.78fr) minmax(0,1.22fr);
    grid-template-areas: "media content";
    gap: 22px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgsolv-app-ndt__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgsolv-app-ndt__media-card {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.10);
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgsolv-app-ndt__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgsolv-app-ndt__media-head span,
.dgsolv-app-ndt__media-head strong {
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-ndt__media-head span {
    color: #778981;
}

.dgsolv-app-ndt__media-head strong {
    color: #173f2f;
}

.dgsolv-app-ndt__figure {
    margin: 0;
}

.dgsolv-app-ndt__image-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 14px;
    background: #f8faf9;
}

.dgsolv-app-ndt__image-frame img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 480 / 640;
    object-fit: contain;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsolv-app-ndt__image-frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.02);
    }
}

.dgsolv-app-ndt__caption {
    padding: 16px 18px 18px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsolv-app-ndt__caption-label {
    margin-bottom: 6px;
    color: #788a82;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsolv-app-ndt__caption h3 {
    margin: 0 0 8px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgsolv-app-ndt__caption p {
    margin: 0;
    color: #5d7067;
    font-size: 12px;
    line-height: 1.95;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-ndt__caption strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-ndt__media-meta {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgsolv-app-ndt__media-meta span {
    min-width: 0;
    padding: 10px 8px;
    border-radius: 11px;
    border: 1px solid rgba(18,59,43,.08);
    background: rgba(255,255,255,.76);
    text-align: center;
}

.dgsolv-app-ndt__media-meta small {
    display: block;
    margin-bottom: 4px;
    color: #7b8d85;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsolv-app-ndt__media-meta b {
    display: block;
    color: #1b4635;
    font-size: 10px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolv-app-ndt__content {
    grid-area: content;
    min-width: 0;
    direction: rtl;
    padding: 28px 28px 26px;
    border-radius: 22px;
    border: 1px solid rgba(18,59,43,.09);
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 44px rgba(18,59,43,.07),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgsolv-app-ndt__content p {
    margin: 0;
    color: #52665c;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsolv-app-ndt__content p + p {
    margin-top: 16px;
}

.dgsolv-app-ndt__content strong {
    color: #173f2f;
    font-weight: 850;
}

.dgsolv-app-ndt__process {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsolv-app-ndt__step {
    min-height: 108px;
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f4f7f5;
}

.dgsolv-app-ndt__step span {
    display: block;
    margin-bottom: 6px;
    color: #7d6c37;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgsolv-app-ndt__step strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-ndt__traits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 10px;
}

.dgsolv-app-ndt__trait {
    min-height: 92px;
    padding: 14px;
    border-radius: 15px;
    border: 1px solid rgba(18,59,43,.075);
    background: #f7f9f8;
}

.dgsolv-app-ndt__trait span {
    display: block;
    margin-bottom: 6px;
    color: #315f4d;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolv-app-ndt__trait strong {
    display: block;
    color: #193f30;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 850;
}

.dgsolv-app-ndt__note {
    margin-top: 14px;
    padding: 14px 16px;
    border-right: 3px solid #a88b35;
    border-radius: 12px;
    background: rgba(168,139,53,.065);
}

.dgsolv-app-ndt__note p {
    color: #56685f;
}

@media (max-width: 900px) {
    .dgsolv-app-ndt__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsolv-app-ndt__meta {
        max-width: 240px;
    }

    .dgsolv-app-ndt__grid {
        grid-template-columns: minmax(280px,.82fr) minmax(0,1.18fr);
    }

    .dgsolv-app-ndt__process {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-ndt__media-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsolv-app-ndt {
        padding: 48px 14px 52px;
    }

    .dgsolv-app-ndt__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgsolv-app-ndt__media-col {
        position: relative;
        top: auto;
    }

    .dgsolv-app-ndt__content {
        padding: 22px 20px 20px;
    }
}

@media (max-width: 560px) {
    .dgsolv-app-ndt__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsolv-app-ndt__traits {
        grid-template-columns: 1fr;
    }

    .dgsolv-app-ndt__content p {
        font-size: 13px;
        line-height: 2.05;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgsolv-app-ndt__image-frame img {
        transition: none;
    }
}
/* END — Solvent Dye / Application 06 — NDT Tests v1.8.20 */


/* =========================================================
   DGCHEME — Solvent Dye Product Range
   v1.8.21
   No tabs / no family image / products start immediately.
========================================================= */
.dgproduct-explorer--solvent {
    position: relative;
    overflow: visible;
    padding: 68px 20px 78px;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgproduct-explorer--solvent::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
    background-size: 44px 44px;
}

.dgproduct-explorer--solvent .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

/* Premium top — intentionally no image and no tabs */
.dgsolvent-products__hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 24px;
    padding: 26px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 23px;
    background:
        radial-gradient(circle at 90% 10%, rgba(211,185,76,.10), transparent 31%),
        linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 24px 52px rgba(0,0,0,.16);
}

.dgsolvent-products__hero::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 160px;
    left: -54px;
    bottom: -86px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
}

.dgsolvent-products__copy {
    min-width: 0;
    direction: rtl;
    text-align: right;
}

.dgsolvent-products__kicker {
    display: block;
    margin-bottom: 7px;
    color: #b8d2c4;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsolvent-products__copy h2 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsolvent-products__copy p {
    max-width: 760px;
    margin: 10px 0 0 auto;
    color: rgba(238,247,242,.75);
    font-size: 13px;
    line-height: 2.1;
    text-align: justify;
    text-align-last: right;
}

.dgsolvent-products__copy strong {
    color: #fff;
    font-weight: 850;
}

.dgsolvent-products__stats {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    align-self: center;
    direction: ltr;
}

.dgsolvent-products__stat {
    min-height: 86px;
    padding: 13px 14px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);
}

.dgsolvent-products__stat span {
    display: block;
    margin-bottom: 7px;
    color: #a9c6b7;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsolvent-products__stat strong {
    display: block;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 900;
}

.dgsolvent-products__stat small {
    display: block;
    margin-top: 3px;
    color: rgba(225,238,231,.56);
    font-size: 8px;
    line-height: 1.45;
    font-weight: 700;
}

.dgproduct-explorer--solvent .dgproduct-family-panel {
    padding: 0;
    border: 0;
    background: transparent;
}

.dgproduct-explorer--solvent .dgproduct-products-head {
    margin: 0 0 13px;
    padding: 0 2px 12px;
    border-bottom: 1px solid rgba(255,255,255,.09);
    background: transparent;
}

.dgproduct-explorer--solvent .dgproduct-products-head > div:first-child > span {
    color: #a9c6b7;
}

.dgproduct-explorer--solvent .dgproduct-products-head h3 {
    color: #fff;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.045);
}

.dgproduct-explorer--solvent .dgproduct-products-head__count strong {
    color: #fff;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count small {
    color: #a9c6b7;
}

/* Product cards */
.dgproduct-explorer--solvent .dgproduct-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
    direction: ltr;
}

.dgproduct-explorer--solvent .dgproduct-card {
    border-color: rgba(255,255,255,.11);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 14px 30px rgba(0,0,0,.15);
}

.dgproduct-explorer--solvent .dgproduct-card:hover,
.dgproduct-explorer--solvent .dgproduct-card:focus-visible {
    border-color: rgba(212,190,92,.38);
    box-shadow: 0 20px 40px rgba(0,0,0,.23);
}

.dgproduct-explorer--solvent .dgproduct-card__media {
    aspect-ratio: 1 / 1;
    background: #f5f7f6;
}

.dgproduct-explorer--solvent .dgproduct-card__media > img {
    object-fit: cover;
}

.dgproduct-explorer--solvent .dgproduct-card__series {
    top: 9px;
    right: 9px;
    min-width: 0;
    padding: 5px 7px;
    border-color: rgba(255,255,255,.18);
    background: rgba(7,36,25,.78);
    color: #e6f2eb;
    font-size: 7px;
}

.dgsolvent-products__color-badge {
    position: absolute;
    z-index: 4;
    left: 9px;
    bottom: 9px;
    max-width: calc(100% - 18px);
    overflow: hidden;
    padding: 6px 8px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 8px;
    background: rgba(7,29,20,.72);
    color: #fff;
    direction: ltr;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
    backdrop-filter: blur(7px);
}

.dgproduct-explorer--solvent .dgproduct-card__body {
    display: block;
    padding: 12px;
}

.dgproduct-explorer--solvent .dgproduct-card__identity {
    margin-bottom: 10px;
}

.dgproduct-explorer--solvent .dgproduct-card__identity > div > span {
    color: #7c8981;
}

.dgproduct-explorer--solvent .dgproduct-card__identity strong {
    color: #173f2f;
    font-size: 13px;
}

.dgproduct-explorer--solvent .dgproduct-card__glow-name {
    max-width: 50%;
    overflow: hidden;
    color: #6a776f;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dgproduct-explorer--solvent .dgproduct-card__glow-name i {
    background: #315f4d;
    box-shadow: 0 0 0 3px rgba(49,95,77,.10);
}

.dgproduct-explorer--solvent .dgproduct-card__quick-specs {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.dgproduct-explorer--solvent .dgproduct-card__quick-specs > span {
    min-height: 56px;
    background: #f5f8f6;
}

.dgproduct-explorer--solvent .dgproduct-card__apps {
    margin-top: 9px;
}

.dgproduct-explorer--solvent .dgproduct-card__app {
    border-color: #e0e7e2;
    background: #f8faf9;
    color: #65736b;
}

.dgproduct-explorer--solvent .dgproduct-card__footer {
    margin-top: 10px;
    border-top-color: #e7ece9;
}

.dgproduct-explorer--solvent .dgproduct-card__footer span {
    color: #64736a;
}

/* Solvent Dye popup compatibility */
.dgproduct-viewer__plastic-compat {
    margin-top: 18px;
}

.dgproduct-viewer__plastic-compat[hidden] {
    display: none;
}

.dgproduct-viewer__compat-grid {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 6px;
}

.dgproduct-viewer__compat-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    background: rgba(255,255,255,.055);
}

.dgproduct-viewer__compat-item strong {
    overflow: hidden;
    color: #f2f5f3;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dgproduct-viewer__compat-item span {
    flex: 0 0 auto;
    font-size: 11px;
    line-height: 1;
}

.dgproduct-viewer__compat-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-top: 8px;
    color: rgba(255,255,255,.68);
    font-size: 8px;
    line-height: 1.5;
}

.dgproduct-viewer__compat-legend span {
    white-space: nowrap;
}

.dgproduct-explorer--solvent .dgproduct-viewer__media-footer > div > strong {
    color: #fff;
}

@media (max-width: 980px) {
    .dgsolvent-products__hero {
        grid-template-columns: minmax(0,1fr) 280px;
    }

    .dgproduct-explorer--solvent .dgproduct-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 720px) {
    .dgproduct-explorer--solvent {
        padding: 48px 14px 54px;
    }

    .dgsolvent-products__hero {
        grid-template-columns: 1fr;
        padding: 21px 19px;
    }

    .dgsolvent-products__stats {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .dgproduct-explorer--solvent .dgproduct-grid {
        grid-template-columns: 1fr;
    }

    .dgproduct-viewer__compat-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 460px) {
    .dgsolvent-products__stats {
        grid-template-columns: 1fr;
    }

    .dgproduct-viewer__compat-grid {
        grid-template-columns: 1fr;
    }
}
/* END — Solvent Dye Product Range v1.8.21 */


/* =========================================================
   DGCHEME — Solvent Dye Product Range / Visual Recovery
   v1.8.22
   - Remove inherited white Product Explorer inner panel
   - Restore wide catalogue geometry used on prior product pages
   - Ensure viewer/fullscreen always sit above site header/menu
========================================================= */

/* Wider / more open catalogue geometry */
.dgproduct-explorer.dgproduct-explorer--solvent {
    padding: 34px 18px 58px;
}

.dgproduct-explorer.dgproduct-explorer--solvent .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
    width: min(1380px, 100%);
    margin: 0 auto;
    padding: 30px 28px 34px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.dgproduct-explorer.dgproduct-explorer--solvent .dgproduct-explorer__inner::before {
    display: none;
}

/* Top panel must read as a dark technical header, not a white inherited card */
.dgproduct-explorer--solvent .dgsolvent-products__hero {
    margin-bottom: 28px;
    border-color: rgba(255,255,255,.12);
    background:
        radial-gradient(circle at 88% 12%, rgba(211,185,76,.095), transparent 31%),
        radial-gradient(circle at 12% 86%, rgba(82,148,112,.07), transparent 33%),
        linear-gradient(135deg, rgba(255,255,255,.075), rgba(0,0,0,.075));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 22px 48px rgba(0,0,0,.16);
}

/* Explicit text colors so shared light catalogue rules cannot wash these out */
.dgproduct-explorer--solvent .dgsolvent-products__kicker {
    color: #a8cbb9;
}

.dgproduct-explorer--solvent .dgsolvent-products__copy h2 {
    color: #ffffff;
}

.dgproduct-explorer--solvent .dgsolvent-products__copy p {
    color: rgba(239,247,243,.80);
}

.dgproduct-explorer--solvent .dgsolvent-products__copy p strong {
    color: #ffffff;
}

.dgproduct-explorer--solvent .dgsolvent-products__stat {
    border-color: rgba(255,255,255,.105);
    background: rgba(255,255,255,.05);
}

.dgproduct-explorer--solvent .dgsolvent-products__stat span {
    color: #9fc7b2;
}

.dgproduct-explorer--solvent .dgsolvent-products__stat strong {
    color: #ffffff;
}

.dgproduct-explorer--solvent .dgsolvent-products__stat small {
    color: rgba(230,241,235,.67);
}

/* Products header remains readable over dark section */
.dgproduct-explorer--solvent .dgproduct-products-head {
    padding-inline: 2px;
}

.dgproduct-explorer--solvent .dgproduct-products-head > div:first-child > span {
    color: #9fc7b2;
}

.dgproduct-explorer--solvent .dgproduct-products-head h3 {
    color: #ffffff;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count {
    border: 0;
    background: transparent;
    box-shadow: none;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count strong {
    color: #ffffff;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count small {
    color: #a6c9b7;
}

/* Viewer must cover the fixed site header / hamburger completely */
body.dgproduct-viewer-open .dgproduct-viewer,
html.dgproduct-viewer-open .dgproduct-viewer {
    z-index: 2147483000;
    isolation: isolate;
}

.dgproduct-viewer__backdrop {
    inset: 0;
}

.dgproduct-fullscreen {
    z-index: 2147483600;
    isolation: isolate;
}

/* Keep dialog comfortably inside the viewport while covering from y=0 */
body.dgproduct-viewer-open .dgproduct-viewer {
    inset: 0;
    min-height: 100dvh;
}

@media (max-width: 720px) {
    .dgproduct-explorer.dgproduct-explorer--solvent {
        padding: 34px 12px 48px;
    }

    .dgproduct-explorer.dgproduct-explorer--solvent .dgproduct-explorer__inner {
        width: 100%;
        padding: 20px 10px 24px;
    }
}
/* END — Solvent Dye Product Range / Visual Recovery v1.8.22 */


/* =========================================================
   DGCHEME — Solvent Dye Product Range / Header + Modal Fix
   v1.8.24
   1) Site header/navigation fully disappears while product viewer is open.
   2) Product-grid heading upgraded from a plain line to a designed catalogue header.
========================================================= */

/* ---------------------------------------------------------
   PRODUCT VIEWER: hide the site menu/header while modal is open
--------------------------------------------------------- */
html.dgproduct-viewer-open,
body.dgproduct-viewer-open {
    overflow: hidden;
}

body.dgproduct-viewer-open header,
body.dgproduct-viewer-open nav,
body.dgproduct-viewer-open [role="banner"],
body.dgproduct-viewer-open [role="navigation"],
body.dgproduct-viewer-open #masthead,
body.dgproduct-viewer-open .site-header,
body.dgproduct-viewer-open .main-header,
body.dgproduct-viewer-open .header-main,
body.dgproduct-viewer-open .mobile-header,
body.dgproduct-viewer-open .sticky-header {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.dgproduct-viewer-open .dgproduct-viewer,
html.dgproduct-viewer-open .dgproduct-viewer {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    z-index: 2147483000 !important;
}

body.dgproduct-viewer-open .dgproduct-viewer__backdrop,
html.dgproduct-viewer-open .dgproduct-viewer__backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(1,12,8,.92) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* ---------------------------------------------------------
   PRODUCT GRID HEADER: premium catalogue composition
--------------------------------------------------------- */
.dgproduct-explorer--solvent .dgproduct-products-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 28px;
    align-items: center;
    min-height: 112px;
    margin: 0 0 20px;
    padding: 22px 24px 20px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 22px;
    background:
        radial-gradient(circle at 87% 18%, rgba(213,190,86,.11), transparent 27%),
        radial-gradient(circle at 12% 84%, rgba(89,151,118,.09), transparent 31%),
        linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 18px 38px rgba(0,0,0,.14);
}

.dgproduct-explorer--solvent .dgproduct-products-head::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 42%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(210,187,83,.25) 28%,
        rgba(223,202,105,.92) 72%,
        rgba(255,240,161,.58) 100%
    );
}

.dgproduct-explorer--solvent .dgproduct-products-head::after {
    content: "";
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,.03),
        rgba(255,255,255,.18) 50%,
        rgba(255,255,255,.03)
    );
}

.dgproduct-explorer--solvent .dgproduct-products-head > div:first-child {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding-right: 18px;
    border-right: 3px solid rgba(213,190,86,.68);
    text-align: right;
}

.dgproduct-explorer--solvent .dgproduct-products-head > div:first-child > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
    color: #9fc7b2;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgproduct-explorer--solvent .dgproduct-products-head > div:first-child > span::before {
    content: "";
    width: 18px;
    height: 1px;
    background: rgba(213,190,86,.72);
}

.dgproduct-explorer--solvent .dgproduct-products-head h3 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 900;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto auto;
    gap: 7px;
    align-items: end;
    justify-content: end;
    min-width: 128px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    direction: ltr;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count::before {
    content: "CATALOG";
    position: absolute;
    right: 0;
    bottom: -11px;
    color: rgba(213,231,222,.38);
    font-size: 7px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .18em;
}

.dgproduct-explorer--solvent .dgproduct-products-head__count strong {
    position: relative;
    color: #fff;
    font-size: 28px;
    line-height: .95;
    font-weight: 900;
    letter-spacing: -.04em;
    text-shadow: 0 6px 22px rgba(0,0,0,.16);
}

.dgproduct-explorer--solvent .dgproduct-products-head__count strong::after {
    content: "";
    position: absolute;
    left: 1px;
    right: 1px;
    bottom: -8px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #cfb84f, rgba(207,184,79,.12));
}

.dgproduct-explorer--solvent .dgproduct-products-head__count small {
    padding-bottom: 2px;
    color: #a8cbb9;
    font-size: 8px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
}

@media (max-width: 720px) {
    .dgproduct-explorer--solvent .dgproduct-products-head {
        grid-template-columns: 1fr auto;
        gap: 16px;
        min-height: 96px;
        padding: 18px 17px 17px;
        border-radius: 18px;
    }

    .dgproduct-explorer--solvent .dgproduct-products-head > div:first-child {
        padding-right: 12px;
    }

    .dgproduct-explorer--solvent .dgproduct-products-head__count {
        min-width: 90px;
    }

    .dgproduct-explorer--solvent .dgproduct-products-head__count strong {
        font-size: 24px;
    }
}

@media (max-width: 480px) {
    .dgproduct-explorer--solvent .dgproduct-products-head {
        grid-template-columns: 1fr;
        gap: 14px;
        align-items: start;
    }

    .dgproduct-explorer--solvent .dgproduct-products-head__count {
        justify-content: start;
    }

    .dgproduct-explorer--solvent .dgproduct-products-head__count::before {
        right: auto;
        left: 0;
    }
}
/* END — Solvent Dye Product Range / Header + Modal Fix v1.8.24 */


/* =========================================================
   DGCHEME — Solvent Dye Product Range / Readability Fine-Tune
   v1.8.25
   - Keep "AREN SOLVENT DYE SERIES" on one line
   - Increase product-image color badge readability
========================================================= */

/* Viewer family label: never wrap into two lines */
.dgproduct-explorer--solvent .dgproduct-viewer__product-id {
    min-width: max-content;
    padding-left: 20px;
}

.dgproduct-explorer--solvent .dgproduct-viewer__product-id > span {
    display: block;
    width: max-content;
    max-width: none;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    font-size: 7px;
    line-height: 1.35;
    letter-spacing: .065em;
}

/* Color label on product image: slightly larger and clearer */
.dgproduct-explorer--solvent .dgsolvent-products__color-badge {
    padding: 6px 9px;
    border-radius: 8px;
    font-size: 8.5px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .01em;
}

@media (max-width: 640px) {
    .dgproduct-explorer--solvent .dgproduct-viewer__product-id {
        min-width: 0;
        padding-left: 34px;
    }

    .dgproduct-explorer--solvent .dgproduct-viewer__product-id > span {
        width: auto;
        max-width: 100%;
        font-size: 6.5px;
        white-space: nowrap;
    }

    .dgproduct-explorer--solvent .dgsolvent-products__color-badge {
        font-size: 8px;
    }
}
/* END — Solvent Dye Product Range / Readability Fine-Tune v1.8.25 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Intro
   v1.9.00
   First content section after user-provided slider.
   Desktop: white copy LEFT / technical green card RIGHT.
   Mobile: technical card FIRST / copy SECOND.
========================================================= */
.dgchameleon-intro,
.dgchameleon-intro * {
    box-sizing: border-box;
}

.dgchameleon-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 12%, rgba(55,115,87,.055), transparent 25%),
        radial-gradient(circle at 10% 82%, rgba(186,156,65,.045), transparent 28%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgchameleon-intro::before {
    content: "";
    position: absolute;
    top: -110px;
    left: -70px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    border: 1px solid rgba(26,72,54,.055);
    box-shadow:
        0 0 0 28px rgba(26,72,54,.02),
        0 0 0 58px rgba(26,72,54,.012);
    pointer-events: none;
}

.dgchameleon-intro__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgchameleon-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;
    direction: ltr;
}

.dgchameleon-intro__copy {
    grid-area: copy;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.94);
    box-shadow:
        0 18px 42px rgba(18,59,43,.065),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgchameleon-intro__copy-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
    color: #6c8077;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgchameleon-intro__copy-kicker::before {
    content: "";
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, #b39a3d, rgba(179,154,61,.12));
}

.dgchameleon-intro__copy h2 {
    margin: 0 0 14px;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgchameleon-intro__copy p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-intro__copy p + p {
    margin-top: 15px;
}

.dgchameleon-intro__copy strong {
    color: #173f2f;
    font-weight: 850;
}

.dgchameleon-intro__distinction {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgchameleon-intro__distinction-item {
    min-height: 94px;
    padding: 13px 14px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgchameleon-intro__distinction-item span {
    display: block;
    margin-bottom: 6px;
    color: #7c6b37;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .1em;
}

.dgchameleon-intro__distinction-item strong {
    display: block;
    color: #183e2f;
    font-size: 11px;
    line-height: 1.85;
    font-weight: 850;
}

/* RIGHT / Technical card */
.dgchameleon-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;
    padding: 28px 26px 25px;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.105);
    background:
        radial-gradient(circle at 88% 12%, rgba(228,204,103,.095), transparent 27%),
        radial-gradient(circle at 12% 86%, rgba(84,145,112,.09), transparent 30%),
        linear-gradient(135deg, #0a2a1e 0%, #123d2b 52%, #09271b 100%);
    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
    text-align: right;
}

.dgchameleon-intro__tech::before,
.dgchameleon-intro__tech::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.dgchameleon-intro__tech::before {
    width: 190px;
    height: 190px;
    left: -90px;
    bottom: -105px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px rgba(255,255,255,.018),
        0 0 0 50px rgba(255,255,255,.01);
}

.dgchameleon-intro__tech::after {
    top: 0;
    right: 0;
    width: 48%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(205,184,83,.34),
        rgba(236,219,131,.88)
    );
}

.dgchameleon-intro__tech-top {
    position: relative;
    z-index: 1;
}

.dgchameleon-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #aac9b8;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgchameleon-intro__tech h1 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgchameleon-intro__tech-subtitle {
    display: block;
    margin-top: 3px;
    color: rgba(228,240,234,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

.dgchameleon-intro__formula {
    position: relative;
    z-index: 1;
    margin-top: 23px;
    padding: 17px 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
}

.dgchameleon-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
    direction: ltr;
}

.dgchameleon-intro__formula-label span {
    color: #abc8b8;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgchameleon-intro__formula-label small {
    color: rgba(229,240,234,.42);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgchameleon-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);
    gap: 4px;
    align-items: center;
    direction: ltr;
}

.dgchameleon-intro__formula-node {
    min-width: 0;
    padding: 11px 8px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.038);
    text-align: center;
}

.dgchameleon-intro__formula-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgchameleon-intro__formula-node small {
    display: block;
    margin-top: 3px;
    color: rgba(223,238,230,.52);
    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgchameleon-intro__formula-arrow {
    color: #d4bd58;
    text-align: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgchameleon-intro__mechanism {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    padding: 13px 14px;
    border-right: 3px solid rgba(217,194,90,.76);
    border-radius: 12px;
    background: rgba(217,194,90,.055);
    direction: ltr;
    text-align: left;
}

.dgchameleon-intro__mechanism span {
    display: block;
    margin-bottom: 4px;
    color: #c6d9ce;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgchameleon-intro__mechanism strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgchameleon-intro__specs {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin-top: 18px;
}

.dgchameleon-intro__spec {
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
}

.dgchameleon-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .1em;
}

.dgchameleon-intro__spec strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgchameleon-intro__tags {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 17px;
    direction: ltr;
}

.dgchameleon-intro__tag {
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: rgba(234,244,239,.70);
    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}

@media (max-width: 900px) {
    .dgchameleon-intro__grid {
        grid-template-columns: minmax(0,1fr) minmax(330px,.92fr);
    }

    .dgchameleon-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgchameleon-intro__formula-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 760px) {
    .dgchameleon-intro {
        padding: 44px 14px 50px;
    }

    .dgchameleon-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgchameleon-intro__tech,
    .dgchameleon-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgchameleon-intro__formula-flow {
        grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
        gap: 3px;
    }

    .dgchameleon-intro__formula-arrow {
        transform: none;
    }
}

@media (max-width: 520px) {
    .dgchameleon-intro__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgchameleon-intro__distinction,
    .dgchameleon-intro__specs {
        grid-template-columns: 1fr;
    }

    .dgchameleon-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgchameleon-intro__formula-arrow {
        transform: rotate(90deg);
    }

    .dgchameleon-intro__copy p {
        line-height: 2.05;
    }
}
/* END — Chameleon Glitter / Intro v1.9.00 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Section 02 / Iridescence
   v1.9.01
========================================================= */
.dgchameleon-iridescence,
.dgchameleon-iridescence * {
    box-sizing: border-box;
}

.dgchameleon-iridescence {
    position: relative;
    width: 100%;
    padding: 62px 20px 70px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 14%, rgba(223,196,88,.10), transparent 22%),
        radial-gradient(circle at 8% 84%, rgba(255,255,255,.06), transparent 25%),
        linear-gradient(135deg, #08271b 0%, #0f3b29 52%, #08291d 100%);
}

.dgchameleon-iridescence::before,
.dgchameleon-iridescence::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.dgchameleon-iridescence::before {
    left: -110px;
    bottom: -120px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.065);
    box-shadow:
        0 0 0 28px rgba(255,255,255,.018),
        0 0 0 58px rgba(255,255,255,.010);
}

.dgchameleon-iridescence::after {
    top: 38px;
    right: 22px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(218,194,78,.18), transparent 65%);
    filter: blur(18px);
    opacity: .55;
}

.dgchameleon-iridescence__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgchameleon-iridescence__grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(360px,.93fr);
    grid-template-areas: "copy media";
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgchameleon-iridescence__copy {
    grid-area: copy;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 24px;
    background: rgba(255,255,255,.04);
    box-shadow: 0 20px 44px rgba(3,23,16,.16), inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
    text-align: right;
    backdrop-filter: blur(6px);
}

.dgchameleon-iridescence__kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 13px;
    direction: ltr;
    color: #b7d0c1;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgchameleon-iridescence__kicker::before {
    content: "";
    width: 26px;
    height: 1px;
    background: linear-gradient(90deg, rgba(226,200,95,.96), rgba(226,200,95,.10));
}

.dgchameleon-iridescence__copy h2 {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgchameleon-iridescence__lead {
    margin: 0;
    color: rgba(236,245,239,.88);
    font-size: 14px;
    line-height: 2.15;
    font-weight: 700;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-iridescence__copy p {
    margin: 14px 0 0;
    color: rgba(221,234,227,.76);
    font-size: 13px;
    line-height: 2.12;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-iridescence__copy strong {
    color: #fff;
    font-weight: 900;
}

.dgchameleon-iridescence__rail {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 20px;
}

.dgchameleon-iridescence__rail-item {
    min-height: 92px;
    padding: 13px 14px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dgchameleon-iridescence__rail-item span {
    display: block;
    margin-bottom: 6px;
    color: #d7c36e;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgchameleon-iridescence__rail-item strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.85;
    font-weight: 850;
}

.dgchameleon-iridescence__media-wrap {
    grid-area: media;
    min-width: 0;
    position: sticky;
    top: 96px;
}

.dgchameleon-iridescence__media {
    position: relative;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 26px;
    background: rgba(255,255,255,.05);
    box-shadow: 0 22px 46px rgba(3,23,16,.18), inset 0 1px 0 rgba(255,255,255,.04);
    overflow: hidden;
    backdrop-filter: blur(6px);
}

.dgchameleon-iridescence__media::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.03), transparent 24%);
    pointer-events: none;
}

.dgchameleon-iridescence__figure {
    margin: 0;
}

.dgchameleon-iridescence__frame {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #0c2117;
    aspect-ratio: 800 / 457;
}

.dgchameleon-iridescence__frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .55s ease;
}

.dgchameleon-iridescence__media:hover .dgchameleon-iridescence__frame img {
    transform: scale(1.045);
}

.dgchameleon-iridescence__badge {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(9,33,22,.62);
    color: #fff;
    backdrop-filter: blur(8px);
}

.dgchameleon-iridescence__badge b {
    display: inline-flex;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(224,197,82,.18);
    color: #e1c85d;
    font-size: 10px;
    line-height: 1;
    font-weight: 900;
}

.dgchameleon-iridescence__badge span {
    display: block;
    direction: ltr;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 850;
    letter-spacing: .10em;
}

.dgchameleon-iridescence__caption {
    margin-top: 14px;
    padding: 14px 15px;
    border-right: 3px solid rgba(224,197,82,.82);
    border-radius: 14px;
    background: rgba(224,197,82,.06);
    color: rgba(239,245,241,.90);
    font-size: 12px;
    line-height: 2;
    text-align: justify;
    text-align-last: right;
    direction: rtl;
}

.dgchameleon-iridescence__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
    direction: ltr;
}

.dgchameleon-iridescence__meta span {
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: rgba(228,240,233,.74);
    font-size: 7px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
}

@media (max-width: 980px) {
    .dgchameleon-iridescence__grid {
        grid-template-columns: minmax(0,1fr) minmax(320px,.92fr);
        gap: 18px;
    }

    .dgchameleon-iridescence__rail {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgchameleon-iridescence {
        padding: 44px 14px 52px;
    }

    .dgchameleon-iridescence__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "copy";
        gap: 14px;
    }

    .dgchameleon-iridescence__media-wrap {
        position: relative;
        top: auto;
    }

    .dgchameleon-iridescence__copy,
    .dgchameleon-iridescence__media {
        padding: 20px;
        border-radius: 20px;
    }

    .dgchameleon-iridescence__media {
        padding: 14px;
    }
}

@media (max-width: 520px) {
    .dgchameleon-iridescence__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgchameleon-iridescence__copy h2 {
        font-size: 17px;
    }

    .dgchameleon-iridescence__lead,
    .dgchameleon-iridescence__copy p {
        line-height: 2.03;
    }
}
/* END — Chameleon Glitter / Section 02 / Iridescence v1.9.01 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Iridescent Film Applications
   v1.9.02
   Light transition section before product-family tabs.
   Desktop: content LEFT / sticky image RIGHT.
   Mobile: image FIRST / content SECOND.
========================================================= */
.dgchameleon-filmapps,
.dgchameleon-filmapps * {
    box-sizing: border-box;
}

.dgchameleon-filmapps {
    position: relative;
    width: 100%;
    padding: 64px 20px 72px;
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 12%, rgba(44,104,78,.055), transparent 25%),
        radial-gradient(circle at 8% 88%, rgba(181,153,62,.045), transparent 28%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgchameleon-filmapps::before {
    content: "";
    position: absolute;
    top: 44px;
    left: -80px;
    width: 230px;
    height: 230px;
    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;
    box-shadow:
        0 0 0 28px rgba(23,63,47,.018),
        0 0 0 56px rgba(23,63,47,.010);
    pointer-events: none;
}

.dgchameleon-filmapps__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgchameleon-filmapps__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 24px;
}

.dgchameleon-filmapps__meta {
    align-self: start;
    padding: 16px 18px;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.82);
    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgchameleon-filmapps__meta span {
    display: block;
    color: #72857c;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgchameleon-filmapps__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgchameleon-filmapps__head-copy {
    text-align: right;
}

.dgchameleon-filmapps__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #687d72;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgchameleon-filmapps__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgchameleon-filmapps__subtitle {
    display: block;
    margin-top: 2px;
    color: #7b8a83;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 800;
    letter-spacing: .07em;
}

.dgchameleon-filmapps__grid {
    display: grid;
    grid-template-columns: minmax(0,1.1fr) minmax(360px,.9fr);
    grid-template-areas: "content media";
    gap: 24px;
    align-items: start;
    direction: ltr;
    overflow: visible;
}

.dgchameleon-filmapps__content {
    grid-area: content;
    min-width: 0;
    padding: 28px 29px 27px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 42px rgba(18,59,43,.065),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
}

.dgchameleon-filmapps__feature {
    position: relative;
    margin: 0;
    padding: 18px 18px 18px 20px;
    overflow: hidden;
    border-right: 3px solid #a78f35;
    border-radius: 15px;
    background:
        radial-gradient(circle at 12% 20%, rgba(167,143,53,.07), transparent 36%),
        linear-gradient(135deg, #f7f9f7 0%, #f1f5f2 100%);
    color: #3f574b;
    font-size: 13px;
    line-height: 2.08;
    font-weight: 850;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-filmapps__feature::after {
    content: "IRIDESCENT FILM";
    position: absolute;
    left: 16px;
    bottom: 8px;
    color: rgba(23,63,47,.09);
    direction: ltr;
    font-size: 17px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
    pointer-events: none;
}

.dgchameleon-filmapps__body {
    margin-top: 19px;
}

.dgchameleon-filmapps__body p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.14;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-filmapps__body p + p {
    margin-top: 15px;
}

.dgchameleon-filmapps__body strong {
    color: #173f2f;
    font-weight: 900;
}

.dgchameleon-filmapps__applications {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 21px;
    padding-top: 19px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgchameleon-filmapps__app {
    min-height: 82px;
    padding: 12px 13px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgchameleon-filmapps__app span {
    display: block;
    margin-bottom: 5px;
    color: #7b6a35;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .1em;
}

.dgchameleon-filmapps__app strong {
    display: block;
    color: #183f30;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgchameleon-filmapps__transition {
    position: relative;
    margin-top: 16px;
    padding: 14px 46px 14px 16px;
    border: 1px solid rgba(18,59,43,.08);
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(244,248,245,.95), rgba(250,251,250,.98));
    color: #53685d;
    font-size: 12px;
    line-height: 1.95;
}

.dgchameleon-filmapps__transition::before {
    content: "NEXT";
    position: absolute;
    right: 14px;
    top: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 6px;
    border-radius: 7px;
    background: #173f2f;
    color: #fff;
    direction: ltr;
    font-size: 7px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgchameleon-filmapps__transition strong {
    color: #173f2f;
    font-weight: 900;
}

.dgchameleon-filmapps__media-col {
    grid-area: media;
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    min-width: 0;
}

.dgchameleon-filmapps__media {
    overflow: hidden;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgchameleon-filmapps__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgchameleon-filmapps__media-head span,
.dgchameleon-filmapps__media-head strong {
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgchameleon-filmapps__media-head span {
    color: #788a82;
}

.dgchameleon-filmapps__media-head strong {
    color: #173f2f;
}

.dgchameleon-filmapps__figure {
    margin: 0;
}

.dgchameleon-filmapps__frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 800 / 533;
    background: #eef2ef;
}

.dgchameleon-filmapps__frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgchameleon-filmapps__frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.03);
    }
}

.dgchameleon-filmapps__image-label {
    position: absolute;
    right: 13px;
    bottom: 13px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(7,33,23,.64);
    color: #fff;
    backdrop-filter: blur(8px);
}

.dgchameleon-filmapps__image-label b {
    color: #e1ca67;
    font-size: 9px;
    line-height: 1;
    font-weight: 900;
}

.dgchameleon-filmapps__image-label span {
    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgchameleon-filmapps__caption {
    padding: 15px 17px 17px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgchameleon-filmapps__caption span {
    display: block;
    margin-bottom: 6px;
    color: #7b8b83;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgchameleon-filmapps__caption strong {
    display: block;
    color: #173f2f;
    font-size: 12px;
    line-height: 1.85;
    font-weight: 900;
}

.dgchameleon-filmapps__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 0 16px 16px;
    background: #f3f6f4;
    direction: ltr;
}

.dgchameleon-filmapps__chip {
    padding: 7px 9px;
    border: 1px solid rgba(18,59,43,.08);
    border-radius: 999px;
    background: rgba(255,255,255,.76);
    color: #607369;
    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .06em;
}

@media (max-width: 940px) {
    .dgchameleon-filmapps__grid {
        grid-template-columns: minmax(0,1.1fr) minmax(320px,.9fr);
        gap: 18px;
    }

    .dgchameleon-filmapps__applications {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgchameleon-filmapps {
        padding: 46px 14px 52px;
    }

    .dgchameleon-filmapps__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgchameleon-filmapps__meta {
        max-width: 250px;
    }

    .dgchameleon-filmapps__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "media"
            "content";
        gap: 14px;
    }

    .dgchameleon-filmapps__media-col {
        position: relative;
        top: auto;
    }

    .dgchameleon-filmapps__content {
        padding: 22px 20px 21px;
    }
}

@media (max-width: 520px) {
    .dgchameleon-filmapps__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgchameleon-filmapps__applications {
        grid-template-columns: 1fr;
    }

    .dgchameleon-filmapps__feature,
    .dgchameleon-filmapps__body p {
        line-height: 2.02;
    }
}
/* END — Chameleon Glitter / Iridescent Film Applications v1.9.02 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Pre-Tabs Bridge
   v1.9.03
   The explanatory copy sits OUTSIDE the content card.
========================================================= */
.dgchameleon-filmapps__pre-tabs {
    position: relative;
    margin-top: 28px;
    padding: 24px 4px 0;
    direction: rtl;
}

.dgchameleon-filmapps__pre-tabs::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(23,63,47,.05) 0%,
        rgba(23,63,47,.16) 50%,
        rgba(167,143,53,.48) 100%
    );
}

.dgchameleon-filmapps__pre-tabs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 13px;
}

.dgchameleon-filmapps__pre-tabs-head span {
    color: #6f8278;
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgchameleon-filmapps__pre-tabs-head strong {
    color: #173f2f;
    font-size: 13px;
    line-height: 1.7;
    font-weight: 900;
}

.dgchameleon-filmapps__pre-tabs p {
    max-width: 1040px;
    margin: 0 0 0 auto;
    color: #53675d;
    font-size: 13px;
    line-height: 2.16;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-filmapps__pre-tabs p + p {
    margin-top: 12px;
}

.dgchameleon-filmapps__pre-tabs strong {
    color: #173f2f;
    font-weight: 900;
}

.dgchameleon-filmapps__pre-tabs-next {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 15px;
    color: #7b6a35;
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgchameleon-filmapps__pre-tabs-next::before {
    content: "";
    width: 28px;
    height: 1px;
    background: #a78f35;
}

@media (max-width: 760px) {
    .dgchameleon-filmapps__pre-tabs {
        margin-top: 20px;
        padding-top: 20px;
    }

    .dgchameleon-filmapps__pre-tabs-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .dgchameleon-filmapps__pre-tabs p {
        line-height: 2.04;
    }
}
/* END — Chameleon Glitter / Pre-Tabs Bridge v1.9.03 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Sticky Film Card + Premium
   Family Transition
   v1.9.04
========================================================= */

/* ---------------------------------------------------------
   The short left content card must remain visible while the
   taller media column scrolls.
--------------------------------------------------------- */
.dgchameleon-filmapps__content {
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
}

/* ---------------------------------------------------------
   Premium open transition area before the family tabs.
   Intentionally NOT a boxed card.
--------------------------------------------------------- */
.dgchameleon-filmapps__pre-tabs {
    position: relative;
    margin-top: 34px;
    padding: 34px 6px 30px;
    overflow: hidden;
    direction: rtl;
    isolation: isolate;
}

.dgchameleon-filmapps__pre-tabs::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(23,63,47,.03) 0%,
        rgba(23,63,47,.12) 36%,
        rgba(169,143,53,.48) 78%,
        rgba(196,170,69,.84) 100%
    );
}

.dgchameleon-filmapps__pre-tabs::after {
    content: "04";
    position: absolute;
    z-index: -1;
    left: 8px;
    top: 18px;
    color: rgba(23,63,47,.045);
    direction: ltr;
    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;
    pointer-events: none;
}

.dgchameleon-filmapps__pre-tabs-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;
    min-height: 58px;
    margin-bottom: 20px;
    padding-right: 20px;
    border-right: 3px solid #a78f35;
}

.dgchameleon-filmapps__pre-tabs-head::before {
    content: "";
    position: absolute;
    right: -3px;
    top: -10px;
    width: 3px;
    height: 18px;
    border-radius: 99px;
    background: #173f2f;
}

.dgchameleon-filmapps__pre-tabs-head span {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;
    background: rgba(255,255,255,.64);
    color: #6e8177;
    direction: ltr;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}

.dgchameleon-filmapps__pre-tabs-head span::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #a78f35;
    box-shadow: 0 0 0 4px rgba(167,143,53,.10);
}

.dgchameleon-filmapps__pre-tabs-head strong {
    max-width: 580px;
    color: #173f2f;
    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;
    text-align: right;
}

.dgchameleon-filmapps__pre-tabs p {
    position: relative;
    max-width: 1060px;
    margin: 0 0 0 auto;
    padding-right: 20px;
    color: #51655b;
    font-size: 13px;
    line-height: 2.18;
    text-align: justify;
    text-align-last: right;
}

.dgchameleon-filmapps__pre-tabs p::before {
    content: "";
    position: absolute;
    right: 1px;
    top: .88em;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(23,63,47,.28);
    border-radius: 50%;
    background: #f8faf8;
}

.dgchameleon-filmapps__pre-tabs p + p {
    margin-top: 14px;
}

.dgchameleon-filmapps__pre-tabs p + p::before {
    border-color: rgba(167,143,53,.46);
    background: rgba(167,143,53,.16);
}

.dgchameleon-filmapps__pre-tabs strong {
    color: #103b2b;
    font-weight: 950;
}

.dgchameleon-filmapps__pre-tabs-next {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 22px;
    margin-right: 20px;
    padding: 9px 12px 9px 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(23,63,47,.055), rgba(167,143,53,.08));
    color: #725f27;
    direction: ltr;
    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgchameleon-filmapps__pre-tabs-next::before {
    content: "";
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, #a78f35, rgba(167,143,53,.18));
}

.dgchameleon-filmapps__pre-tabs-next::after {
    content: "↓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-left: 2px;
    border: 1px solid rgba(23,63,47,.08);
    border-radius: 50%;
    background: rgba(255,255,255,.78);
    color: #173f2f;
    font-size: 11px;
    line-height: 1;
    font-weight: 900;
}

/* Subtle separator that visually hands off to the upcoming tabs */
.dgchameleon-filmapps__pre-tabs > :last-child {
    margin-bottom: 0;
}

@media (max-width: 760px) {
    .dgchameleon-filmapps__content {
        position: relative;
        top: auto;
    }

    .dgchameleon-filmapps__pre-tabs {
        margin-top: 22px;
        padding: 26px 2px 22px;
    }

    .dgchameleon-filmapps__pre-tabs::after {
        top: 24px;
        left: 2px;
        font-size: 68px;
    }

    .dgchameleon-filmapps__pre-tabs-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgchameleon-filmapps__pre-tabs-head span {
        justify-self: end;
    }

    .dgchameleon-filmapps__pre-tabs-head strong {
        max-width: none;
        font-size: 13px;
    }

    .dgchameleon-filmapps__pre-tabs p {
        padding-right: 16px;
        line-height: 2.05;
    }

    .dgchameleon-filmapps__pre-tabs-next {
        margin-right: 16px;
    }
}
/* END — Chameleon Glitter / Sticky Film Card + Premium Transition v1.9.04 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Sticky Recovery
   v1.9.05
   Root cause: the section itself had overflow:hidden, which
   prevents position:sticky from behaving correctly.
========================================================= */

.dgchameleon-filmapps {
    overflow: visible;
}

.dgchameleon-filmapps__inner,
.dgchameleon-filmapps__grid {
    overflow: visible;
}

@media (min-width: 761px) {
    .dgchameleon-filmapps__content {
        position: sticky;
        top: 108px;
        align-self: start;
        height: max-content;
        z-index: 3;
    }
}

@media (max-width: 760px) {
    .dgchameleon-filmapps__content {
        position: relative;
        top: auto;
        height: auto;
    }
}
/* END — Chameleon Glitter / Sticky Recovery v1.9.05 */


/* =========================================================
   DGCHEME — Chameleon Glitter Product Explorer
   Golden-architecture lock + Standard + Fluorescent
   v1.9.08
========================================================= */
.dgproduct-explorer--chameleon {
    --dgpe-ink: #20342b;
    --dgpe-muted: #6c776f;
    --dgpe-line: #dfe8e2;
    --dgpe-soft: #f4f7f5;
    --dgpe-dark: #08130d;
    --dgpe-dark-2: #102019;
    --dgpe-glow: #83c15a;
    --dgpe-glow-soft: #d8ff8f;
    --dgpe-gold: #68349f;

    position: relative;
    width: 100%;
    padding: 54px 22px 62px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgproduct-explorer--chameleon::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 8%, rgba(255,255,255,.035), transparent 19%),
        linear-gradient(180deg, rgba(255,255,255,.018), transparent 28%);
}

.dgproduct-explorer--chameleon > .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
}

/* Header */
.dgproduct-explorer--chameleon .dgproduct-explorer__kicker {
    color: rgba(221,237,228,.52);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__title {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-explorer__lead {
    color: rgba(225,238,231,.67);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head-meta {
    color: rgba(225,238,231,.48);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head-meta span {
    color: #fff;
}

/* Tabs: same geometry as Golden, tuned only for green section */
.dgproduct-explorer--chameleon .dgproduct-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.065);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab {
    color: rgba(233,242,237,.70);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab:hover {
    background: rgba(255,255,255,.09);
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active {
    background: #fff;
    color: #1b2a20;
    box-shadow:
        0 8px 22px rgba(0,0,0,.14),
        inset 0 -2px 0 var(--chameleon-tab-accent, #68349f);
}

.dgproduct-explorer--chameleon
.dgproduct-tabs__tab[data-dgproduct-series="standard"] {
    --chameleon-tab-accent: #68349f;
}

.dgproduct-explorer--chameleon
.dgproduct-tabs__tab[data-dgproduct-series="fluorescent"] {
    --chameleon-tab-accent: #8b3cff;
}

.dgproduct-explorer--chameleon .dgproduct-tabs__code {
    color: rgba(232,241,236,.42);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active .dgproduct-tabs__code {
    color: var(--chameleon-tab-accent, #68349f);
}

/* Mobile selector */
.dgproduct-explorer--chameleon .dgproduct-mobile-select__option[data-dgproduct-series="standard"].is-active span {
    color: #68349f;
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__option[data-dgproduct-series="fluorescent"].is-active span {
    color: #8b3cff;
}

/* =========================================================
   Family banner — exact Golden desktop geometry:
   LEFT = [NUMBER][ENGLISH META]
   RIGHT = Persian identity.
========================================================= */
@media (min-width: 681px) {
    .dgproduct-explorer--chameleon .dgproduct-family-divider {
        width: 100%;
        height: 116px;
        min-height: 116px;
        box-sizing: border-box;
        padding: 17px 20px;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
        overflow: hidden;
        border-radius: 15px;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;
        min-width: 300px;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__index {
        order: 1;
        display: grid;
        place-items: center;
        flex: 0 0 50px;
        width: 50px;
        height: 50px;
        box-sizing: border-box;
        border: 1px solid rgba(255,255,255,.30);
        border-radius: 14px;
        background: rgba(255,255,255,.16);
        color: #fff;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.22);
        direction: ltr;
        font-size: 14px;
        font-weight: 900;
        line-height: 1;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__copy {
        width: min(760px, 100%);
        margin-left: auto;
        margin-right: 0;
        padding: 0;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__copy h3 {
        margin: 0 0 6px;
        direction: rtl;
        text-align: right;
        font-size: 16px;
        font-weight: 900;
        line-height: 1.8;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__subtitle {
        display: block;
        width: 100%;
        margin: 0;
        direction: ltr;
        text-align: right;
        color: rgba(255,255,255,.90);
        font-size: 16px;
        font-weight: 850;
        line-height: 1.55;
        letter-spacing: 0;
    }
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__micro {
    color: rgba(255,255,255,.72);
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__latin strong {
    color: #fff;
    font-size: 16px;
    font-weight: 900;
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 5px;
    color: rgba(255,255,255,.76);
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
    letter-spacing: .05em;
}

.dgproduct-explorer--chameleon .dgproduct-family-divider h3 {
    color: #fff;
}

/* User-provided family gradients */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, #68349f, #83c15a, #f39f09, #ef0800);
    box-shadow:
        0 14px 30px rgba(11,21,16,.20),
        inset 0 1px 0 rgba(255,255,255,.30);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, #8b3cff, #039cf8, #60f93f, #e52bdc);
    box-shadow:
        0 14px 30px rgba(11,21,16,.20),
        inset 0 1px 0 rgba(255,255,255,.30);
}

.dgproduct-explorer--chameleon .dgproduct-family-divider::after {
    height: 2px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(255,255,255,.62),
        rgba(255,255,255,0)
    );
    box-shadow: none;
}

/* Family intro — shared Golden layout; white card on green section */
.dgproduct-explorer--chameleon .dgproduct-family-intro {
    align-items: start;
    margin-bottom: 0;
    border-color: rgba(255,255,255,.16);
    box-shadow: 0 16px 34px rgba(0,0,0,.15);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__media {
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__visual {
    min-height: 0;
    background: #eef2ef;
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__visual > img {
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgproduct-explorer--chameleon .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.04);
    }
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-intro__eyebrow {
    color: #68349f;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-intro__eyebrow {
    color: #8b3cff;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-intro__badge strong {
    color: #d6ff87;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-intro__badge strong {
    color: #cba2ff;
}

/* Since these two supplied families currently have no product cards,
   no Product Head/Grid is rendered. */

@media (max-width: 680px) {
    .dgproduct-explorer--chameleon .dgproduct-family-divider {
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 16px;
        gap: 14px;
        border-radius: 14px;
        direction: rtl;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__meta {
        direction: ltr;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__identity {
        text-align: right;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-divider__subtitle {
        color: rgba(255,255,255,.90);
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--chameleon {
        padding: 48px 14px 54px;
    }

    .dgproduct-explorer--chameleon .dgproduct-family-intro__media {
        position: relative;
        top: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--chameleon .dgproduct-family-intro__visual > img {
        transition: none;
    }
}
/* END — Chameleon Product Explorer v1.9.08 */


/* =========================================================
   DGCHEME — Chameleon Glitter Product Explorer
   FULL GREEN SURFACE + Special Series
   v1.9.09
========================================================= */

/* ---------------------------------------------------------
   FULL SECTION GREEN:
   not only the outer background — tabs, family intro,
   mobile selector and all internal surfaces stay in the
   green visual language.
--------------------------------------------------------- */
.dgproduct-explorer--chameleon {
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgproduct-explorer--chameleon .dgproduct-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-color: rgba(255,255,255,.10);
    background:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 26px rgba(0,0,0,.10);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab {
    color: rgba(230,242,235,.70);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab:hover {
    background: rgba(255,255,255,.07);
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active {
    background:
        linear-gradient(180deg, rgba(36,92,65,.96), rgba(16,57,40,.96));
    color: #fff;
    box-shadow:
        0 8px 22px rgba(0,0,0,.16),
        inset 0 -2px 0 var(--chameleon-tab-accent, #83c15a),
        inset 0 1px 0 rgba(255,255,255,.07);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active .dgproduct-tabs__code {
    color: #dff1e7;
}

.dgproduct-explorer--chameleon
.dgproduct-tabs__tab[data-dgproduct-series="special"] {
    --chameleon-tab-accent: #00ac56;
}

/* Mobile select also remains green */
.dgproduct-explorer--chameleon .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background:
        linear-gradient(180deg, rgba(36,92,65,.97), rgba(16,57,40,.98));
    color: #fff;
    box-shadow:
        0 10px 24px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__copy small {
    color: rgba(226,239,231,.52);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__copy strong {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__chevron svg {
    fill: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__menu {
    border-color: rgba(255,255,255,.10);
    background: #123a29;
    box-shadow: 0 16px 36px rgba(0,0,0,.24);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__option {
    border-color: rgba(255,255,255,.07);
    background: transparent;
    color: rgba(231,242,235,.77);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__option:hover,
.dgproduct-explorer--chameleon .dgproduct-mobile-select__option.is-active {
    background: rgba(255,255,255,.075);
    color: #fff;
}

.dgproduct-explorer--chameleon
.dgproduct-mobile-select__option[data-dgproduct-series="special"].is-active span {
    color: #71ffc1;
}

/* Family Intro is now GREEN instead of a white card */
.dgproduct-explorer--chameleon .dgproduct-family-intro {
    border-color: rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 88% 12%, rgba(255,255,255,.035), transparent 24%),
        linear-gradient(135deg, #0b2d20 0%, #123d2b 58%, #0b2c20 100%);
    box-shadow:
        0 18px 42px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__content h3 {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__content p {
    color: rgba(230,241,234,.78);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__content strong {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__points {
    border-top-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__points li {
    color: rgba(226,239,231,.76);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__media figcaption {
    border-top-color: rgba(255,255,255,.07);
    background: #0d3123;
    color: rgba(228,240,233,.68);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__visual {
    background: #071b13;
}

/* Stronger family-specific eyebrow colors on green surface */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-intro__eyebrow {
    color: #c8a8e6;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-intro__eyebrow {
    color: #91dfff;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-intro__eyebrow {
    color: #71ffc1;
}

/* Special family banner */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, #00ac56, #1465ba, #6934a2);
    box-shadow:
        0 14px 30px rgba(11,21,16,.22),
        inset 0 1px 0 rgba(255,255,255,.30);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-intro__badge strong {
    color: #71ffc1;
}

@media (max-width: 760px) {
    .dgproduct-explorer--chameleon .dgproduct-tabs {
        grid-template-columns: 1fr;
    }
}
/* END — Chameleon Product Explorer Full Green + Special v1.9.09 */


/* =========================================================
   DGCHEME — Chameleon Glitter Product Explorer
   FULL GREEN RECOVERY + DUSTER SERIES
   v1.9.10
========================================================= */

/* Outer explorer must read fully green when previous section is white */
.dgproduct-explorer--chameleon {
    background:
        radial-gradient(circle at 14% 14%, rgba(169,227,121,.08), transparent 26%),
        radial-gradient(circle at 88% 22%, rgba(112,176,255,.05), transparent 24%),
        linear-gradient(125deg, #052117 0%, #0b3828 46%, #07271b 100%);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__inner {
    border-color: rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 12% 10%, rgba(255,255,255,.045), transparent 24%),
        linear-gradient(135deg, rgba(12,54,37,.98) 0%, rgba(14,63,42,.985) 53%, rgba(8,39,27,.99) 100%);
    box-shadow:
        0 22px 48px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.03);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__inner::before {
    background: radial-gradient(circle, rgba(179,255,132,.14) 0%, rgba(179,255,132,0) 72%);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head {
    border-bottom-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head-copy::before {
    background: linear-gradient(180deg, #90d466 0%, #8f65ff 100%);
    box-shadow: 0 0 18px rgba(169,227,121,.22);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__kicker {
    color: rgba(223,240,231,.46);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__title {
    color: #f4fbf7;
}

.dgproduct-explorer--chameleon .dgproduct-explorer__lead {
    color: rgba(225,240,232,.70);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head-meta {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 12px 24px rgba(0,0,0,.12);
}

.dgproduct-explorer--chameleon .dgproduct-explorer__head-meta span,
.dgproduct-explorer--chameleon .dgproduct-explorer__head-meta small {
    color: #eff8f2;
}

.dgproduct-explorer--chameleon .dgproduct-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 10px 28px rgba(0,0,0,.12);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab {
    border-color: rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
    color: rgba(231,242,235,.72);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__code {
    color: rgba(229,239,232,.46);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__label {
    color: rgba(244,251,247,.82);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab:hover {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.14);
    background: linear-gradient(180deg, rgba(40,98,69,.96), rgba(16,58,40,.98));
    box-shadow: 0 14px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.06), inset 0 -3px 0 var(--chameleon-tab-accent, #83c15a);
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--chameleon .dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-tabs__tab[data-dgproduct-series="standard"] { --chameleon-tab-accent: #8d63d8; }
.dgproduct-explorer--chameleon .dgproduct-tabs__tab[data-dgproduct-series="fluorescent"] { --chameleon-tab-accent: #74e463; }
.dgproduct-explorer--chameleon .dgproduct-tabs__tab[data-dgproduct-series="special"] { --chameleon-tab-accent: #29d38a; }
.dgproduct-explorer--chameleon .dgproduct-tabs__tab[data-dgproduct-series="duster"] { --chameleon-tab-accent: #f199ff; }

.dgproduct-explorer--chameleon .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(35,92,64,.98), rgba(17,57,39,.99));
    box-shadow: 0 10px 24px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.05);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__menu {
    border-color: rgba(255,255,255,.10);
    background: #103826;
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__option {
    color: rgba(235,244,238,.78);
}

.dgproduct-explorer--chameleon .dgproduct-mobile-select__option.is-active,
.dgproduct-explorer--chameleon .dgproduct-mobile-select__option:hover {
    background: rgba(255,255,255,.08);
    color: #fff;
}

/* Banners: readable text + non-white index chip */
.dgproduct-explorer--chameleon .dgproduct-family-divider {
    box-shadow: 0 16px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.22);
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__index {
    background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
    border-color: rgba(255,255,255,.22);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16);
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__micro,
.dgproduct-explorer--chameleon .dgproduct-family-divider__latin strong,
.dgproduct-explorer--chameleon .dgproduct-family-divider__latin em,
.dgproduct-explorer--chameleon .dgproduct-family-divider h3,
.dgproduct-explorer--chameleon .dgproduct-family-divider__subtitle {
    color: #fff;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

.dgproduct-explorer--chameleon .dgproduct-family-divider__micro,
.dgproduct-explorer--chameleon .dgproduct-family-divider__latin em {
    opacity: .88;
}

/* Family intro stays green */
.dgproduct-explorer--chameleon .dgproduct-family-intro {
    border-color: rgba(255,255,255,.10);
    background: radial-gradient(circle at 88% 12%, rgba(255,255,255,.035), transparent 24%), linear-gradient(135deg, #0a2c20 0%, #103928 58%, #0a2b1f 100%);
    box-shadow: 0 18px 42px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__media figcaption {
    border-top-color: rgba(255,255,255,.08);
    background: #0d3023;
    color: rgba(228,240,233,.72);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.07));
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__badge span {
    color: rgba(238,245,240,.74);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__badge strong,
.dgproduct-explorer--chameleon .dgproduct-family-intro__content h3,
.dgproduct-explorer--chameleon .dgproduct-family-intro__content strong {
    color: #fff;
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__content p,
.dgproduct-explorer--chameleon .dgproduct-family-intro__points li {
    color: rgba(228,240,233,.80);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__points {
    border-top-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__points li::before {
    background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.11));
    border-color: rgba(255,255,255,.14);
}

.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="standard"] .dgproduct-family-divider {
    background-image: linear-gradient(90deg, #68349f, #83c15a, #f39f09, #ef0800);
}
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="fluorescent"] .dgproduct-family-divider {
    background-image: linear-gradient(90deg, #8b3cff, #039cf8, #60f93f, #e52bdc);
}
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-divider {
    background-image: linear-gradient(90deg, #00ac56, #1465ba, #6934a2);
}
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider {
    background-image: linear-gradient(90deg, #afe2aa, #86cde7, #f199ff);
}

.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__micro,
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__latin strong,
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__latin em,
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider h3,
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__subtitle,
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__index {
    color: #173828;
    text-shadow: none;
}

.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-divider__index {
    background: linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.38));
    border-color: rgba(255,255,255,.45);
}

.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="standard"] .dgproduct-family-intro__eyebrow { color: #d2b9f7; }
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="fluorescent"] .dgproduct-family-intro__eyebrow { color: #94eaff; }
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="special"] .dgproduct-family-intro__eyebrow { color: #79ffc8; }
.dgproduct-explorer--chameleon .dgproduct-family-panel[data-dgproduct-family="duster"] .dgproduct-family-intro__eyebrow { color: #ffb0ef; }

@media (max-width: 980px) {
    .dgproduct-explorer--chameleon .dgproduct-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--chameleon .dgproduct-tabs {
        grid-template-columns: 1fr;
    }
    .dgproduct-explorer--chameleon .dgproduct-explorer__head-meta {
        align-self: stretch;
    }
}
/* END — Chameleon Product Explorer Full Green Recovery + Duster v1.9.10 */


/* =========================================================
   DGCHEME — Chameleon Glitter / Small Visual Corrections
   v1.9.11
   1) Remove murky figcaption strip in all 4 families.
   2) Normalize Special banner typography/index to other tabs.
========================================================= */

/* ---------------------------------------------------------
   01 — Family image caption:
   keep the two technical labels, remove the separate dark
   strip so it reads as part of the green family card.
--------------------------------------------------------- */
.dgproduct-explorer--chameleon .dgproduct-family-intro__media figcaption {
    min-height: 34px;
    padding: 9px 11px 7px;
    border-top: 1px solid rgba(255,255,255,.065);
    background: transparent;
    box-shadow: none;
    color: rgba(229,241,234,.68);
}

.dgproduct-explorer--chameleon .dgproduct-family-intro__media figcaption span {
    color: inherit;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 850;
    letter-spacing: .055em;
}

/* ---------------------------------------------------------
   02 — Special family:
   an older global "special" component was overriding the
   Chameleon banner. Reset ONLY this family to the same scale
   and visual language as Standard / Fluorescent / Duster.
--------------------------------------------------------- */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider {
    min-height: 116px;
    height: 116px;
    padding: 17px 20px;
    gap: 28px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 15px;
    background-color: transparent;
    background-image: linear-gradient(90deg, #00ac56, #1465ba, #6934a2);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.22);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider::before {
    content: none;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider::after {
    right: 0;
    left: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(255,255,255,.62),
        rgba(255,255,255,0)
    );
    box-shadow: none;
}

/* left cluster: NUMBER must sit at the far left */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__meta {
    order: 1;
    min-width: 300px;
    padding: 0;
    gap: 14px;
    direction: ltr;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__index {
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 14px;
    background: linear-gradient(
        180deg,
        rgba(255,255,255,.18),
        rgba(255,255,255,.08)
    );
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16);
    font-size: 14px;
    line-height: 1;
    font-weight: 900;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__latin {
    direction: ltr;
    align-items: flex-start;
    text-align: left;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__micro {
    margin: 0 0 2px;
    color: rgba(255,255,255,.72);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .10em;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__latin strong {
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 900;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__latin em {
    margin-top: 5px;
    color: rgba(255,255,255,.76);
    font-size: 8px;
    line-height: 1.4;
    font-style: normal;
    font-weight: 850;
    letter-spacing: .05em;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

/* right cluster: Persian identity */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__identity {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
    text-align: right;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__copy {
    width: min(760px, 100%);
    padding: 0;
    background: transparent;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider h3 {
    margin: 0 0 6px;
    color: #fff;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-divider__subtitle {
    display: block;
    margin: 0;
    color: rgba(255,255,255,.90);
    direction: ltr;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 850;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.16);
}

/* Also neutralize the older purple Special rules inside intro */
.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-intro__content h3 {
    color: #fff;
    font-size: 16px;
}

.dgproduct-explorer--chameleon
.dgproduct-family-panel[data-dgproduct-family="special"]
.dgproduct-family-intro__badge strong {
    color: #79ffc8;
}

@media (max-width: 680px) {
    .dgproduct-explorer--chameleon
    .dgproduct-family-panel[data-dgproduct-family="special"]
    .dgproduct-family-divider {
        height: auto;
        min-height: 0;
        padding: 16px;
        gap: 14px;
    }

    .dgproduct-explorer--chameleon
    .dgproduct-family-panel[data-dgproduct-family="special"]
    .dgproduct-family-divider__meta {
        min-width: 0;
    }

    .dgproduct-explorer--chameleon
    .dgproduct-family-panel[data-dgproduct-family="special"]
    .dgproduct-family-divider__latin strong,
    .dgproduct-explorer--chameleon
    .dgproduct-family-panel[data-dgproduct-family="special"]
    .dgproduct-family-divider h3,
    .dgproduct-explorer--chameleon
    .dgproduct-family-panel[data-dgproduct-family="special"]
    .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}
/* END — Chameleon Glitter Small Visual Corrections v1.9.11 */


/* =========================================================
   DGCHEME — Simple Glitter / Intro
   v1.10.00
   Exact sequence/layout language of Chameleon Glitter intro:
   Desktop: white copy LEFT / technical green card RIGHT.
   Mobile: technical card FIRST / copy SECOND.
========================================================= */
.dgsimple-intro,
.dgsimple-intro * {
    box-sizing: border-box;
}

.dgsimple-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 12%, rgba(55,115,87,.055), transparent 25%),
        radial-gradient(circle at 10% 82%, rgba(186,156,65,.045), transparent 28%),
        linear-gradient(180deg, #fbfcfb 0%, #f5f8f6 100%);
}

.dgsimple-intro::before {
    content: "";
    position: absolute;
    top: -110px;
    left: -70px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    border: 1px solid rgba(26,72,54,.055);
    box-shadow:
        0 0 0 28px rgba(26,72,54,.02),
        0 0 0 58px rgba(26,72,54,.012);
    pointer-events: none;
}

.dgsimple-intro__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgsimple-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;
    direction: ltr;
}

/* LEFT / COPY */
.dgsimple-intro__copy {
    grid-area: copy;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.94);
    box-shadow:
        0 18px 42px rgba(18,59,43,.065),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgsimple-intro__copy-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
    color: #6c8077;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsimple-intro__copy-kicker::before {
    content: "";
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, #b39a3d, rgba(179,154,61,.12));
}

.dgsimple-intro__copy h2 {
    margin: 0 0 14px;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsimple-intro__copy p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-intro__copy p + p {
    margin-top: 15px;
}

.dgsimple-intro__copy strong {
    color: #173f2f;
    font-weight: 900;
}

.dgsimple-intro__highlights {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgsimple-intro__highlight {
    min-height: 94px;
    padding: 13px 14px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgsimple-intro__highlight span {
    display: block;
    margin-bottom: 6px;
    color: #7c6b37;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsimple-intro__highlight strong {
    display: block;
    color: #183e2f;
    font-size: 11px;
    line-height: 1.85;
    font-weight: 850;
}

/* RIGHT / TECHNICAL GREEN CARD */
.dgsimple-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;
    padding: 28px 26px 25px;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.105);
    background:
        radial-gradient(circle at 88% 12%, rgba(228,204,103,.095), transparent 27%),
        radial-gradient(circle at 12% 86%, rgba(84,145,112,.09), transparent 30%),
        linear-gradient(135deg, #0a2a1e 0%, #123d2b 52%, #09271b 100%);
    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
    text-align: right;
}

.dgsimple-intro__tech::before,
.dgsimple-intro__tech::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.dgsimple-intro__tech::before {
    width: 190px;
    height: 190px;
    left: -90px;
    bottom: -105px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px rgba(255,255,255,.018),
        0 0 0 50px rgba(255,255,255,.01);
}

.dgsimple-intro__tech::after {
    top: 0;
    right: 0;
    width: 48%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(205,184,83,.34),
        rgba(236,219,131,.88)
    );
}

.dgsimple-intro__tech-top,
.dgsimple-intro__formula,
.dgsimple-intro__mechanism,
.dgsimple-intro__specs,
.dgsimple-intro__tags {
    position: relative;
    z-index: 1;
}

.dgsimple-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #aac9b8;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsimple-intro__tech h1 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgsimple-intro__tech-subtitle {
    display: block;
    margin-top: 3px;
    color: rgba(228,240,234,.58);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

/* Formation path / technical formula */
.dgsimple-intro__formula {
    margin-top: 23px;
    padding: 17px 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
}

.dgsimple-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
    direction: ltr;
}

.dgsimple-intro__formula-label span {
    color: #abc8b8;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgsimple-intro__formula-label small {
    color: rgba(229,240,234,.42);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgsimple-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);
    gap: 4px;
    align-items: center;
    direction: ltr;
}

.dgsimple-intro__formula-node {
    min-width: 0;
    padding: 11px 8px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.038);
    text-align: center;
}

.dgsimple-intro__formula-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgsimple-intro__formula-node small {
    display: block;
    margin-top: 3px;
    color: rgba(223,238,230,.52);
    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgsimple-intro__formula-arrow {
    color: #d4bd58;
    text-align: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgsimple-intro__mechanism {
    margin-top: 10px;
    padding: 13px 14px;
    border-right: 3px solid rgba(217,194,90,.76);
    border-radius: 12px;
    background: rgba(217,194,90,.055);
    direction: ltr;
    text-align: left;
}

.dgsimple-intro__mechanism span {
    display: block;
    margin-bottom: 4px;
    color: #c6d9ce;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsimple-intro__mechanism strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

/* Technical specs */
.dgsimple-intro__specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin-top: 18px;
}

.dgsimple-intro__spec {
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
}

.dgsimple-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsimple-intro__spec strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgsimple-intro__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 17px;
    direction: ltr;
}

.dgsimple-intro__tag {
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: rgba(234,244,239,.70);
    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}

@media (max-width: 900px) {
    .dgsimple-intro__grid {
        grid-template-columns: minmax(0,1fr) minmax(330px,.92fr);
    }

    .dgsimple-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgsimple-intro__formula-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 760px) {
    .dgsimple-intro {
        padding: 44px 14px 50px;
    }

    .dgsimple-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgsimple-intro__tech,
    .dgsimple-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgsimple-intro__formula-flow {
        grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
        gap: 3px;
    }

    .dgsimple-intro__formula-arrow {
        transform: none;
    }
}

@media (max-width: 520px) {
    .dgsimple-intro__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsimple-intro__highlights,
    .dgsimple-intro__specs {
        grid-template-columns: 1fr;
    }

    .dgsimple-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgsimple-intro__formula-arrow {
        transform: rotate(90deg);
    }

    .dgsimple-intro__copy p {
        line-height: 2.05;
    }
}
/* END — Simple Glitter / Intro v1.10.00 */

/* =========================================================
   DGCHEME — Simple Glitter / Section 02 / Metalized Films
   v1.10.01
   Green alternating section after intro.
========================================================= */
.dgsimple-metalized,
.dgsimple-metalized * {
    box-sizing: border-box;
}

.dgsimple-metalized {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: hidden;
    background:
        radial-gradient(circle at 14% 18%, rgba(206,182,85,.09), transparent 24%),
        radial-gradient(circle at 88% 82%, rgba(34,102,74,.10), transparent 28%),
        linear-gradient(90deg, #04271b 0%, #0b4f34 52%, #04281b 100%);
}

.dgsimple-metalized::before {
    content: "";
    position: absolute;
    left: -140px;
    bottom: -150px;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.05);
    box-shadow:
        0 0 0 34px rgba(255,255,255,.015),
        0 0 0 78px rgba(255,255,255,.008);
    pointer-events: none;
}

.dgsimple-metalized__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgsimple-metalized__grid {
    display: grid;
    grid-template-columns: minmax(360px, .94fr) minmax(0, 1.06fr);
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgsimple-metalized__media {
    position: sticky;
    top: 110px;
    min-width: 0;
}

.dgsimple-metalized__figure {
    margin: 0;
    overflow: hidden;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.055);
    box-shadow:
        0 22px 50px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.dgsimple-metalized__figure img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 800 / 557;
    object-fit: cover;
    transition: transform .55s ease;
}

.dgsimple-metalized__figure:hover img {
    transform: scale(1.045);
}

.dgsimple-metalized__caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px 15px;
    direction: ltr;
}

.dgsimple-metalized__caption strong {
    color: #ffffff;
    font-size: 12px;
    line-height: 1.5;
    font-weight: 850;
}

.dgsimple-metalized__caption span {
    color: rgba(231,240,235,.62);
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsimple-metalized__body {
    min-width: 0;
    padding: 28px 30px 30px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(8, 49, 34, .48);
    box-shadow: 0 20px 46px rgba(0,0,0,.18);
    direction: rtl;
    text-align: right;
}

.dgsimple-metalized__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 11px;
    color: #c5d8cf;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsimple-metalized__eyebrow::before {
    content: "";
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, rgba(214,191,93,.95), rgba(214,191,93,.1));
}

.dgsimple-metalized__title {
    margin: 0 0 14px;
    color: #fff;
    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgsimple-metalized__lead {
    margin: 0;
    padding: 14px 16px;
    border-right: 3px solid rgba(215,192,92,.9);
    border-radius: 16px;
    background: rgba(255,255,255,.05);
    color: #edf4f0;
    font-size: 14px;
    line-height: 2.1;
    font-weight: 800;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-metalized__text {
    margin: 16px 0 0;
    color: rgba(228,239,233,.82);
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-metalized__facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 11px;
    margin-top: 22px;
}

.dgsimple-metalized__fact {
    min-height: 104px;
    padding: 14px 14px 13px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
}

.dgsimple-metalized__fact span {
    display: block;
    margin-bottom: 7px;
    color: #d7c671;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgsimple-metalized__fact strong {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgsimple-metalized__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.08);
    direction: ltr;
}

.dgsimple-metalized__foot strong {
    color: #fff;
    font-size: 10px;
    line-height: 1.6;
    font-weight: 850;
}

.dgsimple-metalized__foot span {
    color: rgba(214,231,222,.6);
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

@media (max-width: 980px) {
    .dgsimple-metalized__grid {
        grid-template-columns: 1fr;
    }

    .dgsimple-metalized__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgsimple-metalized__body {
        order: 2;
    }
}

@media (max-width: 760px) {
    .dgsimple-metalized {
        padding: 44px 14px 50px;
    }

    .dgsimple-metalized__body,
    .dgsimple-metalized__figure {
        border-radius: 20px;
    }

    .dgsimple-metalized__body {
        padding: 22px 20px 22px;
    }
}

@media (max-width: 560px) {
    .dgsimple-metalized__facts {
        grid-template-columns: 1fr;
    }

    .dgsimple-metalized__caption,
    .dgsimple-metalized__foot {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* END — Simple Glitter / Section 02 / Metalized Films v1.10.01 */


/* =========================================================
   DGCHEME — Simple Glitter / Section 03 / Metalized Film
   Structure + Colored Film + Pre-Tabs Transition
   v1.10.03
   LIGHT section after the green food-packaging section.
========================================================= */
.dgsimple-film-tech,
.dgsimple-film-tech * {
    box-sizing: border-box;
}

.dgsimple-film-tech {
    position: relative;
    width: 100%;
    padding: 66px 20px 72px;
    overflow: hidden;
    background:
        radial-gradient(circle at 91% 10%, rgba(43,104,78,.055), transparent 24%),
        radial-gradient(circle at 8% 92%, rgba(180,153,62,.04), transparent 27%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgsimple-film-tech::before {
    content: "";
    position: absolute;
    left: -85px;
    top: 72px;
    width: 250px;
    height: 250px;
    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;
    box-shadow:
        0 0 0 28px rgba(23,63,47,.016),
        0 0 0 56px rgba(23,63,47,.009);
    pointer-events: none;
}

.dgsimple-film-tech__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

/* ---------------------------------------
   Section header
--------------------------------------- */
.dgsimple-film-tech__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 24px;
}

.dgsimple-film-tech__meta {
    padding: 16px 18px;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.84);
    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgsimple-film-tech__meta span {
    display: block;
    color: #75877e;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsimple-film-tech__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgsimple-film-tech__head-copy {
    text-align: right;
}

.dgsimple-film-tech__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #6d8176;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgsimple-film-tech__title {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsimple-film-tech__subtitle {
    display: block;
    margin-top: 2px;
    color: #7b8b83;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 800;
    letter-spacing: .07em;
}

/* ---------------------------------------
   Shared content/media blocks
--------------------------------------- */
.dgsimple-film-tech__block {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgsimple-film-tech__block + .dgsimple-film-tech__block {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid rgba(18,59,43,.08);
}

/* second block swaps columns visually while keeping source sequence */
.dgsimple-film-tech__block--reverse {
    grid-template-columns: minmax(360px,.92fr) minmax(0,1.08fr);
}

.dgsimple-film-tech__content {
    min-width: 0;
    padding: 28px 29px 27px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgsimple-film-tech__block--reverse .dgsimple-film-tech__content {
    order: 2;
}

.dgsimple-film-tech__block-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: #7c6b37;
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgsimple-film-tech__block-kicker::before {
    content: "";
    width: 24px;
    height: 1px;
    background: #aa923d;
}

.dgsimple-film-tech__content h3 {
    margin: 0 0 13px;
    color: #173f2f;
    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgsimple-film-tech__content p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-film-tech__content p + p {
    margin-top: 14px;
}

.dgsimple-film-tech__content strong {
    color: #173f2f;
    font-weight: 900;
}

.dgsimple-film-tech__callout {
    position: relative;
    margin-top: 18px;
    padding: 15px 17px 15px 19px;
    overflow: hidden;
    border-right: 3px solid #aa923d;
    border-radius: 15px;
    background:
        radial-gradient(circle at 12% 22%, rgba(170,146,61,.065), transparent 34%),
        linear-gradient(135deg, #f6f8f6 0%, #f0f4f1 100%);
    color: #40564b;
    font-size: 12px;
    line-height: 2.05;
    font-weight: 850;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-film-tech__callout::after {
    content: attr(data-watermark);
    position: absolute;
    left: 15px;
    bottom: 8px;
    color: rgba(23,63,47,.07);
    direction: ltr;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .06em;
    pointer-events: none;
}

/* fact row */
.dgsimple-film-tech__facts {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 19px;
}

.dgsimple-film-tech__fact {
    min-height: 82px;
    padding: 12px 13px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgsimple-film-tech__fact span {
    display: block;
    margin-bottom: 5px;
    color: #7b6a35;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsimple-film-tech__fact strong {
    display: block;
    color: #183f30;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

/* ---------------------------------------
   Media cards — independent height
--------------------------------------- */
.dgsimple-film-tech__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgsimple-film-tech__block--reverse .dgsimple-film-tech__media {
    order: 1;
}

.dgsimple-film-tech__media-card {
    overflow: hidden;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgsimple-film-tech__media-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px 12px;
    border-bottom: 1px solid rgba(18,59,43,.08);
    direction: ltr;
}

.dgsimple-film-tech__media-head span,
.dgsimple-film-tech__media-head strong {
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .09em;
}

.dgsimple-film-tech__media-head span {
    color: #788a82;
}

.dgsimple-film-tech__media-head strong {
    color: #173f2f;
}

.dgsimple-film-tech__figure {
    margin: 0;
}

.dgsimple-film-tech__frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #eef2ef;
}

.dgsimple-film-tech__frame--structure {
    aspect-ratio: 983 / 636;
}

.dgsimple-film-tech__frame--color {
    aspect-ratio: 739 / 734;
}

.dgsimple-film-tech__frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgsimple-film-tech__frame:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.03);
    }
}

.dgsimple-film-tech__image-label {
    position: absolute;
    right: 13px;
    bottom: 13px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(7,33,23,.66);
    color: #fff;
    backdrop-filter: blur(8px);
}

.dgsimple-film-tech__image-label b {
    color: #e1ca67;
    font-size: 9px;
    line-height: 1;
    font-weight: 900;
}

.dgsimple-film-tech__image-label span {
    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgsimple-film-tech__caption {
    padding: 15px 17px 17px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    direction: rtl;
}

.dgsimple-film-tech__caption span {
    display: block;
    margin-bottom: 6px;
    color: #7b8b83;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgsimple-film-tech__caption strong {
    display: block;
    color: #173f2f;
    font-size: 12px;
    line-height: 1.85;
    font-weight: 900;
}

/* ---------------------------------------
   Full-width pre-tabs transition
--------------------------------------- */
.dgsimple-film-tech__pre-tabs {
    position: relative;
    margin-top: 30px;
    padding: 30px 6px 2px;
    direction: rtl;
}

.dgsimple-film-tech__pre-tabs::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(23,63,47,.03),
        rgba(23,63,47,.14) 45%,
        rgba(170,146,61,.62) 100%
    );
}

.dgsimple-film-tech__pre-tabs::after {
    content: "04";
    position: absolute;
    left: 8px;
    top: 18px;
    color: rgba(23,63,47,.045);
    direction: ltr;
    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;
    pointer-events: none;
}

.dgsimple-film-tech__pre-tabs-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;
    min-height: 58px;
    margin-bottom: 17px;
    padding-right: 20px;
    border-right: 3px solid #aa923d;
}

.dgsimple-film-tech__pre-tabs-head::before {
    content: "";
    position: absolute;
    right: -3px;
    top: -10px;
    width: 3px;
    height: 18px;
    border-radius: 99px;
    background: #173f2f;
}

.dgsimple-film-tech__pre-tabs-head span {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;
    background: rgba(255,255,255,.66);
    color: #6e8177;
    direction: ltr;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgsimple-film-tech__pre-tabs-head span::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #aa923d;
    box-shadow: 0 0 0 4px rgba(170,146,61,.10);
}

.dgsimple-film-tech__pre-tabs-head strong {
    max-width: 650px;
    color: #173f2f;
    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;
    text-align: right;
}

.dgsimple-film-tech__pre-tabs p {
    position: relative;
    max-width: 1060px;
    margin: 0 0 0 auto;
    padding-right: 20px;
    color: #51655b;
    font-size: 13px;
    line-height: 2.18;
    text-align: justify;
    text-align-last: right;
}

.dgsimple-film-tech__pre-tabs p::before {
    content: "";
    position: absolute;
    right: 1px;
    top: .88em;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(170,146,61,.48);
    border-radius: 50%;
    background: rgba(170,146,61,.14);
}

.dgsimple-film-tech__pre-tabs strong {
    color: #173f2f;
    font-weight: 950;
}

.dgsimple-film-tech__pre-tabs-next {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    margin-right: 20px;
    padding: 9px 12px 9px 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(23,63,47,.055), rgba(170,146,61,.08));
    color: #725f27;
    direction: ltr;
    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgsimple-film-tech__pre-tabs-next::before {
    content: "";
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, #aa923d, rgba(170,146,61,.18));
}

@media (max-width: 940px) {
    .dgsimple-film-tech__block,
    .dgsimple-film-tech__block--reverse {
        grid-template-columns: minmax(0,1fr) minmax(320px,.9fr);
    }

    .dgsimple-film-tech__facts {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgsimple-film-tech {
        padding: 46px 14px 52px;
    }

    .dgsimple-film-tech__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsimple-film-tech__meta {
        max-width: 250px;
    }

    .dgsimple-film-tech__block,
    .dgsimple-film-tech__block--reverse {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgsimple-film-tech__media,
    .dgsimple-film-tech__block--reverse .dgsimple-film-tech__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgsimple-film-tech__content,
    .dgsimple-film-tech__block--reverse .dgsimple-film-tech__content {
        order: 2;
        padding: 22px 20px 21px;
    }

    .dgsimple-film-tech__pre-tabs {
        margin-top: 22px;
        padding-top: 25px;
    }

    .dgsimple-film-tech__pre-tabs::after {
        top: 24px;
        font-size: 68px;
    }

    .dgsimple-film-tech__pre-tabs-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgsimple-film-tech__pre-tabs-head span {
        justify-self: end;
    }

    .dgsimple-film-tech__pre-tabs p {
        padding-right: 16px;
        line-height: 2.05;
    }

    .dgsimple-film-tech__pre-tabs-next {
        margin-right: 16px;
    }
}

@media (max-width: 520px) {
    .dgsimple-film-tech__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgsimple-film-tech__pre-tabs-head strong {
        font-size: 13px;
    }
}
/* END — Simple Glitter / Section 03 / Metalized Film Tech v1.10.03 */


/* =========================================================
   DGCHEME — Simple Glitter Product Explorer
   Standard / T / Fluorescent / AL
   v1.10.04
   Full-green architecture; no product grids.
   Deep links:
   ?series=standard#product-explorer
   ?series=t#product-explorer
   ?series=fluorescent#product-explorer
   ?series=al#product-explorer
========================================================= */
.dgproduct-explorer--simple {
    --dg-simple-ink: #f5fbf7;
    --dg-simple-muted: rgba(229,241,234,.72);
    --dg-simple-line: rgba(255,255,255,.09);

    position: relative;
    width: 100%;
    padding: 56px 20px 66px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(78,131,190,.035), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgproduct-explorer--simple::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 8%, rgba(255,255,255,.035), transparent 19%),
        linear-gradient(180deg, rgba(255,255,255,.018), transparent 28%);
}

.dgproduct-explorer--simple .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 24px;
    background:
        radial-gradient(circle at 12% 10%, rgba(255,255,255,.04), transparent 24%),
        linear-gradient(135deg, rgba(12,54,37,.98) 0%, rgba(14,63,42,.985) 53%, rgba(8,39,27,.99) 100%);
    box-shadow:
        0 22px 48px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.03);
}

.dgproduct-explorer--simple .dgproduct-explorer__head {
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgproduct-explorer--simple .dgproduct-explorer__head-copy::before {
    background: linear-gradient(180deg, #98dd68 0%, #a279ff 100%);
    box-shadow: 0 0 18px rgba(169,227,121,.20);
}

.dgproduct-explorer--simple .dgproduct-explorer__kicker {
    color: rgba(223,240,231,.48);
}

.dgproduct-explorer--simple .dgproduct-explorer__title {
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-explorer__lead {
    color: rgba(225,240,232,.70);
}

.dgproduct-explorer--simple .dgproduct-explorer__head-meta {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.03),
        0 12px 24px rgba(0,0,0,.12);
}

.dgproduct-explorer--simple .dgproduct-explorer__head-meta span,
.dgproduct-explorer--simple .dgproduct-explorer__head-meta small {
    color: #eff8f2;
}

/* Tabs */
.dgproduct-explorer--simple .dgproduct-tabs {
    grid-template-columns: repeat(4, minmax(0,1fr));
    margin-bottom: 18px;
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 28px rgba(0,0,0,.12);
}

.dgproduct-explorer--simple .dgproduct-tabs__tab {
    border-color: rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
    color: rgba(231,242,235,.72);
}

.dgproduct-explorer--simple .dgproduct-tabs__code {
    color: rgba(229,239,232,.46);
}

.dgproduct-explorer--simple .dgproduct-tabs__label {
    color: rgba(244,251,247,.82);
}

.dgproduct-explorer--simple .dgproduct-tabs__tab:hover {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.14);
    background: linear-gradient(180deg, rgba(40,98,69,.96), rgba(16,58,40,.98));
    color: #fff;
    box-shadow:
        0 14px 28px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 -3px 0 var(--simple-tab-accent, #8bd25f);
}

.dgproduct-explorer--simple .dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--simple .dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-tabs__tab[data-dgproduct-series="standard"] { --simple-tab-accent: #f3df28; }
.dgproduct-explorer--simple .dgproduct-tabs__tab[data-dgproduct-series="t"] { --simple-tab-accent: #a6c1f7; }
.dgproduct-explorer--simple .dgproduct-tabs__tab[data-dgproduct-series="fluorescent"] { --simple-tab-accent: #f511f1; }
.dgproduct-explorer--simple .dgproduct-tabs__tab[data-dgproduct-series="al"] { --simple-tab-accent: #d7dde8; }

/* Mobile select — fully green */
.dgproduct-explorer--simple .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(35,92,64,.98), rgba(17,57,39,.99));
    color: #fff;
    box-shadow:
        0 10px 24px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.dgproduct-explorer--simple .dgproduct-mobile-select__copy small {
    color: rgba(226,239,231,.52);
}

.dgproduct-explorer--simple .dgproduct-mobile-select__copy strong {
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-mobile-select__chevron {
    background: rgba(255,255,255,.06);
}

.dgproduct-explorer--simple .dgproduct-mobile-select__chevron svg {
    fill: #fff;
}

.dgproduct-explorer--simple .dgproduct-mobile-select__menu {
    border-color: rgba(255,255,255,.10);
    background: #103826;
    box-shadow: 0 16px 36px rgba(0,0,0,.24);
}

.dgproduct-explorer--simple .dgproduct-mobile-select__option {
    color: rgba(235,244,238,.78);
}

.dgproduct-explorer--simple .dgproduct-mobile-select__option:hover,
.dgproduct-explorer--simple .dgproduct-mobile-select__option.is-active {
    background: rgba(255,255,255,.08);
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-mobile-select__option.is-active span {
    color: #d9efc8;
}

/* =========================================================
   Family divider
   Desktop law:
   FAR LEFT [NUMBER][ENGLISH META] ........ [PERSIAN] FAR RIGHT
========================================================= */
@media (min-width: 681px) {
    .dgproduct-explorer--simple .dgproduct-family-divider {
        width: 100%;
        height: 116px;
        min-height: 116px;
        box-sizing: border-box;
        padding: 17px 20px;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
        overflow: hidden;
        border-radius: 15px;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;
        min-width: 300px;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__index {
        order: 1;
        display: grid;
        place-items: center;
        flex: 0 0 50px;
        width: 50px;
        height: 50px;
        box-sizing: border-box;
        border: 1px solid rgba(255,255,255,.24);
        border-radius: 14px;
        background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
        color: #fff;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.16);
        direction: ltr;
        font-size: 14px;
        font-weight: 900;
        line-height: 1;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__copy {
        width: min(760px,100%);
        margin-left: auto;
        margin-right: 0;
        padding: 0;
        background: transparent;
        direction: rtl;
        text-align: right;
    }
}

.dgproduct-explorer--simple .dgproduct-family-divider {
    position: relative;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--simple .dgproduct-family-divider::after {
    height: 2px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(255,255,255,.60),
        rgba(255,255,255,0)
    );
    box-shadow: none;
}

.dgproduct-explorer--simple .dgproduct-family-divider__micro {
    margin: 0 0 2px;
    color: rgba(255,255,255,.74);
    direction: ltr;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .10em;
    text-align: left;
    text-shadow: 0 1px 6px rgba(0,0,0,.18);
}

.dgproduct-explorer--simple .dgproduct-family-divider__latin strong {
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 900;
    text-shadow: 0 1px 6px rgba(0,0,0,.18);
}

.dgproduct-explorer--simple .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 5px;
    color: rgba(255,255,255,.78);
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-style: normal;
    font-weight: 850;
    letter-spacing: .05em;
    text-shadow: 0 1px 6px rgba(0,0,0,.18);
}

.dgproduct-explorer--simple .dgproduct-family-divider h3 {
    margin: 0 0 6px;
    color: #fff;
    direction: rtl;
    font-size: 16px;
    line-height: 1.8;
    font-weight: 900;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.18);
}

.dgproduct-explorer--simple .dgproduct-family-divider__subtitle {
    display: block;
    width: 100%;
    margin: 0;
    color: rgba(255,255,255,.92);
    direction: ltr;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 850;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.18);
}

/* User-provided family banners */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, blue, green, yellow, red);
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, white, #94d153, #a6c1f7);
}

/* T starts with white: switch left meta/index to dark for readability */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__index {
    border-color: rgba(23,56,40,.18);
    background: rgba(23,56,40,.10);
    color: #173828;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.32);
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__latin strong,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__latin em {
    color: #173828;
    text-shadow: none;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-divider {
    background-image: linear-gradient(90deg, purple, blue, #19b2cd, #6df43c, #f511f1);
}

/* AL: user's white-streak reference image; dark overlays keep text readable */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider {
    background-image:
        linear-gradient(90deg, rgba(11,36,28,.58) 0%, rgba(19,55,43,.22) 46%, rgba(6,29,22,.54) 100%),
        url("/wp-content/uploads/2025/08/Screenshot-2025-08-23-193138.webp");
    background-size: cover;
    background-position: center;
}

/* =========================================================
   Family intro — full green, image LEFT, content RIGHT.
   No white content surfaces and no murky figcaption strip.
========================================================= */
.dgproduct-explorer--simple .dgproduct-family-intro {
    align-items: start;
    margin-bottom: 0;
    border-color: rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 88% 12%, rgba(255,255,255,.035), transparent 24%),
        linear-gradient(135deg, #0a2c20 0%, #103928 58%, #0a2b1f 100%);
    box-shadow:
        0 18px 42px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--simple .dgproduct-family-intro__media {
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
}

.dgproduct-explorer--simple .dgproduct-family-intro__visual {
    min-height: 0;
    background: #071b13;
}

.dgproduct-explorer--simple .dgproduct-family-intro__visual > img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgproduct-explorer--simple .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.035);
    }
}

.dgproduct-explorer--simple .dgproduct-family-intro__media figcaption {
    min-height: 34px;
    padding: 9px 11px 7px;
    border-top: 1px solid rgba(255,255,255,.065);
    background: transparent;
    box-shadow: none;
    color: rgba(229,241,234,.68);
}

.dgproduct-explorer--simple .dgproduct-family-intro__media figcaption span {
    color: inherit;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 850;
    letter-spacing: .055em;
}

.dgproduct-explorer--simple .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.07));
}

.dgproduct-explorer--simple .dgproduct-family-intro__badge span {
    color: rgba(238,245,240,.74);
}

.dgproduct-explorer--simple .dgproduct-family-intro__badge strong,
.dgproduct-explorer--simple .dgproduct-family-intro__content h3,
.dgproduct-explorer--simple .dgproduct-family-intro__content strong {
    color: #fff;
}

.dgproduct-explorer--simple .dgproduct-family-intro__content p,
.dgproduct-explorer--simple .dgproduct-family-intro__points li {
    color: rgba(228,240,233,.80);
}

.dgproduct-explorer--simple .dgproduct-family-intro__points {
    border-top-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--simple .dgproduct-family-intro__points li::before {
    background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.11));
    border-color: rgba(255,255,255,.14);
    box-shadow: none;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="standard"]
.dgproduct-family-intro__eyebrow {
    color: #f7db79;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-intro__eyebrow {
    color: #b9d2ff;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="fluorescent"]
.dgproduct-family-intro__eyebrow {
    color: #ff9ffa;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-intro__eyebrow {
    color: #d7e1e8;
}

/* Fluorescent sub-series */
.dgsimple-fluorescent-subseries {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin: 16px 0;
}

.dgsimple-fluorescent-subseries__item {
    min-height: 126px;
    padding: 14px 15px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 14px;
    background: rgba(255,255,255,.04);
}

.dgsimple-fluorescent-subseries__item span {
    display: block;
    margin-bottom: 6px;
    color: #ff9ffa;
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
    text-align: left;
}

.dgsimple-fluorescent-subseries__item strong {
    display: block;
    margin-bottom: 7px;
    color: #fff;
    font-size: 11px;
    line-height: 1.8;
    font-weight: 900;
}

.dgsimple-fluorescent-subseries__item p {
    margin: 0;
    color: rgba(228,240,233,.76);
    font-size: 11px;
    line-height: 1.95;
}

/* No product headers / grids in any of these four families */
.dgproduct-explorer--simple .dgproduct-products-head,
.dgproduct-explorer--simple .dgproduct-grid {
    display: none;
}

@media (max-width: 980px) {
    .dgproduct-explorer--simple .dgproduct-tabs {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--simple {
        padding: 48px 14px 54px;
    }

    .dgproduct-explorer--simple .dgproduct-explorer__inner {
        padding: 18px 14px;
        border-radius: 20px;
    }

    .dgproduct-explorer--simple .dgproduct-tabs {
        display: none;
    }

    .dgproduct-explorer--simple .dgproduct-mobile-select {
        display: block;
    }

    .dgproduct-explorer--simple .dgproduct-family-intro__media {
        position: relative;
        top: auto;
    }

    .dgsimple-fluorescent-subseries {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--simple .dgproduct-family-divider {
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 16px;
        gap: 14px;
        border-radius: 14px;
        direction: rtl;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__meta {
        direction: ltr;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__identity {
        text-align: right;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__subtitle {
        color: rgba(255,255,255,.92);
        font-size: 13px;
    }

    .dgproduct-explorer--simple .dgproduct-family-divider__latin strong,
    .dgproduct-explorer--simple .dgproduct-family-divider h3 {
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--simple .dgproduct-family-intro__visual > img {
        transition: none;
    }
}
/* END — Simple Glitter Product Explorer v1.10.04 */


/* =========================================================
   DGCHEME — Simple Glitter / Divider Readability Fix
   Tabs 02 (T Series) + 04 (AL Series)
   v1.10.05
========================================================= */

/* Same deep green used in the page content */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__latin strong,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__latin em,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider h3,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__title-text,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__title-code,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__subtitle,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__index,

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__latin strong,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__latin em,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider h3,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__title-text,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__title-code,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__subtitle,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__index {
    color: #173f2f;
    text-shadow: none;
}

/* Keep secondary English labels readable but slightly softer */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__latin em,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__micro,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__latin em {
    color: rgba(23,63,47,.78);
}

/* Number chips: light glass background + green number */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__index,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__index {
    border-color: rgba(23,63,47,.18);
    background: rgba(255,255,255,.48);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.58);
}

/* AL reference image is already light; remove dark wash so green copy is clear */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider {
    background-image:
        linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.05)),
        url("/wp-content/uploads/2025/08/Screenshot-2025-08-23-193138.webp");
}

/* Keep title/subtitle weight identical to the other family banners */
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider h3,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider h3 {
    font-size: 16px;
    font-weight: 900;
}

.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider__subtitle,
.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider__subtitle {
    font-size: 16px;
    font-weight: 850;
}

/* END — Simple Glitter Divider Readability Fix v1.10.05 */


/* =========================================================
   DGCHEME — Simple Glitter / T + AL Banner HARD FIX
   v1.10.06
   Compatibility for BOTH explorer class variants:
   .dgproduct-explorer--simple
   .dgproduct-explorer--simple-glitter
========================================================= */

/* ---------- T SERIES ---------- */
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider {
    color: #173f2f !important;
}

.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__micro,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__latin strong,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__latin em,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__copy,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__copy h3,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__title-text,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__title-code,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__subtitle,

.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__micro,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__latin strong,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__latin em,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__copy,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__copy h3,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__title-text,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__title-code,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__subtitle {
    color: #173f2f !important;
    text-shadow: none !important;
    -webkit-text-fill-color: #173f2f !important;
}

.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="t"]
.dgproduct-family-divider .dgproduct-family-divider__index {
    background: rgba(255,255,255,.52) !important;
    border-color: rgba(23,63,47,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.60) !important;
}

/* ---------- AL SERIES ---------- */
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider {
    color: #173f2f !important;
}

.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__micro,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__latin strong,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__latin em,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__copy,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__copy h3,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__title-text,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__title-code,
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__subtitle,

.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__micro,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__latin strong,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__latin em,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__copy,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__copy h3,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__title-text,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__title-code,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__subtitle {
    color: #173f2f !important;
    text-shadow: none !important;
    -webkit-text-fill-color: #173f2f !important;
}

.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__index,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider .dgproduct-family-divider__index {
    background: rgba(255,255,255,.52) !important;
    border-color: rgba(23,63,47,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.60) !important;
}

/* Keep the light streak AL reference visible */
.dgproduct-explorer.dgproduct-explorer--simple
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider,
.dgproduct-explorer.dgproduct-explorer--simple-glitter
.dgproduct-family-panel[data-dgproduct-family="al"]
.dgproduct-family-divider {
    background-image:
        linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,255,255,.04)),
        url("/wp-content/uploads/2025/08/Screenshot-2025-08-23-193138.webp") !important;
    background-size: cover !important;
    background-position: center !important;
}

/* END — Simple Glitter / T + AL Banner HARD FIX v1.10.06 */


/* =========================================================
   DGCHEME — Holographic Glitter / Pre-Tabs Sections
   v1.11.00
   Sequence: WHITE INTRO -> GREEN STRUCTURE -> WHITE APPLICATIONS/PRE-TABS
   The following Product Explorer section should be GREEN.
========================================================= */

/* =========================================================
   SECTION 01 — INTRO / WHITE
========================================================= */
.dgholo-intro,
.dgholo-intro * {
    box-sizing: border-box;
}

.dgholo-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 12%, rgba(72,101,153,.055), transparent 25%),
        radial-gradient(circle at 10% 82%, rgba(179,145,68,.04), transparent 28%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgholo-intro::before {
    content: "";
    position: absolute;
    left: -85px;
    top: 75px;
    width: 250px;
    height: 250px;
    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;
    box-shadow:
        0 0 0 28px rgba(23,63,47,.016),
        0 0 0 56px rgba(23,63,47,.009);
    pointer-events: none;
}

.dgholo-intro__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgholo-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;
    direction: ltr;
}

.dgholo-intro__copy {
    grid-area: copy;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.95);
    box-shadow:
        0 18px 42px rgba(18,59,43,.065),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgholo-intro__kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
    color: #6c8077;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgholo-intro__kicker::before {
    content: "";
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, #9770c5, rgba(151,112,197,.12));
}

.dgholo-intro__copy h2 {
    margin: 0 0 14px;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgholo-intro__copy p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgholo-intro__copy p + p {
    margin-top: 15px;
}

.dgholo-intro__copy strong {
    color: #173f2f;
    font-weight: 900;
}

.dgholo-intro__compare {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgholo-intro__compare-item {
    min-height: 96px;
    padding: 13px 14px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgholo-intro__compare-item span {
    display: block;
    margin-bottom: 6px;
    color: #7b63a0;
    direction: ltr;
    text-align: left;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgholo-intro__compare-item strong {
    display: block;
    color: #183e2f;
    font-size: 11px;
    line-height: 1.85;
    font-weight: 850;
}

/* technical green card */
.dgholo-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;
    padding: 28px 26px 25px;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.105);
    background:
        radial-gradient(circle at 88% 12%, rgba(160,108,222,.11), transparent 26%),
        radial-gradient(circle at 12% 86%, rgba(71,147,118,.09), transparent 30%),
        linear-gradient(135deg, #0a2a1e 0%, #123d2b 52%, #09271b 100%);
    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
    text-align: right;
}

.dgholo-intro__tech::before,
.dgholo-intro__tech::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.dgholo-intro__tech::before {
    width: 190px;
    height: 190px;
    left: -90px;
    bottom: -105px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px rgba(255,255,255,.018),
        0 0 0 50px rgba(255,255,255,.01);
}

.dgholo-intro__tech::after {
    top: 0;
    right: 0;
    width: 52%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #57a8ff, #be74ff, #f4b45b);
}

.dgholo-intro__tech > * {
    position: relative;
    z-index: 1;
}

.dgholo-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #aac9b8;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgholo-intro__tech h1 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgholo-intro__tech-subtitle {
    display: block;
    margin-top: 3px;
    color: rgba(228,240,234,.60);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

.dgholo-intro__formula {
    margin-top: 23px;
    padding: 17px 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
}

.dgholo-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
    direction: ltr;
}

.dgholo-intro__formula-label span {
    color: #abc8b8;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgholo-intro__formula-label small {
    color: rgba(229,240,234,.42);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgholo-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);
    gap: 4px;
    align-items: center;
    direction: ltr;
}

.dgholo-intro__formula-node {
    min-width: 0;
    padding: 11px 8px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.038);
    text-align: center;
}

.dgholo-intro__formula-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgholo-intro__formula-node small {
    display: block;
    margin-top: 3px;
    color: rgba(223,238,230,.52);
    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgholo-intro__formula-arrow {
    color: #c48cff;
    text-align: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgholo-intro__mechanism {
    margin-top: 10px;
    padding: 13px 14px;
    border-right: 3px solid rgba(183,128,244,.80);
    border-radius: 12px;
    background: rgba(183,128,244,.055);
    direction: ltr;
    text-align: left;
}

.dgholo-intro__mechanism span {
    display: block;
    margin-bottom: 4px;
    color: #c6d9ce;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgholo-intro__mechanism strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgholo-intro__specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin-top: 18px;
}

.dgholo-intro__spec {
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
}

.dgholo-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgholo-intro__spec strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgholo-intro__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 17px;
    direction: ltr;
}

.dgholo-intro__tag {
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: rgba(234,244,239,.70);
    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}

/* =========================================================
   SECTION 02 — STRUCTURE / GREEN
========================================================= */
.dgholo-structure,
.dgholo-structure * {
    box-sizing: border-box;
}

.dgholo-structure {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(132,94,255,.055), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgholo-structure__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgholo-structure__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgholo-structure__head-copy {
    direction: rtl;
    text-align: right;
}

.dgholo-structure__eyebrow {
    display: block;
    margin-bottom: 7px;
    color: rgba(223,240,231,.48);
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
    text-align: right;
}

.dgholo-structure__head h2 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgholo-structure__head-meta {
    flex: 0 0 auto;
    min-width: 145px;
    padding: 13px 16px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
    direction: ltr;
    text-align: left;
}

.dgholo-structure__head-meta span {
    display: block;
    color: #d8c1ff;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgholo-structure__head-meta strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgholo-structure__grid {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr);
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgholo-structure__content {
    min-width: 0;
    padding: 27px 29px 28px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;
    background: rgba(7,45,31,.48);
    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);
    direction: rtl;
    text-align: right;
}

.dgholo-structure__content h3 {
    margin: 0 0 13px;
    color: #fff;
    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgholo-structure__lead {
    margin: 0;
    padding: 14px 16px;
    border-right: 3px solid #c08cff;
    border-radius: 15px;
    background: rgba(255,255,255,.045);
    color: #eef6f1;
    font-size: 13px;
    line-height: 2.12;
    font-weight: 850;
    text-align: justify;
    text-align-last: right;
}

.dgholo-structure__content p:not(.dgholo-structure__lead) {
    margin: 15px 0 0;
    color: rgba(228,240,233,.80);
    font-size: 13px;
    line-height: 2.14;
    text-align: justify;
    text-align-last: right;
}

.dgholo-structure__steps {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 19px;
}

.dgholo-structure__step {
    min-height: 94px;
    padding: 12px 13px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dgholo-structure__step span {
    display: block;
    margin-bottom: 6px;
    color: #d8c1ff;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgholo-structure__step strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgholo-structure__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgholo-structure__figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 22px;
    background: rgba(255,255,255,.035);
    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgholo-structure__visual {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 957 / 501;
    background: #071b13;
}

.dgholo-structure__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

.dgholo-structure__badge {
    position: absolute;
    right: 13px;
    bottom: 13px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(7,33,23,.66);
    color: #fff;
    backdrop-filter: blur(8px);
    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgholo-structure__figure figcaption {
    padding: 14px 16px 16px;
    border-top: 1px solid rgba(255,255,255,.07);
    background: transparent;
    color: rgba(230,241,235,.72);
    direction: rtl;
    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

/* =========================================================
   SECTION 03 — APPLICATIONS + PRE-TABS / WHITE
========================================================= */
.dgholo-apps,
.dgholo-apps * {
    box-sizing: border-box;
}

.dgholo-apps {
    position: relative;
    width: 100%;
    padding: 62px 20px 72px;
    overflow: visible;
    background:
        radial-gradient(circle at 88% 16%, rgba(104,74,171,.045), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgholo-apps__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgholo-apps__grid {
    display: grid;
    grid-template-columns: minmax(360px,.92fr) minmax(0,1.08fr);
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgholo-apps__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgholo-apps__figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgholo-apps__visual {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 735 / 490;
    background: #eef2ef;
}

.dgholo-apps__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

.dgholo-apps__image-label {
    position: absolute;
    right: 13px;
    bottom: 13px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(7,33,23,.68);
    color: #fff;
    backdrop-filter: blur(8px);
    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgholo-apps__figure figcaption {
    padding: 14px 16px 16px;
    border-top: 1px solid rgba(18,59,43,.08);
    background: #f3f6f4;
    color: #51655b;
    direction: rtl;
    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgholo-apps__content {
    min-width: 0;
    padding: 28px 30px 29px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgholo-apps__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: #7b63a0;
    direction: ltr;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgholo-apps__eyebrow::before {
    content: "";
    width: 24px;
    height: 1px;
    background: #8f6ab7;
}

.dgholo-apps__content h2 {
    margin: 0 0 14px;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgholo-apps__content p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgholo-apps__content p + p {
    margin-top: 14px;
}

.dgholo-apps__content strong {
    color: #173f2f;
    font-weight: 900;
}

.dgholo-apps__highlight {
    margin-top: 18px;
    padding: 15px 17px;
    border-right: 3px solid #8f6ab7;
    border-radius: 15px;
    background:
        radial-gradient(circle at 12% 22%, rgba(143,106,183,.06), transparent 34%),
        linear-gradient(135deg, #f6f8f6 0%, #f0f4f1 100%);
    color: #40564b;
    font-size: 12px;
    line-height: 2.05;
    font-weight: 850;
    text-align: justify;
    text-align-last: right;
}

.dgholo-apps__uses {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 19px;
}

.dgholo-apps__use {
    min-height: 82px;
    padding: 12px 13px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgholo-apps__use span {
    display: block;
    margin-bottom: 5px;
    color: #7b63a0;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgholo-apps__use strong {
    display: block;
    color: #183f30;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

/* transition to next green Product Explorer */
.dgholo-apps__pre-tabs {
    position: relative;
    margin-top: 30px;
    padding: 30px 6px 2px;
    direction: rtl;
}

.dgholo-apps__pre-tabs::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(23,63,47,.03),
        rgba(23,63,47,.14) 45%,
        rgba(143,106,183,.60) 100%
    );
}

.dgholo-apps__pre-tabs::after {
    content: "04";
    position: absolute;
    left: 8px;
    top: 18px;
    color: rgba(23,63,47,.045);
    direction: ltr;
    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;
    pointer-events: none;
}

.dgholo-apps__pre-tabs-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;
    min-height: 58px;
    margin-bottom: 17px;
    padding-right: 20px;
    border-right: 3px solid #8f6ab7;
}

.dgholo-apps__pre-tabs-head span {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;
    background: rgba(255,255,255,.66);
    color: #6e8177;
    direction: ltr;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgholo-apps__pre-tabs-head span::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #8f6ab7;
    box-shadow: 0 0 0 4px rgba(143,106,183,.10);
}

.dgholo-apps__pre-tabs-head strong {
    max-width: 650px;
    color: #173f2f;
    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;
    text-align: right;
}

.dgholo-apps__pre-tabs p {
    position: relative;
    max-width: 1060px;
    margin: 0 0 0 auto;
    padding-right: 20px;
    color: #51655b;
    font-size: 13px;
    line-height: 2.18;
    text-align: justify;
    text-align-last: right;
}

.dgholo-apps__pre-tabs p::before {
    content: "";
    position: absolute;
    right: 1px;
    top: .88em;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(143,106,183,.48);
    border-radius: 50%;
    background: rgba(143,106,183,.14);
}

.dgholo-apps__pre-tabs strong {
    color: #173f2f;
    font-weight: 950;
}

.dgholo-apps__pre-tabs-next {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    margin-right: 20px;
    padding: 9px 12px 9px 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(23,63,47,.055), rgba(143,106,183,.08));
    color: #6a4c8b;
    direction: ltr;
    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgholo-apps__pre-tabs-next::before {
    content: "";
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, #8f6ab7, rgba(143,106,183,.18));
}

@media (hover:hover) and (pointer:fine) {
    .dgholo-structure__visual:hover img,
    .dgholo-apps__visual:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.035);
    }
}

@media (max-width: 940px) {
    .dgholo-intro__grid,
    .dgholo-structure__grid,
    .dgholo-apps__grid {
        grid-template-columns: minmax(0,1fr) minmax(320px,.9fr);
    }

    .dgholo-structure__steps,
    .dgholo-apps__uses {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dgholo-intro,
    .dgholo-structure,
    .dgholo-apps {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dgholo-intro {
        padding-top: 44px;
        padding-bottom: 50px;
    }

    .dgholo-structure,
    .dgholo-apps {
        padding-top: 46px;
        padding-bottom: 52px;
    }

    .dgholo-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgholo-intro__tech,
    .dgholo-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgholo-structure__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dgholo-structure__head-meta {
        min-width: 0;
        max-width: 220px;
    }

    .dgholo-structure__grid,
    .dgholo-apps__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgholo-structure__media,
    .dgholo-apps__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgholo-structure__content,
    .dgholo-apps__content {
        order: 2;
        padding: 22px 20px 21px;
    }

    .dgholo-apps__pre-tabs {
        margin-top: 22px;
        padding-top: 25px;
    }

    .dgholo-apps__pre-tabs::after {
        top: 24px;
        font-size: 68px;
    }

    .dgholo-apps__pre-tabs-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgholo-apps__pre-tabs-head span {
        justify-self: end;
    }

    .dgholo-apps__pre-tabs p {
        padding-right: 16px;
        line-height: 2.05;
    }

    .dgholo-apps__pre-tabs-next {
        margin-right: 16px;
    }
}

@media (max-width: 520px) {
    .dgholo-intro__inner,
    .dgholo-structure__inner,
    .dgholo-apps__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgholo-intro__compare,
    .dgholo-intro__specs {
        grid-template-columns: 1fr;
    }

    .dgholo-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgholo-intro__formula-arrow {
        transform: rotate(90deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgholo-structure__visual img,
    .dgholo-apps__visual img {
        transition: none;
    }
}
/* END — Holographic Glitter Pre-Tabs v1.11.00 */


/* =========================================================
   DGCHEME — Holographic Glitter Product Explorer / v1.11.01
   Green tab section after holographic pre-tabs.
========================================================= */
.dgproduct-explorer--holographic {
    position: relative;
    overflow: hidden;
    padding: 64px 20px 74px;
    background:
        radial-gradient(circle at 14% 14%, rgba(255,255,255,.06), transparent 26%),
        radial-gradient(circle at 88% 28%, rgba(135,199,255,.07), transparent 29%),
        linear-gradient(135deg, #082419 0%, #0f3727 48%, #082318 100%);
}

.dgproduct-explorer--holographic::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255,255,255,.02) 0, rgba(255,255,255,0) 16%, rgba(255,255,255,0) 84%, rgba(255,255,255,.02) 100%);
}

.dgproduct-explorer--holographic .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgproduct-explorer--holographic .dgproduct-explorer__head {
    margin-bottom: 22px;
}

.dgproduct-explorer--holographic .dgproduct-explorer__kicker,
.dgproduct-explorer--holographic .dgproduct-explorer__lead {
    color: rgba(223,240,231,.74);
}

.dgproduct-explorer--holographic .dgproduct-explorer__title {
    color: #ffffff;
}

.dgproduct-explorer--holographic .dgproduct-explorer__head-meta {
    border-color: rgba(255,255,255,.11);
    background: rgba(255,255,255,.04);
    color: #ffffff;
}

.dgproduct-explorer--holographic .dgproduct-explorer__head-meta span,
.dgproduct-explorer--holographic .dgproduct-explorer__head-meta small {
    color: #ffffff;
}

.dgproduct-explorer--holographic .dgproduct-tabs {
    gap: 12px;
    margin-bottom: 22px;
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab:hover {
    background: rgba(255,255,255,.065);
    border-color: rgba(255,255,255,.16);
}

.dgproduct-explorer--holographic .dgproduct-tabs__code,
.dgproduct-explorer--holographic .dgproduct-tabs__label {
    color: #eff6f2;
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab.is-active {
    border-color: rgba(255,255,255,.18);
    background: rgba(255,255,255,.11);
    box-shadow: 0 16px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.05);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__copy small {
    color: rgba(223,240,231,.72);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__copy strong,
.dgproduct-explorer--holographic .dgproduct-mobile-select__chevron svg {
    color: #fff;
    fill: currentColor;
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__menu {
    background: #0d2d20;
    border-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__option {
    color: #eef6f1;
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__option span {
    color: rgba(223,240,231,.72);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__option.is-active,
.dgproduct-explorer--holographic .dgproduct-mobile-select__option:hover {
    background: rgba(255,255,255,.08);
}

.dgproduct-explorer--holographic .dgproduct-family-divider {
    margin-bottom: 18px;
}

.dgproduct-explorer--holographic .dgproduct-family-panel {
    background: transparent;
}

.dgholo-divider--tla,
.dgholo-divider--la {
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 18px 42px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
}

.dgholo-divider--tla {
    background:
        linear-gradient(90deg, #ffffff 0%, #93d051 54%, #a6c2f2 100%);
}

.dgholo-divider--la {
    background:
        linear-gradient(90deg, #67359f 0%, #7bb960 40%, #f59e07 72%, #f01100 100%);
}

.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__index,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__micro,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__latin strong,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__latin em,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__title-text,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__title-code,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__subtitle {
    color: #1d5a36;
}

.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__index,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__micro,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__latin strong,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__latin em,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__title-text,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__title-code,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__subtitle {
    color: #1d5a36;
}

.dgproduct-explorer--holographic .dgproduct-family-intro {
    padding: 22px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 24px;
    background: rgba(255,255,255,.05);
    box-shadow: 0 20px 46px rgba(0,0,0,.16);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__media {
    border-color: rgba(255,255,255,.10);
    background: rgba(7,36,25,.34);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__visual {
    background: #091d14;
}

.dgproduct-explorer--holographic .dgproduct-family-intro__visual > img {
    transition: transform .45s cubic-bezier(.22,.61,.36,1), filter .45s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgproduct-explorer--holographic .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.04);
        filter: contrast(1.03) saturate(1.03);
    }
}

.dgproduct-explorer--holographic .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.16);
    background: rgba(8,27,18,.70);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__badge span,
.dgproduct-explorer--holographic .dgproduct-family-intro__badge strong,
.dgproduct-explorer--holographic .dgproduct-family-intro__media figcaption span {
    color: #ffffff;
}

.dgproduct-explorer--holographic .dgproduct-family-intro__content h3,
.dgproduct-explorer--holographic .dgproduct-family-intro__content strong {
    color: #ffffff;
}

.dgproduct-explorer--holographic .dgproduct-family-intro__content p,
.dgproduct-explorer--holographic .dgproduct-family-intro__points li,
.dgproduct-explorer--holographic .dgproduct-family-intro__eyebrow {
    color: rgba(233,242,237,.82);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__points li::before {
    background: linear-gradient(180deg, #93d051 0%, #a6c2f2 100%);
}

.dgproduct-explorer--holographic .dgproduct-family-panel[data-dgproduct-family="la"] .dgproduct-family-intro__content,
.dgproduct-explorer--holographic .dgproduct-family-panel[data-dgproduct-family="tla"] .dgproduct-family-intro__content {
    text-shadow: 0 0 0 transparent;
}

@media (max-width: 940px) {
    .dgproduct-explorer--holographic {
        padding-top: 52px;
        padding-bottom: 60px;
    }
}

@media (max-width: 768px) {
    .dgproduct-explorer--holographic {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dgproduct-explorer--holographic .dgproduct-family-intro {
        padding: 16px;
        border-radius: 20px;
    }
}
/* END — Holographic Glitter Product Explorer v1.11.01 */


/* =========================================================
   DGCHEME — Holographic Product Explorer / FULL GREEN FIX
   v1.11.02

   Root cause:
   shared .dgproduct-explorer__inner still carried the old
   white Product Explorer surface. Outer section was green,
   but the large inner container remained white.

   Fix mirrors the completed Chameleon green architecture.
========================================================= */

.dgproduct-explorer--holographic {
    background:
        radial-gradient(circle at 14% 14%, rgba(169,227,121,.075), transparent 26%),
        radial-gradient(circle at 88% 22%, rgba(128,151,255,.055), transparent 24%),
        linear-gradient(125deg, #052117 0%, #0b3828 46%, #07271b 100%);
}

/* This was the missing override: the shared base makes this WHITE. */
.dgproduct-explorer--holographic .dgproduct-explorer__inner {
    border-color: rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 12% 10%, rgba(255,255,255,.045), transparent 24%),
        radial-gradient(circle at 90% 90%, rgba(130,95,215,.035), transparent 28%),
        linear-gradient(135deg, rgba(12,54,37,.985) 0%, rgba(14,63,42,.99) 53%, rgba(8,39,27,.995) 100%);
    box-shadow:
        0 22px 48px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.03);
}

.dgproduct-explorer--holographic .dgproduct-explorer__inner::before {
    background:
        radial-gradient(circle, rgba(179,255,132,.13) 0%, rgba(179,255,132,0) 72%);
}

.dgproduct-explorer--holographic .dgproduct-explorer__head {
    border-bottom-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--holographic .dgproduct-explorer__head-copy::before {
    background: linear-gradient(180deg, #90d466 0%, #9269e8 100%);
    box-shadow: 0 0 18px rgba(169,227,121,.20);
}

.dgproduct-explorer--holographic .dgproduct-explorer__kicker {
    color: rgba(223,240,231,.48);
}

.dgproduct-explorer--holographic .dgproduct-explorer__title {
    color: #f4fbf7;
}

.dgproduct-explorer--holographic .dgproduct-explorer__lead {
    color: rgba(225,240,232,.70);
}

.dgproduct-explorer--holographic .dgproduct-explorer__head-meta {
    border-color: rgba(255,255,255,.10);
    background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.03),
        0 12px 24px rgba(0,0,0,.12);
}

.dgproduct-explorer--holographic .dgproduct-explorer__head-meta span,
.dgproduct-explorer--holographic .dgproduct-explorer__head-meta small {
    color: #eff8f2;
}

/* Green tab rail instead of inherited white rail */
.dgproduct-explorer--holographic .dgproduct-tabs {
    border-color: rgba(255,255,255,.10);
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 28px rgba(0,0,0,.12);
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab {
    border-color: rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
    color: rgba(231,242,235,.72);
}

.dgproduct-explorer--holographic .dgproduct-tabs__code {
    color: rgba(229,239,232,.48);
}

.dgproduct-explorer--holographic .dgproduct-tabs__label {
    color: rgba(244,251,247,.84);
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab:hover {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
}

.dgproduct-explorer--holographic .dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.14);
    background:
        linear-gradient(180deg, rgba(40,98,69,.96), rgba(16,58,40,.98));
    box-shadow:
        0 14px 28px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 -3px 0 var(--holographic-tab-accent, #93d051);
}

.dgproduct-explorer--holographic
.dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--holographic
.dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #fff;
}

.dgproduct-explorer--holographic
.dgproduct-tabs__tab[data-dgproduct-series="tla"] {
    --holographic-tab-accent: #a6c2f2;
}

.dgproduct-explorer--holographic
.dgproduct-tabs__tab[data-dgproduct-series="la"] {
    --holographic-tab-accent: #f59e07;
}

/* Mobile select must also stay green */
.dgproduct-explorer--holographic .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background:
        linear-gradient(180deg, rgba(35,92,64,.98), rgba(17,57,39,.99));
    box-shadow:
        0 10px 24px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__menu {
    border-color: rgba(255,255,255,.10);
    background: #103826;
}

.dgproduct-explorer--holographic .dgproduct-mobile-select__option {
    color: rgba(235,244,238,.78);
}

.dgproduct-explorer--holographic
.dgproduct-mobile-select__option.is-active,
.dgproduct-explorer--holographic
.dgproduct-mobile-select__option:hover {
    background: rgba(255,255,255,.08);
    color: #fff;
}

/* Family content must not fall back to inherited white surfaces */
.dgproduct-explorer--holographic .dgproduct-family-intro {
    border-color: rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 88% 12%, rgba(255,255,255,.035), transparent 24%),
        linear-gradient(135deg, #0a2c20 0%, #103928 58%, #0a2b1f 100%);
    box-shadow:
        0 18px 42px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__content {
    background: transparent;
}

.dgproduct-explorer--holographic .dgproduct-family-intro__media {
    border-color: rgba(255,255,255,.08);
    background: transparent;
}

.dgproduct-explorer--holographic .dgproduct-family-intro__media figcaption {
    border-top-color: rgba(255,255,255,.07);
    background: transparent;
    color: rgba(228,240,233,.70);
}

.dgproduct-explorer--holographic .dgproduct-family-intro__points {
    border-top-color: rgba(255,255,255,.08);
}

/* Keep the supplied light family strips readable */
.dgproduct-explorer--holographic .dgholo-divider--tla,
.dgproduct-explorer--holographic .dgholo-divider--la {
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

/* END — Holographic Product Explorer Full Green Fix v1.11.02 */


/* =========================================================
   DGCHEME — Holographic Product Explorer
   WIDTH + FAMILY DIVIDER GEOMETRY FIX
   v1.11.03

   LOCKED RULE:
   - Product Explorer uses the wide 1380px architecture.
   - Divider Persian identity = FAR RIGHT.
   - English cluster = FAR LEFT.
   - Number chip = LEFT OF English cluster, never over it.
   - Divider geometry mirrors finished Chameleon page.
========================================================= */

/* Restore the wide Product Explorer architecture.
   v1.11.00 accidentally narrowed this to 1180px. */
.dgproduct-explorer--holographic .dgproduct-explorer__inner {
    width: min(1380px, 100%);
    margin-right: auto;
    margin-left: auto;
}

/* Keep panel + banner genuinely full width inside the explorer */
.dgproduct-explorer--holographic .dgproduct-family-panel,
.dgproduct-explorer--holographic .dgproduct-family-divider,
.dgproduct-explorer--holographic .dgproduct-family-intro {
    width: 100%;
}

/* =========================================================
   DESKTOP FAMILY BANNER — EXACT LOCKED GEOMETRY
   LEFT: [NUMBER] [ENGLISH]
   RIGHT: [PERSIAN]
========================================================= */
@media (min-width: 681px) {

    .dgproduct-explorer--holographic .dgproduct-family-divider {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;

        width: 100%;
        height: 116px;
        min-height: 116px;
        margin-bottom: 18px;
        padding: 17px 20px;

        overflow: hidden;
        border-radius: 15px;

        /* Critical: left cluster follows physical LTR order */
        direction: ltr;
    }

    /* LEFT CLUSTER */
    .dgproduct-explorer--holographic .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;

        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;

        min-width: 300px;
        margin: 0;
        padding: 0;

        direction: ltr;
        text-align: left;
    }

    /* NUMBER MUST BE TO THE LEFT OF THE ENGLISH WORDS */
    .dgproduct-explorer--holographic .dgproduct-family-divider__index {
        order: 1;
        flex: 0 0 50px;

        display: grid;
        place-items: center;

        width: 50px;
        height: 50px;
        margin: 0;

        border-radius: 14px;

        direction: ltr;
        text-align: center;
        font-size: 14px;
        line-height: 1;
        font-weight: 900;
    }

    /* ENGLISH WORDS IMMEDIATELY TO THE RIGHT OF NUMBER */
    .dgproduct-explorer--holographic .dgproduct-family-divider__latin {
        order: 2;
        flex: 0 1 auto;
        min-width: 0;

        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;

        margin: 0;
        padding: 0;

        direction: ltr;
        text-align: left;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__micro {
        display: block;
        margin: 0 0 3px;

        direction: ltr;
        text-align: left;

        font-size: 7px;
        line-height: 1.4;
        font-weight: 850;
        letter-spacing: .10em;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__latin strong {
        display: block;
        margin: 0;

        direction: ltr;
        text-align: left;

        font-size: 16px;
        line-height: 1.35;
        font-weight: 900;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__latin em {
        display: block;
        margin: 5px 0 0;

        direction: ltr;
        text-align: left;

        font-size: 8px;
        line-height: 1.4;
        font-style: normal;
        font-weight: 850;
        letter-spacing: .05em;
    }

    /* RIGHT CLUSTER */
    .dgproduct-explorer--holographic .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;

        display: flex;
        align-items: center;
        justify-content: flex-end;

        margin: 0;
        padding: 0;

        direction: ltr;
        text-align: right;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__copy {
        width: min(760px, 100%);
        margin: 0;
        padding: 0;

        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__copy h3 {
        margin: 0 0 6px;

        direction: rtl;
        text-align: right;

        font-size: 16px;
        line-height: 1.8;
        font-weight: 900;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__subtitle {
        display: block;
        width: 100%;
        margin: 0;

        direction: ltr;
        text-align: right;

        font-size: 16px;
        line-height: 1.55;
        font-weight: 850;
        letter-spacing: 0;
    }
}

/* TLA + LA: same dark green typography used by the reference Duster banner */
.dgproduct-explorer--holographic .dgholo-divider--tla,
.dgproduct-explorer--holographic .dgholo-divider--la {
    color: #173f2f;
}

.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__index,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__micro,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__latin strong,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__latin em,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider h3,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__title-text,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__title-code,
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__subtitle,

.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__index,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__micro,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__latin strong,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__latin em,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider h3,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__title-text,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__title-code,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__subtitle {
    color: #173f2f;
    text-shadow: none;
}

/* Glass number chip like the supplied reference */
.dgproduct-explorer--holographic .dgholo-divider--tla .dgproduct-family-divider__index,
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__index {
    border-color: rgba(255,255,255,.55);
    background: rgba(255,255,255,.34);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.58);
}

/* On the darker left side of LA, give the left cluster a subtle light plate
   so the requested green type stays readable without changing its color. */
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__meta {
    border-radius: 14px;
    background: rgba(255,255,255,.58);
    box-shadow: 0 8px 22px rgba(18,52,38,.08);
}

@media (min-width: 681px) {
    .dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__meta {
        padding: 8px 10px;
    }
}

/* Mobile: no collisions; Persian still right, English/number stay grouped */
@media (max-width: 680px) {

    .dgproduct-explorer--holographic .dgproduct-family-divider {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;

        height: auto;
        min-height: 0;
        padding: 16px;

        direction: rtl;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;

        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__copy {
        width: 100%;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__meta {
        order: 2;

        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;

        width: 100%;
        min-width: 0;

        direction: ltr;
        text-align: left;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__index {
        order: 1;
        flex: 0 0 46px;

        width: 46px;
        height: 46px;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;

        direction: ltr;
        text-align: left;
    }

    .dgproduct-explorer--holographic .dgproduct-family-divider__latin strong,
    .dgproduct-explorer--holographic .dgproduct-family-divider h3,
    .dgproduct-explorer--holographic .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

/* END — Holographic Explorer Width + Divider Geometry Fix v1.11.03 */

/* =========================================================
   DGCHEME — Holographic Tabs LA meta plate removal
   v1.11.04
   Remove the white backing box from Tab 02 left cluster.
========================================================= */
.dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__meta {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

@media (min-width: 681px) {
    .dgproduct-explorer--holographic .dgholo-divider--la .dgproduct-family-divider__meta {
        padding: 0 !important;
    }
}
/* END — v1.11.04 */


/* =========================================================
   DGCHEME — Magic Glitter / All Sections Before Tabs
   v1.12.00

   LOCKED SEQUENCE:
   SECTION 01 = WHITE / INTRO
   SECTION 02 = GREEN / MIXED GLITTER & SPARKLE
   SECTION 03 = WHITE / WHOLESALE + PRE-TABS

   Next Product Explorer section MUST be GREEN.
========================================================= */


/* =========================================================
   SECTION 01 — MAGIC GLITTER INTRO / WHITE
========================================================= */
.dgmagic-intro,
.dgmagic-intro * {
    box-sizing: border-box;
}

.dgmagic-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 12%, rgba(125,80,190,.055), transparent 25%),
        radial-gradient(circle at 10% 84%, rgba(48,113,79,.035), transparent 28%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgmagic-intro::before {
    content: "";
    position: absolute;
    left: -82px;
    top: 76px;
    width: 245px;
    height: 245px;
    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;
    box-shadow:
        0 0 0 27px rgba(23,63,47,.016),
        0 0 0 55px rgba(23,63,47,.009);
    pointer-events: none;
}

.dgmagic-intro__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgmagic-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;
    direction: ltr;
}

.dgmagic-intro__copy {
    grid-area: copy;
    min-width: 0;
    padding: 30px 30px 28px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgmagic-intro__kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: #6d8077;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgmagic-intro__kicker::before {
    content: "";
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, #8d63d8, rgba(141,99,216,.12));
}

.dgmagic-intro__copy h2 {
    margin: 0 0 14px;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgmagic-intro__copy p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgmagic-intro__copy p + p {
    margin-top: 14px;
}

.dgmagic-intro__copy strong {
    color: #173f2f;
    font-weight: 900;
}

.dgmagic-intro__mix-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(18,59,43,.08);
}

.dgmagic-intro__mix-item {
    min-height: 88px;
    padding: 12px 13px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;
    background: #f5f8f6;
}

.dgmagic-intro__mix-item span {
    display: block;
    margin-bottom: 5px;
    color: #7553a8;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgmagic-intro__mix-item strong {
    display: block;
    color: #183f30;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* Technical card */
.dgmagic-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;
    padding: 28px 26px 25px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.105);
    border-radius: 22px;
    background:
        radial-gradient(circle at 88% 12%, rgba(181,104,255,.105), transparent 26%),
        radial-gradient(circle at 10% 90%, rgba(76,156,117,.08), transparent 30%),
        linear-gradient(135deg, #092a1e 0%, #123d2b 52%, #09271b 100%);
    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);
    direction: rtl;
    text-align: right;
}

.dgmagic-intro__tech::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 62%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        #6fd85e,
        #69a7ff,
        #bb73ff,
        #ffba55
    );
    pointer-events: none;
}

.dgmagic-intro__tech > * {
    position: relative;
    z-index: 1;
}

.dgmagic-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #abc9b9;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgmagic-intro__tech h1 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgmagic-intro__tech-subtitle {
    display: block;
    margin-top: 3px;
    color: rgba(228,240,234,.62);
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

.dgmagic-intro__formula {
    margin-top: 23px;
    padding: 17px 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.045);
}

.dgmagic-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
    direction: ltr;
}

.dgmagic-intro__formula-label span {
    color: #abc8b8;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgmagic-intro__formula-label small {
    color: rgba(229,240,234,.42);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgmagic-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
    gap: 4px;
    align-items: center;
    direction: ltr;
}

.dgmagic-intro__formula-node {
    min-width: 0;
    padding: 11px 7px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.038);
    text-align: center;
}

.dgmagic-intro__formula-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgmagic-intro__formula-node small {
    display: block;
    margin-top: 3px;
    color: rgba(223,238,230,.52);
    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgmagic-intro__formula-arrow {
    color: #c38cff;
    text-align: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgmagic-intro__mechanism {
    margin-top: 10px;
    padding: 13px 14px;
    border-right: 3px solid rgba(190,135,244,.82);
    border-radius: 12px;
    background: rgba(183,128,244,.055);
    direction: ltr;
    text-align: left;
}

.dgmagic-intro__mechanism span {
    display: block;
    margin-bottom: 4px;
    color: #c6d9ce;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgmagic-intro__mechanism strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgmagic-intro__specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin-top: 18px;
}

.dgmagic-intro__spec {
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
}

.dgmagic-intro__spec span {
    display: block;
    margin-bottom: 5px;
    color: #a8c5b7;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgmagic-intro__spec strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgmagic-intro__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 17px;
    direction: ltr;
}

.dgmagic-intro__tag {
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: rgba(234,244,239,.70);
    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}


/* =========================================================
   SECTION 02 — MAGIC MIX / GREEN
========================================================= */
.dgmagic-sparkle,
.dgmagic-sparkle * {
    box-sizing: border-box;
}

.dgmagic-sparkle {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(132,94,255,.055), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgmagic-sparkle__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgmagic-sparkle__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgmagic-sparkle__head-copy {
    direction: rtl;
    text-align: right;
}

.dgmagic-sparkle__eyebrow {
    display: block;
    margin-bottom: 7px;
    color: rgba(223,240,231,.48);
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
    text-align: right;
}

.dgmagic-sparkle__head h2 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgmagic-sparkle__head-meta {
    flex: 0 0 auto;
    min-width: 150px;
    padding: 13px 16px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
    direction: ltr;
    text-align: left;
}

.dgmagic-sparkle__head-meta span {
    display: block;
    color: #d8c1ff;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgmagic-sparkle__head-meta strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgmagic-sparkle__grid {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr);
    gap: 24px;
    align-items: start;
    direction: ltr;
}

.dgmagic-sparkle__content {
    min-width: 0;
    padding: 27px 29px 28px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;
    background: rgba(7,45,31,.48);
    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);
    direction: rtl;
    text-align: right;
}

.dgmagic-sparkle__content h3 {
    margin: 0 0 13px;
    color: #fff;
    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgmagic-sparkle__lead {
    margin: 0;
    padding: 14px 16px;
    border-right: 3px solid #c08cff;
    border-radius: 15px;
    background: rgba(255,255,255,.045);
    color: #eef6f1;
    font-size: 13px;
    line-height: 2.12;
    font-weight: 850;
    text-align: justify;
    text-align-last: right;
}

.dgmagic-sparkle__content p:not(.dgmagic-sparkle__lead) {
    margin: 15px 0 0;
    color: rgba(228,240,233,.80);
    font-size: 13px;
    line-height: 2.14;
    text-align: justify;
    text-align-last: right;
}

.dgmagic-sparkle__uses {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;
    margin-top: 19px;
}

.dgmagic-sparkle__use {
    min-height: 92px;
    padding: 12px 13px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}

.dgmagic-sparkle__use span {
    display: block;
    margin-bottom: 6px;
    color: #d8c1ff;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgmagic-sparkle__use strong {
    display: block;
    color: #fff;
    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgmagic-sparkle__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgmagic-sparkle__figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 22px;
    background: rgba(255,255,255,.035);
    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgmagic-sparkle__visual {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 642 / 321;
    background: #071b13;
}

.dgmagic-sparkle__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

.dgmagic-sparkle__badge {
    position: absolute;
    right: 13px;
    bottom: 13px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(7,33,23,.66);
    color: #fff;
    backdrop-filter: blur(8px);
    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

.dgmagic-sparkle__figure figcaption {
    padding: 14px 16px 16px;
    border-top: 1px solid rgba(255,255,255,.07);
    background: transparent;
    color: rgba(230,241,235,.72);
    direction: rtl;
    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}


/* =========================================================
   SECTION 03 — WHOLESALE + PRE-TABS / WHITE
========================================================= */
.dgmagic-wholesale,
.dgmagic-wholesale * {
    box-sizing: border-box;
}

.dgmagic-wholesale {
    position: relative;
    width: 100%;
    padding: 62px 20px 72px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 16%, rgba(104,74,171,.045), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgmagic-wholesale__inner {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgmagic-wholesale__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;
    margin-bottom: 22px;
}

.dgmagic-wholesale__meta {
    padding: 16px 18px;
    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.86);
    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgmagic-wholesale__meta span {
    display: block;
    color: #75877e;
    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgmagic-wholesale__meta strong {
    display: block;
    margin-top: 7px;
    color: #173f2f;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgmagic-wholesale__head-copy {
    direction: rtl;
    text-align: right;
}

.dgmagic-wholesale__eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #6d8176;
    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgmagic-wholesale__head h2 {
    margin: 0;
    color: #173f2f;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgmagic-wholesale__subtitle {
    display: block;
    margin-top: 2px;
    color: #7b8b83;
    direction: ltr;
    text-align: right;
    font-size: 9px;
    line-height: 1.45;
    font-weight: 800;
    letter-spacing: .07em;
}

.dgmagic-wholesale__body {
    padding: 28px 30px 29px;
    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);
    direction: rtl;
    text-align: right;
}

.dgmagic-wholesale__body p {
    margin: 0;
    color: #53675d;
    font-size: 13px;
    line-height: 2.15;
    text-align: justify;
    text-align-last: right;
}

.dgmagic-wholesale__body p + p {
    margin-top: 14px;
}

.dgmagic-wholesale__body strong {
    color: #173f2f;
    font-weight: 900;
}

.dgmagic-wholesale__facts {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 10px;
    margin-top: 20px;
}

.dgmagic-wholesale__fact {
    min-height: 104px;
    padding: 14px 14px 13px;
    border: 1px solid rgba(18,59,43,.075);
    border-radius: 15px;
    background: #f5f8f6;
}

.dgmagic-wholesale__fact span {
    display: block;
    margin-bottom: 6px;
    color: #7553a8;
    direction: ltr;
    text-align: left;
    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgmagic-wholesale__fact strong {
    display: block;
    color: #183f30;
    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* Pre-tabs transition */
.dgmagic-wholesale__pre-tabs {
    position: relative;
    margin-top: 30px;
    padding: 30px 6px 2px;
    direction: rtl;
}

.dgmagic-wholesale__pre-tabs::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(23,63,47,.03),
        rgba(23,63,47,.14) 45%,
        rgba(143,106,183,.60) 100%
    );
}

.dgmagic-wholesale__pre-tabs::after {
    content: "04";
    position: absolute;
    left: 8px;
    top: 18px;
    color: rgba(23,63,47,.045);
    direction: ltr;
    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;
    pointer-events: none;
}

.dgmagic-wholesale__pre-tabs-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;
    min-height: 58px;
    margin-bottom: 17px;
    padding-right: 20px;
    border-right: 3px solid #8f6ab7;
}

.dgmagic-wholesale__pre-tabs-head span {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;
    background: rgba(255,255,255,.66);
    color: #6e8177;
    direction: ltr;
    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgmagic-wholesale__pre-tabs-head span::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #8f6ab7;
    box-shadow: 0 0 0 4px rgba(143,106,183,.10);
}

.dgmagic-wholesale__pre-tabs-head strong {
    max-width: 650px;
    color: #173f2f;
    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;
    text-align: right;
}

.dgmagic-wholesale__pre-tabs p {
    position: relative;
    max-width: 1060px;
    margin: 0 0 0 auto;
    padding-right: 20px;
    color: #51655b;
    font-size: 13px;
    line-height: 2.18;
    text-align: justify;
    text-align-last: right;
}

.dgmagic-wholesale__pre-tabs p::before {
    content: "";
    position: absolute;
    right: 1px;
    top: .88em;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(143,106,183,.48);
    border-radius: 50%;
    background: rgba(143,106,183,.14);
}

.dgmagic-wholesale__pre-tabs strong {
    color: #173f2f;
    font-weight: 950;
}

.dgmagic-wholesale__pre-tabs-next {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    margin-right: 20px;
    padding: 9px 12px 9px 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(23,63,47,.055), rgba(143,106,183,.08));
    color: #6a4c8b;
    direction: ltr;
    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgmagic-wholesale__pre-tabs-next::before {
    content: "";
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, #8f6ab7, rgba(143,106,183,.18));
}


@media (hover:hover) and (pointer:fine) {
    .dgmagic-sparkle__visual:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.035);
    }
}


@media (max-width: 940px) {
    .dgmagic-intro__grid,
    .dgmagic-sparkle__grid {
        grid-template-columns: minmax(0,1fr) minmax(320px,.9fr);
    }

    .dgmagic-wholesale__facts,
    .dgmagic-sparkle__uses {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}


@media (max-width: 760px) {
    .dgmagic-intro,
    .dgmagic-sparkle,
    .dgmagic-wholesale {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dgmagic-intro {
        padding-top: 44px;
        padding-bottom: 50px;
    }

    .dgmagic-sparkle,
    .dgmagic-wholesale {
        padding-top: 46px;
        padding-bottom: 52px;
    }

    .dgmagic-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgmagic-intro__tech,
    .dgmagic-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgmagic-sparkle__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dgmagic-sparkle__head-meta {
        min-width: 0;
        max-width: 220px;
    }

    .dgmagic-sparkle__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgmagic-sparkle__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgmagic-sparkle__content {
        order: 2;
        padding: 22px 20px 21px;
    }

    .dgmagic-wholesale__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgmagic-wholesale__meta {
        max-width: 250px;
    }

    .dgmagic-wholesale__body {
        padding: 22px 20px 21px;
    }

    .dgmagic-wholesale__pre-tabs {
        margin-top: 22px;
        padding-top: 25px;
    }

    .dgmagic-wholesale__pre-tabs::after {
        top: 24px;
        font-size: 68px;
    }

    .dgmagic-wholesale__pre-tabs-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgmagic-wholesale__pre-tabs-head span {
        justify-self: end;
    }

    .dgmagic-wholesale__pre-tabs p {
        padding-right: 16px;
        line-height: 2.05;
    }

    .dgmagic-wholesale__pre-tabs-next {
        margin-right: 16px;
    }
}


@media (max-width: 520px) {
    .dgmagic-intro__inner,
    .dgmagic-sparkle__inner,
    .dgmagic-wholesale__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgmagic-intro__mix-grid,
    .dgmagic-intro__specs,
    .dgmagic-wholesale__facts,
    .dgmagic-sparkle__uses {
        grid-template-columns: 1fr;
    }

    .dgmagic-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgmagic-intro__formula-arrow {
        transform: rotate(90deg);
    }
}


@media (prefers-reduced-motion: reduce) {
    .dgmagic-sparkle__visual img {
        transition: none;
    }
}
/* END — Magic Glitter Pre-Tabs v1.12.00 */


/* =========================================================
   DGCHEME — Magic Glitter Product Explorer / Z Series
   v1.12.01

   LOCKED:
   - Full GREEN Product Explorer.
   - Wide 1380px architecture.
   - Family divider: [NUMBER][ENGLISH] LEFT / PERSIAN RIGHT.
   - 4 product cards desktop / 2 tablet / 1 mobile.
========================================================= */

.dgproduct-explorer--magic {
    position: relative;
    width: 100%;
    padding: 64px 20px 76px;
    overflow: visible;
    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.055), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(132,94,255,.055), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgproduct-explorer--magic::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 8%, rgba(255,255,255,.035), transparent 19%),
        linear-gradient(180deg, rgba(255,255,255,.018), transparent 28%);
}

.dgproduct-explorer--magic .dgproduct-explorer__inner {
    position: relative;
    z-index: 1;
    width: min(1380px, 100%);
    margin: 0 auto;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 24px;
    background:
        radial-gradient(circle at 12% 10%, rgba(255,255,255,.04), transparent 24%),
        linear-gradient(135deg, rgba(12,54,37,.98) 0%, rgba(14,63,42,.985) 53%, rgba(8,39,27,.99) 100%);
    box-shadow:
        0 22px 48px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.03);
}

.dgproduct-explorer--magic .dgproduct-explorer__head {
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgproduct-explorer--magic .dgproduct-explorer__head-copy::before {
    background: linear-gradient(180deg, #9bd36f 0%, #b184f2 100%);
    box-shadow: 0 0 18px rgba(169,227,121,.20);
}

.dgproduct-explorer--magic .dgproduct-explorer__kicker {
    color: rgba(223,240,231,.48);
}

.dgproduct-explorer--magic .dgproduct-explorer__title {
    color: #fff;
}

.dgproduct-explorer--magic .dgproduct-explorer__lead {
    color: rgba(225,240,232,.70);
}

.dgproduct-explorer--magic .dgproduct-explorer__head-meta {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.03),
        0 12px 24px rgba(0,0,0,.12);
}

.dgproduct-explorer--magic .dgproduct-explorer__head-meta span,
.dgproduct-explorer--magic .dgproduct-explorer__head-meta small {
    color: #eff8f2;
}

/* Current tab rail. More tabs can be appended in later versions. */
.dgproduct-explorer--magic .dgproduct-tabs {
    grid-template-columns: minmax(0,1fr);
    margin-bottom: 18px;
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 28px rgba(0,0,0,.12);
}

.dgproduct-explorer--magic .dgproduct-tabs__tab {
    border-color: rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
    color: rgba(231,242,235,.72);
}

.dgproduct-explorer--magic .dgproduct-tabs__code {
    color: rgba(229,239,232,.48);
}

.dgproduct-explorer--magic .dgproduct-tabs__label {
    color: rgba(244,251,247,.84);
}

.dgproduct-explorer--magic .dgproduct-tabs__tab.is-active {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.14);
    background: linear-gradient(180deg, rgba(40,98,69,.96), rgba(16,58,40,.98));
    box-shadow:
        0 14px 28px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 -3px 0 #c0aee6;
}

.dgproduct-explorer--magic .dgproduct-tabs__tab.is-active .dgproduct-tabs__code,
.dgproduct-explorer--magic .dgproduct-tabs__tab.is-active .dgproduct-tabs__label {
    color: #fff;
}

/* Mobile family select remains green */
.dgproduct-explorer--magic .dgproduct-mobile-select__trigger {
    border-color: rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(35,92,64,.98), rgba(17,57,39,.99));
    color: #fff;
    box-shadow:
        0 10px 24px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.dgproduct-explorer--magic .dgproduct-mobile-select__copy small {
    color: rgba(226,239,231,.52);
}

.dgproduct-explorer--magic .dgproduct-mobile-select__copy strong,
.dgproduct-explorer--magic .dgproduct-mobile-select__chevron svg {
    color: #fff;
    fill: currentColor;
}

.dgproduct-explorer--magic .dgproduct-mobile-select__menu {
    border-color: rgba(255,255,255,.10);
    background: #103826;
}

.dgproduct-explorer--magic .dgproduct-mobile-select__option {
    color: rgba(235,244,238,.78);
}

.dgproduct-explorer--magic .dgproduct-mobile-select__option.is-active,
.dgproduct-explorer--magic .dgproduct-mobile-select__option:hover {
    background: rgba(255,255,255,.08);
    color: #fff;
}

/* =========================================================
   Z SERIES FAMILY DIVIDER
========================================================= */
.dgproduct-explorer--magic .dgmagic-divider--z {
    position: relative;
    width: 100%;
    border: 1px solid rgba(255,255,255,.18);
    background-image: linear-gradient(90deg, white, #c0aee6, #a7c1fb);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--magic .dgmagic-divider--z::after {
    height: 2px;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.6), rgba(255,255,255,0));
    box-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__index,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__micro,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__latin strong,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__latin em,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider h3,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__title-text,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__title-code,
.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__subtitle {
    color: #173f2f;
    text-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--z .dgproduct-family-divider__index {
    border-color: rgba(23,63,47,.16);
    background: rgba(255,255,255,.36);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.66);
}

/* LOCKED DESKTOP DIVIDER GEOMETRY */
@media (min-width: 681px) {
    .dgproduct-explorer--magic .dgproduct-family-divider {
        width: 100%;
        height: 116px;
        min-height: 116px;
        box-sizing: border-box;
        padding: 17px 20px;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
        overflow: hidden;
        border-radius: 15px;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__meta {
        order: 1;
        flex: 0 0 auto;
        min-width: 310px;
        margin: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
        text-align: left;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__index {
        order: 1;
        display: grid;
        place-items: center;
        flex: 0 0 50px;
        width: 50px;
        height: 50px;
        margin: 0;
        border-radius: 14px;
        direction: ltr;
        font-size: 14px;
        line-height: 1;
        font-weight: 900;
        text-align: center;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__micro {
        display: block;
        margin: 0 0 3px;
        direction: ltr;
        text-align: left;
        font-size: 7px;
        line-height: 1.4;
        font-weight: 850;
        letter-spacing: .10em;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__latin strong {
        display: block;
        margin: 0;
        direction: ltr;
        text-align: left;
        font-size: 16px;
        line-height: 1.35;
        font-weight: 900;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__latin em {
        display: block;
        margin: 5px 0 0;
        direction: ltr;
        text-align: left;
        font-size: 8px;
        line-height: 1.4;
        font-style: normal;
        font-weight: 850;
        letter-spacing: .05em;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__identity {
        order: 2;
        flex: 1 1 auto;
        min-width: 0;
        margin: 0;
        padding: 0;
        direction: ltr;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__copy {
        width: min(760px,100%);
        margin: 0;
        padding: 0;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider h3 {
        margin: 0 0 6px;
        direction: rtl;
        text-align: right;
        font-size: 16px;
        line-height: 1.8;
        font-weight: 900;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__subtitle {
        display: block;
        width: 100%;
        margin: 0;
        direction: ltr;
        text-align: right;
        font-size: 16px;
        line-height: 1.55;
        font-weight: 850;
    }
}

/* =========================================================
   Z SERIES INTRO — GREEN
========================================================= */
.dgproduct-explorer--magic .dgproduct-family-intro {
    align-items: start;
    margin-bottom: 24px;
    border-color: rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 88% 12%, rgba(255,255,255,.035), transparent 24%),
        linear-gradient(135deg, #0a2c20 0%, #103928 58%, #0a2b1f 100%);
    box-shadow:
        0 18px 42px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--magic .dgproduct-family-intro__media {
    position: sticky;
    top: 108px;
    align-self: start;
    height: fit-content;
    border-color: rgba(255,255,255,.08);
    background: transparent;
}

.dgproduct-explorer--magic .dgproduct-family-intro__visual {
    min-height: 0;
    background: #071b13;
}

.dgproduct-explorer--magic .dgproduct-family-intro__visual > img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    transform: scale(1);
    transition: transform .48s cubic-bezier(.22,.61,.36,1), filter .48s ease;
}

@media (hover:hover) and (pointer:fine) {
    .dgproduct-explorer--magic .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.035);
    }
}

.dgproduct-explorer--magic .dgproduct-family-intro__media figcaption {
    min-height: 34px;
    padding: 9px 11px 7px;
    border-top: 1px solid rgba(255,255,255,.065);
    background: transparent;
    box-shadow: none;
    color: rgba(229,241,234,.68);
}

.dgproduct-explorer--magic .dgproduct-family-intro__media figcaption span {
    color: inherit;
    font-size: 7px;
}

.dgproduct-explorer--magic .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.07));
}

.dgproduct-explorer--magic .dgproduct-family-intro__badge span,
.dgproduct-explorer--magic .dgproduct-family-intro__badge strong,
.dgproduct-explorer--magic .dgproduct-family-intro__content h3,
.dgproduct-explorer--magic .dgproduct-family-intro__content strong {
    color: #fff;
}

.dgproduct-explorer--magic .dgproduct-family-intro__content p,
.dgproduct-explorer--magic .dgproduct-family-intro__points li {
    color: rgba(228,240,233,.80);
}

.dgproduct-explorer--magic .dgproduct-family-intro__eyebrow {
    color: #d6c6f6;
}

.dgproduct-explorer--magic .dgproduct-family-intro__points {
    border-top-color: rgba(255,255,255,.08);
}

/* =========================================================
   PRODUCTS HEADER / 4-2-1 GRID
========================================================= */
.dgproduct-explorer--magic .dgproduct-products-head {
    margin-top: 2px;
    margin-bottom: 16px;
    padding: 0 2px 13px;
}

.dgproduct-explorer--magic .dgproduct-products-head::after {
    background: linear-gradient(90deg, transparent 0, rgba(255,255,255,.14) 16%, rgba(255,255,255,.14) 84%, transparent 100%);
}

.dgproduct-explorer--magic .dgproduct-products-head > div:first-child > span {
    color: rgba(224,239,230,.50);
}

.dgproduct-explorer--magic .dgproduct-products-head h3 {
    color: #fff;
}

.dgproduct-explorer--magic .dgproduct-products-head__count {
    color: rgba(224,239,230,.52);
}

.dgproduct-explorer--magic .dgproduct-products-head__count strong {
    color: #fff;
}

.dgproduct-explorer--magic .dgproduct-grid--magic-z {
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 14px;
}

/* Magic-specific product card accents while preserving previous architecture */
.dgproduct-explorer--magic .dgproduct-card::before {
    background: linear-gradient(90deg, transparent, #c0aee6, #a7c1fb, transparent);
    box-shadow: 0 0 18px rgba(192,174,230,.55);
}

.dgproduct-explorer--magic .dgproduct-card__series {
    border-color: rgba(208,192,255,.26);
    color: #eee5ff;
}

.dgproduct-explorer--magic .dgproduct-card__night-badge i {
    background: #c0aee6;
    box-shadow: 0 0 9px rgba(192,174,230,.9);
}

.dgproduct-explorer--magic .dgproduct-card__glow-name {
    border-color: #e6def1;
    background: #f8f4fc;
    color: #66527b;
}

.dgproduct-explorer--magic .dgproduct-card__glow-name i {
    background: #b9a3e4;
    box-shadow: 0 0 0 3px rgba(185,163,228,.14);
}

.dgproduct-explorer--magic .dgproduct-card__footer svg {
    fill: #8165a7;
}

/* Viewer accent */
.dgproduct-explorer--magic .dgproduct-viewer__brand-card {
    border-color: rgba(196,174,236,.24);
}

.dgproduct-explorer--magic .dgproduct-viewer__product-id span {
    color: #cdbcf0;
}

/* Tablet = 2, Mobile = 1 */
@media (max-width: 1020px) {
    .dgproduct-explorer--magic .dgproduct-grid--magic-z {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--magic {
        padding: 48px 14px 56px;
    }

    .dgproduct-explorer--magic .dgproduct-explorer__inner {
        padding: 18px 14px;
        border-radius: 20px;
    }

    .dgproduct-explorer--magic .dgproduct-tabs {
        display: none;
    }

    .dgproduct-explorer--magic .dgproduct-mobile-select {
        display: block;
    }

    .dgproduct-explorer--magic .dgproduct-family-intro__media {
        position: relative;
        top: auto;
    }
}

@media (max-width: 680px) {
    .dgproduct-explorer--magic .dgproduct-family-divider {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 16px;
        direction: rtl;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__copy {
        width: 100%;
        direction: rtl;
        text-align: right;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__meta {
        order: 2;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;
        width: 100%;
        min-width: 0;
        direction: ltr;
        text-align: left;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__index {
        order: 1;
        flex: 0 0 46px;
        width: 46px;
        height: 46px;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__latin {
        order: 2;
        min-width: 0;
        direction: ltr;
        text-align: left;
    }

    .dgproduct-explorer--magic .dgproduct-family-divider__latin strong,
    .dgproduct-explorer--magic .dgproduct-family-divider h3,
    .dgproduct-explorer--magic .dgproduct-family-divider__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--magic .dgproduct-grid--magic-z {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--magic .dgproduct-family-intro__visual > img {
        transition: none;
    }
}
/* END — Magic Glitter Product Explorer / Z Series v1.12.01 */


/* =========================================================
   DGCHEME — Magic Glitter Z + Q / Product UI refinement
   v1.12.02

   FIXES:
   1) ALL Magic product cards are GREEN, not white.
   2) Product-list heading is now a designed green module.
   3) Q Series family + gradient + products added.
========================================================= */

/* Two tabs now */
.dgproduct-explorer--magic .dgproduct-tabs {
    grid-template-columns: repeat(2, minmax(0,1fr));
}

/* ---------------------------------------------------------
   PROFESSIONAL PRODUCT SECTION HEADER
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgproduct-products-head.dgmagic-products-head {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;

    min-height: 112px;
    margin: 28px 0 18px;
    padding: 22px 24px;

    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 20px;
    background:
        radial-gradient(circle at 88% 16%, rgba(192,174,230,.075), transparent 24%),
        radial-gradient(circle at 9% 82%, rgba(110,176,124,.08), transparent 28%),
        linear-gradient(135deg, rgba(7,42,29,.98), rgba(13,61,42,.99));

    box-shadow:
        0 18px 38px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.035);

    direction: ltr;
}

.dgproduct-explorer--magic .dgproduct-products-head.dgmagic-products-head::before {
    content: "";
    position: absolute;
    top: 0;
    right: 24px;
    left: 24px;
    height: 2px;
    border-radius: 99px;
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--dgmagic-product-accent-a, #c0aee6),
            var(--dgmagic-product-accent-b, #a7c1fb),
            transparent
        );
    opacity: .78;
}

.dgproduct-explorer--magic .dgproduct-products-head.dgmagic-products-head::after {
    content: "";
    position: absolute;
    left: -48px;
    bottom: -76px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(255,255,255,.045);
    border-radius: 50%;
    box-shadow:
        0 0 0 23px rgba(255,255,255,.012),
        0 0 0 49px rgba(255,255,255,.007);
    pointer-events: none;
}

.dgproduct-explorer--magic .dgmagic-products-head__count {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;

    display: flex;
    align-items: center;
    gap: 11px;

    min-width: 138px;
    padding: 13px 15px;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 15px;
    background: rgba(255,255,255,.045);

    direction: ltr;
}

.dgproduct-explorer--magic .dgmagic-products-head__count strong {
    color: #fff;
    font-size: 25px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.04em;
}

.dgproduct-explorer--magic .dgmagic-products-head__count span {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.dgproduct-explorer--magic .dgmagic-products-head__count small {
    color: rgba(223,239,230,.46);
    font-size: 6px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgproduct-explorer--magic .dgmagic-products-head__count b {
    color: rgba(239,247,242,.88);
    font-size: 9px;
    line-height: 1.35;
    font-weight: 900;
}

.dgproduct-explorer--magic .dgmagic-products-head__copy {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-width: 0;

    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--magic .dgmagic-products-head__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;

    color: rgba(220,239,228,.50);
    direction: ltr;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgproduct-explorer--magic .dgmagic-products-head__eyebrow::before {
    content: "";
    width: 28px;
    height: 1px;
    background:
        linear-gradient(
            90deg,
            var(--dgmagic-product-accent-a, #c0aee6),
            rgba(255,255,255,.08)
        );
}

.dgproduct-explorer--magic .dgmagic-products-head__copy h3 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    line-height: 1.8;
    font-weight: 950;
}

.dgproduct-explorer--magic .dgmagic-products-head__copy p {
    max-width: 760px;
    margin: 5px 0 0 auto;
    color: rgba(224,238,230,.66);
    font-size: 11px;
    line-height: 1.9;
}

.dgproduct-explorer--magic .dgmagic-products-head--z {
    --dgmagic-product-accent-a: #c0aee6;
    --dgmagic-product-accent-b: #a7c1fb;
}

.dgproduct-explorer--magic .dgmagic-products-head--q {
    --dgmagic-product-accent-a: #95c94d;
    --dgmagic-product-accent-b: #ffad32;
}


/* ---------------------------------------------------------
   MAGIC PRODUCT CARDS — FULL GREEN
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgproduct-card {
    border-color: rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 90% 10%, rgba(255,255,255,.035), transparent 26%),
        linear-gradient(180deg, #103b2a 0%, #0b3022 100%);
    box-shadow:
        0 13px 32px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);
}

.dgproduct-explorer--magic .dgproduct-card:hover,
.dgproduct-explorer--magic .dgproduct-card:focus-visible {
    border-color: rgba(255,255,255,.17);
    box-shadow:
        0 22px 50px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.04);
}

.dgproduct-explorer--magic .dgproduct-card__media {
    border: 1px solid rgba(255,255,255,.07);
    background: #061a12;
}

.dgproduct-explorer--magic .dgproduct-card__body {
    color: #f0f7f3;
}

.dgproduct-explorer--magic .dgproduct-card__identity {
    border-bottom-color: rgba(255,255,255,.08);
}

.dgproduct-explorer--magic .dgproduct-card__identity > div > span {
    color: rgba(216,233,223,.43);
}

.dgproduct-explorer--magic .dgproduct-card__identity strong {
    color: #fff;
}

.dgproduct-explorer--magic .dgproduct-card__glow-name {
    border-color: rgba(211,192,247,.16);
    background: rgba(214,194,246,.075);
    color: #eee4ff;
}

.dgproduct-explorer--magic .dgproduct-card__quick-specs > span {
    border-color: rgba(255,255,255,.075);
    background:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
}

.dgproduct-explorer--magic .dgproduct-card__quick-specs small {
    color: rgba(213,231,220,.43);
}

.dgproduct-explorer--magic .dgproduct-card__quick-specs b {
    color: #edf6f0;
}

.dgproduct-explorer--magic .dgproduct-card__app {
    border-color: rgba(255,255,255,.075);
    background: rgba(255,255,255,.04);
    color: rgba(229,240,233,.70);
}

.dgproduct-explorer--magic .dgproduct-card__app--more {
    border-color: rgba(255,255,255,.085);
    background: rgba(255,255,255,.07);
    color: rgba(241,247,243,.84);
}

.dgproduct-explorer--magic .dgproduct-card__footer {
    border-top-color: rgba(255,255,255,.08);
    color: rgba(220,234,225,.55);
}

.dgproduct-explorer--magic .dgproduct-card__footer svg {
    fill: #c7b4ec;
}


/* ---------------------------------------------------------
   Q SERIES FAMILY DIVIDER
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgmagic-divider--q {
    position: relative;
    width: 100%;
    border: 1px solid rgba(255,255,255,.18);
    background-image:
        linear-gradient(90deg, #2a6894, #95c94d, #e3190a, #ffad32, white);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--magic .dgmagic-divider--q::after {
    height: 2px;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0),
            rgba(255,255,255,.62),
            rgba(255,255,255,0)
        );
    box-shadow: none;
}

/* Left side of Q is dark blue, so English cluster is white. */
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__index,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__micro,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__latin strong,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__latin em {
    color: #fff;
    text-shadow: 0 1px 6px rgba(0,0,0,.20);
}

/* Right edge ends white, so Persian identity is green for readability. */
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider h3,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__title-text,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__title-code,
.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__subtitle {
    color: #173f2f;
    text-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--q .dgproduct-family-divider__index {
    border-color: rgba(255,255,255,.42);
    background: rgba(255,255,255,.15);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.32);
}

/* Q accents */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-family-intro__eyebrow {
    color: #d5ed9d;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-card::before {
    background:
        linear-gradient(90deg, transparent, #95c94d, #ffad32, transparent);
    box-shadow: 0 0 18px rgba(149,201,77,.48);
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-card__series {
    border-color: rgba(149,201,77,.24);
    color: #e8ffc0;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-card__night-badge i {
    background: #95c94d;
    box-shadow: 0 0 9px rgba(149,201,77,.86);
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-card__glow-name {
    border-color: rgba(255,173,50,.18);
    background: rgba(255,173,50,.07);
    color: #ffe2b6;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="q"]
.dgproduct-card__glow-name i {
    background: #ffad32;
    box-shadow: 0 0 0 3px rgba(255,173,50,.12);
}


/* Mobile product header */
@media (max-width: 760px) {
    .dgproduct-explorer--magic .dgproduct-products-head.dgmagic-products-head {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 18px;
    }

    .dgproduct-explorer--magic .dgmagic-products-head__count {
        align-self: flex-start;
        min-width: 0;
    }

    .dgproduct-explorer--magic .dgmagic-products-head__copy h3 {
        font-size: 16px;
    }
}

/* END — Magic Glitter Z + Q Product UI refinement v1.12.02 */


/* =========================================================
   DGCHEME — Magic Glitter / Y & YB Series
   v1.12.03
   Third family, no product grid.
========================================================= */

/* Three tabs */
.dgproduct-explorer--magic .dgproduct-tabs {
    grid-template-columns: repeat(3, minmax(0,1fr));
}

/* ---------------------------------------------------------
   Y & YB FAMILY DIVIDER
   Gradient supplied by user.
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgmagic-divider--yyb {
    position: relative;
    width: 100%;
    border: 1px solid rgba(255,255,255,.18);
    background-image: linear-gradient(90deg, white, #94d153, #a6c1f7);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--magic .dgmagic-divider--yyb::after {
    height: 2px;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0),
            rgba(255,255,255,.62),
            rgba(255,255,255,0)
        );
    box-shadow: none;
}

/* Light banner -> deep green typography for full readability */
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__index,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__micro,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__latin strong,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__latin em,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider h3,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__title-text,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__title-code,
.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__subtitle {
    color: #173f2f;
    text-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--yyb .dgproduct-family-divider__index {
    border-color: rgba(23,63,47,.17);
    background: rgba(255,255,255,.42);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.64);
}

/* Family-specific accent */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="y-yb"]
.dgproduct-family-intro__eyebrow {
    color: #d9efad;
}

/* No products in Y & YB */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="y-yb"]
.dgproduct-products-head,
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="y-yb"]
.dgproduct-grid {
    display: none;
}

/* Keep three desktop tabs, then collapse gracefully */
@media (max-width: 980px) and (min-width: 761px) {
    .dgproduct-explorer--magic .dgproduct-tabs {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }
}

/* END — Magic Glitter Y & YB v1.12.03 */


/* =========================================================
   DGCHEME — Magic Glitter / Irregular Series
   v1.12.04
   Fourth family, no product grid.
========================================================= */

/* Four tabs */
.dgproduct-explorer--magic .dgproduct-tabs {
    grid-template-columns: repeat(4, minmax(0,1fr));
}

/* ---------------------------------------------------------
   IRREGULAR FAMILY DIVIDER
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgmagic-divider--irregular {
    position: relative;
    width: 100%;
    border: 1px solid rgba(255,255,255,.18);
    background-image: linear-gradient(90deg, white, #cc9a02, #a7c1fb);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--magic .dgmagic-divider--irregular::after {
    height: 2px;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0),
            rgba(255,255,255,.62),
            rgba(255,255,255,0)
        );
    box-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__index,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__micro,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__latin strong,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__latin em,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider h3,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__title-text,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__title-code,
.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__subtitle {
    color: #173f2f;
    text-shadow: none;
}

.dgproduct-explorer--magic .dgmagic-divider--irregular .dgproduct-family-divider__index {
    border-color: rgba(23,63,47,.17);
    background: rgba(255,255,255,.42);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.64);
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-family-intro__eyebrow {
    color: #d9efad;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-products-head,
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-grid {
    display: none;
}

@media (max-width: 1160px) and (min-width: 761px) {
    .dgproduct-explorer--magic .dgproduct-tabs {
        grid-template-columns: repeat(4, minmax(0,1fr));
    }
}

/* END — Magic Glitter Irregular v1.12.04 */


/* =========================================================
   DGCHEME — Magic Glitter / Irregular Products
   v1.12.05
   Restores the 13 products supplied in the Irregular gallery.
========================================================= */

/* v1.12.04 temporarily hid product UI for this family.
   The source gallery contains products, so restore it. */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-products-head {
    display: flex;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-grid {
    display: grid;
}

/* Professional product header accent */
.dgproduct-explorer--magic .dgmagic-products-head--irregular {
    --dgmagic-product-accent-a: #cc9a02;
    --dgmagic-product-accent-b: #a7c1fb;
}

/* Irregular product card accent */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-card::before {
    background:
        linear-gradient(90deg, transparent, #cc9a02, #a7c1fb, transparent);
    box-shadow: 0 0 18px rgba(204,154,2,.42);
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-card__series {
    border-color: rgba(204,154,2,.24);
    color: #ffe6a3;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-card__night-badge i {
    background: #cc9a02;
    box-shadow: 0 0 9px rgba(204,154,2,.82);
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-card__glow-name {
    border-color: rgba(167,193,251,.18);
    background: rgba(167,193,251,.07);
    color: #dce7ff;
}

.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="irregular"]
.dgproduct-card__glow-name i {
    background: #a7c1fb;
    box-shadow: 0 0 0 3px rgba(167,193,251,.12);
}

.dgproduct-explorer--magic .dgproduct-grid--magic-irregular {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 14px;
}

@media (max-width: 1020px) {
    .dgproduct-explorer--magic .dgproduct-grid--magic-irregular {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--magic .dgproduct-grid--magic-irregular {
        grid-template-columns: 1fr;
    }
}

/* END — Magic Glitter Irregular Products v1.12.05 */


/* =========================================================
   DGCHEME — Magic Glitter / Glow In The Dark
   v1.12.06
   Fifth family, no product grid.
========================================================= */

/* Five desktop tabs */
.dgproduct-explorer--magic .dgproduct-tabs {
    grid-template-columns: repeat(5, minmax(0,1fr));
}

/* Make the Persian tab labels fit cleanly while keeping the
   full "اکلیل مجیک" wording requested by the content owner. */
.dgproduct-explorer--magic .dgproduct-tabs__label {
    font-size: 10px;
    line-height: 1.7;
}

/* ---------------------------------------------------------
   GLOW IN THE DARK FAMILY DIVIDER
--------------------------------------------------------- */
.dgproduct-explorer--magic .dgmagic-divider--glow {
    position: relative;
    width: 100%;
    border: 1px solid rgba(255,255,255,.18);
    background-image: linear-gradient(90deg, #61ff3e, #00ffff, #0066ff);
    box-shadow:
        0 16px 34px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.20);
}

.dgproduct-explorer--magic .dgmagic-divider--glow::after {
    height: 2px;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0),
            rgba(255,255,255,.65),
            rgba(255,255,255,0)
        );
    box-shadow: none;
}

/* Left side is neon green/cyan: dark green copy is clearer. */
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__index,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__micro,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__latin strong,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__latin em {
    color: #103828;
    text-shadow: none;
}

/* Right side finishes in blue: white Persian identity is clearer. */
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider h3,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__title-text,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__title-code,
.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__subtitle {
    color: #fff;
    text-shadow: 0 1px 7px rgba(0,36,86,.28);
}

.dgproduct-explorer--magic .dgmagic-divider--glow .dgproduct-family-divider__index {
    border-color: rgba(16,56,40,.18);
    background: rgba(255,255,255,.34);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.58);
}

/* Family accent */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="glow-in-the-dark"]
.dgproduct-family-intro__eyebrow {
    color: #7cff65;
}

/* No products in Glow In The Dark */
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="glow-in-the-dark"]
.dgproduct-products-head,
.dgproduct-explorer--magic
.dgproduct-family-panel[data-dgproduct-family="glow-in-the-dark"]
.dgproduct-grid {
    display: none;
}

/* Tablet: avoid crushing five full Persian labels */
@media (max-width: 1160px) and (min-width: 761px) {
    .dgproduct-explorer--magic .dgproduct-tabs {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }
}

/* END — Magic Glitter Glow In The Dark v1.12.06 */


/* =========================================================
   DGCHEME — Magic Glitter Intro family-card links
   v1.12.07
========================================================= */
.dgmagic-intro a.dgmagic-intro__mix-item {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.dgmagic-intro a.dgmagic-intro__mix-item:visited {
    color: inherit;
}

@media (hover:hover) and (pointer:fine) {
    .dgmagic-intro a.dgmagic-intro__mix-item:hover {
        transform: translateY(-2px);
        border-color: rgba(23,63,47,.14);
        background: #f1f5f2;
        box-shadow: 0 10px 22px rgba(18,59,43,.07);
    }
}

.dgmagic-intro a.dgmagic-intro__mix-item:focus-visible {
    outline: 2px solid rgba(117,83,168,.55);
    outline-offset: 3px;
}
/* END — Magic Glitter Intro family-card links v1.12.07 */


/* =========================================================
   DGCHEME — White Pearlescent Pigments / Pre-Products
   v1.13.00

   LOCKED SEQUENCE:
   01 WHITE  — Intro
   02 GREEN  — Internal Structure + Interference
   03 WHITE  — Pearlescent Theory + Applications
   04 GREEN  — Optical Refraction Mechanism
   05 WHITE  — Semi-Transparency + Product Transition

   Product section starts AFTER this and may be WHITE.
========================================================= */


/* =========================================================
   SHARED
========================================================= */
.dgwhitepearl-intro,
.dgwhitepearl-structure,
.dgwhitepearl-theory,
.dgwhitepearl-optics,
.dgwhitepearl-semitransparent,
.dgwhitepearl-intro *,
.dgwhitepearl-structure *,
.dgwhitepearl-theory *,
.dgwhitepearl-optics *,
.dgwhitepearl-semitransparent * {
    box-sizing: border-box;
}

.dgwhitepearl-intro__inner,
.dgwhitepearl-structure__inner,
.dgwhitepearl-theory__inner,
.dgwhitepearl-optics__inner,
.dgwhitepearl-semitransparent__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgwhitepearl-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 9px;

    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgwhitepearl-section-kicker::before {
    content: "";
    width: 25px;
    height: 1px;
    flex: 0 0 auto;
}

.dgwhitepearl-section-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-section-lead {
    margin: 7px 0 0;
    font-size: 12px;
    line-height: 1.95;
}

.dgwhitepearl-figure {
    margin: 0;
    overflow: hidden;
    border-radius: 22px;
}

.dgwhitepearl-visual {
    position: relative;
    overflow: hidden;
}

.dgwhitepearl-visual img {
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        filter .48s ease;
}

.dgwhitepearl-image-badge {
    position: absolute;
    right: 13px;
    bottom: 13px;

    padding: 8px 10px;
    border-radius: 999px;

    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

@media (hover:hover) and (pointer:fine) {
    .dgwhitepearl-visual:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.025);
    }
}


/* =========================================================
   SECTION 01 — INTRO / WHITE
========================================================= */
.dgwhitepearl-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;

    background:
        radial-gradient(circle at 88% 12%, rgba(164,178,201,.075), transparent 25%),
        radial-gradient(circle at 11% 84%, rgba(203,194,151,.045), transparent 28%),
        linear-gradient(180deg, #fcfdfc 0%, #f4f7f5 100%);
}

.dgwhitepearl-intro::before {
    content: "";
    position: absolute;
    left: -88px;
    top: 78px;

    width: 255px;
    height: 255px;

    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;

    box-shadow:
        0 0 0 28px rgba(23,63,47,.015),
        0 0 0 56px rgba(23,63,47,.008);

    pointer-events: none;
}

.dgwhitepearl-intro__inner {
    position: relative;
    z-index: 1;
}

.dgwhitepearl-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;

    direction: ltr;
}

.dgwhitepearl-intro__copy {
    grid-area: copy;
    min-width: 0;

    padding: 30px 30px 28px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-intro__copy .dgwhitepearl-section-kicker {
    color: #6d8077;
}

.dgwhitepearl-intro__copy .dgwhitepearl-section-kicker::before {
    background: linear-gradient(90deg, #c0ae76, rgba(192,174,118,.12));
}

.dgwhitepearl-intro__copy h2 {
    margin: 0 0 14px;

    color: #173f2f;

    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-intro__copy p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-intro__copy p + p {
    margin-top: 14px;
}

.dgwhitepearl-intro__copy strong {
    color: #173f2f;
    font-weight: 900;
}

.dgwhitepearl-intro__features {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 20px;
    padding-top: 18px;

    border-top: 1px solid rgba(18,59,43,.08);
}

.dgwhitepearl-intro__feature {
    min-height: 90px;
    padding: 12px 13px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: #f5f8f6;
}

.dgwhitepearl-intro__feature span {
    display: block;
    margin-bottom: 5px;

    color: #917c45;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-intro__feature strong {
    display: block;

    color: #183f30;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* Technical green card */
.dgwhitepearl-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;

    padding: 28px 26px 25px;
    overflow: hidden;

    border: 1px solid rgba(255,255,255,.105);
    border-radius: 22px;

    background:
        radial-gradient(circle at 88% 12%, rgba(220,219,190,.08), transparent 26%),
        radial-gradient(circle at 10% 90%, rgba(95,163,124,.08), transparent 30%),
        linear-gradient(135deg, #092a1e 0%, #123d2b 52%, #09271b 100%);

    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-intro__tech::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;

    width: 64%;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d7d5c2,
            #ffffff,
            #b8c7d7
        );

    pointer-events: none;
}

.dgwhitepearl-intro__tech > * {
    position: relative;
    z-index: 1;
}

.dgwhitepearl-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;

    color: #abc9b9;

    direction: ltr;
    text-align: right;

    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgwhitepearl-intro__tech h1 {
    margin: 0;

    color: #fff;

    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgwhitepearl-intro__tech-subtitle {
    display: block;
    margin-top: 3px;

    color: rgba(228,240,234,.62);

    direction: ltr;
    text-align: right;

    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

.dgwhitepearl-intro__formula {
    margin-top: 23px;
    padding: 17px 16px;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;

    background: rgba(255,255,255,.045);
}

.dgwhitepearl-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 11px;

    direction: ltr;
}

.dgwhitepearl-intro__formula-label span {
    color: #abc8b8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgwhitepearl-intro__formula-label small {
    color: rgba(229,240,234,.42);

    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgwhitepearl-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
    gap: 4px;
    align-items: center;

    direction: ltr;
}

.dgwhitepearl-intro__formula-node {
    min-width: 0;
    padding: 11px 7px;

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;

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

    text-align: center;
}

.dgwhitepearl-intro__formula-node strong {
    display: block;

    color: #fff;

    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgwhitepearl-intro__formula-node small {
    display: block;
    margin-top: 3px;

    color: rgba(223,238,230,.52);

    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgwhitepearl-intro__formula-arrow {
    color: #d7d4b5;

    text-align: center;

    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgwhitepearl-intro__mechanism {
    margin-top: 10px;
    padding: 13px 14px;

    border-right: 3px solid rgba(222,218,183,.74);
    border-radius: 12px;

    background: rgba(222,218,183,.055);

    direction: ltr;
    text-align: left;
}

.dgwhitepearl-intro__mechanism span {
    display: block;
    margin-bottom: 4px;

    color: #c6d9ce;

    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgwhitepearl-intro__mechanism strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgwhitepearl-intro__specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;

    margin-top: 18px;
}

.dgwhitepearl-intro__spec {
    min-height: 76px;
    padding: 11px 12px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;

    background: rgba(255,255,255,.035);
}

.dgwhitepearl-intro__spec span {
    display: block;
    margin-bottom: 5px;

    color: #a8c5b7;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-intro__spec strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgwhitepearl-intro__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    margin-top: 17px;

    direction: ltr;
}

.dgwhitepearl-intro__tag {
    padding: 7px 9px;

    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;

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

    color: rgba(234,244,239,.70);

    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}


/* =========================================================
   SECTION 02 — STRUCTURE / GREEN
========================================================= */
.dgwhitepearl-structure {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;

    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.045), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(130,157,195,.045), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgwhitepearl-structure__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
    padding-bottom: 17px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgwhitepearl-structure__head-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-structure__head .dgwhitepearl-section-kicker {
    color: rgba(223,240,231,.48);
}

.dgwhitepearl-structure__head .dgwhitepearl-section-kicker::before {
    background: linear-gradient(90deg, #e5e3d3, rgba(229,227,211,.12));
}

.dgwhitepearl-structure__head h2 {
    color: #fff;
}

.dgwhitepearl-structure__head p {
    color: rgba(225,240,232,.68);
}

.dgwhitepearl-structure__head-meta {
    flex: 0 0 auto;
    min-width: 150px;

    padding: 13px 16px;

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

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

    direction: ltr;
    text-align: left;
}

.dgwhitepearl-structure__head-meta span {
    display: block;

    color: #e3dfc8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgwhitepearl-structure__head-meta strong {
    display: block;
    margin-top: 5px;

    color: #fff;

    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgwhitepearl-structure__grid {
    display: grid;
    grid-template-columns: minmax(0,1.04fr) minmax(360px,.96fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgwhitepearl-structure__content {
    min-width: 0;
    padding: 27px 29px 28px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;

    background: rgba(7,45,31,.48);

    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-structure__content h3 {
    margin: 0 0 13px;

    color: #fff;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-structure__lead {
    margin: 0;
    padding: 14px 16px;

    border-right: 3px solid #ded9b6;
    border-radius: 15px;

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

    color: #eef6f1;

    font-size: 13px;
    line-height: 2.12;
    font-weight: 850;

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-structure__content p:not(.dgwhitepearl-structure__lead) {
    margin: 15px 0 0;

    color: rgba(228,240,233,.80);

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

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-structure__content strong {
    color: #fff;
    font-weight: 900;
}

.dgwhitepearl-structure__facts {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgwhitepearl-structure__fact {
    min-height: 94px;
    padding: 12px 13px;

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

    background: rgba(255,255,255,.035);
}

.dgwhitepearl-structure__fact span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-structure__fact strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgwhitepearl-structure__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgwhitepearl-structure .dgwhitepearl-figure {
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);

    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgwhitepearl-structure .dgwhitepearl-visual {
    background: #071b13;
}

.dgwhitepearl-structure .dgwhitepearl-image-badge {
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(7,33,23,.66);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgwhitepearl-structure .dgwhitepearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: transparent;

    color: rgba(230,241,235,.72);

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgwhitepearl-structure__interference {
    display: grid;
    grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr);
    gap: 18px;
    align-items: center;

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

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;

    background: rgba(255,255,255,.032);
}

.dgwhitepearl-structure__interference-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-structure__interference-copy span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: right;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-structure__interference-copy strong {
    display: block;

    color: #fff;

    font-size: 12px;
    line-height: 2;
    font-weight: 900;
}

/* v1.13.01 — coded interference spectrum around the source image */
.dgwhitepearl-structure__interference-visual {
    min-width: 0;
}

.dgwhitepearl-interference-diagram {
    margin: 0;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 17px;

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

    box-shadow:
        0 16px 34px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.035);

    overflow: hidden;
}

.dgwhitepearl-interference-diagram__surface {
    padding: 16px 17px 14px;

    background:
        radial-gradient(circle at 14% 10%, rgba(214,221,238,.34), transparent 27%),
        radial-gradient(circle at 89% 88%, rgba(227,219,188,.30), transparent 28%),
        linear-gradient(180deg, #fbfcfd 0%, #f1f4f6 100%);
}

.dgwhitepearl-interference-diagram__materials {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 10px;

    margin: 0 0 10px;

    direction: ltr;
}

.dgwhitepearl-interference-diagram__material {
    position: relative;

    display: inline-flex;
    align-items: baseline;
    gap: 6px;

    min-width: 104px;
    padding: 7px 10px 8px;

    border: 1px solid rgba(41,79,130,.13);
    border-radius: 10px;

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

    box-shadow:
        0 5px 13px rgba(23,63,47,.055),
        inset 0 1px 0 rgba(255,255,255,.92);
}

.dgwhitepearl-interference-diagram__material::after {
    content: "";

    position: absolute;
    left: 50%;
    bottom: -8px;

    width: 1px;
    height: 8px;

    background: rgba(56,109,190,.34);
}

.dgwhitepearl-interference-diagram__material small {
    color: #728096;

    font-size: 7px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-interference-diagram__material strong {
    color: #326fd0;

    font-size: 13px;
    line-height: 1;
    font-weight: 900;
}

.dgwhitepearl-interference-diagram__material sub {
    font-size: .68em;
    line-height: 0;
}

.dgwhitepearl-interference-diagram__image {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 82px;
    padding: 9px 10px;

    border: 1px solid rgba(31,67,51,.11);
    border-radius: 12px;

    background: #fff;

    box-shadow: inset 0 1px 0 rgba(255,255,255,.92);

    overflow: hidden;
}

.dgwhitepearl-interference-diagram__image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 118px;
    object-fit: contain;
}

.dgwhitepearl-interference-diagram__colors {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 4px;

    margin-top: 9px;

    direction: ltr;
    text-align: center;
}

.dgwhitepearl-interference-diagram__colors span {
    min-width: 0;

    color: #3475d8;

    font-size: 10px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.01em;

    white-space: nowrap;
}

.dgwhitepearl-interference-diagram__thickness {
    position: relative;

    margin-top: 7px;
    padding-top: 16px;

    direction: ltr;
    text-align: center;
}

.dgwhitepearl-interference-diagram__arrow {
    position: absolute;
    top: 5px;
    left: 4%;
    right: 5%;

    height: 2px;
    border-radius: 999px;

    background: #3475d8;
}

.dgwhitepearl-interference-diagram__arrow::after {
    content: "";

    position: absolute;
    top: 50%;
    right: -1px;

    width: 9px;
    height: 9px;

    border-top: 2px solid #3475d8;
    border-right: 2px solid #3475d8;

    transform: translateY(-50%) rotate(45deg);
}

.dgwhitepearl-interference-diagram__thickness strong {
    display: inline-block;

    color: #756fd2;

    font-size: 11px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .01em;
}

.dgwhitepearl-interference-diagram figcaption {
    padding: 10px 13px 11px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: rgba(5,31,21,.26);

    color: rgba(231,241,235,.72);

    direction: rtl;
    text-align: right;

    font-size: 9px;
    line-height: 1.85;
    font-weight: 800;
}


/* =========================================================
   SECTION 03 — THEORY + APPLICATIONS / WHITE
========================================================= */
.dgwhitepearl-theory {
    position: relative;
    width: 100%;
    padding: 62px 20px 70px;
    overflow: visible;

    background:
        radial-gradient(circle at 88% 16%, rgba(188,178,133,.055), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgwhitepearl-theory__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;

    margin-bottom: 22px;
}

.dgwhitepearl-theory__meta {
    padding: 16px 18px;

    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;

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

    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgwhitepearl-theory__meta span {
    display: block;

    color: #8d7b48;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgwhitepearl-theory__meta strong {
    display: block;
    margin-top: 7px;

    color: #173f2f;

    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgwhitepearl-theory__head-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-theory__head .dgwhitepearl-section-kicker {
    color: #6d8176;
}

.dgwhitepearl-theory__head .dgwhitepearl-section-kicker::before {
    background: #b7a767;
}

.dgwhitepearl-theory__head h2 {
    color: #173f2f;
}

.dgwhitepearl-theory__head p {
    color: #64766c;
}

.dgwhitepearl-theory__grid {
    display: grid;
    grid-template-columns: minmax(360px,.92fr) minmax(0,1.08fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgwhitepearl-theory__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgwhitepearl-theory .dgwhitepearl-figure {
    border: 1px solid rgba(18,59,43,.09);
    background: #fff;

    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgwhitepearl-theory .dgwhitepearl-visual {
    background: #eef2ef;
}

.dgwhitepearl-theory .dgwhitepearl-image-badge {
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(7,33,23,.68);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgwhitepearl-theory .dgwhitepearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(18,59,43,.08);

    background: #f3f6f4;

    color: #51655b;

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgwhitepearl-theory__content {
    min-width: 0;
    padding: 28px 30px 29px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-theory__content h3 {
    margin: 0 0 13px;

    color: #173f2f;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-theory__content p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-theory__content p + p {
    margin-top: 14px;
}

.dgwhitepearl-theory__content strong {
    color: #173f2f;
    font-weight: 900;
}

.dgwhitepearl-theory__note {
    margin-top: 18px;
    padding: 15px 17px;

    border-right: 3px solid #b8a75d;
    border-radius: 15px;

    background:
        radial-gradient(circle at 12% 22%, rgba(184,167,93,.06), transparent 34%),
        linear-gradient(135deg, #f6f8f6 0%, #f0f4f1 100%);

    color: #40564b;

    font-size: 12px;
    line-height: 2.05;
    font-weight: 850;

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-theory__apps {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgwhitepearl-theory__app {
    min-height: 82px;
    padding: 12px 13px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: #f5f8f6;
}

.dgwhitepearl-theory__app span {
    display: block;
    margin-bottom: 5px;

    color: #8e7c45;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-theory__app strong {
    display: block;

    color: #183f30;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* =========================================================
   SECTION 04 — OPTICS / GREEN
========================================================= */
.dgwhitepearl-optics {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;

    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.045), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(130,157,195,.045), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgwhitepearl-optics__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
    padding-bottom: 17px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgwhitepearl-optics__head-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-optics__head .dgwhitepearl-section-kicker {
    color: rgba(223,240,231,.48);
}

.dgwhitepearl-optics__head .dgwhitepearl-section-kicker::before {
    background: linear-gradient(90deg, #e5e3d3, rgba(229,227,211,.12));
}

.dgwhitepearl-optics__head h2 {
    color: #fff;
}

.dgwhitepearl-optics__head p {
    color: rgba(225,240,232,.68);
}

.dgwhitepearl-optics__head-meta {
    flex: 0 0 auto;
    min-width: 150px;

    padding: 13px 16px;

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

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

    direction: ltr;
    text-align: left;
}

.dgwhitepearl-optics__head-meta span {
    display: block;

    color: #e3dfc8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgwhitepearl-optics__head-meta strong {
    display: block;
    margin-top: 5px;

    color: #fff;

    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgwhitepearl-optics__grid {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgwhitepearl-optics__content {
    min-width: 0;
    padding: 27px 29px 28px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;

    background: rgba(7,45,31,.48);

    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-optics__content h3 {
    margin: 0 0 13px;

    color: #fff;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-optics__content p {
    margin: 0;

    color: rgba(228,240,233,.80);

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

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-optics__content p + p {
    margin-top: 14px;
}

.dgwhitepearl-optics__content strong {
    color: #fff;
    font-weight: 900;
}

.dgwhitepearl-optics__mechanism {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgwhitepearl-optics__mechanism-item {
    min-height: 94px;
    padding: 12px 13px;

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

    background: rgba(255,255,255,.035);
}

.dgwhitepearl-optics__mechanism-item span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-optics__mechanism-item strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgwhitepearl-optics__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgwhitepearl-optics .dgwhitepearl-figure {
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);

    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgwhitepearl-optics .dgwhitepearl-visual {
    background: #071b13;
}

.dgwhitepearl-optics .dgwhitepearl-image-badge {
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(7,33,23,.66);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgwhitepearl-optics .dgwhitepearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: transparent;

    color: rgba(230,241,235,.72);

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgwhitepearl-optics__diagram {
    display: grid;
    grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr);
    gap: 18px;
    align-items: center;

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

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;

    background: rgba(255,255,255,.032);
}

.dgwhitepearl-optics__diagram-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-optics__diagram-copy span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: right;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-optics__diagram-copy strong {
    display: block;

    color: #fff;

    font-size: 12px;
    line-height: 2;
    font-weight: 900;
}

.dgwhitepearl-optics__diagram-visual {
    overflow: hidden;
    border-radius: 15px;

    background: rgba(255,255,255,.92);
}

.dgwhitepearl-optics__diagram-visual img {
    display: block;
    width: 100%;
    height: auto;
}


/* =========================================================
   SECTION 05 — SEMI-TRANSPARENT / WHITE
========================================================= */
.dgwhitepearl-semitransparent {
    position: relative;
    width: 100%;
    padding: 62px 20px 72px;
    overflow: hidden;

    background:
        radial-gradient(circle at 88% 16%, rgba(188,178,133,.055), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgwhitepearl-semitransparent__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;

    margin-bottom: 22px;
}

.dgwhitepearl-semitransparent__meta {
    padding: 16px 18px;

    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;

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

    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgwhitepearl-semitransparent__meta span {
    display: block;

    color: #8d7b48;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgwhitepearl-semitransparent__meta strong {
    display: block;
    margin-top: 7px;

    color: #173f2f;

    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgwhitepearl-semitransparent__head-copy {
    direction: rtl;
    text-align: right;
}

.dgwhitepearl-semitransparent__head .dgwhitepearl-section-kicker {
    color: #6d8176;
}

.dgwhitepearl-semitransparent__head .dgwhitepearl-section-kicker::before {
    background: #b7a767;
}

.dgwhitepearl-semitransparent__head h2 {
    color: #173f2f;
}

.dgwhitepearl-semitransparent__body {
    padding: 28px 30px 29px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgwhitepearl-semitransparent__body p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgwhitepearl-semitransparent__body strong {
    color: #173f2f;
    font-weight: 900;
}

.dgwhitepearl-semitransparent__substrates {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;

    margin-top: 20px;
}

.dgwhitepearl-semitransparent__substrate {
    min-height: 116px;
    padding: 16px 17px;

    border: 1px solid rgba(18,59,43,.08);
    border-radius: 16px;
}

.dgwhitepearl-semitransparent__substrate--black {
    background:
        radial-gradient(circle at 86% 20%, rgba(255,255,255,.08), transparent 24%),
        linear-gradient(135deg, #18221d, #0b1510);

    border-color: rgba(255,255,255,.08);
}

.dgwhitepearl-semitransparent__substrate--white {
    background:
        radial-gradient(circle at 86% 20%, rgba(189,178,124,.08), transparent 24%),
        linear-gradient(135deg, #fff, #f3f5f3);
}

.dgwhitepearl-semitransparent__substrate span {
    display: block;
    margin-bottom: 7px;

    direction: ltr;
    text-align: left;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgwhitepearl-semitransparent__substrate strong {
    display: block;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 900;
}

.dgwhitepearl-semitransparent__substrate--black span {
    color: rgba(230,239,234,.54);
}

.dgwhitepearl-semitransparent__substrate--black strong {
    color: #fff;
}

.dgwhitepearl-semitransparent__substrate--white span {
    color: #8d7b48;
}

.dgwhitepearl-semitransparent__substrate--white strong {
    color: #173f2f;
}


/* pre-products transition */
.dgwhitepearl-semitransparent__pre-products {
    position: relative;
    margin-top: 30px;
    padding: 30px 6px 2px;

    direction: rtl;
}

.dgwhitepearl-semitransparent__pre-products::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(23,63,47,.03),
            rgba(23,63,47,.14) 45%,
            rgba(183,167,103,.60) 100%
        );
}

.dgwhitepearl-semitransparent__pre-products::after {
    content: "06";
    position: absolute;
    left: 8px;
    top: 18px;

    color: rgba(23,63,47,.045);

    direction: ltr;

    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;

    pointer-events: none;
}

.dgwhitepearl-semitransparent__pre-head {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;

    min-height: 58px;
    margin-bottom: 17px;
    padding-right: 20px;

    border-right: 3px solid #b7a767;
}

.dgwhitepearl-semitransparent__pre-head span {
    justify-self: start;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 8px 10px;

    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;

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

    color: #6e8177;

    direction: ltr;

    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgwhitepearl-semitransparent__pre-head span::before {
    content: "";

    width: 7px;
    height: 7px;
    flex: 0 0 auto;

    border-radius: 50%;

    background: #b7a767;

    box-shadow: 0 0 0 4px rgba(183,167,103,.10);
}

.dgwhitepearl-semitransparent__pre-head strong {
    max-width: 650px;

    color: #173f2f;

    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;

    text-align: right;
}

.dgwhitepearl-semitransparent__families {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;

    margin-right: 20px;
    margin-left: 20px;
}

.dgwhitepearl-semitransparent__family {
    min-height: 88px;
    padding: 13px 14px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: rgba(255,255,255,.66);
}

.dgwhitepearl-semitransparent__family span {
    display: block;
    margin-bottom: 5px;

    color: #8d7b48;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgwhitepearl-semitransparent__family strong {
    display: block;

    color: #173f2f;

    font-size: 10px;
    line-height: 1.8;
    font-weight: 900;
}

.dgwhitepearl-semitransparent__next {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 18px;
    margin-right: 20px;

    padding: 9px 12px 9px 14px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            rgba(23,63,47,.055),
            rgba(183,167,103,.09)
        );

    color: #887539;

    direction: ltr;

    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgwhitepearl-semitransparent__next::before {
    content: "";

    width: 28px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #b7a767,
            rgba(183,167,103,.18)
        );
}


/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 940px) {
    .dgwhitepearl-intro__grid,
    .dgwhitepearl-structure__grid,
    .dgwhitepearl-theory__grid,
    .dgwhitepearl-optics__grid {
        grid-template-columns: minmax(0,1fr) minmax(320px,.9fr);
    }

    .dgwhitepearl-intro__features,
    .dgwhitepearl-structure__facts,
    .dgwhitepearl-optics__mechanism {
        grid-template-columns: 1fr;
    }

    .dgwhitepearl-theory__apps {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgwhitepearl-intro,
    .dgwhitepearl-structure,
    .dgwhitepearl-theory,
    .dgwhitepearl-optics,
    .dgwhitepearl-semitransparent {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dgwhitepearl-intro {
        padding-top: 44px;
        padding-bottom: 50px;
    }

    .dgwhitepearl-structure,
    .dgwhitepearl-theory,
    .dgwhitepearl-optics,
    .dgwhitepearl-semitransparent {
        padding-top: 46px;
        padding-bottom: 52px;
    }

    /* Intro law: tech first, copy second */
    .dgwhitepearl-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgwhitepearl-intro__tech,
    .dgwhitepearl-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgwhitepearl-structure__head,
    .dgwhitepearl-optics__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dgwhitepearl-structure__head-meta,
    .dgwhitepearl-optics__head-meta {
        min-width: 0;
        max-width: 220px;
    }

    /* visual sections: title -> image -> text */
    .dgwhitepearl-structure__grid,
    .dgwhitepearl-theory__grid,
    .dgwhitepearl-optics__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgwhitepearl-structure__media,
    .dgwhitepearl-theory__media,
    .dgwhitepearl-optics__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgwhitepearl-structure__content,
    .dgwhitepearl-theory__content,
    .dgwhitepearl-optics__content {
        order: 2;
        padding: 22px 20px 21px;
    }

    .dgwhitepearl-structure__interference,
    .dgwhitepearl-optics__diagram {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .dgwhitepearl-theory__head,
    .dgwhitepearl-semitransparent__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgwhitepearl-theory__meta,
    .dgwhitepearl-semitransparent__meta {
        max-width: 250px;
    }

    .dgwhitepearl-semitransparent__body {
        padding: 22px 20px 21px;
    }

    .dgwhitepearl-semitransparent__pre-products {
        margin-top: 22px;
        padding-top: 25px;
    }

    .dgwhitepearl-semitransparent__pre-products::after {
        top: 24px;
        font-size: 68px;
    }

    .dgwhitepearl-semitransparent__pre-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgwhitepearl-semitransparent__pre-head span {
        justify-self: end;
    }

    .dgwhitepearl-semitransparent__families {
        grid-template-columns: 1fr;
        margin-right: 14px;
        margin-left: 14px;
    }

    .dgwhitepearl-semitransparent__next {
        margin-right: 14px;
    }
}

@media (max-width: 520px) {
    .dgwhitepearl-intro__inner,
    .dgwhitepearl-structure__inner,
    .dgwhitepearl-theory__inner,
    .dgwhitepearl-optics__inner,
    .dgwhitepearl-semitransparent__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgwhitepearl-intro__specs,
    .dgwhitepearl-theory__apps,
    .dgwhitepearl-semitransparent__substrates {
        grid-template-columns: 1fr;
    }


    .dgwhitepearl-interference-diagram__surface {
        padding: 13px 10px 12px;
    }

    .dgwhitepearl-interference-diagram__materials {
        gap: 7px;
        margin-bottom: 8px;
    }

    .dgwhitepearl-interference-diagram__material {
        min-width: 0;
        padding: 6px 8px 7px;
    }

    .dgwhitepearl-interference-diagram__material small {
        font-size: 6px;
    }

    .dgwhitepearl-interference-diagram__material strong {
        font-size: 11px;
    }

    .dgwhitepearl-interference-diagram__image {
        min-height: 62px;
        padding: 7px;
    }

    .dgwhitepearl-interference-diagram__colors {
        gap: 1px;
        margin-top: 8px;
    }

    .dgwhitepearl-interference-diagram__colors span {
        font-size: 8px;
    }

    .dgwhitepearl-interference-diagram__thickness {
        margin-top: 5px;
        padding-top: 14px;
    }

    .dgwhitepearl-interference-diagram__thickness strong {
        font-size: 9px;
    }

    .dgwhitepearl-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgwhitepearl-intro__formula-arrow {
        transform: rotate(90deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgwhitepearl-visual img {
        transition: none;
    }
}

/* END — White Pearlescent Pigments Pre-Products v1.13.00 */

/* =========================================================
   White Pearlescent / Multiple Refraction content module
   v1.13.02
   Scoped enhancement only — Section 04 diagram
========================================================= */
.dgwhitepearl-optics__diagram {
    align-items: stretch;
}

.dgwhitepearl-optics__diagram-copy {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: 0;
}

.dgwhitepearl-optics__diagram-copy > strong {
    margin-bottom: 14px;
}

.dgwhitepearl-optics__response {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 2px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 17px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 12px 28px rgba(0,0,0,.10);
    direction: ltr;
    text-align: left;
}

.dgwhitepearl-optics__response-head {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgwhitepearl-optics__response-head span,
.dgwhitepearl-optics__response-result span,
.dgwhitepearl-optics__response-equation span,
.dgwhitepearl-optics__response-example span {
    display: block;
    margin: 0;
    color: rgba(230,241,235,.62);
    font-size: 7px;
    line-height: 1.45;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.dgwhitepearl-optics__response-head strong {
    display: block;
    color: #fff;
    font-size: 12px;
    line-height: 1.55;
    font-weight: 900;
}

.dgwhitepearl-optics__response-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
    gap: 7px;
    align-items: stretch;
}

.dgwhitepearl-optics__response-node {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 10px 9px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.dgwhitepearl-optics__response-node small {
    display: block;
    margin-bottom: 4px;
    color: rgba(230,241,235,.52);
    font-size: 6px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgwhitepearl-optics__response-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.55;
    font-weight: 900;
}

.dgwhitepearl-optics__response-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(228,223,196,.72);
    font-size: 14px;
    line-height: 1;
    font-weight: 800;
}

.dgwhitepearl-optics__response-results {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}

.dgwhitepearl-optics__response-result {
    position: relative;
    overflow: hidden;
    padding: 11px 12px 11px 14px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 13px;
    background: rgba(255,255,255,.032);
}

.dgwhitepearl-optics__response-result::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    border-radius: 3px;
    background: rgba(255,255,255,.32);
}

.dgwhitepearl-optics__response-result--blue::before {
    background: #4aa8ff;
}

.dgwhitepearl-optics__response-result--yellow::before {
    background: #e8c63e;
}

.dgwhitepearl-optics__response-result strong {
    display: block;
    margin-top: 4px;
    color: #fff;
    font-size: 9px;
    line-height: 1.65;
    font-weight: 900;
}

.dgwhitepearl-optics__response-equation {
    padding: 11px 12px;
    border: 1px solid rgba(212,222,203,.10);
    border-radius: 13px;
    background:
        linear-gradient(90deg, rgba(73,168,255,.07), rgba(232,198,62,.055));
}

.dgwhitepearl-optics__response-equation strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 10px;
    line-height: 1.65;
    font-weight: 900;
}

.dgwhitepearl-optics__response-example {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 2px;
}

.dgwhitepearl-optics__response-example strong {
    color: #e4dfc4;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 900;
    text-align: right;
}

@media (max-width: 767px) {
    .dgwhitepearl-optics__response {
        padding: 14px;
    }

    .dgwhitepearl-optics__response-flow {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .dgwhitepearl-optics__response-arrow {
        width: 100%;
        min-height: 12px;
        transform: rotate(90deg);
    }

    .dgwhitepearl-optics__response-results {
        grid-template-columns: 1fr;
    }

    .dgwhitepearl-optics__response-example {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}
/* END — White Pearlescent Multiple Refraction v1.13.02 */


/* =========================================================
   DGCHEME — White Pearlescent Product Explorer / Family 01
   v1.13.03

   WHITE PRODUCT SECTION
   - Shared Product Explorer mechanics retained
   - Family 01: Pearlescent White
   - Family divider: #BDBDC1 -> white toward physical LEFT
   - Divider typography: DGCHEME deep green
   - Product grid: 4 / 2 / 1
   - Product cards remain white
========================================================= */

.dgproduct-explorer--white-pearl,
.dgproduct-explorer--white-pearl * {
    box-sizing: border-box;
}

.dgproduct-explorer--white-pearl {
    --dgpearl-green: #173f2f;
    --dgpearl-green-2: #245740;
    --dgpearl-muted: #6f7e75;
    --dgpearl-line: #dde5df;
    --dgpearl-silver: #BDBDC1;
    --dgpearl-silver-soft: #ececef;
    --dgpearl-white: #ffffff;
    position: relative;
    overflow: visible;
    width: 100%;
    padding: 54px 22px 66px;
    border-top: 1px solid rgba(23,63,47,.08);
    background:
        radial-gradient(circle at 12% 8%, rgba(189,189,193,.12), transparent 23%),
        radial-gradient(circle at 90% 45%, rgba(23,63,47,.035), transparent 25%),
        linear-gradient(180deg, #ffffff 0%, #fbfcfb 100%);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__inner {
    width: min(1380px, 100%);
    margin: 0 auto;
    background: transparent;
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__head {
    position: relative;
    margin-bottom: 18px;
    padding: 18px 20px 17px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.085);
    border-radius: 20px;
    background:
        linear-gradient(110deg, rgba(255,255,255,.98), rgba(245,246,246,.96)),
        #fff;
    box-shadow:
        0 12px 30px rgba(20,52,39,.055),
        inset 0 1px 0 rgba(255,255,255,.86);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__head::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 34%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #BDBDC1, #173f2f);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__kicker {
    color: #7c8981;
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__title {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__lead {
    color: var(--dgpearl-muted);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__head-meta {
    padding: 9px 12px;
    border: 1px solid rgba(23,63,47,.08);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 7px 18px rgba(23,63,47,.045);
}

.dgproduct-explorer--white-pearl .dgproduct-explorer__head-meta span {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    padding: 6px;
    margin-bottom: 18px;
    border: 1px solid rgba(23,63,47,.09);
    background: #f4f6f5;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
}

.dgproduct-explorer--white-pearl .dgproduct-tabs__tab {
    min-height: 53px;
    border: 1px solid transparent;
}

.dgproduct-explorer--white-pearl .dgproduct-tabs__tab:hover {
    border-color: rgba(23,63,47,.08);
    background: rgba(255,255,255,.84);
}

.dgproduct-explorer--white-pearl .dgproduct-tabs__tab.is-active {
    border-color: rgba(23,63,47,.10);
    background:
        linear-gradient(180deg, #fff, #fafbfa);
    color: var(--dgpearl-green);
    box-shadow:
        0 8px 19px rgba(23,63,47,.065),
        inset 0 -2px 0 #BDBDC1;
}

.dgproduct-explorer--white-pearl .dgproduct-tabs__tab.is-active .dgproduct-tabs__code {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-tabs__label {
    color: #3b4b42;
}

.dgproduct-explorer--white-pearl .dgproduct-mobile-select__option.is-active {
    background: #edf3ef;
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-mobile-select__option.is-active span {
    color: var(--dgpearl-green);
}


/* ---------------------------------------------------------
   FAMILY 01 / PEARLESCENT WHITE DIVIDER

   Physical desktop geometry:
   LEFT  -> [NUMBER] [ENGLISH]
   RIGHT -> [PERSIAN IDENTITY]

   User color:
   #BDBDC1, fading to WHITE toward physical LEFT.
--------------------------------------------------------- */

.dgproduct-explorer--white-pearl .dgpearl-divider--white {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.12);
    border-radius: 20px;
    background:
        linear-gradient(90deg, #ffffff 0%, #f8f8f9 22%, #dedee0 62%, #BDBDC1 100%);
    box-shadow:
        0 15px 34px rgba(23,63,47,.09),
        inset 0 1px 0 rgba(255,255,255,.82);
    color: var(--dgpearl-green);
    direction: ltr;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.58), transparent 42%),
        radial-gradient(circle at 83% 45%, rgba(255,255,255,.28), transparent 30%);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(23,63,47,.14), rgba(23,63,47,.30), transparent);
    box-shadow: none;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__meta,
.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.48);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.86);
    color: var(--dgpearl-green);
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__micro,
.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.60);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__latin strong {
    display: block;
    color: var(--dgpearl-green);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.72);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white h3,
.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__title-text,
.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__title-code {
    margin: 0;
    color: var(--dgpearl-green);
    text-shadow: none;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(23,63,47,.72);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
}


/* ---------------------------------------------------------
   FAMILY INTRO / WHITE
--------------------------------------------------------- */

.dgproduct-explorer--white-pearl .dgpearl-family-intro {
    align-items: start;
    margin-bottom: 28px;
    padding: 12px;
    border-color: rgba(23,63,47,.09);
    border-radius: 20px;
    background:
        linear-gradient(180deg, #fff, #fcfdfc);
    box-shadow:
        0 10px 28px rgba(23,63,47,.055),
        inset 0 1px 0 rgba(255,255,255,.84);
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__media {
    position: sticky;
    top: 108px;
    align-self: start;
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__visual {
    min-height: 0;
    border: 1px solid rgba(23,63,47,.09);
    border-radius: 16px;
    background:
        linear-gradient(145deg, #eef0ef, #ffffff);
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__visual > img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    transition: transform .45s cubic-bezier(.22,1,.36,1);
}

@media (hover:hover) and (pointer:fine) {
    .dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__visual:hover > img {
        transform: scale(1.025);
    }
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__visual::after {
    background: linear-gradient(180deg, transparent 58%, rgba(8,36,25,.42));
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.52);
    background: rgba(13,55,39,.78);
}

.dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__badge strong {
    color: #fff;
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__eyebrow {
    color: #718178;
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__content h3 {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__content p {
    color: #4f5f55;
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__content p strong {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__points li {
    color: #536259;
}

.dgproduct-explorer--white-pearl .dgproduct-family-intro__points li::before {
    background: #BDBDC1;
    box-shadow: 0 0 0 4px rgba(189,189,193,.17);
}

.dgpearl-family-intro__subfamilies {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
    margin: 14px 0 16px;
}

.dgpearl-family-intro__subfamilies > span {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid rgba(23,63,47,.09);
    border-radius: 11px;
    background:
        linear-gradient(180deg, #f9faf9, #f3f5f4);
    direction: ltr;
    text-align: left;
}

.dgpearl-family-intro__subfamilies small,
.dgpearl-family-intro__subfamilies strong {
    display: block;
}

.dgpearl-family-intro__subfamilies small {
    margin-bottom: 2px;
    color: #8d9992;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .09em;
}

.dgpearl-family-intro__subfamilies strong {
    color: var(--dgpearl-green);
    font-size: 11px;
    font-weight: 900;
}


/* ---------------------------------------------------------
   DESIGNED PRODUCT HEADER / WHITE
--------------------------------------------------------- */

.dgproduct-explorer--white-pearl .dgpearl-products-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 18px;
    margin: 0 0 15px;
    padding: 17px 18px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.09);
    border-radius: 17px;
    background:
        radial-gradient(circle at 92% 12%, rgba(189,189,193,.16), transparent 26%),
        linear-gradient(110deg, #ffffff, #f7f8f7);
    box-shadow:
        0 8px 24px rgba(23,63,47,.05),
        inset 0 1px 0 rgba(255,255,255,.88);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, #BDBDC1, rgba(23,63,47,.36), transparent);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head > div:first-child > span {
    color: #7e8a83;
}

.dgproduct-explorer--white-pearl .dgpearl-products-head h3 {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head p {
    margin: 2px 0 0;
    color: #7d8982;
    font-size: 9px;
    line-height: 1.8;
}

.dgproduct-explorer--white-pearl .dgpearl-products-head .dgproduct-products-head__count {
    min-width: 92px;
    justify-content: center;
    padding: 10px 12px;
    border: 1px solid rgba(23,63,47,.10);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 7px 18px rgba(23,63,47,.045);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head .dgproduct-products-head__count strong {
    color: var(--dgpearl-green);
    font-size: 20px;
}


/* ---------------------------------------------------------
   WHITE PRODUCT CARDS
--------------------------------------------------------- */

.dgproduct-explorer--white-pearl .dgproduct-grid--pearlescent-white {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 13px;
}

.dgproduct-explorer--white-pearl .dgproduct-card {
    position: relative;
    border-color: rgba(23,63,47,.10);
    border-radius: 15px;
    background: #fff;
    box-shadow:
        0 7px 22px rgba(23,63,47,.055),
        inset 0 1px 0 rgba(255,255,255,.92);
}

.dgproduct-explorer--white-pearl .dgproduct-card::before {
    content: "";
    position: absolute;
    z-index: 8;
    top: 0;
    right: 18px;
    left: 18px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, #BDBDC1, #173f2f, transparent);
    opacity: .62;
}

.dgproduct-explorer--white-pearl .dgproduct-card:hover,
.dgproduct-explorer--white-pearl .dgproduct-card:focus-visible {
    border-color: rgba(23,63,47,.18);
    box-shadow: 0 13px 30px rgba(23,63,47,.10);
}

.dgproduct-explorer--white-pearl .dgproduct-card:focus-visible {
    outline: 2px solid rgba(23,63,47,.35);
    outline-offset: 2px;
}

.dgproduct-explorer--white-pearl .dgproduct-card__media {
    background: #edf0ee;
}

.dgproduct-explorer--white-pearl .dgproduct-card__series {
    border-color: rgba(255,255,255,.36);
    background: rgba(20,61,45,.74);
    color: #fff;
}

.dgproduct-explorer--white-pearl .dgproduct-card__night-badge i {
    background: #e7e7e9;
    box-shadow: 0 0 0 3px rgba(255,255,255,.15), 0 0 9px rgba(255,255,255,.58);
}

.dgproduct-explorer--white-pearl .dgproduct-card__identity {
    border-bottom-color: rgba(23,63,47,.085);
}

.dgproduct-explorer--white-pearl .dgproduct-card__identity strong {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-card__glow-name {
    max-width: 58%;
    overflow: hidden;
    border-color: rgba(23,63,47,.09);
    background: #f4f7f5;
    color: #4d6558;
    text-overflow: ellipsis;
}

.dgproduct-explorer--white-pearl .dgproduct-card__glow-name i {
    flex: 0 0 6px;
    background: #BDBDC1;
    box-shadow: 0 0 0 3px rgba(189,189,193,.18);
}

.dgproduct-explorer--white-pearl .dgproduct-card__quick-specs > span {
    border-color: rgba(23,63,47,.075);
    background: linear-gradient(180deg, #fafbfa, #f5f7f6);
}

.dgproduct-explorer--white-pearl .dgproduct-card__quick-specs b {
    color: #33483d;
}

.dgproduct-explorer--white-pearl .dgproduct-card__app {
    border-color: rgba(23,63,47,.08);
    background: #fff;
    color: #66766c;
}

.dgproduct-explorer--white-pearl .dgproduct-card__app--more {
    background: #eff3f0;
    color: #4d6658;
}

.dgproduct-explorer--white-pearl .dgproduct-card__footer {
    border-top-color: rgba(23,63,47,.07);
}

.dgproduct-explorer--white-pearl .dgproduct-card__footer svg {
    fill: var(--dgpearl-green);
}


/* ---------------------------------------------------------
   VIEWER ACCENTS
--------------------------------------------------------- */

.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card {
    border-color: rgba(255,255,255,.32);
    background:
        linear-gradient(100deg, rgba(244,245,245,.94), rgba(189,189,193,.86));
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-side > span,
.dgproduct-explorer--white-pearl .dgproduct-viewer__product-id > span {
    color: rgba(23,63,47,.72);
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__product-id strong {
    color: var(--dgpearl-green);
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__media-footer > div > strong {
    color: #f0f1f0;
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 1120px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--white {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-grid--pearlescent-white {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--white-pearl {
        padding: 38px 14px 48px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-explorer__head {
        align-items: flex-start;
        padding: 16px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-explorer__head-meta {
        align-self: flex-start;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background:
            linear-gradient(180deg, #BDBDC1 0%, #e6e6e8 48%, #ffffff 100%);
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__media {
        position: relative;
        top: auto;
    }

    .dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__content {
        padding: 18px 14px 12px;
    }

    .dgproduct-explorer--white-pearl .dgpearl-products-head {
        grid-template-columns: 1fr auto;
        padding: 14px;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--white-pearl .dgproduct-explorer__head {
        display: block;
    }

    .dgproduct-explorer--white-pearl .dgproduct-explorer__head-meta {
        width: max-content;
        margin-top: 11px;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__meta {
        align-items: center;
        gap: 11px;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--white .dgproduct-family-divider__index {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .dgpearl-family-intro__subfamilies {
        grid-template-columns: 1fr;
    }

    .dgproduct-explorer--white-pearl .dgpearl-products-head {
        grid-template-columns: 1fr;
    }

    .dgproduct-explorer--white-pearl .dgpearl-products-head .dgproduct-products-head__count {
        width: max-content;
    }

    .dgproduct-explorer--white-pearl .dgproduct-grid--pearlescent-white {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--white-pearl .dgproduct-card,
    .dgproduct-explorer--white-pearl .dgproduct-card__night,
    .dgproduct-explorer--white-pearl .dgpearl-family-intro .dgproduct-family-intro__visual > img {
        transition: none;
    }
}

/* END — White Pearlescent Product Explorer / Family 01 v1.13.03 */

/* =========================================================
   DGCHEME — WHITE PEARLESCENT PRODUCT SECTION — v1.13.04
   Product media transparency + viewer identity two-row lock
   ========================================================= */

/* Product images: no artificial media background/overlay. */
.dgproduct-explorer--white-pearl .dgproduct-card__media {
    background: transparent;
    box-shadow: none;
}

.dgproduct-explorer--white-pearl .dgproduct-card__media::after {
    display: none;
    content: none;
}

.dgproduct-explorer--white-pearl .dgproduct-card__night,
.dgproduct-explorer--white-pearl .dgproduct-card__media > img {
    background: transparent;
}

/* Viewer identity: exactly two visual rows — family, then product code. */
.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card {
    gap: 16px;
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__product-id {
    flex: 0 0 auto;
    min-width: 172px;
    max-width: 210px;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    text-align: right;
    direction: ltr;
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__product-id > span {
    display: block;
    width: 100%;
    margin: 0;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
    font-size: 7px;
    line-height: 1.35;
    letter-spacing: .065em;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > strong {
    display: block;
    width: 100%;
    margin: 0;
    white-space: nowrap;
    font-size: 18px;
    line-height: 1.15;
    text-align: right;
}

@media (max-width: 640px) {
    .dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card {
        gap: 10px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-viewer__product-id {
        min-width: 152px;
        max-width: 172px;
        padding-left: 8px;
        gap: 4px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-viewer__product-id > span {
        font-size: 6.5px;
        letter-spacing: .045em;
    }

    .dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > strong {
        font-size: 15px;
    }
}

/* =========================================================
   DGCHEME — WHITE PEARLESCENT PRODUCT SECTION — v1.13.05
   Viewer brand card: transparent surface + white typography
   ========================================================= */

.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card {
    background: transparent;
    background-image: none;
    box-shadow: none;
}

.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card,
.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__brand-side > span,
.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > span,
.dgproduct-explorer--white-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > strong {
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
}

/* =========================================================
   DGCHEME — WHITE PEARLESCENT PRODUCT SECTION — v1.13.06
   Family 02 / Interference White
   Accent: #6161E4 → white toward physical left
   ========================================================= */

/* FAMILY 02 DIVIDER
   Desktop physical geometry:
   LEFT  -> [NUMBER] [ENGLISH]
   RIGHT -> [PERSIAN IDENTITY]
*/
.dgproduct-explorer--white-pearl .dgpearl-divider--interference {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(97,97,228,.22);
    border-radius: 20px;
    background:
        linear-gradient(90deg, #ffffff 0%, #f8f8ff 21%, #dadafa 52%, #9292ee 78%, #6161E4 100%);
    box-shadow:
        0 15px 34px rgba(49,54,123,.11),
        inset 0 1px 0 rgba(255,255,255,.76);
    direction: ltr;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.62), transparent 40%),
        radial-gradient(circle at 82% 42%, rgba(255,255,255,.20), transparent 31%);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(97,97,228,.18), #6161E4, transparent);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__meta,
.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.14);
    border-radius: 14px;
    background: rgba(255,255,255,.56);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.90);
    color: var(--dgpearl-green);
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__micro,
.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.60);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin strong {
    display: block;
    color: var(--dgpearl-green);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.72);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .035em;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference h3,
.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__title-text,
.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__title-code {
    margin: 0;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    text-shadow: 0 1px 14px rgba(23,36,72,.20);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(255,255,255,.86);
    -webkit-text-fill-color: rgba(255,255,255,.86);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
}

/* FAMILY 02 INTRO ACCENTS */
.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.55);
    background: rgba(73,73,190,.82);
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-family-intro__points li::before {
    background: #6161E4;
    box-shadow: 0 0 0 4px rgba(97,97,228,.13);
}

.dgpearl-family-intro__undertones {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 14px 0 16px;
    direction: ltr;
}

.dgpearl-family-intro__undertones > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 7px 10px;
    border: 1px solid rgba(97,97,228,.12);
    border-radius: 999px;
    background: linear-gradient(180deg, #fbfbff, #f3f3fd);
    color: #4b4bb1;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}

/* FAMILY 02 PRODUCTS */
.dgproduct-explorer--white-pearl .dgproduct-grid--interference-white {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 13px;
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card::before {
    background: linear-gradient(90deg, transparent, #b9b9f5, #6161E4, transparent);
    opacity: .72;
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__series {
    border-color: rgba(255,255,255,.42);
    background: rgba(73,73,190,.82);
    color: #ffffff;
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__night-badge i,
.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__glow-name i {
    background: #6161E4;
    box-shadow: 0 0 0 3px rgba(97,97,228,.14);
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__app--more {
    background: #f0f0ff;
    color: #5050b8;
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__footer svg {
    fill: #6161E4;
}

.dgproduct-explorer--white-pearl .dgpearl-products-head--interference::before {
    background: linear-gradient(90deg, transparent, #b9b9f5, #6161E4, transparent);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head--interference .dgproduct-products-head__count {
    border-color: rgba(97,97,228,.14);
}

.dgproduct-explorer--white-pearl .dgpearl-products-head--interference .dgproduct-products-head__count strong {
    color: #5656c7;
}

/* Keep product media clean: no artificial background. */
.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__media,
.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__night,
.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__media > img {
    background: transparent;
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__media::after {
    display: none;
    content: none;
}

@media (max-width: 1120px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-grid--interference-white {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background:
            linear-gradient(180deg, #6161E4 0%, #a9a9f3 48%, #ffffff 100%);
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__micro,
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin span,
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin strong,
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__latin em,
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__index {
        color: var(--dgpearl-green);
        -webkit-text-fill-color: var(--dgpearl-green);
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgpearl-family-intro__undertones {
        gap: 6px;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__meta {
        align-items: center;
        gap: 11px;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--interference .dgproduct-family-divider__index {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .dgproduct-explorer--white-pearl .dgproduct-grid--interference-white {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card,
    .dgproduct-explorer--white-pearl [data-dgproduct-family="interference-white"] .dgproduct-card__night {
        transition: none;
    }
}

/* END — White Pearlescent Product Explorer / Family 02 v1.13.06 */


/* =========================================================
   DGCHEME — White Pearlescent Product Explorer / Family 03
   Iridescent White Series — v1.13.07
   Productless family: intro only, no invented product grid.
========================================================= */

/* FAMILY 03 DIVIDER — exact requested white → green → purple direction */
.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(320px,.92fr);
    gap: 28px;
    align-items: center;
    width: 100%;
    min-height: 116px;
    padding: 22px 24px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.10);
    border-radius: 22px;
    background-image: linear-gradient(90deg, white, green, purple);
    box-shadow: 0 18px 42px rgba(13,49,35,.10);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    border: 1px solid rgba(23,63,47,.20);
    border-radius: 15px;
    background: rgba(255,255,255,.52);
    color: var(--dgpearl-green);
    -webkit-text-fill-color: var(--dgpearl-green);
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .08em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__micro,
.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__latin span {
    display: block;
    color: rgba(23,63,47,.70);
    -webkit-text-fill-color: rgba(23,63,47,.70);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .14em;
    line-height: 1.5;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__latin strong {
    display: block;
    margin-top: 2px;
    color: var(--dgpearl-green);
    -webkit-text-fill-color: var(--dgpearl-green);
    font-size: 12px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.72);
    -webkit-text-fill-color: rgba(23,63,47,.72);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .035em;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    min-width: 0;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent h3,
.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__title-text,
.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__title-code {
    margin: 0;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    text-shadow: 0 1px 14px rgba(28,18,45,.28);
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(255,255,255,.88);
    -webkit-text-fill-color: rgba(255,255,255,.88);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
}

/* FAMILY 03 INTRO */
.dgproduct-explorer--white-pearl [data-dgproduct-family="iridescent-white"] .dgproduct-family-intro__badge {
    border-color: rgba(255,255,255,.62);
    background: linear-gradient(110deg, rgba(0,128,0,.88), rgba(128,0,128,.88));
}

.dgproduct-explorer--white-pearl [data-dgproduct-family="iridescent-white"] .dgproduct-family-intro__points li::before {
    background: purple;
    box-shadow: 0 0 0 4px rgba(128,0,128,.11);
}

.dgpearl-family-intro__iridescent-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 14px 0 16px;
    direction: ltr;
}

.dgpearl-family-intro__iridescent-tags > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 7px 10px;
    border: 1px solid rgba(87,68,132,.14);
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255,255,255,.98), rgba(232,247,236,.95), rgba(243,234,249,.96));
    color: #385b49;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .07em;
}

/* Explicitly productless: no fake products or empty product header is generated. */
.dgproduct-explorer--white-pearl [data-dgproduct-family="iridescent-white"] .dgproduct-family-intro {
    margin-bottom: 0;
}

@media (max-width: 1120px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background-image: linear-gradient(180deg, purple, green, white);
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgpearl-family-intro__iridescent-tags {
        gap: 6px;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__meta {
        align-items: center;
        gap: 11px;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__index {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .dgpearl-family-intro__iridescent-tags > span {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
    }
}

/* END — White Pearlescent Product Explorer / Family 03 v1.13.07 */

/* =========================================================
   DGCHEME — White Pearlescent Product Explorer — v1.13.08
   Family 03 divider geometry hard-lock
   Desktop physical geometry:
   LEFT  -> [NUMBER] [ENGLISH]
   RIGHT -> [PERSIAN IDENTITY]
   Number chip matches Families 01 / 02.
========================================================= */

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent {
    direction: ltr;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__meta {
    grid-column: 1;
    justify-self: start;
    justify-content: flex-start;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__identity {
    grid-column: 2;
    justify-self: stretch;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__latin {
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.14);
    border-radius: 14px;
    background: rgba(255,255,255,.56);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.90);
    color: var(--dgpearl-green);
    -webkit-text-fill-color: var(--dgpearl-green);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
}

@media (max-width: 760px) {
    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent {
        direction: rtl;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__identity {
        order: 1;
        justify-self: auto;
    }

    .dgproduct-explorer--white-pearl .dgpearl-divider--iridescent .dgproduct-family-divider__meta {
        order: 2;
        justify-self: auto;
        direction: ltr;
        text-align: left;
    }
}

/* END — Family 03 divider geometry fix v1.13.08 */

/* =========================================================
   SHARED
========================================================= */
.dgcolorpearl-intro,
.dgcolorpearl-structure,
.dgcolorpearl-theory,
.dgcolorpearl-optics,
.dgcolorpearl-semitransparent,
.dgcolorpearl-intro *,
.dgcolorpearl-structure *,
.dgcolorpearl-theory *,
.dgcolorpearl-optics *,
.dgcolorpearl-semitransparent * {
    box-sizing: border-box;
}

.dgcolorpearl-intro__inner,
.dgcolorpearl-structure__inner,
.dgcolorpearl-theory__inner,
.dgcolorpearl-optics__inner,
.dgcolorpearl-semitransparent__inner {
    width: min(1180px, calc(100% - 8px));
    margin: 0 auto;
}

.dgcolorpearl-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 9px;

    direction: ltr;
    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgcolorpearl-section-kicker::before {
    content: "";
    width: 25px;
    height: 1px;
    flex: 0 0 auto;
}

.dgcolorpearl-section-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-section-lead {
    margin: 7px 0 0;
    font-size: 12px;
    line-height: 1.95;
}

.dgcolorpearl-figure {
    margin: 0;
    overflow: hidden;
    border-radius: 22px;
}

.dgcolorpearl-visual {
    position: relative;
    overflow: hidden;
}

.dgcolorpearl-visual img {
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        filter .48s ease;
}

.dgcolorpearl-image-badge {
    position: absolute;
    right: 13px;
    bottom: 13px;

    padding: 8px 10px;
    border-radius: 999px;

    direction: ltr;
    font-size: 7px;
    line-height: 1.3;
    font-weight: 900;
    letter-spacing: .08em;
}

@media (hover:hover) and (pointer:fine) {
    .dgcolorpearl-visual:hover img {
        transform: scale(1.035);
        filter: contrast(1.015) saturate(1.025);
    }
}


/* =========================================================
   SECTION 01 — INTRO / WHITE
========================================================= */
.dgcolorpearl-intro {
    position: relative;
    width: 100%;
    padding: 58px 20px 64px;
    overflow: hidden;

    background:
        radial-gradient(circle at 88% 12%, rgba(164,178,201,.075), transparent 25%),
        radial-gradient(circle at 11% 84%, rgba(203,194,151,.045), transparent 28%),
        linear-gradient(180deg, #fcfdfc 0%, #f4f7f5 100%);
}

.dgcolorpearl-intro::before {
    content: "";
    position: absolute;
    left: -88px;
    top: 78px;

    width: 255px;
    height: 255px;

    border: 1px solid rgba(23,63,47,.05);
    border-radius: 50%;

    box-shadow:
        0 0 0 28px rgba(23,63,47,.015),
        0 0 0 56px rgba(23,63,47,.008);

    pointer-events: none;
}

.dgcolorpearl-intro__inner {
    position: relative;
    z-index: 1;
}

.dgcolorpearl-intro__grid {
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
    grid-template-areas: "copy tech";
    gap: 24px;
    align-items: stretch;

    direction: ltr;
}

.dgcolorpearl-intro__copy {
    grid-area: copy;
    min-width: 0;

    padding: 30px 30px 28px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-intro__copy .dgcolorpearl-section-kicker {
    color: #6d8077;
}

.dgcolorpearl-intro__copy .dgcolorpearl-section-kicker::before {
    background: linear-gradient(90deg, #c0ae76, rgba(192,174,118,.12));
}

.dgcolorpearl-intro__copy h2 {
    margin: 0 0 14px;

    color: #173f2f;

    font-size: 18px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-intro__copy p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-intro__copy p + p {
    margin-top: 14px;
}

.dgcolorpearl-intro__copy strong {
    color: #173f2f;
    font-weight: 900;
}

.dgcolorpearl-intro__features {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 20px;
    padding-top: 18px;

    border-top: 1px solid rgba(18,59,43,.08);
}

.dgcolorpearl-intro__feature {
    min-height: 90px;
    padding: 12px 13px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: #f5f8f6;
}

.dgcolorpearl-intro__feature span {
    display: block;
    margin-bottom: 5px;

    color: #917c45;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-intro__feature strong {
    display: block;

    color: #183f30;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* Technical green card */
.dgcolorpearl-intro__tech {
    grid-area: tech;
    position: relative;
    min-width: 0;

    padding: 28px 26px 25px;
    overflow: hidden;

    border: 1px solid rgba(255,255,255,.105);
    border-radius: 22px;

    background:
        radial-gradient(circle at 88% 12%, rgba(220,219,190,.08), transparent 26%),
        radial-gradient(circle at 10% 90%, rgba(95,163,124,.08), transparent 30%),
        linear-gradient(135deg, #092a1e 0%, #123d2b 52%, #09271b 100%);

    box-shadow:
        0 22px 46px rgba(8,44,30,.20),
        inset 0 1px 0 rgba(255,255,255,.035);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-intro__tech::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;

    width: 64%;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d7d5c2,
            #ffffff,
            #b8c7d7
        );

    pointer-events: none;
}

.dgcolorpearl-intro__tech > * {
    position: relative;
    z-index: 1;
}

.dgcolorpearl-intro__tech-eyebrow {
    display: block;
    margin-bottom: 8px;

    color: #abc9b9;

    direction: ltr;
    text-align: right;

    font-size: 9px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgcolorpearl-intro__tech h1 {
    margin: 0;

    color: #fff;

    font-size: 20px;
    line-height: 1.85;
    font-weight: 900;
}

.dgcolorpearl-intro__tech-subtitle {
    display: block;
    margin-top: 3px;

    color: rgba(228,240,234,.62);

    direction: ltr;
    text-align: right;

    font-size: 9px;
    line-height: 1.45;
    font-weight: 850;
    letter-spacing: .07em;
}

.dgcolorpearl-intro__formula {
    margin-top: 23px;
    padding: 17px 16px;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;

    background: rgba(255,255,255,.045);
}

.dgcolorpearl-intro__formula-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 11px;

    direction: ltr;
}

.dgcolorpearl-intro__formula-label span {
    color: #abc8b8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgcolorpearl-intro__formula-label small {
    color: rgba(229,240,234,.42);

    font-size: 7px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .08em;
}

.dgcolorpearl-intro__formula-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
    gap: 4px;
    align-items: center;

    direction: ltr;
}

.dgcolorpearl-intro__formula-node {
    min-width: 0;
    padding: 11px 7px;

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;

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

    text-align: center;
}

.dgcolorpearl-intro__formula-node strong {
    display: block;

    color: #fff;

    font-size: 9px;
    line-height: 1.45;
    font-weight: 900;
}

.dgcolorpearl-intro__formula-node small {
    display: block;
    margin-top: 3px;

    color: rgba(223,238,230,.52);

    font-size: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.dgcolorpearl-intro__formula-arrow {
    color: #d7d4b5;

    text-align: center;

    font-size: 15px;
    line-height: 1;
    font-weight: 900;
}

.dgcolorpearl-intro__mechanism {
    margin-top: 10px;
    padding: 13px 14px;

    border-right: 3px solid rgba(222,218,183,.74);
    border-radius: 12px;

    background: rgba(222,218,183,.055);

    direction: ltr;
    text-align: left;
}

.dgcolorpearl-intro__mechanism span {
    display: block;
    margin-bottom: 4px;

    color: #c6d9ce;

    font-size: 7px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .12em;
}

.dgcolorpearl-intro__mechanism strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}

.dgcolorpearl-intro__specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;

    margin-top: 18px;
}

.dgcolorpearl-intro__spec {
    min-height: 76px;
    padding: 11px 12px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 13px;

    background: rgba(255,255,255,.035);
}

.dgcolorpearl-intro__spec span {
    display: block;
    margin-bottom: 5px;

    color: #a8c5b7;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-intro__spec strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.7;
    font-weight: 850;
}

.dgcolorpearl-intro__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    margin-top: 17px;

    direction: ltr;
}

.dgcolorpearl-intro__tag {
    padding: 7px 9px;

    border: 1px solid rgba(255,255,255,.09);
    border-radius: 999px;

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

    color: rgba(234,244,239,.70);

    font-size: 7px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .05em;
}


/* =========================================================
   SECTION 02 — STRUCTURE / GREEN
========================================================= */
.dgcolorpearl-structure {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;

    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.045), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(130,157,195,.045), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgcolorpearl-structure__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
    padding-bottom: 17px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgcolorpearl-structure__head-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-structure__head .dgcolorpearl-section-kicker {
    color: rgba(223,240,231,.48);
}

.dgcolorpearl-structure__head .dgcolorpearl-section-kicker::before {
    background: linear-gradient(90deg, #e5e3d3, rgba(229,227,211,.12));
}

.dgcolorpearl-structure__head h2 {
    color: #fff;
}

.dgcolorpearl-structure__head p {
    color: rgba(225,240,232,.68);
}

.dgcolorpearl-structure__head-meta {
    flex: 0 0 auto;
    min-width: 150px;

    padding: 13px 16px;

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

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

    direction: ltr;
    text-align: left;
}

.dgcolorpearl-structure__head-meta span {
    display: block;

    color: #e3dfc8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgcolorpearl-structure__head-meta strong {
    display: block;
    margin-top: 5px;

    color: #fff;

    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgcolorpearl-structure__grid {
    display: grid;
    grid-template-columns: minmax(0,1.04fr) minmax(360px,.96fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgcolorpearl-structure__content {
    min-width: 0;
    padding: 27px 29px 28px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;

    background: rgba(7,45,31,.48);

    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-structure__content h3 {
    margin: 0 0 13px;

    color: #fff;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-structure__lead {
    margin: 0;
    padding: 14px 16px;

    border-right: 3px solid #ded9b6;
    border-radius: 15px;

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

    color: #eef6f1;

    font-size: 13px;
    line-height: 2.12;
    font-weight: 850;

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-structure__content p:not(.dgcolorpearl-structure__lead) {
    margin: 15px 0 0;

    color: rgba(228,240,233,.80);

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

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-structure__content strong {
    color: #fff;
    font-weight: 900;
}

.dgcolorpearl-structure__facts {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgcolorpearl-structure__fact {
    min-height: 94px;
    padding: 12px 13px;

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

    background: rgba(255,255,255,.035);
}

.dgcolorpearl-structure__fact span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-structure__fact strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgcolorpearl-structure__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgcolorpearl-structure .dgcolorpearl-figure {
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);

    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgcolorpearl-structure .dgcolorpearl-visual {
    background: #071b13;
}

.dgcolorpearl-structure .dgcolorpearl-image-badge {
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(7,33,23,.66);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgcolorpearl-structure .dgcolorpearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: transparent;

    color: rgba(230,241,235,.72);

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgcolorpearl-structure__interference {
    display: grid;
    grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr);
    gap: 18px;
    align-items: center;

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

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;

    background: rgba(255,255,255,.032);
}

.dgcolorpearl-structure__interference-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-structure__interference-copy span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: right;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-structure__interference-copy strong {
    display: block;

    color: #fff;

    font-size: 12px;
    line-height: 2;
    font-weight: 900;
}

/* v1.13.01 — coded interference spectrum around the source image */
.dgcolorpearl-structure__interference-visual {
    min-width: 0;
}

.dgcolorpearl-interference-diagram {
    margin: 0;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 17px;

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

    box-shadow:
        0 16px 34px rgba(0,0,0,.15),
        inset 0 1px 0 rgba(255,255,255,.035);

    overflow: hidden;
}

.dgcolorpearl-interference-diagram__surface {
    padding: 16px 17px 14px;

    background:
        radial-gradient(circle at 14% 10%, rgba(214,221,238,.34), transparent 27%),
        radial-gradient(circle at 89% 88%, rgba(227,219,188,.30), transparent 28%),
        linear-gradient(180deg, #fbfcfd 0%, #f1f4f6 100%);
}

.dgcolorpearl-interference-diagram__materials {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 10px;

    margin: 0 0 10px;

    direction: ltr;
}

.dgcolorpearl-interference-diagram__material {
    position: relative;

    display: inline-flex;
    align-items: baseline;
    gap: 6px;

    min-width: 104px;
    padding: 7px 10px 8px;

    border: 1px solid rgba(41,79,130,.13);
    border-radius: 10px;

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

    box-shadow:
        0 5px 13px rgba(23,63,47,.055),
        inset 0 1px 0 rgba(255,255,255,.92);
}

.dgcolorpearl-interference-diagram__material::after {
    content: "";

    position: absolute;
    left: 50%;
    bottom: -8px;

    width: 1px;
    height: 8px;

    background: rgba(56,109,190,.34);
}

.dgcolorpearl-interference-diagram__material small {
    color: #728096;

    font-size: 7px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-interference-diagram__material strong {
    color: #326fd0;

    font-size: 13px;
    line-height: 1;
    font-weight: 900;
}

.dgcolorpearl-interference-diagram__material sub {
    font-size: .68em;
    line-height: 0;
}

.dgcolorpearl-interference-diagram__image {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 82px;
    padding: 9px 10px;

    border: 1px solid rgba(31,67,51,.11);
    border-radius: 12px;

    background: #fff;

    box-shadow: inset 0 1px 0 rgba(255,255,255,.92);

    overflow: hidden;
}

.dgcolorpearl-interference-diagram__image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 118px;
    object-fit: contain;
}

.dgcolorpearl-interference-diagram__colors {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 4px;

    margin-top: 9px;

    direction: ltr;
    text-align: center;
}

.dgcolorpearl-interference-diagram__colors span {
    min-width: 0;

    color: #3475d8;

    font-size: 10px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.01em;

    white-space: nowrap;
}

.dgcolorpearl-interference-diagram__thickness {
    position: relative;

    margin-top: 7px;
    padding-top: 16px;

    direction: ltr;
    text-align: center;
}

.dgcolorpearl-interference-diagram__arrow {
    position: absolute;
    top: 5px;
    left: 4%;
    right: 5%;

    height: 2px;
    border-radius: 999px;

    background: #3475d8;
}

.dgcolorpearl-interference-diagram__arrow::after {
    content: "";

    position: absolute;
    top: 50%;
    right: -1px;

    width: 9px;
    height: 9px;

    border-top: 2px solid #3475d8;
    border-right: 2px solid #3475d8;

    transform: translateY(-50%) rotate(45deg);
}

.dgcolorpearl-interference-diagram__thickness strong {
    display: inline-block;

    color: #756fd2;

    font-size: 11px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .01em;
}

.dgcolorpearl-interference-diagram figcaption {
    padding: 10px 13px 11px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: rgba(5,31,21,.26);

    color: rgba(231,241,235,.72);

    direction: rtl;
    text-align: right;

    font-size: 9px;
    line-height: 1.85;
    font-weight: 800;
}


/* =========================================================
   SECTION 03 — THEORY + APPLICATIONS / WHITE
========================================================= */
.dgcolorpearl-theory {
    position: relative;
    width: 100%;
    padding: 62px 20px 70px;
    overflow: visible;

    background:
        radial-gradient(circle at 88% 16%, rgba(188,178,133,.055), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgcolorpearl-theory__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;

    margin-bottom: 22px;
}

.dgcolorpearl-theory__meta {
    padding: 16px 18px;

    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;

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

    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgcolorpearl-theory__meta span {
    display: block;

    color: #8d7b48;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgcolorpearl-theory__meta strong {
    display: block;
    margin-top: 7px;

    color: #173f2f;

    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgcolorpearl-theory__head-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-theory__head .dgcolorpearl-section-kicker {
    color: #6d8176;
}

.dgcolorpearl-theory__head .dgcolorpearl-section-kicker::before {
    background: #b7a767;
}

.dgcolorpearl-theory__head h2 {
    color: #173f2f;
}

.dgcolorpearl-theory__head p {
    color: #64766c;
}

.dgcolorpearl-theory__grid {
    display: grid;
    grid-template-columns: minmax(360px,.92fr) minmax(0,1.08fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgcolorpearl-theory__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgcolorpearl-theory .dgcolorpearl-figure {
    border: 1px solid rgba(18,59,43,.09);
    background: #fff;

    box-shadow: 0 18px 44px rgba(18,59,43,.09);
}

.dgcolorpearl-theory .dgcolorpearl-visual {
    background: #eef2ef;
}

.dgcolorpearl-theory .dgcolorpearl-image-badge {
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(7,33,23,.68);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgcolorpearl-theory .dgcolorpearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(18,59,43,.08);

    background: #f3f6f4;

    color: #51655b;

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgcolorpearl-theory__content {
    min-width: 0;
    padding: 28px 30px 29px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-theory__content h3 {
    margin: 0 0 13px;

    color: #173f2f;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-theory__content p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-theory__content p + p {
    margin-top: 14px;
}

.dgcolorpearl-theory__content strong {
    color: #173f2f;
    font-weight: 900;
}

.dgcolorpearl-theory__note {
    margin-top: 18px;
    padding: 15px 17px;

    border-right: 3px solid #b8a75d;
    border-radius: 15px;

    background:
        radial-gradient(circle at 12% 22%, rgba(184,167,93,.06), transparent 34%),
        linear-gradient(135deg, #f6f8f6 0%, #f0f4f1 100%);

    color: #40564b;

    font-size: 12px;
    line-height: 2.05;
    font-weight: 850;

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-theory__apps {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgcolorpearl-theory__app {
    min-height: 82px;
    padding: 12px 13px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: #f5f8f6;
}

.dgcolorpearl-theory__app span {
    display: block;
    margin-bottom: 5px;

    color: #8e7c45;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-theory__app strong {
    display: block;

    color: #183f30;

    font-size: 10px;
    line-height: 1.75;
    font-weight: 850;
}


/* =========================================================
   SECTION 04 — OPTICS / GREEN
========================================================= */
.dgcolorpearl-optics {
    position: relative;
    width: 100%;
    padding: 60px 20px 68px;
    overflow: visible;

    background:
        radial-gradient(circle at 13% 12%, rgba(255,225,97,.045), transparent 25%),
        radial-gradient(circle at 88% 43%, rgba(130,157,195,.045), transparent 29%),
        linear-gradient(125deg, #082419 0%, #103827 48%, #09271b 100%);
}

.dgcolorpearl-optics__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
    padding-bottom: 17px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgcolorpearl-optics__head-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-optics__head .dgcolorpearl-section-kicker {
    color: rgba(223,240,231,.48);
}

.dgcolorpearl-optics__head .dgcolorpearl-section-kicker::before {
    background: linear-gradient(90deg, #e5e3d3, rgba(229,227,211,.12));
}

.dgcolorpearl-optics__head h2 {
    color: #fff;
}

.dgcolorpearl-optics__head p {
    color: rgba(225,240,232,.68);
}

.dgcolorpearl-optics__head-meta {
    flex: 0 0 auto;
    min-width: 150px;

    padding: 13px 16px;

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

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

    direction: ltr;
    text-align: left;
}

.dgcolorpearl-optics__head-meta span {
    display: block;

    color: #e3dfc8;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgcolorpearl-optics__head-meta strong {
    display: block;
    margin-top: 5px;

    color: #fff;

    font-size: 11px;
    line-height: 1.55;
    font-weight: 900;
}

.dgcolorpearl-optics__grid {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr);
    gap: 24px;
    align-items: start;

    direction: ltr;
}

.dgcolorpearl-optics__content {
    min-width: 0;
    padding: 27px 29px 28px;

    border: 1px solid rgba(255,255,255,.085);
    border-radius: 22px;

    background: rgba(7,45,31,.48);

    box-shadow:
        0 18px 42px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.025);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-optics__content h3 {
    margin: 0 0 13px;

    color: #fff;

    font-size: 16px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-optics__content p {
    margin: 0;

    color: rgba(228,240,233,.80);

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

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-optics__content p + p {
    margin-top: 14px;
}

.dgcolorpearl-optics__content strong {
    color: #fff;
    font-weight: 900;
}

.dgcolorpearl-optics__mechanism {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px;

    margin-top: 19px;
}

.dgcolorpearl-optics__mechanism-item {
    min-height: 94px;
    padding: 12px 13px;

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

    background: rgba(255,255,255,.035);
}

.dgcolorpearl-optics__mechanism-item span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-optics__mechanism-item strong {
    display: block;

    color: #fff;

    font-size: 10px;
    line-height: 1.78;
    font-weight: 850;
}

.dgcolorpearl-optics__media {
    position: sticky;
    top: 108px;
    align-self: start;
    min-width: 0;
}

.dgcolorpearl-optics .dgcolorpearl-figure {
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);

    box-shadow: 0 20px 46px rgba(0,0,0,.22);
}

.dgcolorpearl-optics .dgcolorpearl-visual {
    background: #071b13;
}

.dgcolorpearl-optics .dgcolorpearl-image-badge {
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(7,33,23,.66);
    color: #fff;

    backdrop-filter: blur(8px);
}

.dgcolorpearl-optics .dgcolorpearl-figure figcaption {
    padding: 14px 16px 16px;

    border-top: 1px solid rgba(255,255,255,.07);

    background: transparent;

    color: rgba(230,241,235,.72);

    direction: rtl;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 850;
}

.dgcolorpearl-optics__diagram {
    display: grid;
    grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr);
    gap: 18px;
    align-items: center;

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

    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;

    background: rgba(255,255,255,.032);
}

.dgcolorpearl-optics__diagram-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-optics__diagram-copy span {
    display: block;
    margin-bottom: 6px;

    color: #e4dfc4;

    direction: ltr;
    text-align: right;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-optics__diagram-copy strong {
    display: block;

    color: #fff;

    font-size: 12px;
    line-height: 2;
    font-weight: 900;
}

.dgcolorpearl-optics__diagram-visual {
    overflow: hidden;
    border-radius: 15px;

    background: rgba(255,255,255,.92);
}

.dgcolorpearl-optics__diagram-visual img {
    display: block;
    width: 100%;
    height: auto;
}


/* =========================================================
   SECTION 05 — SEMI-TRANSPARENT / WHITE
========================================================= */
.dgcolorpearl-semitransparent {
    position: relative;
    width: 100%;
    padding: 62px 20px 72px;
    overflow: hidden;

    background:
        radial-gradient(circle at 88% 16%, rgba(188,178,133,.055), transparent 24%),
        radial-gradient(circle at 8% 88%, rgba(40,102,73,.04), transparent 26%),
        linear-gradient(180deg, #fbfcfb 0%, #f4f7f5 100%);
}

.dgcolorpearl-semitransparent__head {
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 28px;
    align-items: end;

    margin-bottom: 22px;
}

.dgcolorpearl-semitransparent__meta {
    padding: 16px 18px;

    border: 1px solid rgba(18,59,43,.09);
    border-radius: 16px;

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

    box-shadow:
        0 10px 24px rgba(18,59,43,.05),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.dgcolorpearl-semitransparent__meta span {
    display: block;

    color: #8d7b48;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .14em;
}

.dgcolorpearl-semitransparent__meta strong {
    display: block;
    margin-top: 7px;

    color: #173f2f;

    font-size: 13px;
    line-height: 1.65;
    font-weight: 900;
}

.dgcolorpearl-semitransparent__head-copy {
    direction: rtl;
    text-align: right;
}

.dgcolorpearl-semitransparent__head .dgcolorpearl-section-kicker {
    color: #6d8176;
}

.dgcolorpearl-semitransparent__head .dgcolorpearl-section-kicker::before {
    background: #b7a767;
}

.dgcolorpearl-semitransparent__head h2 {
    color: #173f2f;
}

.dgcolorpearl-semitransparent__body {
    padding: 28px 30px 29px;

    border: 1px solid rgba(18,59,43,.085);
    border-radius: 22px;

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

    box-shadow:
        0 18px 42px rgba(18,59,43,.06),
        inset 0 1px 0 rgba(255,255,255,.92);

    direction: rtl;
    text-align: right;
}

.dgcolorpearl-semitransparent__body p {
    margin: 0;

    color: #53675d;

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

    text-align: justify;
    text-align-last: right;
}

.dgcolorpearl-semitransparent__body strong {
    color: #173f2f;
    font-weight: 900;
}

.dgcolorpearl-semitransparent__substrates {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;

    margin-top: 20px;
}

.dgcolorpearl-semitransparent__substrate {
    min-height: 116px;
    padding: 16px 17px;

    border: 1px solid rgba(18,59,43,.08);
    border-radius: 16px;
}

.dgcolorpearl-semitransparent__substrate--black {
    background:
        radial-gradient(circle at 86% 20%, rgba(255,255,255,.08), transparent 24%),
        linear-gradient(135deg, #18221d, #0b1510);

    border-color: rgba(255,255,255,.08);
}

.dgcolorpearl-semitransparent__substrate--white {
    background:
        radial-gradient(circle at 86% 20%, rgba(189,178,124,.08), transparent 24%),
        linear-gradient(135deg, #fff, #f3f5f3);
}

.dgcolorpearl-semitransparent__substrate span {
    display: block;
    margin-bottom: 7px;

    direction: ltr;
    text-align: left;

    font-size: 8px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgcolorpearl-semitransparent__substrate strong {
    display: block;

    font-size: 11px;
    line-height: 1.9;
    font-weight: 900;
}

.dgcolorpearl-semitransparent__substrate--black span {
    color: rgba(230,239,234,.54);
}

.dgcolorpearl-semitransparent__substrate--black strong {
    color: #fff;
}

.dgcolorpearl-semitransparent__substrate--white span {
    color: #8d7b48;
}

.dgcolorpearl-semitransparent__substrate--white strong {
    color: #173f2f;
}


/* pre-products transition */
.dgcolorpearl-semitransparent__pre-products {
    position: relative;
    margin-top: 30px;
    padding: 30px 6px 2px;

    direction: rtl;
}

.dgcolorpearl-semitransparent__pre-products::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(23,63,47,.03),
            rgba(23,63,47,.14) 45%,
            rgba(183,167,103,.60) 100%
        );
}

.dgcolorpearl-semitransparent__pre-products::after {
    content: "06";
    position: absolute;
    left: 8px;
    top: 18px;

    color: rgba(23,63,47,.045);

    direction: ltr;

    font-size: 92px;
    line-height: .82;
    font-weight: 950;
    letter-spacing: -.07em;

    pointer-events: none;
}

.dgcolorpearl-semitransparent__pre-head {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: center;

    min-height: 58px;
    margin-bottom: 17px;
    padding-right: 20px;

    border-right: 3px solid #b7a767;
}

.dgcolorpearl-semitransparent__pre-head span {
    justify-self: start;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 8px 10px;

    border: 1px solid rgba(23,63,47,.075);
    border-radius: 999px;

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

    color: #6e8177;

    direction: ltr;

    font-size: 8px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .13em;
}

.dgcolorpearl-semitransparent__pre-head span::before {
    content: "";

    width: 7px;
    height: 7px;
    flex: 0 0 auto;

    border-radius: 50%;

    background: #b7a767;

    box-shadow: 0 0 0 4px rgba(183,167,103,.10);
}

.dgcolorpearl-semitransparent__pre-head strong {
    max-width: 650px;

    color: #173f2f;

    font-size: 14px;
    line-height: 1.75;
    font-weight: 950;

    text-align: right;
}

.dgcolorpearl-semitransparent__families {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;

    margin-right: 20px;
    margin-left: 20px;
}

.dgcolorpearl-semitransparent__family {
    min-height: 88px;
    padding: 13px 14px;

    border: 1px solid rgba(18,59,43,.075);
    border-radius: 14px;

    background: rgba(255,255,255,.66);
}

.dgcolorpearl-semitransparent__family span {
    display: block;
    margin-bottom: 5px;

    color: #8d7b48;

    direction: ltr;
    text-align: left;

    font-size: 7px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgcolorpearl-semitransparent__family strong {
    display: block;

    color: #173f2f;

    font-size: 10px;
    line-height: 1.8;
    font-weight: 900;
}

.dgcolorpearl-semitransparent__next {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 18px;
    margin-right: 20px;

    padding: 9px 12px 9px 14px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            rgba(23,63,47,.055),
            rgba(183,167,103,.09)
        );

    color: #887539;

    direction: ltr;

    font-size: 8px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .11em;
}

.dgcolorpearl-semitransparent__next::before {
    content: "";

    width: 28px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #b7a767,
            rgba(183,167,103,.18)
        );
}


/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 940px) {
    .dgcolorpearl-intro__grid,
    .dgcolorpearl-structure__grid,
    .dgcolorpearl-theory__grid,
    .dgcolorpearl-optics__grid {
        grid-template-columns: minmax(0,1fr) minmax(320px,.9fr);
    }

    .dgcolorpearl-intro__features,
    .dgcolorpearl-structure__facts,
    .dgcolorpearl-optics__mechanism {
        grid-template-columns: 1fr;
    }

    .dgcolorpearl-theory__apps {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgcolorpearl-intro,
    .dgcolorpearl-structure,
    .dgcolorpearl-theory,
    .dgcolorpearl-optics,
    .dgcolorpearl-semitransparent {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dgcolorpearl-intro {
        padding-top: 44px;
        padding-bottom: 50px;
    }

    .dgcolorpearl-structure,
    .dgcolorpearl-theory,
    .dgcolorpearl-optics,
    .dgcolorpearl-semitransparent {
        padding-top: 46px;
        padding-bottom: 52px;
    }

    /* Intro law: tech first, copy second */
    .dgcolorpearl-intro__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "tech"
            "copy";
        gap: 14px;
    }

    .dgcolorpearl-intro__tech,
    .dgcolorpearl-intro__copy {
        padding: 22px 20px 21px;
        border-radius: 19px;
    }

    .dgcolorpearl-structure__head,
    .dgcolorpearl-optics__head {
        flex-direction: column;
        align-items: stretch;
    }

    .dgcolorpearl-structure__head-meta,
    .dgcolorpearl-optics__head-meta {
        min-width: 0;
        max-width: 220px;
    }

    /* visual sections: title -> image -> text */
    .dgcolorpearl-structure__grid,
    .dgcolorpearl-theory__grid,
    .dgcolorpearl-optics__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgcolorpearl-structure__media,
    .dgcolorpearl-theory__media,
    .dgcolorpearl-optics__media {
        position: relative;
        top: auto;
        order: 1;
    }

    .dgcolorpearl-structure__content,
    .dgcolorpearl-theory__content,
    .dgcolorpearl-optics__content {
        order: 2;
        padding: 22px 20px 21px;
    }

    .dgcolorpearl-structure__interference,
    .dgcolorpearl-optics__diagram {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .dgcolorpearl-theory__head,
    .dgcolorpearl-semitransparent__head {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .dgcolorpearl-theory__meta,
    .dgcolorpearl-semitransparent__meta {
        max-width: 250px;
    }

    .dgcolorpearl-semitransparent__body {
        padding: 22px 20px 21px;
    }

    .dgcolorpearl-semitransparent__pre-products {
        margin-top: 22px;
        padding-top: 25px;
    }

    .dgcolorpearl-semitransparent__pre-products::after {
        top: 24px;
        font-size: 68px;
    }

    .dgcolorpearl-semitransparent__pre-head {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding-right: 14px;
    }

    .dgcolorpearl-semitransparent__pre-head span {
        justify-self: end;
    }

    .dgcolorpearl-semitransparent__families {
        grid-template-columns: 1fr;
        margin-right: 14px;
        margin-left: 14px;
    }

    .dgcolorpearl-semitransparent__next {
        margin-right: 14px;
    }
}

@media (max-width: 520px) {
    .dgcolorpearl-intro__inner,
    .dgcolorpearl-structure__inner,
    .dgcolorpearl-theory__inner,
    .dgcolorpearl-optics__inner,
    .dgcolorpearl-semitransparent__inner {
        width: min(100%, calc(100% - 4px));
    }

    .dgcolorpearl-intro__specs,
    .dgcolorpearl-theory__apps,
    .dgcolorpearl-semitransparent__substrates {
        grid-template-columns: 1fr;
    }


    .dgcolorpearl-interference-diagram__surface {
        padding: 13px 10px 12px;
    }

    .dgcolorpearl-interference-diagram__materials {
        gap: 7px;
        margin-bottom: 8px;
    }

    .dgcolorpearl-interference-diagram__material {
        min-width: 0;
        padding: 6px 8px 7px;
    }

    .dgcolorpearl-interference-diagram__material small {
        font-size: 6px;
    }

    .dgcolorpearl-interference-diagram__material strong {
        font-size: 11px;
    }

    .dgcolorpearl-interference-diagram__image {
        min-height: 62px;
        padding: 7px;
    }

    .dgcolorpearl-interference-diagram__colors {
        gap: 1px;
        margin-top: 8px;
    }

    .dgcolorpearl-interference-diagram__colors span {
        font-size: 8px;
    }

    .dgcolorpearl-interference-diagram__thickness {
        margin-top: 5px;
        padding-top: 14px;
    }

    .dgcolorpearl-interference-diagram__thickness strong {
        font-size: 9px;
    }

    .dgcolorpearl-intro__formula-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .dgcolorpearl-intro__formula-arrow {
        transform: rotate(90deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgcolorpearl-visual img {
        transition: none;
    }
}

/* END — Color Pearlescent Pigments Pre-Products v1.13.00 */

/* =========================================================
   Color Pearlescent / Multiple Refraction content module
   v1.13.02
   Scoped enhancement only — Section 04 diagram
========================================================= */
.dgcolorpearl-optics__diagram {
    align-items: stretch;
}

.dgcolorpearl-optics__diagram-copy {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: 0;
}

.dgcolorpearl-optics__diagram-copy > strong {
    margin-bottom: 14px;
}

.dgcolorpearl-optics__response {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 2px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 17px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 12px 28px rgba(0,0,0,.10);
    direction: ltr;
    text-align: left;
}

.dgcolorpearl-optics__response-head {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgcolorpearl-optics__response-head span,
.dgcolorpearl-optics__response-result span,
.dgcolorpearl-optics__response-equation span,
.dgcolorpearl-optics__response-example span {
    display: block;
    margin: 0;
    color: rgba(230,241,235,.62);
    font-size: 7px;
    line-height: 1.45;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.dgcolorpearl-optics__response-head strong {
    display: block;
    color: #fff;
    font-size: 12px;
    line-height: 1.55;
    font-weight: 900;
}

.dgcolorpearl-optics__response-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
    gap: 7px;
    align-items: stretch;
}

.dgcolorpearl-optics__response-node {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 10px 9px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.dgcolorpearl-optics__response-node small {
    display: block;
    margin-bottom: 4px;
    color: rgba(230,241,235,.52);
    font-size: 6px;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .11em;
}

.dgcolorpearl-optics__response-node strong {
    display: block;
    color: #fff;
    font-size: 9px;
    line-height: 1.55;
    font-weight: 900;
}

.dgcolorpearl-optics__response-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(228,223,196,.72);
    font-size: 14px;
    line-height: 1;
    font-weight: 800;
}

.dgcolorpearl-optics__response-results {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}

.dgcolorpearl-optics__response-result {
    position: relative;
    overflow: hidden;
    padding: 11px 12px 11px 14px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 13px;
    background: rgba(255,255,255,.032);
}

.dgcolorpearl-optics__response-result::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    border-radius: 3px;
    background: rgba(255,255,255,.32);
}

.dgcolorpearl-optics__response-result--blue::before {
    background: #4aa8ff;
}

.dgcolorpearl-optics__response-result--yellow::before {
    background: #e8c63e;
}

.dgcolorpearl-optics__response-result strong {
    display: block;
    margin-top: 4px;
    color: #fff;
    font-size: 9px;
    line-height: 1.65;
    font-weight: 900;
}

.dgcolorpearl-optics__response-equation {
    padding: 11px 12px;
    border: 1px solid rgba(212,222,203,.10);
    border-radius: 13px;
    background:
        linear-gradient(90deg, rgba(73,168,255,.07), rgba(232,198,62,.055));
}

.dgcolorpearl-optics__response-equation strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 10px;
    line-height: 1.65;
    font-weight: 900;
}

.dgcolorpearl-optics__response-example {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 2px;
}

.dgcolorpearl-optics__response-example strong {
    color: #e4dfc4;
    font-size: 9px;
    line-height: 1.5;
    font-weight: 900;
    text-align: right;
}

@media (max-width: 767px) {
    .dgcolorpearl-optics__response {
        padding: 14px;
    }

    .dgcolorpearl-optics__response-flow {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .dgcolorpearl-optics__response-arrow {
        width: 100%;
        min-height: 12px;
        transform: rotate(90deg);
    }

    .dgcolorpearl-optics__response-results {
        grid-template-columns: 1fr;
    }

    .dgcolorpearl-optics__response-example {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}
/* END — Color Pearlescent Multiple Refraction v1.13.02 */

/* =========================================================
   DGCHEME — Color Pearlescent Pigments / Pre-Products
   v1.14.00
   Source page: post 4827
========================================================= */

/* Subtle color-spectrum identity while preserving the shared WHITE/GREEN rhythm. */
.dgcolorpearl-intro__tech {
    background:
        radial-gradient(circle at 18% 18%, rgba(62,116,255,.10), transparent 34%),
        radial-gradient(circle at 82% 76%, rgba(178,72,200,.09), transparent 36%),
        radial-gradient(circle at 54% 12%, rgba(214,170,62,.075), transparent 30%),
        linear-gradient(135deg, #092a1e 0%, #123d2b 52%, #09271b 100%);
}

.dgcolorpearl-intro__tag:nth-child(1) { border-color: rgba(71,117,214,.16); }
.dgcolorpearl-intro__tag:nth-child(2) { border-color: rgba(157,87,190,.16); }
.dgcolorpearl-intro__tag:nth-child(3) { border-color: rgba(195,136,55,.18); }
.dgcolorpearl-intro__tag:nth-child(4) { border-color: rgba(55,145,99,.16); }

/* The first source structure image is only 334×314; do not upscale it aggressively. */
.dgcolorpearl-visual--contain {
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background:
        radial-gradient(circle at 50% 45%, rgba(255,255,255,.10), transparent 54%),
        rgba(255,255,255,.035);
}

.dgcolorpearl-visual--contain img {
    width: auto;
    max-width: min(100%, 390px);
    max-height: 390px;
    object-fit: contain;
}

/* Section 02 second source visual: Fe2O3 thickness / heat-response block. */
.dgcolorpearl-structure__interference--thermal {
    grid-template-columns: minmax(300px,.88fr) minmax(0,1.12fr);
}

.dgcolorpearl-structure__thermal-path {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-top: 14px;
    direction: ltr;
}

.dgcolorpearl-structure__thermal-path span,
.dgcolorpearl-structure__thermal-path strong {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 6px 9px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 10px;
    background: rgba(255,255,255,.055);
    color: #fff;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 900;
    white-space: nowrap;
}

.dgcolorpearl-structure__thermal-path strong {
    border-color: rgba(224,171,101,.24);
    background: rgba(224,171,101,.10);
    color: #f1dfc3;
}

.dgcolorpearl-structure__thermal-path i {
    color: rgba(255,255,255,.55);
    font-style: normal;
    font-size: 13px;
    font-weight: 900;
}

.dgcolorpearl-structure__thermal-figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.035);
}

.dgcolorpearl-structure__thermal-figure img {
    display: block;
    width: 100%;
    height: auto;
}

/* Four source product families are announced before the separate Product Explorer file. */
.dgcolorpearl-semitransparent__families {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.dgcolorpearl-semitransparent__family {
    position: relative;
    overflow: hidden;
}
.dgcolorpearl-semitransparent__family::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
}
.dgcolorpearl-semitransparent__family:nth-child(1)::before {
    background: linear-gradient(90deg,#d5b85a,#f0dd94);
}
.dgcolorpearl-semitransparent__family:nth-child(2)::before {
    background: linear-gradient(90deg,#a85b38,#df9b67);
}
.dgcolorpearl-semitransparent__family:nth-child(3)::before {
    background: linear-gradient(90deg,#4775d6,#a356be,#42a06c);
}
.dgcolorpearl-semitransparent__family:nth-child(4)::before {
    background: linear-gradient(90deg,#4b8ccf,#6fc574,#9b56b6);
}

@media (max-width: 980px) {
    .dgcolorpearl-semitransparent__families {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgcolorpearl-visual--contain {
        min-height: 280px;
        padding: 16px;
    }

    .dgcolorpearl-structure__interference--thermal {
        grid-template-columns: 1fr;
    }

    .dgcolorpearl-structure__thermal-path {
        gap: 5px;
    }

    .dgcolorpearl-structure__thermal-path span,
    .dgcolorpearl-structure__thermal-path strong {
        font-size: 9px;
        min-height: 28px;
        padding: 5px 7px;
    }
}

@media (max-width: 520px) {
    .dgcolorpearl-semitransparent__families {
        grid-template-columns: 1fr;
    }
}

/* END — Color Pearlescent Pigments Pre-Products v1.14.00 */

/* =========================================================
   DGCHEME / COLOR PEARLESCENT
   v1.14.02 — Fe2O3 three-image gallery + optical formulas
   IMPORTANT: full-width stack; images ABOVE summary content
   ========================================================= */

/* Kill the older two-column inheritance on this specific block. */
.dgcolorpearl-structure__interference.dgcolorpearl-structure__interference--thermal-gallery {
    display: block !important;
    grid-template-columns: none !important;
    width: 100%;
    padding: 20px;
}

/* Three source visuals always occupy the top row on desktop. */
.dgcolorpearl-structure__thermal-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    width: 100%;
    direction: ltr;
}

.dgcolorpearl-structure__thermal-card {
    margin: 0;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 30px rgba(0,0,0,.14);
}

.dgcolorpearl-structure__thermal-media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 10px;
    overflow: hidden;
    background: #fff;
}

.dgcolorpearl-structure__thermal-media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 900 / 560;
    object-fit: contain;
}

.dgcolorpearl-structure__thermal-media > span {
    position: absolute;
    top: 11px;
    left: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(23,63,47,.13);
    border-radius: 10px;
    background: rgba(255,255,255,.94);
    color: #173f2f;
    font-size: 10px;
    line-height: 1;
    font-weight: 950;
    box-shadow: 0 7px 17px rgba(0,0,0,.08);
}

.dgcolorpearl-structure__thermal-card figcaption {
    min-height: 112px;
    padding: 14px 15px 16px;
    border-top: 1px solid rgba(23,63,47,.08);
    background: linear-gradient(180deg,#fff 0%,#f4f7f5 100%);
    direction: ltr;
    text-align: left;
}

.dgcolorpearl-structure__thermal-card figcaption small {
    display: block;
    margin-bottom: 7px;
    color: #6e7d75;
    font-size: 7px;
    line-height: 1.4;
    font-weight: 950;
    letter-spacing: .13em;
}

.dgcolorpearl-structure__thermal-card figcaption strong {
    display: block;
    color: #173f2f;
    font-size: 11px;
    line-height: 1.78;
    font-weight: 850;
}

.dgcolorpearl-structure__thermal-card--bronze figcaption { box-shadow: inset 0 3px 0 rgba(195,148,64,.78); }
.dgcolorpearl-structure__thermal-card--copper figcaption { box-shadow: inset 0 3px 0 rgba(191,102,57,.78); }
.dgcolorpearl-structure__thermal-card--russet figcaption { box-shadow: inset 0 3px 0 rgba(147,67,49,.78); }

/* Full-width content block BELOW the three images. */
.dgcolorpearl-structure__thermal-summary {
    display: block;
    width: 100%;
    margin-top: 18px;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 18px;
    background:
        radial-gradient(circle at 10% 0%,rgba(255,255,255,.05),transparent 34%),
        linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.018));
}

.dgcolorpearl-structure__thermal-summary-head {
    display: grid;
    grid-template-columns: minmax(0,.32fr) minmax(0,1fr);
    gap: 18px;
    align-items: start;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.dgcolorpearl-structure__thermal-summary-head > span {
    color: #f3e1b7;
    font-size: 8px;
    line-height: 1.5;
    font-weight: 950;
    letter-spacing: .13em;
    direction: ltr;
    text-align: left;
}

.dgcolorpearl-structure__thermal-summary-head > strong {
    color: #fff;
    font-size: 13px;
    line-height: 2;
    font-weight: 800;
    text-align: right;
}

/* Three optical equations mapped one-to-one to the three images above. */
.dgcolorpearl-structure__thermal-model {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 12px;
    margin-top: 16px;
    direction: ltr;
}

.dgcolorpearl-structure__thermal-formula {
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 15px;
    background: rgba(255,255,255,.035);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.dgcolorpearl-structure__thermal-formula--bronze { border-top-color: rgba(214,168,86,.62); }
.dgcolorpearl-structure__thermal-formula--copper { border-top-color: rgba(209,115,65,.62); }
.dgcolorpearl-structure__thermal-formula--russet { border-top-color: rgba(173,79,59,.62); }

.dgcolorpearl-structure__thermal-formula-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 11px;
}

.dgcolorpearl-structure__thermal-formula-head span {
    color: rgba(236,244,239,.56);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 950;
    letter-spacing: .12em;
}

.dgcolorpearl-structure__thermal-formula-head strong {
    color: #fff;
    font-size: 10px;
    line-height: 1.45;
    font-weight: 900;
    text-align: right;
}

.dgcolorpearl-structure__thermal-equation {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-height: 36px;
    padding: 9px 10px;
    border-radius: 11px;
    background: rgba(0,0,0,.13);
}

.dgcolorpearl-structure__thermal-equation b,
.dgcolorpearl-structure__thermal-equation em {
    color: #fff;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 900;
    font-style: normal;
    white-space: nowrap;
}

.dgcolorpearl-structure__thermal-equation i {
    color: rgba(255,255,255,.48);
    font-size: 12px;
    line-height: 1;
    font-style: normal;
    font-weight: 900;
}

.dgcolorpearl-structure__thermal-formula--bronze .dgcolorpearl-structure__thermal-equation em { color: #f1d59a; }
.dgcolorpearl-structure__thermal-formula--copper .dgcolorpearl-structure__thermal-equation em { color: #efb18c; }
.dgcolorpearl-structure__thermal-formula--russet .dgcolorpearl-structure__thermal-equation em { color: #e7a092; }

.dgcolorpearl-structure__thermal-formula > small {
    display: block;
    margin-top: 9px;
    color: rgba(234,242,237,.58);
    font-size: 8px;
    line-height: 1.65;
    font-weight: 700;
}

.dgcolorpearl-structure__thermal-summary .dgcolorpearl-structure__thermal-path {
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.dgcolorpearl-structure__thermal-note {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 14px;
    direction: ltr;
}

.dgcolorpearl-structure__thermal-note > div {
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
}

.dgcolorpearl-structure__thermal-note span {
    display: block;
    margin-bottom: 5px;
    color: rgba(230,241,235,.52);
    font-size: 7px;
    line-height: 1.4;
    font-weight: 950;
    letter-spacing: .13em;
}

.dgcolorpearl-structure__thermal-note strong {
    display: block;
    color: #f3e1b7;
    font-size: 9px;
    line-height: 1.7;
    font-weight: 850;
    text-align: left;
}

@media (max-width: 900px) {
    .dgcolorpearl-structure__thermal-gallery,
    .dgcolorpearl-structure__thermal-model {
        grid-template-columns: 1fr;
    }

    .dgcolorpearl-structure__thermal-card figcaption {
        min-height: 0;
    }

    .dgcolorpearl-structure__thermal-summary-head {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .dgcolorpearl-structure__thermal-summary-head > span,
    .dgcolorpearl-structure__thermal-summary-head > strong {
        text-align: right;
    }

    .dgcolorpearl-structure__thermal-note {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .dgcolorpearl-structure__interference.dgcolorpearl-structure__interference--thermal-gallery {
        padding: 14px;
    }

    .dgcolorpearl-structure__thermal-gallery {
        gap: 12px;
    }

    .dgcolorpearl-structure__thermal-card {
        border-radius: 15px;
    }

    .dgcolorpearl-structure__thermal-media {
        padding: 8px;
    }

    .dgcolorpearl-structure__thermal-card figcaption {
        padding: 12px 13px 14px;
    }

    .dgcolorpearl-structure__thermal-summary {
        padding: 15px;
        border-radius: 15px;
    }

    .dgcolorpearl-structure__thermal-formula {
        padding: 12px;
    }
}

/* END — Color Pearlescent Fe2O3 Gallery v1.14.02 */

/* =========================================================
   DGCHEME — COLOR PEARLESCENT PRODUCT SECTION — v1.14.03
   Family 01 / Pearlescent Golden
   Product Explorer is intentionally white.
   Family divider accent: #BF9000 → white toward physical left.
   Reuses the stable shared white-pearl product architecture.
   ========================================================= */

.dgproduct-explorer--color-pearl {
    --dgcolor-gold: #BF9000;
    --dgcolor-gold-deep: #8f6b00;
    --dgcolor-gold-soft: #f5ecd1;
    --dgcolor-green: #173f2f;
}

/* Four families for this page. */
.dgproduct-explorer--color-pearl .dgproduct-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Golden active-state accent. */
.dgproduct-explorer--color-pearl .dgproduct-tabs__tab.is-active {
    color: var(--dgcolor-green);
    box-shadow:
        0 8px 19px rgba(23,63,47,.065),
        inset 0 -2px 0 var(--dgcolor-gold);
}

.dgproduct-explorer--color-pearl .dgproduct-explorer__head::before {
    background: linear-gradient(90deg, transparent, var(--dgcolor-gold), var(--dgcolor-green));
}

.dgproduct-explorer--color-pearl .dgproduct-mobile-select__option.is-active {
    background: #f7f2e3;
    color: var(--dgcolor-green);
}

.dgproduct-explorer--color-pearl .dgproduct-mobile-select__option.is-active span {
    color: var(--dgcolor-gold-deep);
}


/* ---------------------------------------------------------
   FAMILY 01 / PEARLESCENT GOLDEN DIVIDER

   Physical desktop geometry:
   LEFT  -> [NUMBER] [ENGLISH]
   RIGHT -> [PERSIAN IDENTITY]

   User accent:
   #BF9000, fading to WHITE toward physical LEFT.
--------------------------------------------------------- */

.dgproduct-explorer--color-pearl .dgcolor-divider--golden {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(191,144,0,.25);
    border-radius: 20px;
    background:
        linear-gradient(90deg, #ffffff 0%, #fbfaf4 18%, #eee3bd 48%, #d3b350 74%, #BF9000 100%);
    box-shadow:
        0 15px 34px rgba(74,58,6,.10),
        inset 0 1px 0 rgba(255,255,255,.82);
    color: var(--dgcolor-green);
    direction: ltr;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.62), transparent 42%),
        radial-gradient(circle at 84% 44%, rgba(255,255,255,.22), transparent 30%);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background:
        linear-gradient(90deg, transparent, rgba(191,144,0,.24), rgba(23,63,47,.30), transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__meta,
.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.52);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
    color: var(--dgcolor-green);
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__micro,
.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.60);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__latin strong {
    display: block;
    color: var(--dgcolor-green);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.72);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden h3,
.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__title-text,
.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__title-code {
    margin: 0;
    color: var(--dgcolor-green);
    text-shadow: none;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(23,63,47,.72);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
}


/* ---------------------------------------------------------
   FAMILY 01 / INTRO
--------------------------------------------------------- */

.dgproduct-explorer--color-pearl .dgcolor-family-intro .dgproduct-family-intro__points li::before {
    background: var(--dgcolor-gold);
    box-shadow: 0 0 0 4px rgba(191,144,0,.13);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro .dgproduct-family-intro__badge {
    background: rgba(108,81,0,.82);
}

.dgcolor-family-intro__subfamilies {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    margin: 14px 0 16px;
}

.dgcolor-family-intro__subfamilies > span {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid rgba(191,144,0,.18);
    border-radius: 11px;
    background:
        linear-gradient(180deg, #fffdf7, #f8f3e3);
    direction: ltr;
    text-align: left;
}

.dgcolor-family-intro__subfamilies small,
.dgcolor-family-intro__subfamilies strong {
    display: block;
}

.dgcolor-family-intro__subfamilies small {
    margin-bottom: 2px;
    color: #9a8a58;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .09em;
}

.dgcolor-family-intro__subfamilies strong {
    color: var(--dgcolor-green);
    font-size: 11px;
    font-weight: 900;
}


/* ---------------------------------------------------------
   PRODUCTS HEADER + GRID
--------------------------------------------------------- */

.dgproduct-explorer--color-pearl .dgcolor-products-head::before {
    background:
        linear-gradient(90deg, transparent, var(--dgcolor-gold), rgba(23,63,47,.36), transparent);
}

.dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-golden {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 13px;
}

.dgproduct-explorer--color-pearl .dgproduct-card::before {
    background:
        linear-gradient(90deg, transparent, var(--dgcolor-gold), #173f2f, transparent);
}

.dgproduct-explorer--color-pearl .dgproduct-card__glow-name i {
    background: var(--dgcolor-gold);
    box-shadow: 0 0 0 3px rgba(191,144,0,.14);
}

.dgproduct-explorer--color-pearl .dgproduct-card__night-badge i {
    background: #d9b849;
    box-shadow:
        0 0 0 3px rgba(255,255,255,.15),
        0 0 9px rgba(215,177,50,.52);
}

/* Keep product images clean, with no artificial surface behind them. */
.dgproduct-explorer--color-pearl .dgproduct-card__media,
.dgproduct-explorer--color-pearl .dgproduct-card__media > img,
.dgproduct-explorer--color-pearl .dgproduct-card__night {
    background: transparent;
    box-shadow: none;
}

.dgproduct-explorer--color-pearl .dgproduct-card__media::after {
    display: none;
    content: none;
}


/* ---------------------------------------------------------
   SHARED VIEWER
   Keep the already-approved transparent brand card and
   white identity text.
--------------------------------------------------------- */

.dgproduct-explorer--color-pearl .dgproduct-viewer__brand-card {
    background: transparent;
    background-image: none;
    box-shadow: none;
}

.dgproduct-explorer--color-pearl .dgproduct-viewer__brand-card,
.dgproduct-explorer--color-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__brand-side > span,
.dgproduct-explorer--color-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > span,
.dgproduct-explorer--color-pearl .dgproduct-viewer__brand-card .dgproduct-viewer__product-id > strong {
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
}

.dgproduct-explorer--color-pearl .dgproduct-viewer__product-id {
    flex: 0 0 auto;
    min-width: 172px;
    max-width: 220px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    direction: ltr;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgproduct-viewer__product-id > span,
.dgproduct-explorer--color-pearl .dgproduct-viewer__product-id > strong {
    display: block;
    width: 100%;
    margin: 0;
    white-space: nowrap;
    text-align: right;
}


/* ---------------------------------------------------------
   FUTURE FAMILY PLACEHOLDERS
--------------------------------------------------------- */

.dgcolor-family-pending {
    margin: 0;
    padding: 26px 24px;
    border: 1px dashed rgba(23,63,47,.15);
    border-radius: 18px;
    background: #fbfcfb;
    text-align: center;
}

.dgcolor-family-pending span,
.dgcolor-family-pending strong {
    display: block;
}

.dgcolor-family-pending span {
    margin-bottom: 5px;
    color: #8b978f;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .12em;
}

.dgcolor-family-pending strong {
    color: #173f2f;
    font-size: 13px;
    line-height: 1.9;
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 1120px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--golden {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }

    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-golden {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .dgproduct-explorer--color-pearl .dgproduct-tabs {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--golden {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background:
            linear-gradient(180deg, #BF9000 0%, #e3cb80 47%, #ffffff 100%);
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--golden .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgcolor-family-intro__subfamilies {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-golden {
        grid-template-columns: 1fr;
    }

    .dgproduct-explorer--color-pearl .dgproduct-tabs {
        grid-template-columns: 1fr;
    }

    .dgproduct-explorer--color-pearl .dgproduct-viewer__product-id {
        min-width: 152px;
        max-width: 182px;
    }
}

/* END — Color Pearlescent Product Explorer / Family 01 v1.14.03 */

/* =========================================================
   DGCHEME — Color Pearlescent Product Explorer / Family 02
   v1.14.04
   Accent requested by user: #CF6623
========================================================= */

.dgproduct-explorer--color-pearl .dgcolor-divider--copper {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(207,102,35,.28);
    border-radius: 20px;
    background:
        linear-gradient(90deg, #ffffff 0%, #fff9f5 18%, #f1c7aa 49%, #dd8d58 74%, #CF6623 100%);
    box-shadow:
        0 15px 34px rgba(103,46,13,.10),
        inset 0 1px 0 rgba(255,255,255,.82);
    color: #173f2f;
    direction: ltr;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.64), transparent 42%),
        radial-gradient(circle at 84% 44%, rgba(255,255,255,.20), transparent 30%);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background:
        linear-gradient(90deg, transparent, rgba(207,102,35,.34), rgba(23,63,47,.30), transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__meta,
.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.52);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
    color: #173f2f;
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__micro,
.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.60);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__latin strong {
    display: block;
    color: #173f2f;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.72);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper h3,
.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__title-text,
.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__title-code {
    margin: 0;
    color: #173f2f;
    text-shadow: none;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(23,63,47,.72);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--copper .dgproduct-family-intro__points li::before {
    background: #CF6623;
    box-shadow: 0 0 0 4px rgba(207,102,35,.13);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--copper .dgproduct-family-intro__badge {
    background: rgba(130,56,14,.84);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__subfamilies--copper {
    grid-template-columns: repeat(2, minmax(0,1fr));
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__subfamilies--copper > span {
    border-color: rgba(207,102,35,.20);
    background: linear-gradient(180deg, #fffaf7, #f9ede5);
}

.dgproduct-explorer--color-pearl .dgcolor-products-head--copper::before {
    background:
        linear-gradient(90deg, transparent, #CF6623, rgba(23,63,47,.36), transparent);
}

.dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-copper {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 13px;
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--copper .dgproduct-card::before {
    background:
        linear-gradient(90deg, transparent, #CF6623, #173f2f, transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--copper .dgproduct-card__glow-name i {
    background: #CF6623;
    box-shadow: 0 0 0 3px rgba(207,102,35,.14);
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--copper .dgproduct-card__night-badge i {
    background: #d87b3f;
    box-shadow:
        0 0 0 3px rgba(255,255,255,.15),
        0 0 9px rgba(207,102,35,.48);
}

@media (max-width: 1120px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--copper {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }

    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-copper {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--copper {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background:
            linear-gradient(180deg, #CF6623 0%, #e6a47a 47%, #ffffff 100%);
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--copper .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgproduct-explorer--color-pearl .dgcolor-family-intro__subfamilies--copper {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-copper {
        grid-template-columns: 1fr;
    }
}

/* END — Color Pearlescent Product Explorer / Families 01-02 v1.14.04 */

/* =========================================================
   DGCHEME — Color Pearlescent Product Explorer / Family 03
   v1.14.05
   Requested narrow-card gradient:
   linear-gradient(90deg, white, purple, Dodgerblue, blue, green, yellow, orange, red)
========================================================= */

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.14);
    border-radius: 20px;
    background-image: linear-gradient(
        90deg,
        white,
        purple,
        Dodgerblue,
        blue,
        green,
        yellow,
        orange,
        red
    );
    box-shadow:
        0 15px 34px rgba(30,48,40,.12),
        inset 0 1px 0 rgba(255,255,255,.82);
    color: #173f2f;
    direction: ltr;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.62), transparent 35%),
        linear-gradient(90deg, rgba(255,255,255,.18), transparent 45%, rgba(255,255,255,.12));
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background:
        linear-gradient(90deg, transparent, rgba(23,63,47,.36), rgba(255,255,255,.58), transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__meta,
.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.52);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
    color: #173f2f;
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__micro,
.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.63);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__latin strong {
    display: block;
    color: #173f2f;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.76);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing h3,
.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__title-text,
.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__title-code {
    margin: 0;
    color: #ffffff;
    text-shadow: 0 1px 8px rgba(0,0,0,.24);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(255,255,255,.88);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.22);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--dyeing .dgproduct-family-intro__points li::before {
    background:
        linear-gradient(135deg, #7b2cbf, #1e90ff 35%, #138a36 62%, #f1c40f 82%, #e34234);
    box-shadow: 0 0 0 4px rgba(30,144,255,.10);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--dyeing .dgproduct-family-intro__badge {
    background:
        linear-gradient(100deg, rgba(75,25,110,.90), rgba(13,88,150,.90), rgba(20,115,62,.90));
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum {
    display: grid;
    grid-template-columns: repeat(7, minmax(0,1fr));
    gap: 7px;
    margin: 15px 0 18px;
    direction: ltr;
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span {
    display: grid;
    min-height: 38px;
    place-items: center;
    padding: 7px 6px;
    border: 1px solid rgba(23,63,47,.10);
    border-radius: 11px;
    color: #173f2f;
    background: #f8faf8;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .055em;
    box-shadow: 0 6px 15px rgba(17,49,37,.05);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(1) {
    background: linear-gradient(180deg, #f9f6f1, #dbc1a8);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(2) {
    background: linear-gradient(180deg, #fbf7ff, #d7b4f5);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(3) {
    background: linear-gradient(180deg, #f6fbff, #a9d5ff);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(4) {
    background: linear-gradient(180deg, #f5fff8, #a6e2b5);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(5) {
    background: linear-gradient(180deg, #fffef4, #f4e79c);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(6) {
    background: linear-gradient(180deg, #fff9f3, #f4c28d);
}
.dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum span:nth-child(7) {
    background: linear-gradient(180deg, #fff7f7, #efa6a6);
}

.dgproduct-explorer--color-pearl .dgcolor-products-head--dyeing::before {
    background:
        linear-gradient(90deg, transparent, purple, Dodgerblue, blue, green, yellow, orange, red, transparent);
}

.dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-dyeing {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 13px;
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--dyeing .dgproduct-card::before {
    background:
        linear-gradient(90deg, transparent, #7b2cbf, #1e90ff, #159947, #f0c926, #ef6c2f, #d83535, transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--dyeing .dgproduct-card__glow-name i {
    background: linear-gradient(135deg, #7b2cbf, #1e90ff 35%, #159947 64%, #ef6c2f 84%, #d83535);
    box-shadow: 0 0 0 3px rgba(30,144,255,.10);
}

.dgproduct-explorer--color-pearl .dgcolor-family-panel--dyeing .dgproduct-card__night-badge i {
    background: #1e90ff;
    box-shadow:
        0 0 0 3px rgba(255,255,255,.15),
        0 0 9px rgba(30,144,255,.48);
}

@media (max-width: 1120px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--dyeing {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }

    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-dyeing {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum {
        grid-template-columns: repeat(4, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--dyeing {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background-image: linear-gradient(
            180deg,
            red,
            orange,
            yellow,
            green,
            blue,
            Dodgerblue,
            purple,
            white
        );
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--dyeing .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 560px) {
    .dgproduct-explorer--color-pearl .dgproduct-grid--pearlescent-dyeing {
        grid-template-columns: 1fr;
    }

    .dgproduct-explorer--color-pearl .dgcolor-family-intro__spectrum {
        grid-template-columns: 1fr 1fr;
    }
}

/* END — Color Pearlescent Product Explorer / Families 01-03 v1.14.05 */

/* =========================================================
   DGCHEME — Color Pearlescent Product Explorer / Family 04
   v1.14.06
   Requested narrow-card gradient:
   linear-gradient(90deg, white, green, purple)
========================================================= */

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .95fr);
    align-items: center;
    gap: 28px;
    width: 100%;
    min-height: 116px;
    margin-bottom: 18px;
    padding: 20px 24px;
    overflow: hidden;
    border: 1px solid rgba(23,63,47,.16);
    border-radius: 20px;
    background-image: linear-gradient(90deg, white, green, purple);
    box-shadow:
        0 15px 34px rgba(29,46,40,.12),
        inset 0 1px 0 rgba(255,255,255,.82);
    color: #173f2f;
    direction: ltr;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, rgba(255,255,255,.68), transparent 42%),
        radial-gradient(circle at 78% 50%, rgba(255,255,255,.12), transparent 32%);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(23,63,47,.32), rgba(121,46,156,.42), transparent);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__meta,
.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__identity {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__meta {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__index {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    margin: 0;
    border: 1px solid rgba(23,63,47,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.52);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
    color: #173f2f;
    font-size: 12px;
    font-weight: 900;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__latin {
    min-width: 0;
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__micro,
.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__latin span {
    display: block;
    margin: 0 0 3px;
    color: rgba(23,63,47,.62);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .11em;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__latin strong {
    display: block;
    color: #173f2f;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.55;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__latin em {
    display: block;
    margin-top: 3px;
    color: rgba(23,63,47,.74);
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .04em;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__identity {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__copy {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon h3,
.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__title-text,
.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__title-code {
    margin: 0;
    color: #ffffff;
    text-shadow: 0 1px 8px rgba(0,0,0,.24);
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon h3 {
    font-size: 16px;
    line-height: 1.85;
}

.dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__subtitle {
    display: block;
    margin-top: 4px;
    direction: ltr;
    color: rgba(255,255,255,.90);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.6;
    text-align: right;
    text-shadow: 0 1px 6px rgba(0,0,0,.22);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--chameleon .dgproduct-family-intro__points li::before {
    background: linear-gradient(135deg, #1c9a55, #6d30a6);
    box-shadow: 0 0 0 4px rgba(87,52,141,.11);
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro--chameleon .dgproduct-family-intro__badge {
    background: linear-gradient(100deg, rgba(16,112,62,.90), rgba(89,37,128,.92));
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__chameleon-tags {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 9px;
    margin: 15px 0 18px;
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__chameleon-tags > span {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid rgba(23,63,47,.11);
    border-radius: 13px;
    background:
        linear-gradient(135deg, rgba(236,249,240,.95), rgba(245,237,252,.96));
    box-shadow: 0 7px 17px rgba(20,57,43,.05);
    direction: ltr;
    text-align: left;
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__chameleon-tags small {
    color: rgba(23,63,47,.60);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .10em;
}

.dgproduct-explorer--color-pearl .dgcolor-family-intro__chameleon-tags strong {
    color: #173f2f;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.55;
}

@media (max-width: 1120px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--chameleon {
        grid-template-columns: minmax(0,1fr) minmax(300px,.9fr);
        gap: 20px;
    }
}

@media (max-width: 760px) {
    .dgproduct-explorer--color-pearl .dgcolor-divider--chameleon {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        min-height: 0;
        padding: 17px;
        background-image: linear-gradient(180deg, purple, green, white);
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__identity {
        order: 1;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__meta {
        order: 2;
        width: 100%;
    }

    .dgproduct-explorer--color-pearl .dgcolor-divider--chameleon .dgproduct-family-divider__subtitle {
        text-align: right;
    }

    .dgproduct-explorer--color-pearl .dgcolor-family-intro__chameleon-tags {
        grid-template-columns: 1fr;
    }
}

/* END — Color Pearlescent Product Explorer / Families 01-04 v1.14.06 */



/* =========================================================
   DGCHEME — SHARED MOBILE FAMILY DIVIDER NORMALIZER
   Reference: Chameleon Glitter / Special Series
   v1.16.17

   Mobile geometry only. Family-specific gradients, colors,
   accents and pseudo-elements remain untouched.
========================================================= */
@media (max-width: 680px) {
    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin-bottom: 14px !important;
        padding: 16px !important;
        gap: 14px !important;
        overflow: hidden !important;
        border-radius: 15px !important;
        direction: rtl !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__meta {
        position: relative;
        z-index: 2;
        order: 1 !important;
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 14px !important;
        direction: ltr !important;
        text-align: left !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__index {
        order: 1 !important;
        display: grid !important;
        place-items: center !important;
        flex: 0 0 50px !important;
        width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
        line-height: 1 !important;
    }

    /* Special Series reference keeps the compact English cluster hidden on mobile. */
    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__latin {
        display: none !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__identity {
        position: relative;
        z-index: 2;
        order: 2 !important;
        display: flex !important;
        flex: 1 1 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        direction: rtl !important;
        text-align: right !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__copy {
        width: min(760px, 100%) !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        direction: rtl !important;
        text-align: right !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider h3 {
        margin: 0 0 6px !important;
        font-size: 13px !important;
        line-height: 1.8 !important;
        text-align: right !important;
    }

    .dgproduct-explorer .dgproduct-family-panel .dgproduct-family-divider__subtitle {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        direction: ltr !important;
        font-size: 13px !important;
        line-height: 1.55 !important;
        text-align: right !important;
    }
}
/* END — Shared Mobile Family Divider Normalizer v1.16.17 */