@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
    --dg-green: #064b3f;
    --dg-deep: #04382f;
    --dg-ink: #122f35;
    --dg-muted: #6c7d80;
    --dg-line: #e4ece8;
    --dg-paper: #ffffff;
    --dg-soft: #f6faf7;
    --dg-lime: #d7df18;
    --dg-red: #f04336;
    --dg-font: 'Inter', "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
}

.dg-home {
    background: var(--dg-paper);
    color: var(--dg-ink);
    font-family: var(--dg-font);
}

.dg-home h1,
.dg-home h2,
.dg-home h3,
.dg-home p {
    margin-top: 0;
}

.dg-home a {
    text-decoration: none !important;
}

.dg-hero {
    position: relative;
    min-height: 760px;
    padding: 110px 0 78px;
    background:
        radial-gradient(circle at 82% 48%, rgba(215, 223, 24, .26) 0 9%, transparent 9.5%),
        radial-gradient(circle at 74% 49%, rgba(0, 0, 0, .14) 0 21%, transparent 21.5%),
        linear-gradient(135deg, var(--dg-green), var(--dg-deep));
    color: #fff;
}

.dg-hero-grid {
    position: absolute;
    inset: 0;
    opacity: .18;
    background-image: linear-gradient(rgba(255, 255, 255, .35) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .35) 1px, transparent 1px);
    background-size: 150px 150px;
}

.dg-hero-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 520px);
    gap: 54px;
    align-items: center;
}

.dg-kicker,
.dg-kicker-dark,
.dg-section-head span,
.dg-demo-panel span {
    display: inline-block;
    margin-bottom: 14px;
    color: var(--dg-lime);
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dg-kicker-dark,
.dg-section-head span {
    color: var(--dg-red);
}

.dg-hero h1 {
    max-width: 690px;
    color: #fff;
    font-size: clamp(42px, 5.5vw, 78px);
    font-weight: 900;
    line-height: .98;
    letter-spacing: 0;
    margin-bottom: 24px;
}

.dg-hero p {
    max-width: 590px;
    color: rgba(255, 255, 255, .72);
    font-size: 19px;
    line-height: 1.7;
    margin-bottom: 28px;
}

.dg-hero-search {
    display: flex;
    max-width: 640px;
    padding: 8px;
    margin-bottom: 22px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    backdrop-filter: blur(8px);
}

.dg-hero-search input {
    flex: 1;
    min-width: 0;
    height: 54px;
    padding: 0 22px;
    color: #fff;
    font-size: 16px;
    background: transparent;
    border: 0;
    outline: 0;
}

.dg-hero-search input::placeholder {
    color: rgba(255, 255, 255, .62);
}

.dg-hero-search button,
.dg-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 24px;
    border: 0;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.dg-hero-search button,
.dg-btn-primary {
    color: var(--dg-ink) !important;
    background: var(--dg-lime);
    box-shadow: 0 18px 38px rgba(215, 223, 24, .24);
}

.dg-btn-light {
    color: #fff !important;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .28);
}

.dg-btn-dark {
    color: #fff !important;
    background: var(--dg-ink);
}

.dg-btn:hover,
.dg-hero-search button:hover {
    transform: translateY(-2px);
}

.dg-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 52px;
}

.dg-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 150px));
    gap: 26px;
}

.dg-hero-stats strong {
    display: block;
    color: #fff;
    font-size: 34px;
    font-weight: 900;
    line-height: 1;
    padding-bottom: 12px;
    border-bottom: 3px solid var(--dg-lime);
}

.dg-hero-stats span {
    display: block;
    margin-top: 9px;
    color: rgba(255, 255, 255, .62);
    font-size: 15px;
}

.dg-hero-visual {
    position: relative;
    min-height: 520px;
}

.dg-device {
    position: relative;
    width: min(100%, 470px);
    margin-left: auto;
    padding: 26px;
    background: rgba(255, 255, 255, .96);
    border-radius: 8px;
    box-shadow: 0 42px 90px rgba(0, 0, 0, .28);
}

.dg-device-top {
    display: flex;
    gap: 8px;
    margin-bottom: 30px;
}

.dg-device-top span {
    width: 10px;
    height: 10px;
    background: #dce7e1;
    border-radius: 50%;
}

.dg-device-body {
    display: grid;
    grid-template-columns: 86px 1fr;
    gap: 22px;
    align-items: center;
    padding: 24px;
    border-radius: 8px;
    background: #f7fbf8;
    border: 1px solid var(--dg-line);
}

.dg-device-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    color: var(--dg-green);
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-radius: 14px;
}

.dg-device-body small {
    display: block;
    color: var(--dg-red);
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.dg-device-body strong {
    display: block;
    color: var(--dg-ink);
    font-size: 25px;
    line-height: 1.15;
}

.dg-device-body p {
    color: var(--dg-muted);
    font-size: 15px;
    line-height: 1.6;
    margin: 10px 0 0;
}

.dg-progress {
    height: 10px;
    margin: 26px 0;
    border-radius: 999px;
    background: #e5eee9;
    overflow: hidden;
}

.dg-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--dg-lime), #27c08d);
}

.dg-device ul {
    display: grid;
    gap: 12px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.dg-device li {
    color: var(--dg-ink);
    font-size: 16px;
    font-weight: 800;
}

.dg-device li::before {
    content: "";
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-right: 10px;
    border-radius: 50%;
    background: var(--dg-lime);
}

.dg-orbit-card {
    position: absolute;
    z-index: 2;
    display: grid;
    gap: 4px;
    min-width: 150px;
    padding: 18px;
    color: #fff;
    background: rgba(255, 255, 255, .13);
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 8px;
    backdrop-filter: blur(8px);
}

.dg-orbit-card span {
    color: var(--dg-lime);
    font-weight: 900;
}

.dg-orbit-card-one {
    left: 0;
    top: 44px;
}

.dg-orbit-card-two {
    right: 0;
    bottom: 48px;
}

.dg-section {
    padding: 88px 0;
}

.dg-trust {
    padding: 0;
    background: var(--dg-soft);
}

.dg-trust-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 32px;
    margin-top: -42px;
    position: relative;
    z-index: 4;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 24px 60px rgba(18, 47, 53, .12);
}

.dg-trust-strip strong,
.dg-trust-strip span {
    display: block;
}

.dg-trust-strip strong {
    color: var(--dg-ink);
    font-size: 22px;
    font-weight: 900;
}

.dg-trust-strip span,
.dg-section-head p,
.dg-split p,
.dg-proof-card p,
.dg-format-card p,
.dg-demo-panel p {
    color: var(--dg-muted);
    font-size: 16px;
    line-height: 1.7;
}

.dg-trust-strip a {
    color: var(--dg-red);
    font-weight: 900;
}

.dg-section-head {
    max-width: 720px;
    margin: 0 auto 40px;
    text-align: center;
}

.dg-section-head h2,
.dg-split h2,
.dg-demo-panel h2 {
    color: var(--dg-ink);
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
    margin-bottom: 14px;
}

.dg-exam-grid,
.dg-format-grid,
.dg-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.dg-exam-card,
.dg-format-card,
.dg-proof-card {
    position: relative;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 8px;
    box-shadow: 0 14px 42px rgba(18, 47, 53, .08);
}

.dg-exam-card {
    display: flex;
    flex-direction: column;
    padding: 26px 24px;
    transition: transform .2s ease, box-shadow .2s ease;
}

.dg-exam-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 54px rgba(18, 47, 53, .12);
}

.dg-exam-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.dg-exam-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    color: var(--dg-green);
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-radius: 12px;
}

.dg-exam-code {
    padding: 5px 12px;
    color: var(--dg-red);
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .03em;
    background: rgba(240, 67, 54, .08);
    border-radius: 999px;
}

.dg-exam-card h3 {
    margin: 0 0 10px;
    color: var(--dg-ink);
    font-size: 19px;
    font-weight: 900;
    line-height: 1.3;
}

.dg-exam-card h3 a {
    color: inherit;
}

.dg-exam-card h3 a:hover {
    color: var(--dg-green);
}

.dg-exam-meta {
    margin: 0 0 20px;
    color: var(--dg-muted);
    font-size: 14px;
}

.dg-card-link {
    margin-top: auto;
    color: var(--dg-green);
    font-weight: 900;
}

.dg-center-action {
    text-align: center;
    margin-top: 38px;
}

.dg-formats {
    background: var(--dg-green);
}

.dg-section-head-light h2 {
    color: #fff;
}

.dg-section-head-light p {
    color: rgba(255, 255, 255, .7);
}

.dg-format-card {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .14);
}

.dg-format-card b {
    display: block;
    color: rgba(215, 223, 24, .38);
    font-size: 72px;
    line-height: .85;
    margin-bottom: 18px;
}

.dg-format-card h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 900;
}

.dg-format-card p {
    color: rgba(255, 255, 255, .68);
}

.dg-split {
    display: grid;
    grid-template-columns: minmax(280px, 430px) 1fr;
    gap: 56px;
    align-items: center;
}

.dg-vendor-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.dg-vendor-card {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 74px;
    padding: 14px;
    color: var(--dg-ink);
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(18, 47, 53, .07);
}

.dg-vendor-card img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: contain;
    background: #fff;
    border: 1px solid var(--dg-line);
}

.dg-vendor-card span {
    font-size: 15px;
    font-weight: 900;
    color: var(--dg-ink);
}

.dg-demo {
    padding: 40px 0;
}

.dg-demo-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 44px;
    color: #fff;
    background: linear-gradient(135deg, var(--dg-green), var(--dg-deep, #04382f));
    border-radius: 16px;
}

.dg-demo-panel h2,
.dg-demo-panel p,
.dg-demo-panel span {
    color: #fff;
}

.dg-demo-panel p {
    opacity: .82;
    margin-bottom: 0;
}

.dg-proof-card strong {
    display: block;
    color: var(--dg-ink);
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 12px;
}

.dg-seo-content {
    padding-top: 20px;
    background: var(--dg-soft);
}

.dg-seo-content .container {
    max-width: 980px;
    color: var(--dg-muted);
    font-size: 16px;
    line-height: 1.75;
}

.dg-seo-content h1,
.dg-seo-content h2,
.dg-seo-content h3 {
    color: var(--dg-ink);
    font-weight: 900;
}

.dg-seo-content h2 {
    display: block;
    margin-bottom: 22px;
    font-size: 32px;
    line-height: 1.2;
}

.dg-seo-content h2 span {
    color: var(--dg-red);
}

.dg-seo-content .premium-promo-home-bottom,
.dg-seo-content .premium-promo-bottom,
.dg-seo-content .premium-promo-top {
    margin: 0;
    padding: 28px 32px;
    color: #fff;
    font-size: 24px;
    font-weight: 900;
    line-height: 1.35;
    text-align: center;
    background: linear-gradient(135deg, var(--dg-green), var(--dg-deep));
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 8px;
    box-shadow: 0 24px 60px rgba(18, 47, 53, .13);
}

.dg-seo-content .premium-promo-home-bottom a,
.dg-seo-content .premium-promo-bottom a,
.dg-seo-content .premium-promo-top a {
    display: inline-block;
    margin-top: 12px;
    color: var(--dg-lime) !important;
    font-size: 20px;
    text-decoration: none !important;
}

body:has(.dg-home) {
    background: #fff;
}

/* ===== Site header (base, all pages) ===== */
.mainheader {
    position: relative;
    width: 100%;
    background: var(--dg-green);
    font-family: var(--dg-font);
}

#header-area {
    position: relative;
}

.navbar-blue.dg-navbar {
    height: auto;
    background: var(--dg-green);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    box-shadow: 0 6px 22px rgba(4, 56, 47, .18);
}

.dg-navbar {
    padding: 0;
}

.dg-nav-container {
    display: flex;
    align-items: center;
    min-height: 76px;
}

.dg-brand {
    display: inline-flex;
    align-items: center;
    width: auto;
    padding: 0;
}

.dg-brand img {
    width: 196px;
    max-width: 100%;
    height: auto;
}

.dg-nav-collapse {
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.dg-main-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 0 auto;
}

.dg-main-menu .nav-item {
    padding-left: 0;
    font-size: 15px;
}

.dg-navbar .navbar-nav .nav-link,
.dg-navbar .nav-item .nav-link {
    color: #fff !important;
    padding: 10px 0;
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
    transition: color .2s ease, opacity .2s ease;
}

.dg-navbar .navbar-nav .nav-link:hover,
.dg-navbar .nav-item .nav-link:hover {
    color: var(--dg-lime) !important;
    background: transparent;
    border-radius: 0;
}

.dg-nav-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.dg-nav-search {
    position: relative;
    display: flex;
    align-items: center;
    width: min(360px, 28vw);
    height: 46px;
    padding: 4px;
    border: 1px solid rgba(255, 255, 255, .36);
    border-radius: 999px;
    background: rgba(255, 255, 255, .11);
    backdrop-filter: blur(10px);
}

.dg-nav-search input {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding: 0 18px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    background: transparent;
    border: 0;
    outline: 0;
}

.dg-nav-search input::placeholder {
    color: rgba(255, 255, 255, .78);
}

.dg-nav-search button {
    width: 56px;
    height: 38px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    border: 0;
    border-radius: 999px;
    background: var(--dg-red);
    cursor: pointer;
}

.dg-account-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    color: #fff;
    font-weight: 900;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 999px;
    background: rgba(255, 255, 255, .1);
    transition: background .2s ease, color .2s ease;
}

.dg-account-link:hover {
    color: var(--dg-ink);
    background: var(--dg-lime);
}

.header-shape {
    display: none;
}

.footer_main {
    margin-top: 0;
}

/* ===== Homepage header overlay variant ===== */
body:has(.dg-home) .mainheader {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
    background: transparent;
}

body:has(.dg-home) #header-area {
    position: absolute;
    width: 100%;
}

body:has(.dg-home) .navbar-blue.dg-navbar {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    box-shadow: none;
}

body:has(.dg-home) .dg-nav-container {
    min-height: 86px;
}

body:has(.dg-home) .dg-brand img {
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .22));
}

.dg-site-footer {
    position: relative;
    padding: 72px 0 28px;
    color: rgba(255, 255, 255, .72);
    font-family: var(--dg-font);
    background:
        linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px),
        linear-gradient(135deg, #04382f, #082d2f);
    background-size: 150px 150px, 150px 150px, auto;
}

.dg-footer-top {
    display: grid;
    grid-template-columns: minmax(240px, 1.4fr) minmax(140px, .7fr) minmax(140px, .7fr) minmax(280px, 1fr);
    gap: 42px;
    padding-bottom: 44px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.dg-footer-brand img {
    width: 188px;
    height: auto;
    margin-bottom: 20px;
}

.dg-footer-brand p,
.dg-footer-cta p {
    max-width: 360px;
    color: rgba(255, 255, 255, .66);
    font-size: 16px;
    line-height: 1.75;
}

.dg-footer-col h3,
.dg-footer-cta h3 {
    margin: 0 0 18px;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
}

.dg-footer-col a {
    display: block;
    width: fit-content;
    margin-bottom: 12px;
    color: rgba(255, 255, 255, .68);
    font-size: 15px;
    font-weight: 800;
}

.dg-footer-col a:hover,
.dg-footer-bottom a:hover {
    color: var(--dg-lime);
}

.dg-footer-cta form {
    display: flex;
    height: 50px;
    padding: 5px;
    margin-bottom: 18px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
}

.dg-footer-cta input {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding: 0 16px;
    color: #fff;
    background: transparent;
    border: 0;
    outline: 0;
}

.dg-footer-cta input::placeholder {
    color: rgba(255, 255, 255, .58);
}

.dg-footer-cta button {
    height: 40px;
    padding: 0 18px;
    color: var(--dg-ink);
    font-weight: 900;
    border: 0;
    border-radius: 999px;
    background: var(--dg-lime);
}

.dg-footer-cta img {
    width: 110px;
    height: auto;
    padding: 6px 10px;
    background: #fff;
    border-radius: 8px;
}

.dg-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 24px;
}

.dg-footer-bottom p {
    margin: 0;
    color: rgba(255, 255, 255, .62);
    font-size: 14px;
}

.dg-footer-bottom div {
    display: flex;
    gap: 18px;
}

.dg-footer-bottom a {
    color: rgba(255, 255, 255, .7);
    font-size: 14px;
    font-weight: 800;
}

@media (max-width: 1199px) {
    .dg-hero-inner,
    .dg-split {
        grid-template-columns: 1fr;
    }

    .dg-hero-visual {
        min-height: 420px;
    }

    .dg-device {
        margin: 0 auto;
    }

    .dg-nav-search {
        width: 260px;
    }

    .dg-main-menu {
        gap: 13px;
    }

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

@media (max-width: 991px) {
    .dg-hero {
        min-height: auto;
        padding-top: 120px;
    }

    .dg-exam-grid,
    .dg-format-grid,
    .dg-proof-grid,
    .dg-vendor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dg-trust-strip,
    .dg-demo-panel {
        align-items: flex-start;
        flex-direction: column;
    }

    .dg-nav-actions {
        gap: 10px;
    }

    .dg-nav-search {
        width: 210px;
    }

    .dg-account-link {
        padding: 0 14px;
    }
}

@media (max-width: 767px) {
    .dg-hero {
        padding: 118px 0 54px;
    }

    .dg-hero-search {
        flex-direction: column;
        padding: 10px;
        border-radius: 8px;
    }

    .dg-hero-search input {
        width: 100%;
    }

    .dg-hero-search button {
        width: 100%;
    }

    .dg-hero-stats,
    .dg-exam-grid,
    .dg-format-grid,
    .dg-proof-grid,
    .dg-vendor-grid {
        grid-template-columns: 1fr;
    }

    .dg-hero-visual {
        min-height: auto;
    }

    .dg-orbit-card {
        position: static;
        margin-bottom: 12px;
    }

    .dg-device {
        padding: 18px;
    }

    .dg-device-body {
        grid-template-columns: 1fr;
    }

    .dg-section {
        padding: 58px 0;
    }

    .dg-exam-card {
        grid-template-columns: 1fr;
    }

    .dg-card-link {
        position: static;
    }

    .navbar-collapse {
        background: var(--dg-deep);
    }

    .navbar-blue,
    .dg-nav-container {
        min-height: 74px;
        height: auto;
    }

    .dg-brand {
        width: auto;
    }

    .dg-brand img {
        width: 158px;
    }

    .dg-nav-toggle {
        margin-right: 0;
        border-color: rgba(255, 255, 255, .38) !important;
        background: rgba(255, 255, 255, .1);
    }

    .dg-nav-collapse {
        position: absolute;
        z-index: 30;
        top: 72px;
        left: 12px;
        right: 12px;
        display: none;
        padding: 18px;
        background: #04382f;
        border: 1px solid rgba(255, 255, 255, .14);
        border-radius: 8px;
        box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
    }

    .dg-nav-collapse.show {
        display: block;
    }

    .dg-main-menu {
        display: grid;
        gap: 4px;
        margin: 0 0 14px;
    }

    .dg-main-menu .nav-link {
        padding: 12px 4px;
        border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .dg-nav-actions {
        display: grid;
        gap: 12px;
    }

    .dg-nav-search {
        width: 100%;
    }

    .dg-account-link {
        width: 100%;
    }

    .dg-footer-top,
    .dg-footer-bottom {
        grid-template-columns: 1fr;
    }

    .dg-footer-top {
        gap: 28px;
    }

    .dg-footer-bottom {
        display: grid;
        align-items: start;
    }
}

@media (max-width: 575px) {
    .dg-hero-actions,
    .dg-btn {
        width: 100%;
    }

/* =====================================================================
   PRODUCT / ADD-TO-CART PAGE MODERNIZATION (showproducts.php)
   Replaces the legacy un-themed product page with a polished shopping
   experience that matches the dg3/v3 look.
   Layout: layouts/exam_product.php → Modules/Pages/Views/showproducts.php
   ===================================================================== */

/* ---- Sidebar pricing card ---- */
.author-card.sidebar-card {
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 20px;
    padding: 26px 24px;
    box-shadow: 0 24px 54px -30px rgba(6, 75, 63, .32);
    margin-bottom: 24px;
    max-width: 100%;
}
.author-infos .ep-side-pack-heading {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dg-green);
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 16px;
}
.author-infos .header {
    font-size: 42px;
    font-weight: 900;
    color: var(--dg-ink);
    line-height: 1;
    margin: 14px 0 4px;
    display: flex;
    align-items: baseline;
    gap: 2px;
}
.author-infos .header span { font-size: 22px; font-weight: 800; color: var(--dg-green); }
.author-infos .header sup { font-size: 18px; font-weight: 700; color: var(--dg-muted); top: -12px; }
.author-infos .cross-price {
    font-size: 18px;
    color: var(--dg-muted);
    text-decoration: line-through;
    margin-bottom: 20px;
}
.author-infos .cross-price span { color: var(--dg-muted); }
.author-infos strong { display: block; font-size: 14px; font-weight: 800; color: var(--dg-ink); margin-bottom: 8px; }
.author-infos select#subscription_bundle,
.author-infos select.custom-dropdown3__select {
    width: 100%;
    height: 50px;
    padding: 0 16px;
    font-family: var(--dg-font);
    font-size: 15px;
    font-weight: 600;
    color: var(--dg-ink);
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 12px;
    outline: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064b3f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 18px;
}
.author-infos select#subscription_bundle:focus {
    border-color: var(--dg-green);
    box-shadow: 0 0 0 3px rgba(6, 75, 63, .12);
}
.statement_info_card {
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 12px;
}
.statement_info_card .info p {
    margin: 0 0 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--dg-muted);
}
.statement_info_card .info p:last-child { margin-bottom: 0; }
.margbtn { margin-bottom: 18px; }

/* ---- Product option cards (Desktop / Web / PDF) ---- */
.bundle-pack-offers.author-info {
    background: #fff !important;
    border: 1px solid var(--dg-line) !important;
    border-radius: 16px !important;
    padding: 20px 18px !important;
    text-align: center;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    cursor: pointer;
    box-shadow: 0 12px 30px -24px rgba(6, 75, 63, .25);
}
.bundle-pack-offers.author-info:hover {
    transform: translateY(-3px);
    border-color: var(--dg-green) !important;
    box-shadow: 0 20px 44px -24px rgba(6, 75, 63, .35);
}
.bundle-pack-offers.author-info p {
    margin: 0 0 6px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--dg-muted) !important;
}
.bundle-pack-offers.author-info > strong {
    font-size: 17px !important;
    font-weight: 900 !important;
    color: var(--dg-green) !important;
    display: block;
    line-height: 1.2;
}
.onbundle-sec-price {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--dg-muted);
    margin-top: 4px;
}
.onbundle-sec-price span { font-size: 13px; color: var(--dg-muted); }

/* ---- Section titles ---- */
.shortcode_module_title { margin-bottom: 4px; }
.dashboard__title { color: var(--dg-ink); }
.dashboard__title h1, .dashboard__title h2 { color: var(--dg-green) !important; font-weight: 900; font-size: clamp(20px, 2.6vw, 26px); margin: 0 0 8px; line-height: 1.2; }
.dashboard__title p { color: var(--dg-muted); font-size: 15px; line-height: 1.7; margin: 0; }

/* ---- Author module image ---- */
.author_module { margin: 12px 0; }
.author_module img { border-radius: 16px !important; box-shadow: 0 18px 40px -24px rgba(6, 75, 63, .32); }

/* ---- CMS content inside product page ---- */
.shortcode_module_title p, .dashboard__title p { color: var(--dg-muted); }
.ep-side-pack-content { font-size: 14px; line-height: 1.7; color: var(--dg-ink); }

/* ---- Product description accordion/content section ---- */
.author-profile-area .pricing_container {
    max-width: 1100px;
}
.author-profile-area .row:has(.sidebar_author) {
    display: flex;
    flex-wrap: wrap;
}
.author-profile-area [class*="col-"] { padding-right: 12px; padding-left: 12px; }

/* ---- Mobile: stack sidebar below content ---- */
@media (max-width: 1199px) {
    .sidebar_author { max-width: 460px; margin: 24px auto 0; }
}
@media (max-width: 767px) {
    .author-card.sidebar-card { padding: 20px 16px; }
    .bundle-pack-offers.author-info { padding: 14px !important; }
    .author-infos .header { font-size: 34px; }
}

/* ---- Checkout / CART page (cart-view.php) ---- */
/* The cart page has its own cart.css but lacks the theme header/footer.
   We make the standalone page match the theme feel. */
body:has(.content_checkout) {
    background: var(--dg-soft) !important;
}
.bundle-pack-offers.mcolorbg4,
.bundle-pack-offers.pcolorbg,
.bundle-pack-offers.scolorbg {
    background: #fff !important;
    border: 1px solid var(--dg-line) !important;
    box-shadow: 0 12px 30px -24px rgba(6, 75, 63, .25);
}

    .dg-trust-strip,
    .dg-demo-panel {
        padding: 24px;
    }

    .dg-section-head {
        text-align: left;
    }
}

/* ===== Interior pages: shared chrome ===== */
/* Legacy body had a red dotted radial-gradient texture; clean it up sitewide */
body {
    background-color: #fff;
    background-image: none;
}

/* =====================================================================
   UNIFIED BREADCRUMBS — one beautiful, mobile-friendly design sitewide.
   Earlier the app shipped four different looks (a solid green bar, a soft
   band, a rounded card, and an unstyled list with Font-Awesome chevrons).
   This normalises every variant the controllers emit
   (ul/ol.breadcrumb, ul/ol.BreadCrumbList, Bootstrap-5 .breadcrumb-item)
   and all three separator styles (inline fa-chevron, BS5 "/", legacy "/").
   The look lives on the LIST element, so it is identical no matter which
   wrapper holds it. ===================================================== */

/* Neutralise the old full-width tint bands. These wrappers hold only a
   breadcrumb, so killing their band leaves just the self-contained pill.
   (.breadcrumbs is deliberately NOT reset — mega_packs reuses that class
   for content sections; .breadcrumb_background keeps its container padding.) */
.breadcrumb-wrap,
.breadback {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.breadcrumb_background {
    background: transparent !important;
    border: 0 !important;
}

/* The pill */
ul.breadcrumb,
ol.breadcrumb,
ul.BreadCrumbList,
ol.BreadCrumbList {
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 0;
    float: none !important;
    width: auto !important;
    max-width: 100%;
    margin: 20px 0 22px !important;
    padding: 9px 18px !important;
    list-style: none !important;
    background: linear-gradient(180deg, #f2f8f4, var(--dg-soft)) !important;
    border: 1px solid var(--dg-line) !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 2px rgba(18, 47, 53, .05) !important;
    font-family: var(--dg-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    vertical-align: middle;
}

/* Crumbs */
ul.breadcrumb > li,
ol.breadcrumb > li,
ul.BreadCrumbList > li,
ol.BreadCrumbList > li {
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--dg-muted) !important;
    background: none !important;
}

/* Links — high specificity to beat legacy ".breadcrumb>li a{color:#fff!important}" */
ul.breadcrumb li a,
ol.breadcrumb li a,
ul.BreadCrumbList li a,
ol.BreadCrumbList li a {
    color: var(--dg-green) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: color .15s ease;
}

ul.breadcrumb li a:hover,
ol.breadcrumb li a:hover,
ul.BreadCrumbList li a:hover,
ol.BreadCrumbList li a:hover {
    color: var(--dg-deep) !important;
    text-decoration: underline !important;
}

/* Current page — explicit .active, BS5 .active, or simply the final crumb */
.breadcrumb > li.active,
.breadcrumb > li:last-child,
.BreadCrumbList > li.active,
.BreadCrumbList > li:last-child {
    color: var(--dg-ink) !important;
    font-weight: 700 !important;
}

/* A little home glyph on the first crumb */
.breadcrumb > li:first-child > a::before,
.BreadCrumbList > li:first-child > a::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 7px;
    vertical-align: -2px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064b3f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V21h14V9.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* One separator everywhere: hide every inline / Font-Awesome chevron … */
.breadcrumb i,
.BreadCrumbList i {
    display: none !important;
}

/* … then draw a single crisp chevron between crumbs (also overrides the
   Bootstrap-5 "/" via !important content, regardless of source order). */
.breadcrumb > li + li::before,
.BreadCrumbList > li + li::before,
.breadcrumb-item + .breadcrumb-item::before {
    content: "" !important;
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 11px !important;
    padding: 0 !important;
    border-top: 2px solid #9bb0ab;
    border-right: 2px solid #9bb0ab;
    border-radius: 1px;
    transform: rotate(45deg);
    float: none !important;
}

/* Mobile: tighter, and a rounded card (not a stadium) so wrapped lines read well */
@media (max-width: 575.98px) {
    ul.breadcrumb,
    ol.breadcrumb,
    ul.BreadCrumbList,
    ol.BreadCrumbList {
        margin: 14px 0 16px !important;
        padding: 8px 13px !important;
        font-size: 12.5px !important;
        border-radius: 14px !important;
    }

    .breadcrumb > li + li::before,
    .BreadCrumbList > li + li::before,
    .breadcrumb-item + .breadcrumb-item::before {
        margin: 0 8px !important;
    }

    .breadcrumb > li:first-child > a::before,
    .BreadCrumbList > li:first-child > a::before {
        width: 13px;
        height: 13px;
        margin-right: 5px;
    }
}

/* Interior page H1 adopts the theme font/ink */
.main-ttl,
.main-ttl span {
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-weight: 900;
}

/* ===== Contact page ===== */
.contact-page {
    float: none !important;
    max-width: 660px;
    margin: 44px auto 64px !important;
    padding: 38px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(18, 47, 53, .09);
    font-family: var(--dg-font);
}

.contact-page .headline h1 {
    margin: 0 0 8px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 32px;
    font-weight: 900;
}

.contact-page .headline h1 span {
    color: var(--dg-red);
}

.contact-page .quot-line {
    margin: 0 0 22px;
    padding: 12px 16px;
    color: var(--dg-muted);
    font-size: 14px;
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-left: 3px solid var(--dg-green);
    border-radius: 8px;
}

.contact-page .quot-line a {
    color: var(--dg-green);
    font-weight: 800;
}

.contact-page .form-group {
    margin-bottom: 14px;
}

.contact-page .form-control {
    width: 100%;
    height: 52px;
    padding: 0 16px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 15px;
    background: #fff !important;
    border: 1px solid var(--dg-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.contact-page textarea.form-control {
    height: auto;
    padding: 14px 16px;
}

.contact-page .form-control:focus {
    border-color: var(--dg-green) !important;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(6, 75, 63, .12) !important;
}

.contact-page .contact-btn-submit {
    min-width: 160px;
    padding: 13px 32px;
    color: #fff !important;
    font-family: var(--dg-font);
    font-weight: 900;
    background: var(--dg-green) !important;
    border: 0 !important;
    border-radius: 999px !important;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

.contact-page .contact-btn-submit:hover {
    background: var(--dg-deep) !important;
    transform: translateY(-2px);
}

.contact-page .error {
    color: var(--dg-muted);
    font-size: 13px;
}

.contact-page .alert {
    border-radius: 10px;
}

/* Breadcrumb container variants (.breadback / .breadcrumb_background) are now
   handled by the UNIFIED BREADCRUMBS block above. .breadcrumbs is left alone
   on purpose because mega_packs reuses it for non-breadcrumb content. */

/* ===== Brand the legacy Bootstrap action buttons (interior pages only) ===== */
/* Header/footer use .dg-* classes, so these target page-body buttons. */
.btn-primary,
.btn-primary:focus,
.btn-success,
.btn-success:focus {
    color: #fff !important;
    background-color: var(--dg-green) !important;
    border-color: var(--dg-green) !important;
    box-shadow: none !important;
}

.btn-primary:hover,
.btn-success:hover {
    background-color: var(--dg-deep) !important;
    border-color: var(--dg-deep) !important;
}

.btn-warning,
.btn-warning:focus {
    color: var(--dg-ink) !important;
    background-color: var(--dg-lime) !important;
    border-color: var(--dg-lime) !important;
    box-shadow: none !important;
}

.btn-warning:hover {
    color: var(--dg-ink) !important;
    background-color: #c3cc14 !important;
    border-color: #c3cc14 !important;
}

.btn-info,
.btn-info:focus {
    color: #fff !important;
    background-color: var(--dg-ink) !important;
    border-color: var(--dg-ink) !important;
    box-shadow: none !important;
}

.btn-info:hover {
    background-color: #0b2025 !important;
    border-color: #0b2025 !important;
}

/* =====================================================================
   MODERN INTERIOR CONTENT (exam / pdf / free-questions / product pages)
   Rebuilds the old 2010-style yellow/red boxes into clean modern cards.
   ===================================================================== */

/* Give exam/pdf pages breathing room and a consistent type scale */
.wrapper .container > .row {
    margin-top: 26px;
    margin-bottom: 40px;
}

/* ol.breadcrumb is styled by the UNIFIED BREADCRUMBS block above. */

/* "Free Questions ..." box — was a yellow panel */
.head-sec-main {
    margin: 0 0 24px !important;
    padding: 32px 34px !important;
    background: #fff !important;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .07);
}

.head-sec-main h1 {
    margin: 0 0 20px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: clamp(24px, 3vw, 34px);
    font-weight: 900;
    line-height: 1.15;
}

.head-sec-main p {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 0 0 13px;
    color: var(--dg-ink);
    font-size: 16px;
    line-height: 1.55;
}

.head-sec-main p:last-child {
    margin-bottom: 0;
}

.head-sec-main .yes_img_exam {
    flex: 0 0 auto;
    margin-top: 3px;
}

/* "Free PDF Files ..." box — was a solid red panel */
.head-ter-main-content {
    margin: 0 0 24px !important;
    padding: 30px 34px !important;
    color: var(--dg-ink) !important;
    background: var(--dg-soft) !important;
    border: 1px solid var(--dg-line);
    border-left: 4px solid var(--dg-green);
    border-radius: 18px;
}

.head-ter-main-content h2 {
    margin: 0 0 12px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(22px, 2.6vw, 28px);
    font-weight: 900;
}

.head-ter-main-content p {
    margin: 0;
    color: var(--dg-muted) !important;
    font-size: 16px;
    line-height: 1.75;
}

/* Available PDF files table */
.divtable {
    margin: 0 0 26px;
    padding: 6px 8px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .06);
    overflow: hidden;
}

.divtable table {
    width: 100%;
    margin: 0;
    font-family: var(--dg-font);
}

.divtable thead th {
    padding: 15px 16px !important;
    color: var(--dg-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: .04em;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid var(--dg-line) !important;
}

.divtable thead th h3 {
    margin: 0;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: var(--dg-muted) !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.divtable tbody td {
    padding: 16px !important;
    color: var(--dg-ink);
    font-size: 15px;
    vertical-align: middle;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--dg-line) !important;
}

.divtable tbody tr:hover td {
    background: var(--dg-soft) !important;
}

.divtable a {
    color: var(--dg-green) !important;
    font-weight: 700;
}

/* Comments / Add Comment */
.upcomment {
    margin: 0 0 26px;
    padding: 30px 34px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .06);
}

.comment_headings {
    display: block;
    margin: 0 0 20px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 22px;
    font-weight: 900;
}

.upcomment .form-group {
    display: block;
    margin-bottom: 16px;
}

.upcomment .control-label,
.upcomment label {
    display: block;
    margin-bottom: 7px;
    padding: 0;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    width: auto;
}

.upcomment .col-sm-6,
.upcomment .col-sm-8 {
    width: 100%;
    max-width: 560px;
    padding: 0;
}

.upcomment .form-control {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 15px;
    background: #fff !important;
    border: 1px solid var(--dg-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.upcomment textarea.form-control {
    height: auto;
    min-height: 120px;
    padding: 12px 16px;
}

.upcomment .form-control:focus {
    border-color: var(--dg-green) !important;
    box-shadow: 0 0 0 3px rgba(6, 75, 63, .12) !important;
}

.upcomment .red,
.red {
    color: var(--dg-red);
}

/* "Get a Perfect Exam Score ..." tips box — was a yellow well */
.well_exam_page_fst {
    margin: 6px 0 28px;
    padding: 30px 34px !important;
    background: #fff !important;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .06);
    overflow: hidden;
}

.well_exam_page_fst h2 {
    margin: 0 0 16px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 900;
    line-height: 1.2;
}

.well_exam_page_fst p {
    color: var(--dg-muted) !important;
    font-size: 16px;
    line-height: 1.8;
}

.well_exam_page_fst img {
    margin: 0 24px 12px 0;
    border-radius: 12px;
}

/* Right-hand promo / simulator card */
.dialog-right {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .08);
}

.dialog-right img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 18px;
}

/* =====================================================================
   GLOBAL LEGACY COMPONENT MODERNIZATION (public pages)
   Modernizes Bootstrap-era forms, panels, wells, modals & alerts so
   login/register/exam-detail/demos and dialogs all look current.
   ===================================================================== */

/* Form fields */
.form-control,
input.form-control,
select.form-control,
textarea.form-control {
    height: 48px;
    padding: 0 16px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 15px;
    background-color: #fff;
    background-image: none;
    border: 1px solid var(--dg-line);
    border-radius: 10px;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}

textarea.form-control {
    height: auto;
    min-height: 120px;
    padding: 12px 16px;
    line-height: 1.6;
}

select.form-control {
    cursor: pointer;
}

.form-control:focus {
    border-color: var(--dg-green);
    box-shadow: 0 0 0 3px rgba(6, 75, 63, .12);
    outline: 0;
}

.form-control::placeholder {
    color: #9aa7a9;
}

/* Stop the browser autofill yellow background clashing with the theme */
.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus,
input:-webkit-autofill {
    -webkit-text-fill-color: var(--dg-ink);
    -webkit-box-shadow: 0 0 0 1000px #fff inset;
    box-shadow: 0 0 0 1000px #fff inset;
    caret-color: var(--dg-ink);
}

label,
.control-label {
    font-family: var(--dg-font);
    font-weight: 700;
    color: var(--dg-ink);
}

/* Panels -> cards */
.panel,
.panel-default {
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 16px;
    box-shadow: 0 14px 40px rgba(18, 47, 53, .06);
    overflow: hidden;
}

.panel-heading {
    padding: 18px 22px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-weight: 800;
    background: var(--dg-soft);
    border-bottom: 1px solid var(--dg-line);
}

.panel-title {
    color: var(--dg-ink);
    font-weight: 800;
}

.panel-body {
    padding: 22px;
}

.panel-footer {
    padding: 16px 22px;
    background: var(--dg-soft);
    border-top: 1px solid var(--dg-line);
}

/* Wells -> soft cards */
.well {
    padding: 24px;
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-radius: 14px;
    box-shadow: none;
}

/* Modals */
.modal-content {
    border: 0;
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .3);
    overflow: hidden;
    font-family: var(--dg-font);
}

.modal-header {
    padding: 18px 22px;
    border-bottom: 1px solid var(--dg-line);
}

.modal-body {
    padding: 22px;
}

.modal-footer {
    padding: 16px 22px;
    border-top: 1px solid var(--dg-line);
}

.modal-title,
.modal-content h4,
.modal-content h5 {
    font-family: var(--dg-font);
    color: var(--dg-ink);
}

/* Alerts */
.alert {
    border-radius: 12px;
    border: 1px solid transparent;
    font-family: var(--dg-font);
}

.alert-success {
    color: #0f5132;
    background: #e7f5ee;
    border-color: #b7e0c8;
}

.alert-danger {
    color: #842029;
    background: #fdeceb;
    border-color: #f5c6c3;
}

/* =====================================================================
   VENDOR DETAIL PAGE (e.g. /microsoft) — exam list + simulator sidebar
   ===================================================================== */
.search_row_container {
    max-width: 900px;
    margin: 26px auto 8px;
    text-align: center;
}

.search_row_container h1 {
    margin: 0 0 14px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(26px, 3.4vw, 40px);
    font-weight: 900;
    line-height: 1.15;
}

.search_row_container h1 span {
    color: var(--dg-red);
}

.search_row_container p {
    margin: 0 auto;
    color: var(--dg-muted);
    font-size: 16px;
    line-height: 1.8;
}

.vendor_exam_sec .nav-tabs {
    margin-bottom: 18px;
    padding: 0;
    border: 0;
    border-bottom: 2px solid var(--dg-line);
}

.vendor_exam_sec .nav-tabs > li,
.vendor_exam_sec .nav-tabs > li.active {
    border: 0;
    background: transparent;
    list-style: none;
}

.vendor_exam_heading {
    margin: 0 0 6px;
    padding-bottom: 12px;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: 24px;
    font-weight: 900;
}

.vendor_exam_heading span {
    color: var(--dg-green);
}

/* Each exam becomes a clean card row */
.activeexamdiv > .row {
    align-items: center;
    margin: 0 0 12px;
    padding: 12px 10px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(18, 47, 53, .05);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.activeexamdiv > .row:hover {
    transform: translateY(-2px);
    border-color: #cfe0d8;
    box-shadow: 0 16px 38px rgba(18, 47, 53, .1);
}

.activeexamdiv .inneryellow a {
    color: var(--dg-green) !important;
    font-weight: 900 !important;
}

.activeexamdiv .middleside p,
.activeexamdiv .ndinnercolm p {
    color: var(--dg-muted) !important;
}

/* Premium exam simulator sidebar — was a flat red box */
.vendorPageBundleArea {
    padding: 26px 22px;
    background: linear-gradient(135deg, var(--dg-green), var(--dg-deep)) !important;
    border-radius: 20px;
    box-shadow: 0 20px 54px rgba(4, 56, 47, .28);
}

.vendorPageBundleArea h3 {
    font-family: var(--dg-font);
}

.vendorPageBundleArea .select--field,
.vendorPageBundleArea .text_field,
.vendorPageBundleArea .form-control {
    height: 46px;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, .25) !important;
}

.vendorPageBundleArea .prdct-btn,
.vendorPageBundleArea .check-btn {
    width: 100%;
    padding: 13px 20px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-weight: 900;
    background: var(--dg-lime) !important;
    border: 0 !important;
    border-radius: 999px !important;
}

.vendorPageBundleArea .prdct-btn:hover,
.vendorPageBundleArea .check-btn:hover {
    background: #c3cc14 !important;
}

.paymentarea {
    margin-top: 18px;
    padding: 16px;
    text-align: center;
    color: var(--dg-muted);
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 14px;
}

/* ============================================================
   FREE / PDF DETAIL PAGE  (/free/<slug>) — modern reskin
   ============================================================ */

/* Drop the legacy red wave shape behind the banner */
.pdf-detail-banner-header-shape { display: none !important; }
.dialog,
.dialog-main { background: transparent !important; box-shadow: none !important; }

/* Hero banner card */
.ebook-main {
    position: relative;
    display: flex;
    gap: 30px;
    align-items: center;
    margin: 24px 0 0;
    padding: 30px 34px;
    background: linear-gradient(135deg, var(--dg-green) 0%, var(--dg-deep) 100%);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(4, 56, 47, .22);
    overflow: hidden;
}
.ebook-main::after {
    content: "";
    position: absolute;
    right: -90px; top: -90px;
    width: 280px; height: 280px;
    background: radial-gradient(circle, rgba(215, 223, 24, .20), transparent 70%);
    pointer-events: none;
}

.ebook-left { position: relative; z-index: 1; flex: 0 0 auto; }
.pdf-detail-img-div { padding: 0; background: transparent; }
.pdf-detail-img-div img {
    width: 150px;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .28);
}

.ebook-right { position: relative; z-index: 1; flex: 1 1 auto; min-width: 0; }

.ebook-title {
    margin: 0 0 6px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 900;
    line-height: 1.2;
}
.ebook-main .ebook-title { color: #fff !important; }

/* Stat cards — replace the red/blue/purple boxes with a unified glass look */
.ebook-right-offers { margin-top: 18px !important; }
.bundle-pack-offers.author-info,
.bundle-pack-offers.author-info.mcolorbg4,
.bundle-pack-offers.author-info.pcolorbg,
.bundle-pack-offers.author-info.scolorbg {
    padding: 14px 16px !important;
    text-align: left !important;
    color: #fff !important;
    background: rgba(255, 255, 255, .10) !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}
.bundle-pack-offers.author-info p {
    margin: 0 0 4px !important;
    color: rgba(255, 255, 255, .66) !important;
    font-size: 12px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.bundle-pack-offers.author-info strong {
    display: block;
    margin-top: 0 !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.2;
}

/* Intro copy above the comparison table */
.pdf-page-table-content-heading {
    margin: 0 0 18px;
    color: var(--dg-ink);
    font-size: 16px;
    line-height: 1.75;
}
.pdf-page-table-content-heading h1,
.pdf-page-table-content-heading h2,
.pdf-page-table-content-heading h3 {
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-weight: 900;
}
.pdf-page-table-content-heading h2 span,
.pdf-page-table-content-heading .heading span { color: var(--dg-green) !important; }

/* Comparison table */
.exam-info-box { margin-top: 34px !important; }
.exam-info-box .table-responsive {
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(18, 47, 53, .06);
    overflow: hidden;
}
.exam-info-box table {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    font-family: var(--dg-font);
    background: transparent !important;
}

/* Column headers — strip clip-path shapes, use solid themed bands */
.exam-info-box thead th {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
.exam-info-box .table-header,
.exam-info-box .table-header-red {
    -webkit-clip-path: none !important;
    clip-path: none !important;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 100%;
    min-height: 66px;
    margin: 0 !important;
    padding: 16px 18px !important;
    color: #fff !important;
    font-family: var(--dg-font);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
}
.exam-info-box .table-header { background: var(--dg-ink) !important; }
.exam-info-box thead th:first-child .table-header { background: var(--dg-green) !important; }
.exam-info-box .table-header-red { background: var(--dg-lime) !important; color: var(--dg-deep) !important; }

/* Highlight the official (premium) column */
.exam-info-box tbody td:last-child { background: var(--dg-soft) !important; }

.exam-info-box .table-cell {
    padding: 15px 18px !important;
    color: var(--dg-ink) !important;
    font-size: 14.5px;
    line-height: 1.5;
    vertical-align: middle !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--dg-line) !important;
}
.exam-info-box tbody tr:first-child .table-cell { border-top: 0 !important; }
.exam-info-box .table-cell strong { color: var(--dg-ink); font-weight: 800; }

/* Inline SVG icons (replace emojis) */
.dgi { vertical-align: -3px; flex-shrink: 0; }
.dgi-yes { color: var(--dg-green); }
.dgi-no { color: var(--dg-red); }
.dgi-warn { color: #e0a106; }
.dgi-hot { color: #ea6a16; }
.dgi-file { color: var(--dg-muted); }
.dgi-badge { color: var(--dg-deep); }
.premium-icon { display: inline-flex; vertical-align: middle; }

/* Action buttons */
.ebook-buttons .b_pdfDemo { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-grad,
.btn-grad.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px !important;
    color: var(--dg-deep) !important;
    font-family: var(--dg-font);
    font-size: 14px;
    font-weight: 900 !important;
    text-decoration: none !important;
    background: var(--dg-lime) !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 24px rgba(215, 223, 24, .30);
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease;
}
.btn-grad:hover { transform: translateY(-1px); }
.btn-grad.btn-grad2 {
    color: #fff !important;
    background: var(--dg-green) !important;
    box-shadow: 0 10px 24px rgba(6, 75, 63, .26);
}

/* "Other PDF files" heading */
.pdf-page-other-files h2 {
    margin: 0 0 6px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: 20px;
    font-weight: 900;
}
.pdf-page-other-files h2 span { color: var(--dg-green) !important; }

@media (max-width: 767px) {
    .ebook-main { padding: 22px; flex-direction: column; align-items: flex-start; gap: 18px; }
    .ebook-right-offers .col-6 { margin-bottom: 10px; }
}

/* ============================================================
   STATIC / CMS PROSE PAGES (dmca, privacy, terms, guarantee, about,
   teach-with-us …) — global readable typography
   layout: static_pages.php  ->  .static-pages-content / .static-page / .Content
   ============================================================ */

/* Prose base — readable size, rhythm, left-aligned (was tiny + justified) */
.static-pages-content,
.static-pages-content .static-page,
.mainwhitebg .Content {
    color: var(--dg-ink);
    font-family: var(--dg-font) !important;
    font-size: 16.5px;
    line-height: 1.8;
    text-align: left !important;
}

/* Merge the title card + content card into one clean panel */
.main-pagging-right .bg-white.rounded.box-shadow:has(+ .static-pages-content) {
    margin: 0 !important;
    padding: 30px 38px 0 !important;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-bottom: 0;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: none !important;
}
.static-pages-content {
    margin: 0 0 28px !important;
    padding: 14px 38px 38px !important;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 0 0 18px 18px !important;
    box-shadow: 0 18px 46px rgba(18, 47, 53, .06) !important;
}
.static-pages-content:first-child {
    border-top: 1px solid var(--dg-line);
    border-radius: 18px !important;
}

/* Headings */
.static-pages-content h1,
.static-page h1,
.mainwhitebg .Content h1,
.main-pagging-right .bg-white.rounded:has(+ .static-pages-content) h1 {
    margin: 0 0 16px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(26px, 3.4vw, 34px);
    font-weight: 900;
    line-height: 1.2;
}
.static-pages-content h2,
.static-page h2,
.mainwhitebg .Content h2 {
    margin: 32px 0 14px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: clamp(20px, 2.3vw, 25px);
    font-weight: 800;
    line-height: 1.3;
}
.static-pages-content h3,
.static-page h3,
.mainwhitebg .Content h3 {
    margin: 26px 0 12px;
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
    font-size: 19px;
    font-weight: 800;
}
.static-pages-content h4,
.static-page h4,
.mainwhitebg .Content h4 {
    margin: 22px 0 10px;
    color: var(--dg-ink) !important;
    font-size: 17px;
    font-weight: 800;
}

/* Paragraphs + emphasis */
.static-pages-content p,
.static-page p,
.mainwhitebg .Content p {
    margin: 0 0 18px;
    color: var(--dg-muted) !important;
    font-size: 16.5px;
    line-height: 1.85;
}
.static-pages-content strong,
.static-page strong,
.mainwhitebg .Content strong { color: var(--dg-ink); font-weight: 800; }

/* Links */
.static-pages-content a,
.static-page a,
.mainwhitebg .Content a {
    color: var(--dg-green) !important;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
    word-break: break-word;
}
.static-pages-content a:hover,
.static-page a:hover,
.mainwhitebg .Content a:hover { color: var(--dg-deep) !important; }

/* Lists */
.static-pages-content ul,
.static-pages-content ol,
.static-page ul,
.static-page ol,
.mainwhitebg .Content ul,
.mainwhitebg .Content ol {
    margin: 0 0 18px;
    padding-left: 22px;
    color: var(--dg-muted);
}
.static-pages-content li,
.static-page li,
.mainwhitebg .Content li {
    margin: 0 0 10px;
    font-size: 16.5px;
    line-height: 1.8;
}
.static-pages-content ul li::marker,
.static-page ul li::marker { color: var(--dg-green); }
.static-pages-content ol li::marker,
.static-page ol li::marker { color: var(--dg-green); font-weight: 800; }

/* Privacy page custom headings + red ▣ / ◈ bullet markers -> theme */
.privacypolicy .headings {
    color: var(--dg-ink) !important;
    font-family: var(--dg-font);
}
.privacypolicy .before-icon:before,
.privacypolicy .before-icon-two:before { color: var(--dg-green) !important; }

/* Tables inside prose (rare) */
.static-pages-content table,
.static-page table {
    width: 100%;
    margin: 0 0 20px;
    border-collapse: collapse;
    font-size: 15.5px;
}
.static-pages-content th,
.static-pages-content td,
.static-page th,
.static-page td {
    padding: 12px 14px;
    border: 1px solid var(--dg-line);
    text-align: left;
}
.static-pages-content thead th,
.static-page thead th { background: var(--dg-soft); color: var(--dg-ink); font-weight: 800; }

@media (max-width: 767px) {
    .main-pagging-right .bg-white.rounded.box-shadow:has(+ .static-pages-content) { padding: 22px 20px 0 !important; }
    .static-pages-content { padding: 12px 20px 28px !important; }
}

/* ===================== Modern scrollbar (sitewide) =====================
   Overrides the legacy red (#f04336) scrollbar from style_pdfq.css; this
   sheet loads after it, so these win without touching the minified file. */
html {
    scrollbar-width: thin;
    scrollbar-color: #cdded7 transparent;
}
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background-color: #cdded7;
    border-radius: 999px;
    border: 3px solid transparent;
    background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--dg-green, #064b3f); }

/* ===================== Unify stray red accents into the green theme =====================
   --dg-red (#f04336) was used as a secondary accent in decorative spots that clashed
   with the green identity (Go button, section/heading highlights, sidebar headings,
   the promo box). Recolor those to green/lime. Red stays ONLY for true negative
   semantics — the ✗ comparison marker (.dgi-no) keeps var(--dg-red). */
.dg-section-head span,
.dg-seo-content h2 span,
.dg-trust-strip a,
.contact-page .headline h1 span,
.search_row_container h1 span,
.pdf-detail-sidebar-heading span,
.home-sidebar-heading span {
    color: var(--dg-green) !important;
}
.dg-nav-search button {
    background: var(--dg-lime) !important;
    color: var(--dg-deep, #04382f) !important;
}
.dg-nav-search button:hover { filter: brightness(.94); }

/* Modernize the "Premium Exam Simulator" promo box (certification + vendor pages):
   the legacy red panel + red pills are now an on-theme green card with glass pills. */
.vendorPageBundleArea .vender {
    background: linear-gradient(165deg, var(--dg-green) 0%, var(--dg-deep, #04382f) 100%) !important;
    border-radius: 18px !important;
    padding: 22px 16px !important;
    box-shadow: 0 22px 45px -26px rgba(4, 56, 47, .65);
}
.vendorPageBundleArea .vender h3 { color: #fff !important; letter-spacing: .03em; }
.vendorPageBundleArea .vender > p {
    background: rgba(255, 255, 255, .10) !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    color: #eafff7 !important;
    border-radius: 10px !important;
    padding: 9px 12px !important;
    margin: 7px 10px !important;
    font-weight: 600;
}
.vendorPageBundleArea .vender select,
.vendorPageBundleArea .vender input[type="text"],
.vendorPageBundleArea .vender input[type="email"] {
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, .28) !important;
}
.vendorPageBundleArea .vender button,
.vendorPageBundleArea .vender .btn,
.vendorPageBundleArea .vender .btn-grad,
.vendorPageBundleArea .vender input[type="submit"] {
    background: var(--dg-lime) !important;
    color: var(--dg-deep, #04382f) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
}
.vendorPageBundleArea .guarantee-safe,
.vendorPageBundleArea .vender + div { color: #eafff7; }

/* Demo page support icons (chat / envelope) → on-theme green instead of red */
.single_support .support_img i,
.single_support .support_img a { color: var(--dg-green) !important; }
.single_support .support_img i { transition: transform .2s ease; }
.single_support:hover .support_img i { transform: translateY(-3px); }

/* On-brand "Exam Simulator" side card (replaces the legacy competitor banner image
   surepassexam*.webp on the free-PDF and exam product pages). */
.exam_side_banner_onbtn { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.dg-sim-card {
    display: block; width: 248px; max-width: 100%; margin: auto;
    padding: 22px 18px; border-radius: 16px; text-align: center;
    color: #fff; text-decoration: none;
    background: linear-gradient(165deg, var(--dg-green) 0%, var(--dg-deep, #04382f) 100%);
    box-shadow: 0 22px 45px -26px rgba(4, 56, 47, .6);
}
.dg-sim-eyebrow { display: block; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--dg-lime); }
.dg-sim-card h3 { margin: 6px 0 16px; color: #fff; font-size: 22px; font-weight: 900; line-height: 1.12; }
.dg-sim-visual { width: 86px; height: 86px; margin: 0 auto 18px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--dg-lime); background: rgba(255, 255, 255, .10); border: 1px solid rgba(255, 255, 255, .18); }
.dg-sim-card ul { list-style: none; margin: 0 0 18px; padding: 0; text-align: left; }
.dg-sim-card li { display: flex; gap: 9px; align-items: flex-start; padding: 8px 0; font-size: 13px; font-weight: 600; color: #eafff7; border-bottom: 1px solid rgba(255, 255, 255, .10); }
.dg-sim-card li:last-child { border-bottom: 0; }
.dg-sim-card li svg { flex: 0 0 16px; margin-top: 1px; color: var(--dg-lime); }
.dg-sim-btn { display: block; padding: 12px 16px; border-radius: 999px; background: var(--dg-lime); color: var(--dg-deep, #04382f); font-weight: 800; font-size: 14px; }
.exam_side_banner_onbtn:hover .dg-sim-btn { filter: brightness(.95); }

/* ============================================================================
   SITEWIDE RESPONSIVE + DESIGN POLISH  (2026-06-23)
   Appended last so it wins the cascade over legacy sheets. Covers: font
   consistency, horizontal-scroll safety net, mobile footer/tables, a modern
   burger menu, the off-theme yellow promo box, and PDF product-page polish.
   ========================================================================== */

/* ---- 1. Font consistency -------------------------------------------------- *
   Legacy sheets set Nunito/Roboto on some pages. Force the theme font (Inter,
   imported at the top of this file) on text + form controls + headings. Icon
   fonts (i / .fa / fontello) are deliberately NOT targeted so glyphs survive. */
html, body { font-family: var(--dg-font); }
body, p, a, li, td, th, label, blockquote, figcaption,
h1, h2, h3, h4, h5, h6,
input, select, textarea, button, .btn {
    font-family: var(--dg-font) !important;
}

/* ---- 2. Horizontal-scroll safety net ------------------------------------- *
   `clip` (not `hidden`) prevents a stray wide element from creating a sideways
   scrollbar without establishing a scroll container, so sticky/fixed survive. */
html, body { max-width: 100%; overflow-x: clip; }
img, svg, video, iframe, embed, table { max-width: 100%; }

/* ---- 3. Mobile footer grid ----------------------------------------------- *
   Bare `1fr` == minmax(auto,1fr); the auto floor is min-content, so a long word
   can push the track wider than the screen. minmax(0,1fr) + min-width:0 caps it. */
@media (max-width: 767px) {
    .dg-footer-top { grid-template-columns: minmax(0, 1fr); }
    .dg-footer-top > * { min-width: 0; }
    .dg-footer-brand p, .dg-footer-cta p { max-width: 100%; }
}

/* ---- 4. Mobile tables scroll instead of overflowing ---------------------- */
@media (max-width: 767px) {
    .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .wrapper table.table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---- 5. Modern burger toggle (mobile nav) -------------------------------- *
   Replaces the tiny, near-invisible 12x10 dark bars.webp with a clearly sized
   white hamburger on a soft glass button. Markup: inline SVG in .dg-nav-toggle. */
.dg-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 44px;
    padding: 0;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 11px;
    background: rgba(255, 255, 255, .14);
    transition: background .2s ease, border-color .2s ease;
}
.dg-nav-toggle:hover { background: rgba(255, 255, 255, .24); }
.dg-nav-toggle:focus-visible { outline: 2px solid var(--dg-lime); outline-offset: 2px; }
.dg-nav-toggle svg { width: 26px; height: 26px; display: block; stroke: currentColor; }
.dg-nav-toggle img { display: none; } /* hide any leftover bars.webp */

/* ---- 6. Off-theme yellow promo box → on-brand soft-green callout ---------- */
.premium-promo-home-bottom {
    background: var(--dg-soft) !important;
    border: 1px solid var(--dg-line) !important;
    border-left: 4px solid var(--dg-green) !important;
    color: var(--dg-ink) !important;
    border-radius: 14px !important;
    padding: 18px 22px !important;
    font-weight: 600 !important;
    box-shadow: 0 14px 30px -24px rgba(4, 56, 47, .5);
}
.premium-promo-home-bottom a {
    color: var(--dg-green) !important;
    font-weight: 800 !important;
    text-decoration: underline;
}

/* ---- 7. PDF product page: polish + overflow safety ----------------------- */
.ebook-title,
.pdf-page-other-files h2,
.pdf-page-table-content-heading h1,
.pdf-page-table-content-heading h2,
.pdf-page-table-content-heading h3 {
    color: var(--dg-ink);
    overflow-wrap: anywhere;       /* long hyphen-free codes can't overflow */
}
/* CMS-authored body content (description) — keep media inside the column */
.pdf-page-table-content-heading img,
.exam-info-box img,
.dialog-left img { max-width: 100%; height: auto; border-radius: 12px; }
.pdf-page-table-content-heading table { display: block; width: 100%; overflow-x: auto; }
/* Recolor the four legacy "offer" stat boxes (uploaded/downloads/language/date)
   from clashing maroon/purple/blue into one calm on-theme soft card. */
.ebook-right-offers .bundle-pack-offers.author-info {
    background: var(--dg-soft) !important;
    border: 1px solid var(--dg-line) !important;
    border-radius: 12px !important;
    padding: 12px 10px !important;
    text-align: center;
    color: var(--dg-ink) !important;
}
.ebook-right-offers .bundle-pack-offers.author-info p {
    color: var(--dg-muted) !important;
    font-size: 12px !important;
    margin: 0 0 4px !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.ebook-right-offers .bundle-pack-offers.author-info strong { color: var(--dg-green) !important; }
/* Comparison table (clip-path headers) → flat, readable, on-theme */
.exam-info-box .table-header,
.exam-info-box .table-header-red {
    background: var(--dg-green) !important;
    color: #fff !important;
    clip-path: none !important;
    border-radius: 8px 8px 0 0;
    padding: 12px 14px !important;
    font-weight: 800;
}
.exam-info-box .table-header-red { background: var(--dg-deep, #04382f) !important; }
.exam-info-box table.table td.table-cell { vertical-align: middle; }
.exam-info-box .dgi-yes, .exam-info-box .dgi-hot { color: var(--dg-green); }
.exam-info-box .dgi-no  { color: var(--dg-red); }
.exam-info-box .dgi-warn { color: #d9a300; }
/* "Get Free PDF / Get Premium Files" gradient buttons → on-theme pills */
.b_pdfDemo .btn-grad,
.b_pdfDemo .btn-grad2 {
    background: var(--dg-green) !important;
    color: #fff !important;
    border-radius: 999px !important;
    border: 0 !important;
    font-weight: 800 !important;
    padding: 11px 22px !important;
}
.b_pdfDemo .btn-grad2 { background: var(--dg-lime) !important; color: var(--dg-deep, #04382f) !important; }

/* ---- 8. Comments / generic CMS form controls on PDF + content pages ------ */
.dialog-left input[type="text"],
.dialog-left input[type="email"],
.dialog-left textarea {
    width: 100%;
    max-width: 100%;
    border: 1px solid var(--dg-line);
    border-radius: 10px;
    padding: 11px 14px;
    background: #fff;
    color: var(--dg-ink);
}
.dialog-left input[type="text"]:focus,
.dialog-left input[type="email"]:focus,
.dialog-left textarea:focus { outline: 0; border-color: var(--dg-green); box-shadow: 0 0 0 3px rgba(6, 75, 63, .12); }

/* =====================================================================
   2026 REFRESH — added in this session
   FAQ accordion · Login/Register · PDF & exam page accents · misc.
   Appended last so these rules win over the blocks above.
   ===================================================================== */

/* ---------- Shared page shell tint (less flat white) ---------------- */
.mainwhitebg {
    background:
        radial-gradient(1100px 280px at 100% -40px, rgba(6, 75, 63, .05), transparent 60%),
        radial-gradient(900px 240px at -120px 0, rgba(215, 223, 24, .07), transparent 60%),
        var(--dg-soft) !important;
}

/* =========================== FAQ (accordion) ======================== */
.faqs-tabs h1 {
    margin: 0 0 6px !important;
    color: var(--dg-ink);
    font-family: var(--dg-font);
    font-size: clamp(26px, 3.4vw, 38px);
    font-weight: 900;
    line-height: 1.1;
}
.dg-faq-sub {
    margin: 0 0 22px;
    color: var(--dg-muted);
    font-size: 16px;
}
.dg-faq-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 22px;
}
.dg-faq-cat {
    appearance: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    font-family: var(--dg-font);
    font-size: 13.5px;
    font-weight: 800;
    color: var(--dg-green);
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 999px;
    transition: all .18s ease;
}
.dg-faq-cat:hover { border-color: rgba(6, 75, 63, .4); transform: translateY(-1px); }
.dg-faq-cat.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--dg-green), var(--dg-deep));
    border-color: transparent;
    box-shadow: 0 10px 22px -10px rgba(6, 75, 63, .6);
}
.dg-faq-cat .dg-faq-cat-count {
    min-width: 22px;
    padding: 1px 7px;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
    color: var(--dg-deep);
    background: var(--dg-lime);
    border-radius: 999px;
}
.dg-faq-panel { display: none; }
.dg-faq-panel.is-active { display: block; animation: dgFaqFade .25s ease both; }
@keyframes dgFaqFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.dg-faq-item {
    margin: 0 0 12px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px -20px rgba(18, 47, 53, .45);
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.dg-faq-item.is-open { border-color: rgba(6, 75, 63, .35); box-shadow: 0 18px 40px -24px rgba(6, 75, 63, .5); }
.dg-faq-q {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    margin: 0;
    padding: 18px 20px;
    cursor: pointer;
    text-align: left;
    font-family: var(--dg-font);
    font-size: 16px;
    font-weight: 800;
    color: var(--dg-ink);
    background: transparent;
    border: 0;
}
.dg-faq-q .dg-faq-num {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    font-size: 13px;
    font-weight: 900;
    color: var(--dg-green);
    background: var(--dg-soft);
    border: 1px solid var(--dg-line);
    border-radius: 9px;
}
.dg-faq-q .dg-faq-qtext { flex: 1 1 auto; }
.dg-faq-q .dg-faq-ico {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--dg-green);
    transition: transform .22s ease;
}
.dg-faq-item.is-open .dg-faq-q .dg-faq-num { color: #fff; background: var(--dg-green); border-color: var(--dg-green); }
.dg-faq-item.is-open .dg-faq-q .dg-faq-ico { transform: rotate(180deg); }
.dg-faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
}
.dg-faq-a-inner {
    padding: 0 20px 20px 64px;
    color: var(--dg-muted);
    font-size: 15px;
    line-height: 1.75;
}
.dg-faq-a-inner p { margin: 0 0 10px; }
.dg-faq-a-inner a { color: var(--dg-green); font-weight: 700; }
@media (max-width: 575px) {
    .dg-faq-q { padding: 15px 14px; font-size: 15px; gap: 10px; }
    .dg-faq-a-inner { padding-left: 14px; }
}

/* ====================== LOGIN / REGISTER ============================ */
.registerareaAdj { max-width: 980px; margin: 8px auto 0; }
.registerareaAdj > .row { display: flex; flex-wrap: wrap; align-items: stretch; margin: 0 -12px; }
.registerareaAdj > .row > [class*="col-"] { padding: 0 12px; }

.login-sec, .register-sec {
    position: relative;
    height: 100%;
    margin: 0 !important;
    padding: 34px 30px !important;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 20px;
    box-shadow: 0 24px 60px -34px rgba(6, 75, 63, .45);
    overflow: hidden;
}
.register-sec {
    color: #eafff7;
    background: linear-gradient(150deg, var(--dg-green) 0%, var(--dg-deep) 100%);
    border-color: transparent;
}
.register-sec::after {
    content: "";
    position: absolute;
    right: -70px; top: -70px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(215, 223, 24, .22), transparent 70%);
    pointer-events: none;
}
.login-sec::before {
    content: "";
    position: absolute;
    left: 0; top: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--dg-green), var(--dg-lime));
}
.reg-header { margin: 0 0 22px; position: relative; z-index: 1; }
.reg-header h2 {
    margin: 0;
    font-family: var(--dg-font);
    font-size: 22px;
    font-weight: 900;
    letter-spacing: .01em;
    color: var(--dg-ink);
}
.register-sec .reg-header h2,
.register-sec .reg-header h2.colorBlck { color: #fff !important; }
.reg-header::after {
    content: "";
    display: block;
    width: 46px; height: 4px;
    margin-top: 12px;
    border-radius: 999px;
    background: var(--dg-lime);
}
.reg-page { position: relative; z-index: 1; }
.reg-page .form-control,
.reg-page input.form-control {
    height: 50px;
    margin-bottom: 16px;
    border-radius: 12px !important;
}
.register-sec .reg-page .form-control {
    color: var(--dg-ink);
    background: #fff !important;
    border: 1px solid transparent !important;
}
.register-sec .reg-page .form-control:focus { box-shadow: 0 0 0 3px rgba(215, 223, 24, .4) !important; }

.btn-u, .btn-u.loginbtn, .loginbtn, .sign-in-login-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 130px;
    height: 48px;
    padding: 0 26px !important;
    font-family: var(--dg-font);
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #fff !important;
    background: var(--dg-green) !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: 0 12px 26px -12px rgba(6, 75, 63, .65);
    transition: transform .15s ease, background .15s ease;
}
.btn-u:hover, .loginbtn:hover, .sign-in-login-btn:hover { background: var(--dg-deep) !important; transform: translateY(-1px); }
.register-sec .sign-in-login-btn,
.register-sec .btn-u {
    color: var(--dg-deep) !important;
    background: var(--dg-lime) !important;
    box-shadow: 0 12px 26px -12px rgba(215, 223, 24, .8);
}
.register-sec .sign-in-login-btn:hover { filter: brightness(.95); background: var(--dg-lime) !important; }
.register-sec .text-right { text-align: left !important; }

form#userLoginForm h4 { margin-top: 22px; font-size: 15px !important; color: var(--dg-ink); }
form#userLoginForm h4 a { color: var(--dg-green) !important; font-weight: 800; }
.register-sec p, .login-sec p { font-size: 14px; line-height: 1.6; }
.login-sec p a { color: var(--dg-green); font-weight: 700; }
.register-sec p a { color: var(--dg-lime); font-weight: 700; }
.reg-page .input-error, .reg-page p.error { color: var(--dg-red); font-size: 13px; font-weight: 600; }
.register-sec .reg-page p.error { color: #ffe2de; }

@media (max-width: 767px) {
    .login-sec, .register-sec { padding: 26px 20px !important; }
    .registerareaAdj > .row > [class*="col-"] { margin-bottom: 18px; }
}

/* ================= PDF DETAIL / EXAM PAGE — fresh accents ============ */
/* Banner: layered gradient + faint grid so it reads less flat */
.ebook-main {
    background:
        linear-gradient(135deg, var(--dg-green) 0%, var(--dg-deep) 100%) !important;
}
.ebook-main::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 46px 46px;
    pointer-events: none;
}
.ebook-right-offers .bundle-pack-offers.author-info {
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.ebook-right-offers .bundle-pack-offers.author-info:hover {
    transform: translateY(-3px);
    background: rgba(255, 255, 255, .16) !important;
    border-color: rgba(215, 223, 24, .5) !important;
}

/* Comparison table: spotlight the official/premium column */
.exam-info-box thead th:last-child .table-header-red {
    position: relative;
    box-shadow: 0 -3px 0 0 var(--dg-green) inset;
}
.exam-info-box tbody td:last-child {
    background: linear-gradient(180deg, rgba(6, 75, 63, .05), rgba(6, 75, 63, .02)) !important;
    box-shadow: inset 3px 0 0 0 rgba(6, 75, 63, .25);
}

/* "Free Questions ..." card — add a soft accent header tab */
.head-sec-main {
    border-top: 4px solid transparent !important;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(90deg, var(--dg-green), var(--dg-lime)) border-box !important;
    border: 1px solid transparent !important;
}
.head-sec-main h1 {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

/* "Available PDF Files" table — header band tint + filename chip feel */
.divtable {
    padding: 6px 10px 10px !important;
    background:
        radial-gradient(700px 120px at 0 0, rgba(6, 75, 63, .04), transparent 60%),
        #fff !important;
}
.divtable thead th { border-bottom: 2px solid rgba(6, 75, 63, .12) !important; }
.divtable a.file, .divtable a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.divtable a.file::before {
    content: "";
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--dg-lime);
    box-shadow: 0 0 0 3px rgba(215, 223, 24, .25);
}
.divtable tbody tr:hover td { background: rgba(6, 75, 63, .045) !important; }

/* Sidebar "Exam Simulator" promo card — give the wrapper a soft frame */
.dialog-right { box-shadow: 0 22px 50px -26px rgba(6, 75, 63, .5); }

/* Sim card refresh — top accent bar + glowing visual ring */
.dg-sim-card {
    position: relative;
    padding-top: 26px !important;
    border: 1px solid rgba(255, 255, 255, .08);
}
.dg-sim-card::before {
    content: "";
    position: absolute;
    left: 18px; right: 18px; top: 0;
    height: 4px;
    border-radius: 0 0 6px 6px;
    background: linear-gradient(90deg, var(--dg-lime), #9fe870);
}
.dg-sim-visual {
    position: relative;
    box-shadow: 0 0 0 6px rgba(215, 223, 24, .08);
}
.dg-sim-visual::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 50%;
    border: 1px dashed rgba(215, 223, 24, .35);
}

/* ===================================================================
   v2 — COMPLETELY NEW UI for the two product pages
   .dgfree  → /free/<slug>            (free-PDF page, layouts/pdf_detail)
   .dgexam  → /<vendor>/pdf/<code>    (exam PDF detail, layouts/exam)
   Appended last → wins the cascade. px units (10px root on these pages).
   =================================================================== */

/* ---------------- FREE-PDF PAGE : hero ---------------- */
.dgfree-hero.ebook-main,
.dgfree-hero {
    position: relative;
    display: flex;
    align-items: center;
    gap: 36px;
    margin: 6px 0 0 !important;
    padding: 42px 46px !important;
    border-radius: 24px !important;
    overflow: hidden;
    background: radial-gradient(130% 150% at 100% 0%, #0a5e4e 0%, #064b3f 46%, #04382f 100%) !important;
    box-shadow: 0 34px 64px -32px rgba(4, 56, 47, .8) !important;
}
.dgfree-hero::before,
.dgfree-hero::after { content: none !important; background: none !important; }
.dgfree-hero__glow {
    position: absolute;
    z-index: 0;
    width: 380px; height: 380px;
    right: -100px; top: -150px;
    background: radial-gradient(circle, rgba(215, 223, 24, .30), rgba(215, 223, 24, 0) 70%);
    pointer-events: none;
}
.dgfree-hero__doc { position: relative; z-index: 1; flex: 0 0 auto; padding-bottom: 8px; }
.dgfree-hero__body { position: relative; z-index: 1; flex: 1 1 auto; min-width: 0; }

/* CSS-built document mock (replaces the old stock book image) */
.dgfree-doc {
    position: relative;
    width: 152px; height: 200px;
    border-radius: 14px;
    background: linear-gradient(160deg, #ffffff, #eaf5ee);
    box-shadow: 0 22px 44px -18px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .6);
    padding: 20px 18px;
    transform: rotate(-4deg);
    transition: transform .3s ease;
}
.dgfree-hero:hover .dgfree-doc { transform: rotate(-1.5deg) translateY(-5px); }
.dgfree-doc__fold {
    position: absolute; top: 0; right: 0;
    width: 0; height: 0;
    border-style: solid; border-width: 0 30px 30px 0;
    border-color: transparent #cfe6da transparent transparent;
    border-top-right-radius: 14px;
}
.dgfree-doc__type {
    display: inline-block;
    font-size: 13px; font-weight: 900; letter-spacing: .5px;
    color: #fff; background: var(--dg-red);
    padding: 4px 11px; border-radius: 7px;
    box-shadow: 0 7px 16px -5px rgba(240, 67, 54, .6);
}
.dgfree-doc__lines { display: block; margin-top: 20px; }
.dgfree-doc__lines i { display: block; height: 7px; border-radius: 4px; background: #d9e8e0; margin-bottom: 10px; }
.dgfree-doc__lines i:nth-child(2) { width: 80%; }
.dgfree-doc__lines i:nth-child(4) { width: 62%; }
.dgfree-doc__lines i:nth-child(5) { width: 88%; }
.dgfree-doc__qa {
    position: absolute; left: 50%; bottom: -15px; transform: translateX(-50%);
    white-space: nowrap;
    font-size: 12px; font-weight: 800; color: var(--dg-green);
    background: var(--dg-lime);
    padding: 6px 15px; border-radius: 999px;
    box-shadow: 0 9px 20px -7px rgba(0, 0, 0, .45);
}

.dgfree-tag {
    display: inline-block;
    font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    color: var(--dg-lime);
    background: rgba(215, 223, 24, .12);
    border: 1px solid rgba(215, 223, 24, .32);
    padding: 6px 15px; border-radius: 999px;
}
.dgfree-title.ebook-title {
    color: #fff !important;
    font-size: 31px; line-height: 1.2; font-weight: 900;
    margin: 16px 0 12px !important;
}
.dgfree-rate { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }
.dgfree-stars { color: var(--dg-lime); font-size: 17px; letter-spacing: 1px; }
.dgfree-rate strong { color: #fff; font-size: 16px; font-weight: 800; }
.dgfree-rate span { color: rgba(255, 255, 255, .72); font-size: 13px; }
.dgfree-meta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 26px; }
.dgfree-chip {
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 14px; padding: 12px 14px;
    display: flex; flex-direction: column; gap: 4px;
}
.dgfree-chip__k { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: rgba(255, 255, 255, .62); }
.dgfree-chip__v { font-size: 15px; font-weight: 800; color: #fff; word-break: break-word; }
.dgfree-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.dgfree-btn {
    display: inline-flex; align-items: center; gap: 9px;
    font-size: 14px; font-weight: 800; line-height: 1;
    padding: 14px 24px; border-radius: 12px;
    cursor: pointer; border: 0; text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.dgfree-btn svg { display: block; }
.dgfree-btn--primary { background: var(--dg-lime); color: var(--dg-green); box-shadow: 0 15px 28px -11px rgba(215, 223, 24, .6); }
.dgfree-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 20px 32px -11px rgba(215, 223, 24, .72); color: var(--dg-green); }
.dgfree-btn--ghost { background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .26); }
.dgfree-btn--ghost:hover { background: rgba(255, 255, 255, .16); color: #fff; transform: translateY(-2px); }

/* CMS intro block */
.dgfree-intro {
    margin-top: 30px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-left: 4px solid var(--dg-green);
    border-radius: 16px;
    padding: 22px 26px;
    font-size: 15px; line-height: 1.8; color: var(--dg-ink);
    box-shadow: 0 18px 40px -30px rgba(6, 75, 63, .4);
}
.dgfree-intro h1, .dgfree-intro h2, .dgfree-intro h3 { color: var(--dg-green); font-weight: 800; }
.dgfree-intro a { color: var(--dg-green); font-weight: 700; }

/* Comparison */
.dgfree-compare.exam-info-box { margin-top: 36px !important; }
.dgfree-compare__head { text-align: center; max-width: 640px; margin: 0 auto 24px; }
.dgfree-compare__eyebrow {
    display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-soft); border: 1px solid var(--dg-line);
    padding: 5px 12px; border-radius: 999px;
}
.dgfree-compare__head h2 { font-size: 25px; font-weight: 900; color: var(--dg-ink); margin: 13px 0 7px; }
.dgfree-compare__head h2 span { color: var(--dg-green); }
.dgfree-compare__head p { font-size: 14px; color: var(--dg-muted); margin: 0; }
.dgfree-compare__foot { text-align: center; margin-top: 24px; }
.dgfree-compare__foot .dgfree-btn--primary { background: var(--dg-green); color: #fff; box-shadow: 0 16px 30px -14px rgba(6, 75, 63, .6); }
.dgfree-compare__foot .dgfree-btn--primary:hover { background: var(--dg-deep); color: #fff; }

/* Other free files */
.dgfree-files .pdf-page-other-files h2 { font-size: 20px; font-weight: 900; color: var(--dg-ink); }
.dgfree-files .pdf-page-other-files h2 span { color: var(--dg-green); }

@media (max-width: 991px) {
    .dgfree-hero.ebook-main, .dgfree-hero { padding: 30px 26px !important; gap: 26px; }
    .dgfree-meta { grid-template-columns: repeat(2, 1fr); }
    .dgfree-title.ebook-title { font-size: 26px; }
}
@media (max-width: 600px) {
    .dgfree-hero.ebook-main, .dgfree-hero { flex-direction: column; align-items: flex-start; padding: 26px 18px !important; }
    .dgfree-hero__doc { align-self: center; }
    .dgfree-meta { grid-template-columns: 1fr 1fr; gap: 10px; }
    .dgfree-cta { width: 100%; }
    .dgfree-btn { flex: 1 1 auto; justify-content: center; }
    .dgfree-intro { padding: 18px; }
    .dgfree-compare__head h2 { font-size: 20px; }
}

/* ---------------- EXAM PDF DETAIL PAGE ---------------- */
.dgexam { margin-top: 6px; }

.dgexam-hero.head-sec-main {
    position: relative;
    background: linear-gradient(180deg, #f3faf6 0%, #ffffff 100%);
    border: 1px solid var(--dg-line);
    border-radius: 22px;
    padding: 30px 34px 26px !important;
    margin: 0 0 26px !important;
    overflow: hidden;
}
.dgexam-hero::before {
    content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
    background: linear-gradient(180deg, var(--dg-green), var(--dg-lime));
}
.dgexam-hero__content { position: relative; }
.dgexam-hero__content h1, .dgexam-hero__content h2 { color: var(--dg-green) !important; font-weight: 900; line-height: 1.2; }
.dgexam-hero__content h1 { font-size: 26px; margin: 0 0 10px; }
.dgexam-hero__content p { font-size: 14px; line-height: 1.75; color: var(--dg-ink); }
.dgexam-retired {
    position: absolute; top: 14px; right: 14px; z-index: 3;
    background: var(--dg-red); color: #fff;
    font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px;
    padding: 5px 12px; border-radius: 999px;
}
.dgexam-facts {
    position: relative;
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
    margin-top: 22px; padding-top: 22px;
    border-top: 1px solid var(--dg-line);
}
.dgexam-fact { background: #fff; border: 1px solid var(--dg-line); border-radius: 14px; padding: 14px 16px; }
.dgexam-fact__n { display: block; font-size: 17px; font-weight: 900; color: var(--dg-green); line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dgexam-fact__l { display: block; margin-top: 5px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--dg-muted); }

.dgexam-grid { display: grid; grid-template-columns: minmax(0, 1fr) 322px; gap: 28px; align-items: start; }
.dgexam-main { min-width: 0; }
.dgexam-aside { position: sticky; top: 18px; display: flex; flex-direction: column; gap: 18px; }

.dgexam-prose.head-ter-main-content {
    background: #fff; border: 1px solid var(--dg-line); border-radius: 16px;
    padding: 22px 26px; margin: 0 !important;
    font-size: 15px; line-height: 1.8; color: var(--dg-ink);
}
.dgexam-prose h2, .dgexam-prose h3 { color: var(--dg-green); font-weight: 800; }
.dgexam-main .divtable { margin-top: 22px; }

/* Comments */
.dgexam-comments {
    margin-top: 26px; background: #fff; border: 1px solid var(--dg-line);
    border-radius: 16px; padding: 24px 26px;
}
.dgexam-comments .comment_headings { display: block; font-size: 18px; font-weight: 900; color: var(--dg-ink); margin-bottom: 4px; }
.dgexam-comments .commentline {
    border: 1px solid var(--dg-line); border-left: 3px solid var(--dg-green);
    border-radius: 12px; padding: 14px 16px; margin: 14px 0; background: var(--dg-soft);
}
.dgexam-comments .commentline p.green { color: var(--dg-green); font-weight: 800; margin: 0 0 4px; font-size: 14px; }
.dgexam-comments .commentline ul { list-style: none; margin: 0 0 8px; padding: 0; display: flex; gap: 14px; flex-wrap: wrap; }
.dgexam-comments .commentline ul li { font-size: 12px; color: var(--dg-muted); }
.dgexam-comments .commentline > p { font-size: 14px; color: var(--dg-ink); margin: 0; line-height: 1.7; }
.dgexam-comments .comments-replies-sec { margin-top: 12px; padding-left: 14px; border-left: 2px dashed var(--dg-line); }
.dgexam-comments .replay-label { font-size: 12px; font-weight: 800; color: var(--dg-muted); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 8px; }
.dgexam-comments .comments-replies-sec-inner { background: #fff; border: 1px solid var(--dg-line); border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; }
.dgexam-comments .comment-reply-btn { background: none; border: 0; color: var(--dg-green); font-weight: 800; font-size: 13px; cursor: pointer; padding: 6px 0; }
.dgexam-comments .upcomment { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--dg-line); }
.dgexam-comments .upcomment .comment_headings { font-size: 16px; }
.dgexam-comments label { font-weight: 700; color: var(--dg-ink); font-size: 13px; }
.dgexam-comments input[type="text"], .dgexam-comments input[type="email"], .dgexam-comments textarea {
    width: 100%; border: 1px solid var(--dg-line); border-radius: 10px; padding: 10px 12px;
    font-size: 14px; background: #fff; margin-top: 4px;
}
.dgexam-comments input[type="text"]:focus, .dgexam-comments input[type="email"]:focus, .dgexam-comments textarea:focus {
    outline: 0; border-color: var(--dg-green); box-shadow: 0 0 0 3px rgba(6, 75, 63, .12);
}
.dgexam-comments .btn-cart-pro, .dgexam-comments .btn-primary {
    background: var(--dg-green) !important; color: #fff !important; border: 0 !important;
    border-radius: 10px; padding: 10px 22px; font-weight: 800;
}
.dgexam-comments .btn-cart-pro:hover, .dgexam-comments .btn-primary:hover { background: var(--dg-deep) !important; }

.dgexam-main .well_exam_page_fst { margin-top: 26px; }

/* "At a glance" sidebar card */
.dgexam-glance {
    background: radial-gradient(130% 140% at 100% 0%, #0a5e4e, #064b3f 56%, #04382f);
    color: #fff; border-radius: 18px; padding: 22px 22px 24px;
    box-shadow: 0 26px 52px -30px rgba(4, 56, 47, .85);
}
.dgexam-glance__eyebrow {
    display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-lime); padding: 4px 11px; border-radius: 999px;
}
.dgexam-glance__t { font-size: 18px; font-weight: 900; color: #fff; margin: 12px 0 14px; line-height: 1.25; }
.dgexam-glance__list { list-style: none; margin: 0 0 18px; padding: 0; }
.dgexam-glance__list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.dgexam-glance__list li:last-child { border-bottom: 0; }
.dgexam-glance__list span { font-size: 12px; color: rgba(255, 255, 255, .7); font-weight: 600; }
.dgexam-glance__list strong { font-size: 14px; color: #fff; font-weight: 800; text-align: right; }
.dgexam-glance__btn {
    display: block; text-align: center; background: var(--dg-lime); color: var(--dg-green);
    font-weight: 800; font-size: 14px; padding: 12px 16px; border-radius: 12px; text-decoration: none;
    transition: transform .18s ease;
}
.dgexam-glance__btn:hover { transform: translateY(-2px); color: var(--dg-green); }

@media (max-width: 991px) {
    .dgexam-grid { grid-template-columns: 1fr; }
    .dgexam-aside { position: static; }
    .dgexam-facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .dgexam-hero.head-sec-main { padding: 22px 18px !important; }
    .dgexam-hero__content h1 { font-size: 21px; }
    .dgexam-facts { grid-template-columns: 1fr 1fr; gap: 10px; }
    .dgexam-prose.head-ter-main-content, .dgexam-comments { padding: 16px; }
}

/* ===================================================================
   v3 — Modern refresh for /<vendor>/pdf/<code> & /free/<slug>
   Adds: dg3-* component library, modern hero, trust strip, sticky CTA,
   features grid, content pills, breadcrumb pill.
   Loaded last, sits on top of v2.
   =================================================================== */

/* Smooth scroll for the whole page wrapper */
.dg3-page { scroll-behavior: smooth; }

/* Hide the legacy Bootstrap breadcrumb on v3 pages (v3 ships its own .dg3-crumbs) */
.container:has(> .dg3-page) > .breadcrumb,
.container:has(.dg3-page) > .breadcrumb { display: none !important; }

/* ---------- Modern breadcrumb pill ---------- */
.dg3-crumbs {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
    margin: 4px 0 22px;
    font-size: 13px; color: var(--dg-muted);
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 999px;
    padding: 7px 16px;
    box-shadow: 0 8px 20px -16px rgba(6, 75, 63, .25);
}
.dg3-crumbs a { color: var(--dg-green); text-decoration: none; font-weight: 600; transition: color .15s ease; }
.dg3-crumbs a:hover { color: var(--dg-deep); }
.dg3-crumbs .dg3-crumbs__sep { color: var(--dg-line); margin: 0 2px; }
.dg3-crumbs .dg3-crumbs__current {
    color: var(--dg-ink); font-weight: 700; max-width: 320px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------- Modern hero (shared v3 base) ---------- */
.dg3-hero {
    position: relative; overflow: hidden;
    background:
        radial-gradient(120% 130% at 100% 0%, rgba(215, 223, 24, .16) 0%, rgba(215, 223, 24, 0) 55%),
        radial-gradient(110% 140% at 0% 100%, rgba(39, 192, 141, .14) 0%, rgba(39, 192, 141, 0) 55%),
        linear-gradient(160deg, #0a5e4e 0%, #064b3f 52%, #04382f 100%);
    color: #fff;
    border-radius: 26px;
    padding: 36px 40px 30px;
    box-shadow: 0 36px 70px -34px rgba(4, 56, 47, .82);
    margin: 0 0 26px;
    isolation: isolate;
}
.dg3-hero::before {
    content: "";
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background-image:
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, .06) 0, rgba(255, 255, 255, 0) 40%),
        radial-gradient(circle at 80% 80%, rgba(255, 255, 255, .04) 0, rgba(255, 255, 255, 0) 35%);
}
.dg3-hero__inner { position: relative; z-index: 1; }
.dg3-hero__eyebrow {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 11px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase;
    color: var(--dg-green);
    background: var(--dg-lime);
    padding: 6px 14px; border-radius: 999px;
    box-shadow: 0 8px 18px -8px rgba(215, 223, 24, .55);
}
.dg3-hero__eyebrow::before {
    content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: var(--dg-green);
    box-shadow: 0 0 0 3px rgba(6, 75, 63, .18);
}
.dg3-hero__title {
    font-family: var(--dg-font);
    color: #fff !important; font-weight: 900;
    font-size: 36px; line-height: 1.15; letter-spacing: -.01em;
    margin: 14px 0 12px !important;
}
.dg3-hero__sub {
    font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, .82);
    max-width: 740px; margin: 0 0 22px;
}
.dg3-hero__meta {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
    margin: 22px 0 24px;
}
.dg3-meta {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .14);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 14px; padding: 12px 14px;
    display: flex; flex-direction: column; gap: 4px;
    transition: transform .2s ease, background .2s ease;
}
.dg3-meta:hover { transform: translateY(-2px); background: rgba(255, 255, 255, .12); }
.dg3-meta__k { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: rgba(255, 255, 255, .65); }
.dg3-meta__v { font-size: 15px; font-weight: 800; color: #fff; word-break: break-word; line-height: 1.25; }
.dg3-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.dg3-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    font-family: var(--dg-font); font-size: 14px; font-weight: 800; line-height: 1;
    padding: 14px 22px; border-radius: 12px;
    border: 0; cursor: pointer; text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.dg3-btn svg { display: block; flex: 0 0 auto; }
.dg3-btn--primary { background: var(--dg-lime); color: var(--dg-green); box-shadow: 0 18px 32px -14px rgba(215, 223, 24, .7); }
.dg3-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 24px 38px -14px rgba(215, 223, 24, .8); color: var(--dg-deep); }
.dg3-btn--ghost { background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .28); }
.dg3-btn--ghost:hover { background: rgba(255, 255, 255, .18); color: #fff; transform: translateY(-2px); }
.dg3-btn--solid { background: var(--dg-green); color: #fff; box-shadow: 0 16px 30px -14px rgba(6, 75, 63, .55); }
.dg3-btn--solid:hover { background: var(--dg-deep); color: #fff; transform: translateY(-2px); }

/* Hero visual: floating "PDF" mock */
.dg3-hero__visual {
    position: absolute; right: 36px; top: 50%; transform: translateY(-50%) rotate(8deg);
    width: 170px; height: 220px; z-index: 0;
    background: linear-gradient(160deg, #ffffff, #eaf5ee);
    border-radius: 16px;
    box-shadow: 0 30px 50px -22px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .55);
    padding: 18px 16px;
    transition: transform .35s ease;
}
.dg3-hero__visual::before {
    content: ""; position: absolute; top: 0; right: 0;
    width: 0; height: 0; border-style: solid; border-width: 0 28px 28px 0;
    border-color: transparent #cfe6da transparent transparent;
    border-top-right-radius: 16px;
}
.dg3-hero__visual::after {
    content: "PDF";
    position: absolute; top: 14px; left: 16px;
    font-size: 12px; font-weight: 900; letter-spacing: .5px;
    color: #fff; background: var(--dg-red);
    padding: 4px 11px; border-radius: 7px;
    box-shadow: 0 7px 16px -5px rgba(240, 67, 54, .6);
}
.dg3-hero__visual span {
    display: block; height: 6px; border-radius: 4px; background: #d9e8e0; margin-bottom: 9px;
}
.dg3-hero__visual span:nth-child(2) { width: 82%; margin-top: 26px; }
.dg3-hero__visual span:nth-child(3) { width: 100%; }
.dg3-hero__visual span:nth-child(4) { width: 64%; }
.dg3-hero__visual span:nth-child(5) { width: 88%; }
.dg3-hero__visual span:nth-child(6) { width: 72%; }
.dg3-hero:hover .dg3-hero__visual { transform: translateY(-50%) rotate(2deg) translateX(4px); }

.dg3-hero__badge {
    position: absolute; right: 24px; top: 24px; z-index: 2;
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .25);
    color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px;
    padding: 6px 12px; border-radius: 999px;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}

/* Hero rating row */
.dg3-hero__rate { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 18px; }
.dg3-stars { display: inline-flex; align-items: center; gap: 1px; color: var(--dg-lime); font-size: 16px; letter-spacing: 1px; }
.dg3-stars svg { display: block; }
.dg3-rate-num { color: #fff; font-weight: 900; font-size: 16px; }
.dg3-rate-meta { color: rgba(255, 255, 255, .7); font-size: 13px; }

/* ---------- Trust strip ---------- */
.dg3-trust {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px;
    margin: 0 0 28px;
}
.dg3-trust__cell {
    background: #fff; border: 1px solid var(--dg-line); border-radius: 16px;
    padding: 16px 18px; display: flex; align-items: center; gap: 12px;
    box-shadow: 0 12px 28px -22px rgba(6, 75, 63, .25);
    transition: transform .2s ease, box-shadow .2s ease;
}
.dg3-trust__cell:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -22px rgba(6, 75, 63, .35); }
.dg3-trust__icon {
    width: 38px; height: 38px; border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--dg-soft); color: var(--dg-green);
    flex: 0 0 auto;
}
.dg3-trust__icon svg { display: block; }
.dg3-trust__n { font-size: 17px; font-weight: 900; color: var(--dg-ink); line-height: 1.1; }
.dg3-trust__l { font-size: 12px; font-weight: 600; color: var(--dg-muted); margin-top: 2px; }

/* ---------- Section wrapper ---------- */
.dg3-section {
    background: #fff; border: 1px solid var(--dg-line); border-radius: 20px;
    padding: 26px 28px; margin: 0 0 26px;
    box-shadow: 0 18px 40px -30px rgba(6, 75, 63, .25);
}
.dg3-section__head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.dg3-section__eyebrow {
    display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-soft); border: 1px solid var(--dg-line);
    padding: 5px 12px; border-radius: 999px;
}
.dg3-section__title { font-size: 22px; font-weight: 900; color: var(--dg-ink); margin: 8px 0 0; }
.dg3-section__sub { font-size: 14px; color: var(--dg-muted); margin: 4px 0 0; max-width: 620px; }

/* ---------- Features grid ---------- */
.dg3-features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dg3-feature {
    background: var(--dg-soft); border: 1px solid var(--dg-line); border-radius: 16px;
    padding: 18px 18px; transition: transform .2s ease, box-shadow .2s ease;
}
.dg3-feature:hover { transform: translateY(-3px); box-shadow: 0 18px 32px -22px rgba(6, 75, 63, .35); }
.dg3-feature__icon {
    width: 38px; height: 38px; border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--dg-green); color: var(--dg-lime);
    margin-bottom: 12px;
}
.dg3-feature__icon svg { display: block; }
.dg3-feature__t { font-size: 15px; font-weight: 800; color: var(--dg-ink); margin: 0 0 4px; }
.dg3-feature__d { font-size: 13px; color: var(--dg-muted); line-height: 1.6; margin: 0; }

/* ---------- Tag pill row ---------- */
.dg3-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.dg3-pill {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: 700;
    background: var(--dg-soft); color: var(--dg-green);
    border: 1px solid var(--dg-line);
    padding: 6px 12px; border-radius: 999px;
}
.dg3-pill--accent { background: rgba(215, 223, 24, .22); color: var(--dg-deep); border-color: rgba(215, 223, 24, .55); }
.dg3-pill--soft { background: #fff; color: var(--dg-muted); }
.dg3-pill svg { display: block; }

/* ---------- Modern table wrapper (used by comparison & files) ---------- */
.dg3-tablewrap { overflow: hidden; border-radius: 16px; border: 1px solid var(--dg-line); background: #fff; }
.dg3-table { width: 100%; border-collapse: collapse; font-size: 14px; color: var(--dg-ink); }
.dg3-table th, .dg3-table td { padding: 14px 16px; text-align: left; vertical-align: middle; }
.dg3-table thead th {
    background: var(--dg-soft); color: var(--dg-ink);
    font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px;
    border-bottom: 1px solid var(--dg-line);
}
.dg3-table tbody tr { border-top: 1px solid var(--dg-line); transition: background .15s ease; }
.dg3-table tbody tr:first-child { border-top: 0; }
.dg3-table tbody tr:hover { background: var(--dg-soft); }
.dg3-table tbody td strong { color: var(--dg-ink); font-weight: 700; }
.dg3-table .dg3-check { color: var(--dg-green); }
.dg3-table .dg3-cross { color: var(--dg-red); }

/* ---------- Comments block (v3 polish over v2) ---------- */
.dg3-comments { background: #fff; border: 1px solid var(--dg-line); border-radius: 20px; padding: 24px 28px; margin: 0 0 26px; box-shadow: 0 18px 40px -30px rgba(6, 75, 63, .25); }
.dg3-comment {
    border: 1px solid var(--dg-line); border-left: 3px solid var(--dg-green);
    border-radius: 14px; padding: 16px 18px; margin: 14px 0; background: var(--dg-soft);
    transition: border-color .15s ease, background .15s ease;
}
.dg3-comment:hover { border-color: var(--dg-green); }
.dg3-comment__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.dg3-comment__author { color: var(--dg-green); font-weight: 800; font-size: 14px; margin: 0; display: inline-flex; align-items: center; gap: 8px; }
.dg3-comment__author .dg3-avatar {
    width: 28px; height: 28px; border-radius: 50%;
    background: linear-gradient(135deg, var(--dg-green), var(--dg-deep));
    color: #fff; font-weight: 800; font-size: 12px;
    display: inline-flex; align-items: center; justify-content: center;
    text-transform: uppercase; flex: 0 0 auto;
}
.dg3-comment__meta { font-size: 12px; color: var(--dg-muted); display: flex; gap: 12px; flex-wrap: wrap; }
.dg3-comment__body { font-size: 14px; line-height: 1.7; color: var(--dg-ink); margin: 4px 0 0; }

/* ---------- Comment form + reply/edit panels (v3) ---------- */
.dg3-comments .comment_headings { font-family: var(--dg-font); }
.dg3-comments .upcomment {
    background: var(--dg-soft); border: 1px solid var(--dg-line);
    border-radius: 16px; padding: 20px 20px; margin-top: 22px;
}
.dg3-comments .upcomment .comment_headings { margin-bottom: 14px; }
.dg3-comments .form-group { margin-bottom: 12px; }
.dg3-comments label, .dg3-comments .control-label {
    display: block; font-size: 12.5px; font-weight: 800; color: var(--dg-ink);
    margin-bottom: 6px; letter-spacing: .2px;
}
.dg3-comments .red { color: var(--dg-red); }
.dg3-comments .form-control {
    width: 100%; font-family: var(--dg-font); font-size: 14px; color: var(--dg-ink);
    background: #fff; border: 1px solid var(--dg-line); border-radius: 11px;
    padding: 11px 14px; outline: 0; box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.dg3-comments textarea.form-control { min-height: 96px; resize: vertical; }
.dg3-comments .form-control:focus { border-color: var(--dg-green); box-shadow: 0 0 0 3px rgba(6, 75, 63, .12); }
.dg3-comments .form-control::placeholder { color: #9fb0ac; }
.dg3-comments .form-submit,
.dg3-comments .btn-cart-pro,
.dg3-comments .btn-primary {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--dg-green) !important; color: #fff !important; border: 0 !important;
    border-radius: 11px; padding: 11px 24px; font-size: 14px; font-weight: 800; cursor: pointer;
    box-shadow: 0 14px 26px -18px rgba(6, 75, 63, .8); transition: background .15s ease;
}
.dg3-comments .form-submit:hover,
.dg3-comments .btn-cart-pro:hover,
.dg3-comments .btn-primary:hover { background: var(--dg-deep) !important; color: #fff !important; }
.dg3-comments .btn-danger, .dg3-comments .btn-warning { border-radius: 8px; font-weight: 700; }
.dg3-comments .comments-replies-sec { margin-top: 12px; padding-left: 16px; border-left: 2px solid var(--dg-line); }
.dg3-comments .replay-label {
    font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px;
    color: var(--dg-muted); margin-bottom: 8px;
}
.dg3-comments .comment-reply-btn { font-family: var(--dg-font); }
.dg3-comments .comment-reply-panel, .dg3-comments .comment-edit-panel {
    background: #fff; border: 1px solid var(--dg-line); border-radius: 12px; padding: 14px 16px; margin-top: 10px;
}
.dg3-comments .pline { font-family: var(--dg-font); font-size: 13px; }

/* ---------- Sticky bottom CTA bar ---------- */
.dg3-sticky-cta {
    position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 999;
    display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
    background: rgba(6, 75, 63, .95);
    border: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
    padding: 12px 18px; border-radius: 16px;
    box-shadow: 0 24px 48px -20px rgba(4, 56, 47, .65);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    transform: translateY(150%); opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
}
.dg3-sticky-cta.is-visible { transform: translateY(0); opacity: 1; }
.dg3-sticky-cta__text { display: flex; flex-direction: column; min-width: 0; }
.dg3-sticky-cta__title { font-size: 14px; font-weight: 800; line-height: 1.2; }
.dg3-sticky-cta__sub { font-size: 12px; color: rgba(255, 255, 255, .72); margin-top: 2px; }
.dg3-sticky-cta__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.dg3-sticky-cta .dg3-btn { padding: 11px 18px; font-size: 13px; }
.dg3-sticky-cta__close {
    background: rgba(255, 255, 255, .12); color: #fff; border: 0;
    width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 16px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s ease;
}
.dg3-sticky-cta__close:hover { background: rgba(255, 255, 255, .25); }

/* ---------- Content prose (CMS article body) ---------- */
.dg3-prose { font-size: 15px; line-height: 1.85; color: var(--dg-ink); }
.dg3-prose h1, .dg3-prose h2, .dg3-prose h3 { color: var(--dg-green); font-weight: 900; margin: 18px 0 8px; line-height: 1.25; }
.dg3-prose h1 { font-size: 24px; }
.dg3-prose h2 { font-size: 20px; }
.dg3-prose h3 { font-size: 17px; }
.dg3-prose p { margin: 0 0 14px; }
.dg3-prose ul, .dg3-prose ol { margin: 0 0 14px; padding-left: 22px; }
.dg3-prose li { margin-bottom: 6px; }
.dg3-prose a { color: var(--dg-green); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(6, 75, 63, .25); text-underline-offset: 3px; }
.dg3-prose a:hover { text-decoration-color: var(--dg-green); }
.dg3-prose strong { color: var(--dg-deep); }
.dg3-prose img { max-width: 100%; height: auto; border-radius: 12px; margin: 8px 0; }

/* ---------- Layout helpers ---------- */
.dg3-grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; }
.dg3-aside { position: sticky; top: 18px; display: flex; flex-direction: column; gap: 18px; }

/* ---------- Sidebar (v3) ---------- */
.dg3-card {
    background: #fff; border: 1px solid var(--dg-line); border-radius: 18px;
    padding: 22px 22px; box-shadow: 0 18px 36px -28px rgba(6, 75, 63, .25);
}
.dg3-card--dark {
    background: radial-gradient(130% 140% at 100% 0%, #0a5e4e, #064b3f 56%, #04382f);
    color: #fff; border: 0;
    box-shadow: 0 26px 52px -30px rgba(4, 56, 47, .85);
}
.dg3-card--dark .dg3-card__eyebrow { color: var(--dg-green); background: var(--dg-lime); }
.dg3-card--dark .dg3-card__t, .dg3-card--dark strong { color: #fff; }
.dg3-card--dark .dg3-card__sub, .dg3-card--dark span { color: rgba(255, 255, 255, .7); }
.dg3-card__eyebrow {
    display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-soft);
    padding: 4px 11px; border-radius: 999px;
}
.dg3-card__t { font-size: 18px; font-weight: 900; color: var(--dg-ink); margin: 12px 0 14px; line-height: 1.25; }
.dg3-card__list { list-style: none; margin: 0 0 18px; padding: 0; }
.dg3-card__list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--dg-line); }
.dg3-card--dark .dg3-card__list li { border-bottom: 1px solid rgba(255, 255, 255, .12); }
.dg3-card__list li:last-child { border-bottom: 0; }
.dg3-card__list span { font-size: 12px; color: var(--dg-muted); font-weight: 600; }
.dg3-card__list strong { font-size: 14px; color: var(--dg-ink); font-weight: 800; text-align: right; }
/* Dark card needs light labels — these win on specificity over the rules above */
.dg3-card--dark .dg3-card__list span { color: rgba(255, 255, 255, .72); }
.dg3-card--dark .dg3-card__list strong { color: #fff; }

/* ---------- v3 responsive ---------- */
@media (max-width: 1199px) {
    .dg3-hero__title { font-size: 30px; }
    .dg3-hero__visual { display: none; }
    .dg3-grid-2 { grid-template-columns: 1fr; }
    .dg3-aside { position: static; }
    .dg3-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .dg3-hero { padding: 26px 20px 22px; }
    .dg3-hero__title { font-size: 25px; }
    .dg3-hero__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dg3-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dg3-section { padding: 20px 18px; }
    .dg3-features { grid-template-columns: 1fr; }
    .dg3-table th, .dg3-table td { padding: 12px 12px; font-size: 13px; }
    .dg3-sticky-cta { left: 8px; right: 8px; bottom: 8px; padding: 10px 12px; }
    .dg3-sticky-cta__sub { display: none; }
    .dg3-crumbs { padding: 6px 12px; font-size: 12px; }
}

/* ===================================================================
   v3.1 — single-column refresh
   Folds the old sticky sidebar into full-width bands, adds the
   simulator promo, scroll-reveal motion, and a hero overlap fix.
   =================================================================== */

/* Keep hero copy clear of the floating PDF mock on wide screens */
@media (min-width: 1200px) {
    .dg3-hero__inner { padding-right: 210px; }
}

/* ---------- Premium package band (full-width, replaces sticky card) ---------- */
.dg3-band {
    position: relative; overflow: hidden; isolation: isolate;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 30px;
    background: radial-gradient(130% 160% at 100% 0%, #0a5e4e, #064b3f 55%, #04382f);
    color: #fff; border-radius: 22px; padding: 30px 34px; margin: 0 0 26px;
    box-shadow: 0 30px 60px -34px rgba(4, 56, 47, .85);
}
.dg3-band__glow {
    position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background:
        radial-gradient(42% 60% at 92% 8%, rgba(215, 223, 24, .20), transparent 60%),
        radial-gradient(50% 75% at 0% 100%, rgba(39, 192, 141, .20), transparent 60%);
}
.dg3-band__eyebrow {
    display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-lime); padding: 5px 12px; border-radius: 999px;
}
.dg3-band__title { font-family: var(--dg-font); font-size: 25px; font-weight: 900; color: #fff; margin: 13px 0 6px; line-height: 1.2; }
.dg3-band__sub { font-size: 14px; line-height: 1.65; color: rgba(255, 255, 255, .78); max-width: 640px; margin: 0 0 18px; }
.dg3-band__stats { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dg3-band__stats li {
    display: flex; flex-direction: column; gap: 3px;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px; padding: 9px 14px; min-width: 108px;
    transition: transform .2s ease, background .2s ease;
}
.dg3-band__stats li:hover { transform: translateY(-2px); background: rgba(255, 255, 255, .13); }
.dg3-band__stats span { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: rgba(255, 255, 255, .6); }
.dg3-band__stats strong { font-size: 16px; font-weight: 800; color: #fff; }
.dg3-band__cta { display: flex; flex-direction: column; align-items: stretch; gap: 10px; text-align: center; min-width: 232px; }
.dg3-band__cta .dg3-btn { width: 100%; }
.dg3-band__note { font-size: 11.5px; color: rgba(255, 255, 255, .66); line-height: 1.5; }

/* ---------- Exam simulator promo (full-width, replaces sim sidebar card) ---------- */
.dg3-sim {
    display: grid; grid-template-columns: minmax(0, 1fr) 230px; align-items: center; gap: 30px;
    background: #fff; border: 1px solid var(--dg-line); border-radius: 22px;
    padding: 28px 32px; margin: 0 0 26px;
    box-shadow: 0 18px 40px -30px rgba(6, 75, 63, .25);
}
.dg3-sim__eyebrow {
    display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
    color: var(--dg-green); background: var(--dg-soft); border: 1px solid var(--dg-line); padding: 5px 12px; border-radius: 999px;
}
.dg3-sim__title { font-family: var(--dg-font); font-size: 22px; font-weight: 900; color: var(--dg-ink); margin: 13px 0 16px; line-height: 1.25; }
.dg3-sim__feats { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 20px; }
.dg3-sim__feats li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 600; color: var(--dg-ink); }
.dg3-sim__feats svg { color: var(--dg-green); flex: 0 0 auto; }
.dg3-sim__btn { align-self: flex-start; }
.dg3-sim__screen {
    display: flex; align-items: center; justify-content: center; min-height: 200px;
    background: radial-gradient(120% 120% at 50% 0%, #0a5e4e, #04382f);
    color: var(--dg-lime); border-radius: 18px; text-decoration: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 24px 44px -30px rgba(4, 56, 47, .8);
    transition: transform .25s ease;
}
.dg3-sim__screen:hover { transform: translateY(-3px); }

/* ---------- Scroll-reveal motion (progressive enhancement) ----------
   Only hidden when JS is active (html.dg3-js); without JS everything
   stays visible so no-JS users never see blank sections. */
.dg3-js .dg3-reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.dg3-js .dg3-reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
    .dg3-js .dg3-reveal { opacity: 1; transform: none; transition: none; }
    .dg3-sim__screen, .dg3-band__stats li { transition: none; }
}

/* ---------- v3.1 responsive ---------- */
@media (max-width: 860px) {
    .dg3-band { grid-template-columns: 1fr; gap: 20px; padding: 26px 22px; }
    .dg3-band__cta { min-width: 0; }
    .dg3-sim { grid-template-columns: 1fr; gap: 22px; padding: 24px 20px; }
    .dg3-sim__feats { grid-template-columns: 1fr; }
    .dg3-sim__screen { min-height: 150px; max-width: 220px; }
}
@media (max-width: 480px) {
    .dg3-band__title, .dg3-sim__title { font-size: 20px; }
    .dg3-band__stats li { flex: 1 1 calc(50% - 10px); min-width: 0; }
}


/* =====================================================================
   dgprod — MODERN PRODUCT / ADD-TO-CART PAGE  (showproducts.php)
   Full structural rebuild: a responsive "choose your format" pricing
   grid (Bundle / PDF / Web / Desktop). Replaces the old stacked
   sidebar+stock-image sections. The product layout loads
   style_min_pdfq.css which forces font-family:Nunito!important on a
   10px root — so every rule here forces Inter and uses px units.
   ===================================================================== */
.dgprod, .dgprod * { font-family: var(--dg-font) !important; box-sizing: border-box; }
.dgprod {
    background: linear-gradient(180deg, #f3f8f4 0%, #ffffff 240px, #ffffff 100%);
    padding: 28px 0 56px;
}
.dgprod .container { max-width: 1180px; }

/* ---------- Header ---------- */
.dgprod-head { text-align: center; max-width: 880px; margin: 0 auto 30px; }
.dgprod-head .purchase_title_head,
.dgprod-head h1 {
    font-size: 34px;
    line-height: 1.18;
    font-weight: 900;
    color: var(--dg-ink);
    margin: 0 0 12px;
    letter-spacing: -.4px;
}
.dgprod-head .purchase_title_head span,
.dgprod-head h1 span { color: var(--dg-green); }
.dgprod-head .purchase_title,
.dgprod-head p {
    font-size: 16px;
    line-height: 1.7;
    color: var(--dg-muted);
    margin: 0 auto;
    max-width: 760px;
}
.dgprod-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}
.dgprod-rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: var(--dg-ink);
    background: #fff;
    border: 1px solid var(--dg-line);
    padding: 7px 14px;
    border-radius: 999px;
    box-shadow: 0 8px 22px -18px rgba(6,75,63,.4);
}
.dgprod-stars { color: #f5a623; letter-spacing: 1px; font-size: 14px; }
.dgprod-rating strong { font-weight: 800; }
.dgprod-rating-sub { color: var(--dg-muted); font-size: 13px; }
.dgprod-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dg-green);
    background: #eaf3ee;
    border: 1px solid #d8e8df;
    padding: 7px 14px;
    border-radius: 999px;
}
.dgprod-chip-i { font-size: 14px; line-height: 1; }

/* ---------- Pricing grid ---------- */
.dgprod-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 38px;
}
.dgprod-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 18px;
    padding: 24px 20px;
    box-shadow: 0 24px 50px -36px rgba(6,75,63,.4);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.dgprod-card:hover {
    transform: translateY(-4px);
    border-color: #bcd7c8;
    box-shadow: 0 32px 60px -34px rgba(6,75,63,.5);
}
.dgprod-card--featured {
    background: linear-gradient(160deg, #0a5749 0%, #04382f 100%);
    border-color: transparent;
    box-shadow: 0 34px 64px -30px rgba(4,56,47,.7);
}
.dgprod-card--featured:hover { border-color: var(--dg-lime); }
.dgprod-ribbon {
    position: absolute;
    top: 14px;
    right: -2px;
    background: var(--dg-lime);
    color: var(--dg-ink);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .6px;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 8px 0 0 8px;
    box-shadow: 0 8px 18px -8px rgba(0,0,0,.4);
}

/* card head */
.dgprod-card-top { margin-bottom: 14px; }
.dgprod-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: var(--dg-green);
    background: #eaf3ee;
    border: 1px solid #d8e8df;
    padding: 5px 11px;
    border-radius: 999px;
    margin-bottom: 12px;
}
.dgprod-tag--gold { color: var(--dg-ink); background: var(--dg-lime); border-color: var(--dg-lime); }
.dgprod-card-name {
    font-size: 20px;
    font-weight: 800;
    color: var(--dg-ink);
    margin: 0 0 8px;
    line-height: 1.25;
}
.dgprod-card-desc { font-size: 13.5px; line-height: 1.6; color: var(--dg-muted); }
.dgprod-card-desc p { margin: 0 0 6px; }
.dgprod-card-desc p:last-child { margin-bottom: 0; }
.dgprod-card-desc .ep-side-pack-heading { display: none; }
.dgprod-card--featured .dgprod-card-name,
.dgprod-card--featured .dgprod-card-desc,
.dgprod-card--featured .dgprod-card-desc p { color: #eaf6ef; }

/* price */
.dgprod-pricewrap {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 0 4px;
    border-top: 1px solid var(--dg-line);
    margin-top: 4px;
}
.dgprod-card--featured .dgprod-pricewrap { border-top-color: rgba(255,255,255,.16); }
.dgprod-price { font-size: 40px; font-weight: 900; color: var(--dg-ink); line-height: 1; letter-spacing: -1px; }
.dgprod-cur { font-size: 22px; font-weight: 800; color: var(--dg-green); margin-right: 1px; vertical-align: top; position: relative; top: 4px; }
.dgprod-old { font-size: 17px; color: var(--dg-muted); text-decoration: line-through; }
.dgprod-save {
    font-size: 11.5px;
    font-weight: 800;
    color: #fff;
    background: var(--dg-red);
    padding: 4px 9px;
    border-radius: 7px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.dgprod-card--featured .dgprod-price { color: #fff; }
.dgprod-card--featured .dgprod-cur { color: var(--dg-lime); }
.dgprod-card--featured .dgprod-old { color: rgba(255,255,255,.65); }
.dgprod-card--featured .dgprod-save { background: var(--dg-lime); color: var(--dg-ink); }

/* feature list */
.dgprod-feats { list-style: none; margin: 16px 0 0; padding: 0; }
.dgprod-feats li,
.dgprod-cms-feats .info p {
    position: relative;
    padding: 0 0 0 26px;
    margin: 0 0 9px;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--dg-ink);
}
.dgprod-feats li:before,
.dgprod-cms-feats .info p:before {
    content: "";
    position: absolute;
    left: 0; top: 2px;
    width: 17px; height: 17px;
    border-radius: 50%;
    background: #eaf3ee url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064b3f' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
}
.dgprod-cms-feats { margin-top: 16px; }
.dgprod-cms-feats .pro-feature-heading {
    display: block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--dg-green);
    margin-bottom: 10px;
}
.dgprod-card--featured .dgprod-feats li { color: #eaf6ef; }
.dgprod-card--featured .dgprod-feats li:before {
    background: rgba(255,255,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d7df18' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
}

/* form controls — pin license block + CTA to the bottom for alignment */
.dgprod-form { display: flex; flex-direction: column; margin-top: auto; }
.dgprod-flabel {
    display: block;
    margin-top: auto;
    padding-top: 18px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .4px;
    text-transform: uppercase;
    color: var(--dg-muted);
    margin-bottom: 7px;
}
.dgprod-card--featured .dgprod-flabel { color: rgba(255,255,255,.75); }
.dgprod-form .dgprod-flabel { margin-top: 0; }
.dgprod-select {
    width: 100%;
    height: 46px;
    padding: 0 40px 0 14px;
    font-size: 14px;
    font-weight: 600;
    color: var(--dg-ink) !important;
    background-color: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 11px;
    outline: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    margin-bottom: 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064b3f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px;
}
.dgprod-select:focus { border-color: var(--dg-green); box-shadow: 0 0 0 3px rgba(6,75,63,.14); }
.dgprod-card--featured .dgprod-select { border-color: rgba(255,255,255,.22); }

/* buttons */
.dgprod-actions { margin-top: 4px; display: flex; flex-direction: column; gap: 9px; }
.dgprod-btn {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 11px;
    padding: 13px 16px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .2px;
    cursor: pointer;
    text-align: center;
    transition: transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.dgprod-btn:active { transform: translateY(1px); }
.dgprod-btn--buy {
    background: var(--dg-green);
    color: #fff;
    box-shadow: 0 16px 30px -18px rgba(6,75,63,.85);
}
.dgprod-btn--buy:hover { background: var(--dg-deep); color: #fff; box-shadow: 0 20px 36px -16px rgba(6,75,63,.95); }
.dgprod-btn--demo {
    background: #fff;
    color: var(--dg-green);
    border: 1.5px solid #cfe2d7;
}
.dgprod-btn--demo:hover { background: #eaf3ee; color: var(--dg-deep); }
.dgprod-card--featured .dgprod-btn--buy { background: var(--dg-lime); color: var(--dg-ink); box-shadow: 0 16px 30px -16px rgba(215,223,24,.6); }
.dgprod-card--featured .dgprod-btn--buy:hover { background: #c7ce15; }
.dgprod-actions .pdf_form { margin: 0; }

.dgprod-metaline {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--dg-line);
    font-size: 12px;
    color: var(--dg-muted);
    text-align: center;
}
.dgprod-card--featured .dgprod-metaline { color: rgba(255,255,255,.65); border-top-color: rgba(255,255,255,.16); }

/* ---------- Trust strip ---------- */
.dgprod-trust {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    background: #fff;
    border: 1px solid var(--dg-line);
    border-radius: 16px;
    padding: 22px 20px;
    box-shadow: 0 22px 48px -38px rgba(6,75,63,.4);
    margin-bottom: 40px;
}
.dgprod-trust-item { display: flex; align-items: center; gap: 13px; }
.dgprod-trust-i {
    flex: 0 0 auto;
    width: 42px; height: 42px;
    display: grid; place-items: center;
    font-size: 19px;
    background: #eaf3ee;
    border-radius: 11px;
}
.dgprod-trust-item div { display: flex; flex-direction: column; }
.dgprod-trust-item strong { font-size: 14px; font-weight: 800; color: var(--dg-ink); }
.dgprod-trust-item span { font-size: 12.5px; color: var(--dg-muted); }

/* ---------- Details / SEO prose ---------- */
.dgprod-details { max-width: 920px; margin: 0 auto; }
.dgprod-prose { color: var(--dg-ink); }
.dgprod-prose:empty { display: none; }
.dgprod-prose h1, .dgprod-prose h2, .dgprod-prose h3 {
    font-size: 22px;
    font-weight: 800;
    color: var(--dg-ink);
    margin: 22px 0 10px;
    line-height: 1.3;
}
.dgprod-prose h3 { font-size: 19px; }
.dgprod-prose h2 b, .dgprod-prose h3 b { color: var(--dg-green); }
.dgprod-prose p { font-size: 15px; line-height: 1.75; color: var(--dg-muted); margin: 0 0 12px; }
.dgprod-prose ul { padding-left: 20px; }
.dgprod-prose li { font-size: 15px; line-height: 1.7; color: var(--dg-ink); margin-bottom: 6px; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .dgprod-grid { grid-template-columns: repeat(2, 1fr); }
    .dgprod-trust { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .dgprod-head .purchase_title_head, .dgprod-head h1 { font-size: 26px; }
    .dgprod-grid { grid-template-columns: 1fr; }
    .dgprod-trust { grid-template-columns: 1fr; }
    .dgprod-card { padding: 22px 18px; }
    .dgprod-price { font-size: 36px; }
}

/* ---------- Exam page v3.1: decluttered hero + full-width comments ---------- */
.dg3-hero__facts {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin: 0 0 22px; font-size: 14px; color: rgba(255,255,255,.85);
}
.dg3-hero__facts strong { color: #fff; font-weight: 800; }
.dg3-hero__dot { color: rgba(255,255,255,.4); }

/* Comments + study guide pulled full-width below the 2-col grid */
.dg3-page > .dg3-comments--wide { margin-top: 26px; }
.dg3-comments--wide .dg3-section__head { max-width: 720px; }

/* 2-column name/email row in the comment form */
.dg3-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 600px) { .dg3-form-row { grid-template-columns: 1fr; gap: 0; } }

/* =====================================================================
   v3.2 — two-column layout restored + richer sidebar cards
   Matches the refreshed mockups: free-PDF page (pdf_detail.php) and
   exam-PDF page (default.php) use a main column + sticky aside. The
   core grid/card classes already exist above (.dg3-grid-2 / .dg3-aside
   / .dg3-card / .dg3-card--dark / .dg3-sticky-cta). The rules below add
   the few extras the mockups need.
   ===================================================================== */

/* Main column wrapper inside the 2-col grid */
.dg3-main { min-width: 0; }
.dg3-main > .dg3-section,
.dg3-main > .dg3-comments { margin-bottom: 22px; }
.dg3-main > .dg3-section:last-child,
.dg3-main > .dg3-comments:last-child { margin-bottom: 0; }

/* Sidebar card: full-width CTA + sub-note + optional leading row icons */
.dg3-card .dg3-card__btn { width: 100%; margin-top: 6px; }
.dg3-card__note { display: block; margin-top: 11px; font-size: 11.5px; color: var(--dg-muted); text-align: center; line-height: 1.5; }
.dg3-card--dark .dg3-card__note { color: rgba(255, 255, 255, .6); }
.dg3-card__list li .dg3-k { display: inline-flex; align-items: center; gap: 8px; }
.dg3-card__list li .dg3-k svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--dg-green); }
.dg3-card--dark .dg3-card__list li .dg3-k svg { color: var(--dg-lime); }

/* Checklist inside a white sidebar card (simulator / formats) */
.dg3-card__feats { list-style: none; margin: 4px 0 16px; padding: 0; }
.dg3-card__feats li { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; font-weight: 600; color: var(--dg-ink); line-height: 1.5; margin-bottom: 10px; }
.dg3-card__feats svg { color: var(--dg-green); flex: 0 0 auto; margin-top: 2px; }

/* Clamped prose for the study-guide sidebar card */
.dg3-card__prose { font-size: 13.5px; line-height: 1.7; color: var(--dg-muted); position: relative; overflow: hidden; }
.dg3-card__prose h1, .dg3-card__prose h2, .dg3-card__prose h3 { font-size: 15px; color: var(--dg-green); font-weight: 800; margin: 0 0 8px; line-height: 1.3; }
.dg3-card__prose p { margin: 0 0 10px; }
.dg3-card__prose a { color: var(--dg-green); font-weight: 700; }
.dg3-card__prose img { display: none; }
.dg3-card__prose:not(.is-open) { max-height: 232px; }
.dg3-card__prose:not(.is-open)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 64px; background: linear-gradient(transparent, #fff); pointer-events: none; }
.dg3-card__more { margin-top: 12px; }

/* Overview link row (free page "Free vs Premium comparison") */
.dg3-linkrow { display: inline-flex; align-items: center; gap: 9px; margin-top: 16px; padding: 12px 16px; border-radius: 12px; background: var(--dg-soft); border: 1px solid var(--dg-line); color: var(--dg-green); font-weight: 800; font-size: 13.5px; text-decoration: none; transition: background .15s ease, transform .15s ease, color .15s ease; }
.dg3-linkrow:hover { background: #eaf3ee; transform: translateX(2px); color: var(--dg-deep); }
.dg3-linkrow svg { flex: 0 0 auto; }

/* "Best value" flag on the comparison official column */
.dg3-besttag { display: inline-block; font-size: 9.5px; font-weight: 900; letter-spacing: .5px; text-transform: uppercase; color: var(--dg-ink); background: var(--dg-lime); padding: 2px 8px; border-radius: 6px; margin-bottom: 6px; }

/* Live-preview pills row */
.dg3-pills--preview { margin-top: 14px; }

/* Rating summary widget (reviews) */
.dg3-reviews-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 24px; align-items: start; margin-top: 4px; }
.dg3-rating-card { background: var(--dg-soft); border: 1px solid var(--dg-line); border-radius: 16px; padding: 20px; text-align: center; }
.dg3-rating-card__num { font-size: 44px; font-weight: 900; color: var(--dg-ink); line-height: 1; }
.dg3-rating-card__stars { color: var(--dg-lime); font-size: 18px; letter-spacing: 2px; margin: 7px 0 3px; }
.dg3-rating-card__sub { font-size: 12.5px; color: var(--dg-muted); margin-bottom: 16px; }
.dg3-rating-bars { display: flex; flex-direction: column; gap: 7px; text-align: left; margin-bottom: 14px; }
.dg3-rating-bar { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dg-muted); }
.dg3-rating-bar__k { width: 28px; flex: 0 0 auto; }
.dg3-rating-bar__track { flex: 1 1 auto; height: 7px; border-radius: 999px; background: #e3ece7; overflow: hidden; }
.dg3-rating-bar__fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--dg-green), #27c08d); }
.dg3-rating-bar__v { width: 36px; flex: 0 0 auto; text-align: right; }
.dg3-rating-card__link { display: inline-block; font-size: 13px; font-weight: 800; color: var(--dg-green); text-decoration: none; padding: 9px 16px; border: 1px solid var(--dg-line); border-radius: 10px; background: #fff; transition: background .15s ease; }
.dg3-rating-card__link:hover { background: #eaf3ee; color: var(--dg-deep); }
@media (max-width: 600px) { .dg3-reviews-grid { grid-template-columns: 1fr; } }

/* The aside should not be sticky when it holds tall study-guide copy */
.dg3-aside--flow { position: static; }