/* =========================================================================
   DAI PHAT GARDEN — theme.css
   Component & layout styles. Brand tokens live in style.css :root.
   ========================================================================= */

/* =========================================================================
   Top bar
   ========================================================================= */
.dpg-topbar {
    background: var(--dpg-navy);
    color: rgba(255,255,255,.86);
    font-size: .82rem;
    padding: .5rem 0;
}
.dpg-topbar a, .dpg-topbar a:hover { color: #fff; }
.dpg-topbar svg { vertical-align: -2px; opacity: .85; }

/* =========================================================================
   Header / Navbar
   ========================================================================= */
.dpg-header {
    background: rgba(255,255,255,.97);
    backdrop-filter: saturate(1.4) blur(10px);
    -webkit-backdrop-filter: saturate(1.4) blur(10px);
    border-bottom: 1px solid var(--dpg-line);
}
.dpg-navbar { padding: .85rem 0; }

.dpg-brand {
    display: flex;
    align-items: center;
}
.custom-logo-link img,
.dpg-brand .custom-logo {
    max-height: 56px;
    width: auto;
}

.dpg-brand__text {
    display: flex;
    align-items: center;
    gap: .65rem;
    text-decoration: none;
}
.dpg-brand__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border-radius: 12px;
    background: var(--dpg-gradient);
    color: #fff;
    font-family: var(--dpg-font-display);
    font-weight: 700;
    font-size: 1.1rem;
    box-shadow: var(--dpg-shadow-sm);
    letter-spacing: .02em;
}
.dpg-brand__name strong {
    display: block;
    font-family: var(--dpg-font-display);
    font-size: 1.18rem;
    color: var(--dpg-navy);
    line-height: 1.1;
    font-weight: 700;
}
.dpg-brand__name em {
    display: block;
    font-style: normal;
    font-size: .72rem;
    color: var(--dpg-muted);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.dpg-brand--footer .dpg-brand__name strong { color: #fff; }
.dpg-brand--footer .dpg-brand__name em { color: rgba(255,255,255,.6); }

/* Nav links */
.dpg-navbar .nav-link {
    color: var(--dpg-ink);
    font-weight: 500;
    padding: .5rem 1rem;
    position: relative;
}
.dpg-navbar .nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px; left: 1rem; right: 1rem;
    height: 2px;
    background: var(--dpg-gradient);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .25s ease;
}
.dpg-navbar .nav-link:hover,
.dpg-navbar .nav-item.active > .nav-link {
    color: var(--dpg-navy);
}
.dpg-navbar .nav-link:hover::after,
.dpg-navbar .nav-item.active > .nav-link::after {
    transform: scaleX(1);
}
.dpg-navbar .dropdown-menu {
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius);
    box-shadow: var(--dpg-shadow);
    padding: .5rem;
    margin-top: .5rem;
}
.dpg-navbar .dropdown-item {
    border-radius: var(--dpg-radius-sm);
    padding: .55rem .85rem;
    color: var(--dpg-text);
}
.dpg-navbar .dropdown-item:hover {
    background: var(--dpg-bg-soft);
    color: var(--dpg-navy);
}

/* Utility icons */
.dpg-utility .dpg-icon-btn {
    width: 42px; height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--dpg-line);
    background: #fff;
    color: var(--dpg-ink);
    margin-left: .35rem;
    padding: 0;
    transition: all .18s ease;
    position: relative;
}
.dpg-utility .dpg-icon-btn:hover {
    border-color: var(--dpg-navy);
    color: var(--dpg-navy);
}
.dpg-utility .nav-link.dpg-icon-btn::after { display: none; }
.dpg-cart__count {
    position: absolute;
    top: -4px; right: -4px;
    background: var(--dpg-green);
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 6px;
    min-width: 18px;
    line-height: 1;
}

.dpg-search-wrap {
    border-top: 1px solid var(--dpg-line);
    background: var(--dpg-bg-soft);
}

/* =========================================================================
   Hero
   ========================================================================= */
.dpg-hero {
    padding: clamp(3rem, 6vw, 6rem) 0 clamp(3rem, 6vw, 5rem);
    background: linear-gradient(180deg, var(--dpg-bg-soft) 0%, #fff 100%);
    position: relative;
    overflow: hidden;
}
.dpg-hero::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 380px; height: 380px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(63,165,53,.10), transparent 65%);
    pointer-events: none;
}
.dpg-hero__copy { z-index: 2; position: relative; }
.dpg-hero__title {
    font-size: clamp(2.2rem, 4.5vw, 3.6rem);
    margin-bottom: 1.25rem;
}
.dpg-hero__accent {
    background: var(--dpg-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-style: italic;
}
.dpg-hero__lede {
    font-size: 1.08rem;
    color: var(--dpg-muted);
    max-width: 52ch;
    margin-bottom: 1.75rem;
}
.dpg-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; }

.dpg-hero__bullets li strong {
    font-family: var(--dpg-font-display);
    font-size: 1.4rem;
    color: var(--dpg-navy);
}

.dpg-hero__visual { position: relative; }
.dpg-hero__frame {
    position: relative;
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    background: linear-gradient(135deg, #FAFBF7, #fff);
    box-shadow: var(--dpg-shadow-lg);
    aspect-ratio: 4 / 5;
}
.dpg-hero__frame img,
.dpg-hero__frame svg { width: 100%; height: 100%; object-fit: cover; display: block; }

.dpg-hero__badge {
    position: absolute;
    bottom: 1.25rem; left: 1.25rem;
    background: #fff;
    border-radius: var(--dpg-radius);
    padding: .65rem .85rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    box-shadow: var(--dpg-shadow);
    max-width: 240px;
}
.dpg-hero__badge-icon {
    flex-shrink: 0;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: rgba(63,165,53,.12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.dpg-hero__badge strong { display: block; font-size: .9rem; color: var(--dpg-ink); }
.dpg-hero__badge small  { display: block; font-size: .75rem; color: var(--dpg-muted); }

/* =========================================================================
   Section heads
   ========================================================================= */
.dpg-section__head { margin-bottom: 2rem; }
.dpg-section__head h2 { margin-bottom: 0; }
.dpg-section__more { font-weight: 600; }

/* =========================================================================
   Category cards
   ========================================================================= */
.dpg-cat-card {
    display: block;
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    height: 100%;
}
.dpg-cat-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--dpg-shadow);
    border-color: transparent;
    color: inherit;
}
.dpg-cat-card__image {
    aspect-ratio: 4 / 3;
    background: var(--dpg-bg-soft);
    overflow: hidden;
}
.dpg-cat-card__image img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.dpg-cat-card:hover .dpg-cat-card__image img { transform: scale(1.05); }
.dpg-cat-card__placeholder {
    width: 100%; height: 100%;
    background:
        radial-gradient(circle at 30% 30%, rgba(63,165,53,.15), transparent 60%),
        radial-gradient(circle at 70% 70%, rgba(27,58,139,.15), transparent 60%),
        var(--dpg-bg-soft);
}
.dpg-cat-card__body { padding: 1.1rem 1.25rem; }
.dpg-cat-card__title {
    font-size: 1.15rem;
    margin-bottom: .2rem;
    color: var(--dpg-navy);
}
.dpg-cat-card__meta { font-size: .85rem; color: var(--dpg-muted); }

/* =========================================================================
   Value props
   ========================================================================= */
.dpg-value {
    padding: 1.5rem 1rem;
    height: 100%;
}
.dpg-value__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px; height: 56px;
    border-radius: 16px;
    background: var(--dpg-gradient-soft);
    color: var(--dpg-green-dark);
    margin-bottom: 1rem;
}
.dpg-value h3 { font-size: 1.05rem; margin-bottom: .35rem; color: var(--dpg-navy); }

/* =========================================================================
   Blog post cards
   ========================================================================= */
.dpg-post-card {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    height: 100%;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.dpg-post-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--dpg-shadow);
    border-color: transparent;
}
.dpg-post-card__media {
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--dpg-bg-soft);
}
.dpg-post-card__media img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.dpg-post-card:hover .dpg-post-card__media img { transform: scale(1.04); }
.dpg-post-card__placeholder {
    width: 100%; height: 100%;
    background: var(--dpg-gradient-soft);
}
.dpg-post-card__body { padding: 1.25rem 1.4rem 1.5rem; }
.dpg-post-card__meta { margin-bottom: .5rem; }
.dpg-post-card__title { margin-bottom: .5rem; }
.dpg-post-card__title a { color: var(--dpg-ink); }
.dpg-post-card__title a:hover { color: var(--dpg-green); }
.dpg-post-card__excerpt { color: var(--dpg-muted); font-size: .92rem; margin-bottom: 0; }

/* =========================================================================
   CTA box
   ========================================================================= */
.dpg-cta__box {
    background: var(--dpg-gradient);
    border-radius: var(--dpg-radius-lg);
    padding: clamp(2rem, 4vw, 3rem);
    color: #fff;
    box-shadow: var(--dpg-shadow-lg);
}
.dpg-cta__form { display: flex; gap: .5rem; }
.dpg-cta__form input {
    flex: 1;
    border: 0;
    border-radius: 999px;
    padding: .75rem 1.1rem;
    font-family: var(--dpg-font-body);
}
.dpg-cta__form input:focus { outline: none; box-shadow: 0 0 0 3px rgba(255,255,255,.4); }

/* =========================================================================
   Single post / Page prose
   ========================================================================= */
.dpg-prose {
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--dpg-text);
}
.dpg-prose h2, .dpg-prose h3, .dpg-prose h4 { margin-top: 2rem; margin-bottom: .8rem; }
.dpg-prose p { margin-bottom: 1.1rem; }
.dpg-prose img { border-radius: var(--dpg-radius); margin: 1.25rem 0; }
.dpg-prose blockquote {
    border-left: 3px solid var(--dpg-green);
    padding: .25rem 0 .25rem 1.25rem;
    font-style: italic;
    color: var(--dpg-muted);
    margin: 1.5rem 0;
}
.dpg-prose code {
    background: var(--dpg-bg-soft);
    padding: .15rem .4rem;
    border-radius: 4px;
    font-size: .9em;
}
.dpg-prose pre {
    background: #0F1A2E;
    color: #E6EDF3;
    padding: 1rem;
    border-radius: var(--dpg-radius);
    overflow-x: auto;
}
.dpg-prose ul, .dpg-prose ol { padding-left: 1.4rem; margin-bottom: 1.1rem; }
.dpg-prose a { color: var(--dpg-navy); text-decoration: underline; text-underline-offset: 3px; }
.dpg-prose a:hover { color: var(--dpg-green); }

.dpg-single__head h1 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); margin-bottom: .75rem; }
.dpg-single__hero {
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    margin: 0 0 2rem;
}
.dpg-single__hero img { width: 100%; height: auto; display: block; }
.dpg-single__tags a {
    display: inline-block;
    padding: .25rem .65rem;
    background: var(--dpg-bg-soft);
    border-radius: 999px;
    font-size: .82rem;
    color: var(--dpg-text);
    margin-right: .35rem;
}
.dpg-single__tags a:hover { background: var(--dpg-navy); color: #fff; }

.dpg-page__head h1 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); margin-bottom: 0; }
.dpg-page__hero {
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    margin: 1.5rem 0 2rem;
}

/* Author box */
.dpg-author-box {
    background: var(--dpg-bg-soft);
    border-radius: var(--dpg-radius-lg);
    padding: 1.5rem;
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}
.dpg-author-box__avatar { border-radius: 999px; }
.dpg-author-box h4 { margin-bottom: .15rem; color: var(--dpg-navy); }

/* Post nav */
.dpg-post-nav__item {
    display: block;
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius);
    padding: 1rem 1.25rem;
    transition: border-color .2s ease, transform .2s ease;
}
.dpg-post-nav__item:hover { border-color: var(--dpg-green); transform: translateY(-2px); }
.dpg-post-nav__item small { color: var(--dpg-muted); display: block; margin-bottom: .25rem; }
.dpg-post-nav__item a { color: var(--dpg-ink); font-weight: 600; }
.dpg-post-nav__next { text-align: right; }

/* Pagination */
.dpg-pagination { margin-top: 3rem; }
.dpg-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px; height: 40px;
    padding: 0 .65rem;
    margin: 0 .15rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--dpg-line);
    color: var(--dpg-text);
    text-decoration: none;
    font-weight: 600;
}
.dpg-pagination .page-numbers:hover { border-color: var(--dpg-navy); color: var(--dpg-navy); }
.dpg-pagination .page-numbers.current {
    background: var(--dpg-gradient);
    color: #fff;
    border-color: transparent;
}

/* Archive head */
.dpg-archive__title { font-size: clamp(1.8rem, 3.5vw, 2.6rem); }
.dpg-archive__desc { max-width: 60ch; margin: 1rem auto 0; }

/* =========================================================================
   Sidebar
   ========================================================================= */
.dpg-widget {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    padding: 1.25rem 1.4rem;
    margin-bottom: 1.5rem;
}
.dpg-widget .widget-title {
    font-family: var(--dpg-font-display);
    font-size: 1.05rem;
    color: var(--dpg-navy);
    margin-bottom: 1rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--dpg-line);
}
.dpg-widget__list li {
    padding: .35rem 0;
    border-bottom: 1px dashed var(--dpg-line);
    font-size: .92rem;
}
.dpg-widget__list li:last-child { border-bottom: 0; }
.dpg-widget__list a { color: var(--dpg-text); }
.dpg-widget__list a:hover { color: var(--dpg-green); }

.dpg-recent-post { padding: .65rem 0; border-bottom: 1px solid var(--dpg-line); }
.dpg-recent-post:last-child { border-bottom: 0; }
.dpg-recent-post__link { display: flex; gap: .75rem; align-items: flex-start; }
.dpg-recent-post__thumb { flex-shrink: 0; width: 64px; height: 64px; overflow: hidden; border-radius: var(--dpg-radius-sm); }
.dpg-recent-post__thumb img { width: 100%; height: 100%; object-fit: cover; }
.dpg-recent-post__title {
    display: block;
    font-weight: 600;
    color: var(--dpg-ink);
    font-size: .92rem;
    line-height: 1.35;
    margin-bottom: .15rem;
}
.dpg-recent-post:hover .dpg-recent-post__title { color: var(--dpg-green); }

.dpg-widget--cta { padding: 0; border: 0; }
.dpg-widget-cta {
    background: var(--dpg-gradient);
    padding: 1.5rem;
    border-radius: var(--dpg-radius-lg);
}

/* Search form */
.dpg-search-form,
.search-form {
    display: flex;
    gap: .5rem;
}
.dpg-search-form input[type="search"],
.search-form input[type="search"] {
    flex: 1;
    border: 1px solid var(--dpg-line);
    border-radius: 999px;
    padding: .65rem 1.1rem;
    font-family: var(--dpg-font-body);
}
.dpg-search-form input[type="search"]:focus,
.search-form input[type="search"]:focus {
    outline: none;
    border-color: var(--dpg-green);
    box-shadow: 0 0 0 3px rgba(63,165,53,.18);
}
.dpg-search-form button,
.search-form button {
    border: 0;
    background: var(--dpg-gradient);
    color: #fff;
    border-radius: 999px;
    padding: .65rem 1.25rem;
    font-weight: 600;
    cursor: pointer;
}

/* =========================================================================
   WooCommerce
   ========================================================================= */
.dpg-shop-hero {
    padding: clamp(2rem, 5vw, 3.5rem) 0 1.5rem;
    background: var(--dpg-bg-soft);
}
.dpg-shop-hero__title {
    font-size: clamp(1.8rem, 3.5vw, 2.6rem);
    margin-bottom: .5rem;
}
.dpg-shop-hero__desc { max-width: 60ch; margin-bottom: 1rem; }
.dpg-bc { color: var(--dpg-muted); }
.dpg-bc a { color: var(--dpg-muted); }
.dpg-bc a:hover { color: var(--dpg-navy); }
.dpg-bc__sep { opacity: .4; margin: 0 .35rem; }

/* WC products grid */
.woocommerce ul.products, .woocommerce-page ul.products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    padding: 0;
    margin: 0;
    list-style: none;
}
.woocommerce ul.products li.product { width: 100% !important; margin: 0 !important; float: none !important; }
@media (max-width: 991px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .woocommerce ul.products { grid-template-columns: 1fr; } }

.woocommerce ul.products li.product {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    padding: 1rem 1rem 1.25rem;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    position: relative;
}
.woocommerce ul.products li.product:hover {
    transform: translateY(-3px);
    box-shadow: var(--dpg-shadow);
    border-color: transparent;
}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link img,
.woocommerce ul.products li.product img {
    border-radius: var(--dpg-radius);
    aspect-ratio: 1;
    object-fit: cover;
}
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--dpg-font-body) !important;
    font-size: 1rem !important;
    font-weight: 600;
    color: var(--dpg-ink) !important;
    padding: .75rem 0 .25rem !important;
    margin: 0;
}
.woocommerce ul.products li.product .price {
    color: var(--dpg-navy) !important;
    font-weight: 700;
    font-size: 1.05rem !important;
}
.woocommerce ul.products li.product .price del { color: var(--dpg-muted); font-weight: 400; font-size: .85rem; }
.woocommerce ul.products li.product .price ins { background: transparent; }

.woocommerce span.onsale {
    background: var(--dpg-sale) !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: .2rem .6rem !important;
    font-weight: 700 !important;
    font-size: .75rem !important;
    min-height: auto !important;
    min-width: auto !important;
    line-height: 1.4 !important;
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    margin: 0 !important;
}

.woocommerce .star-rating { color: var(--dpg-star) !important; font-size: .8rem; }

.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background: var(--dpg-gradient) !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: .55rem 1.15rem !important;
    font-weight: 600 !important;
    border: 0 !important;
    text-decoration: none !important;
    transition: filter .18s ease, transform .18s ease;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.woocommerce a.button.alt,
.woocommerce button.button.alt {
    background: var(--dpg-navy) !important;
}

/* Single product */
.woocommerce div.product .product_title {
    font-family: var(--dpg-font-display);
    font-size: clamp(1.6rem, 3vw, 2.2rem) !important;
    color: var(--dpg-ink);
    margin-bottom: .5rem !important;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--dpg-navy) !important;
    font-size: 1.5rem !important;
    font-weight: 700;
}
.woocommerce div.product .woocommerce-product-rating { margin-bottom: 1rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs {
    border-bottom: 1px solid var(--dpg-line) !important;
    padding: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    margin: 0 1.25rem 0 0 !important;
    padding: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: .9rem 0 !important;
    color: var(--dpg-muted) !important;
    font-weight: 600;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--dpg-navy) !important;
    border-bottom: 2px solid var(--dpg-green);
}

/* Forms / cart */
.woocommerce table.shop_table {
    border-collapse: separate;
    border-radius: var(--dpg-radius) !important;
    border: 1px solid var(--dpg-line) !important;
}
.woocommerce-info, .woocommerce-message, .woocommerce-error {
    border-top-color: var(--dpg-green) !important;
    border-radius: var(--dpg-radius) !important;
}
.woocommerce-info::before, .woocommerce-message::before { color: var(--dpg-green) !important; }

/* =========================================================================
   Wave divider / Footer
   ========================================================================= */
.dpg-wave-divider {
    line-height: 0;
    margin-top: 4rem;
}
.dpg-wave-divider svg { width: 100%; height: 80px; display: block; }

.dpg-footer {
    background: var(--dpg-navy);
    color: rgba(255,255,255,.78);
    padding: 3rem 0 1.5rem;
    position: relative;
}
.dpg-footer__main { padding-bottom: 2rem; }
.dpg-footer .footer-widget-title,
.dpg-footer h5 {
    color: #fff;
    font-size: 1rem;
    font-family: var(--dpg-font-body);
    font-weight: 700;
    letter-spacing: .03em;
    margin-bottom: 1rem;
    text-transform: uppercase;
}
.dpg-footer a {
    color: rgba(255,255,255,.78);
    text-decoration: none;
}
.dpg-footer a:hover { color: var(--dpg-green-soft); }
.dpg-footer__list li { padding: .35rem 0; font-size: .92rem; }
.dpg-footer__list li a { display: inline-block; }
.dpg-tagline { color: rgba(255,255,255,.92); font-style: italic; }
.dpg-footer__desc { font-size: .9rem; color: rgba(255,255,255,.65); line-height: 1.65; }

.dpg-footer__contact li {
    display: flex;
    gap: .65rem;
    margin-bottom: .65rem;
    font-size: .9rem;
    line-height: 1.5;
}
.dpg-footer__icon {
    flex-shrink: 0;
    width: 28px; height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.08);
    border-radius: 8px;
    color: var(--dpg-green-soft);
}

.dpg-social__list a {
    width: 36px; height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.1);
    border-radius: 999px;
    color: #fff;
    transition: background .2s ease;
}
.dpg-social__list a:hover { background: var(--dpg-green); color: #fff; }

.dpg-footer__bottom {
    border-top: 1px solid rgba(255,255,255,.12);
    padding-top: 1.25rem;
    color: rgba(255,255,255,.55);
}
.dpg-footer__bottom-menu a { color: rgba(255,255,255,.65); }

/* =========================================================================
   Comments
   ========================================================================= */
.comments-area {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid var(--dpg-line);
}
.comments-area .comments-title {
    font-family: var(--dpg-font-display);
    font-size: 1.4rem;
    margin-bottom: 1.5rem;
    color: var(--dpg-navy);
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius);
    padding: .65rem 1rem;
    font-family: var(--dpg-font-body);
}
.comment-form .form-submit input {
    background: var(--dpg-gradient);
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: .65rem 1.4rem;
    font-weight: 600;
    cursor: pointer;
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 991.98px) {
    .dpg-navbar .nav-link::after { display: none; }
    .dpg-utility { flex-direction: row; margin-top: .75rem; }
    .dpg-hero { padding-top: 2.5rem; }
}
@media (max-width: 575.98px) {
    .dpg-brand__name em { display: none; }
    .dpg-hero__badge { max-width: 200px; }
    .dpg-cta__form { flex-direction: column; }
    .dpg-cta__form button { width: 100%; }
}

/* =========================================================================
   PAGE: Contact
   ========================================================================= */
.dpg-contact-hero {
    padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(2rem, 4vw, 3rem);
    background: linear-gradient(180deg, var(--dpg-bg-soft) 0%, #fff 100%);
}
.dpg-contact-hero__title {
    font-size: clamp(2rem, 4vw, 3rem);
    margin-bottom: 1rem;
}
.dpg-contact-hero__lede { font-size: 1.05rem; max-width: 56ch; }
.dpg-contact-hero__visual {
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    aspect-ratio: 1;
    background: #fff;
    box-shadow: var(--dpg-shadow);
    max-width: 480px;
    margin-left: auto;
}
.dpg-contact-hero__visual svg { width: 100%; height: 100%; display: block; }

.dpg-info-card {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    padding: 1.75rem 1.5rem;
    height: 100%;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.dpg-info-card:hover {
    transform: translateY(-3px);
    border-color: transparent;
    box-shadow: var(--dpg-shadow);
}
.dpg-info-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px; height: 52px;
    border-radius: 14px;
    background: var(--dpg-gradient-soft);
    color: var(--dpg-green-dark);
    margin-bottom: 1rem;
}
.dpg-info-card h3 { color: var(--dpg-navy); margin-bottom: .35rem; font-size: 1rem; }
.dpg-info-card__link { color: var(--dpg-ink); font-weight: 600; }
.dpg-info-card__link:hover { color: var(--dpg-green); }

/* Contact form */
.dpg-contact-form .form-label {
    font-size: .9rem;
    font-weight: 600;
    color: var(--dpg-ink);
    margin-bottom: .35rem;
}
.dpg-contact-form .form-control,
.dpg-contact-form .form-select {
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius);
    padding: .65rem .9rem;
    font-family: var(--dpg-font-body);
    font-size: .95rem;
    background: #fff;
}
.dpg-contact-form .form-control:focus,
.dpg-contact-form .form-select:focus {
    outline: none;
    border-color: var(--dpg-green);
    box-shadow: 0 0 0 3px rgba(63,165,53,.18);
}

.dpg-contact-side__map {
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    border: 1px solid var(--dpg-line);
    background: var(--dpg-bg-soft);
}
.dpg-contact-side__map iframe { width: 100%; display: block; }

/* FAQ */
.dpg-faq .accordion-item {
    background: #fff;
    border: 1px solid var(--dpg-line) !important;
    border-radius: var(--dpg-radius) !important;
    margin-bottom: .75rem;
    overflow: hidden;
}
.dpg-faq .accordion-button {
    font-family: var(--dpg-font-body);
    font-weight: 600;
    color: var(--dpg-ink);
    background: #fff;
    padding: 1rem 1.25rem;
}
.dpg-faq .accordion-button:not(.collapsed) {
    color: var(--dpg-navy);
    background: var(--dpg-bg-soft);
    box-shadow: none;
}
.dpg-faq .accordion-button:focus {
    box-shadow: 0 0 0 .2rem rgba(63,165,53,.18);
    border-color: var(--dpg-green);
}
.dpg-faq .accordion-body {
    padding: 0 1.25rem 1.25rem;
}

/* =========================================================================
   PAGE: Knowledge / Blog
   ========================================================================= */
.dpg-knowledge-hero {
    padding: clamp(3rem, 6vw, 5rem) 0 clamp(2rem, 4vw, 3rem);
    background: linear-gradient(180deg, var(--dpg-bg-soft) 0%, #fff 100%);
}
.dpg-knowledge-hero__title {
    font-size: clamp(2rem, 4vw, 3rem);
    margin-bottom: 1rem;
}

/* Filter chips */
.dpg-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem 1rem;
    background: #fff;
    border: 1.5px solid var(--dpg-line);
    border-radius: 999px;
    color: var(--dpg-text);
    font-size: .9rem;
    font-weight: 500;
    text-decoration: none;
    transition: all .2s ease;
}
.dpg-chip small { color: var(--dpg-muted); font-weight: 400; }
.dpg-chip:hover {
    border-color: var(--dpg-green);
    color: var(--dpg-navy);
}
.dpg-chip.is-active {
    background: var(--dpg-gradient);
    border-color: transparent;
    color: #fff;
}
.dpg-chip.is-active small { color: rgba(255,255,255,.75); }

/* Featured post */
.dpg-featured-post__media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 11;
    border-radius: var(--dpg-radius-lg);
    overflow: hidden;
    background: var(--dpg-bg-soft);
}
.dpg-featured-post__media img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .4s ease;
}
.dpg-featured-post__media:hover img { transform: scale(1.03); }
.dpg-featured-post__placeholder {
    width: 100%; height: 100%;
    background: var(--dpg-gradient-soft);
}
.dpg-featured-post__badge {
    position: absolute;
    top: 1rem; left: 1rem;
    background: var(--dpg-gradient);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .35rem .75rem;
    border-radius: 999px;
}
.dpg-featured-post__title {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    margin-bottom: .75rem;
    line-height: 1.25;
}
.dpg-featured-post__title a { color: var(--dpg-ink); }
.dpg-featured-post__title a:hover { color: var(--dpg-green); }

.dpg-post-card__more {
    color: var(--dpg-green);
    font-weight: 600;
}
.dpg-post-card__more:hover { color: var(--dpg-navy); }

/* =========================================================================
   SHOP: Sidebar & toolbar
   ========================================================================= */
.dpg-shop-sidebar .dpg-widget {
    margin-bottom: 1.25rem;
}
.dpg-cat-list__item {
    border-bottom: 1px solid var(--dpg-line);
    padding: 0;
}
.dpg-cat-list__item:last-child { border-bottom: 0; }
.dpg-cat-list__item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .55rem 0;
    color: var(--dpg-text);
    font-size: .92rem;
}
.dpg-cat-list__item a:hover { color: var(--dpg-green); }
.dpg-cat-list__item.is-active a {
    color: var(--dpg-navy);
    font-weight: 600;
}

/* Shop toolbar */
.dpg-shop-toolbar {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius);
    padding: .75rem 1rem;
}
.woocommerce .woocommerce-ordering select {
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-sm);
    padding: .4rem .65rem;
    font-family: var(--dpg-font-body);
    font-size: .9rem;
    background: #fff;
}

/* WC Price filter */
.dpg-shop-sidebar .widget_price_filter .price_slider_wrapper { padding-top: .5rem; }
.dpg-shop-sidebar .widget_price_filter .ui-slider {
    background: var(--dpg-line);
    border: 0;
    height: 4px;
    border-radius: 999px;
}
.dpg-shop-sidebar .widget_price_filter .ui-slider .ui-slider-range {
    background: var(--dpg-gradient);
    height: 4px;
}
.dpg-shop-sidebar .widget_price_filter .ui-slider .ui-slider-handle {
    background: var(--dpg-navy);
    border: 2px solid #fff;
    height: 16px; width: 16px;
    border-radius: 999px;
    margin-left: -8px;
    top: -6px;
    box-shadow: var(--dpg-shadow-sm);
}
.dpg-shop-sidebar .widget_price_filter .price_slider_amount .button {
    background: var(--dpg-gradient) !important;
    color: #fff !important;
    border: 0;
    border-radius: 999px !important;
    padding: .35rem .85rem !important;
    font-size: .85rem !important;
}
.dpg-shop-sidebar .widget_price_filter .price_label { font-size: .85rem; color: var(--dpg-muted); }

/* =========================================================================
   SHOP: Single product
   ========================================================================= */
.dpg-single-product-bc { background: var(--dpg-bg-soft); padding-top: 1.25rem; padding-bottom: 1.25rem; }

.woocommerce div.product {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 3rem;
    align-items: start;
}
.woocommerce div.product > .images,
.woocommerce div.product > .summary {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
}

.woocommerce div.product .images img,
.woocommerce div.product .woocommerce-product-gallery__image img {
    border-radius: var(--dpg-radius-lg);
    background: #fff;
}
.woocommerce div.product .woocommerce-product-gallery {
    background: var(--dpg-bg-soft);
    border-radius: var(--dpg-radius-lg);
    padding: 1rem;
}

.woocommerce div.product .summary {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    padding: 2rem;
    box-shadow: var(--dpg-shadow-sm);
}
.woocommerce div.product .summary .product_meta {
    border-top: 1px solid var(--dpg-line);
    padding-top: 1rem;
    margin-top: 1.5rem;
    font-size: .85rem;
    color: var(--dpg-muted);
}
.woocommerce div.product .summary .product_meta > span { display: block; margin-bottom: .35rem; }
.woocommerce div.product .summary .product_meta a { color: var(--dpg-navy); }

.woocommerce div.product form.cart .quantity { margin-right: .75rem; }
.woocommerce .quantity .qty {
    width: 80px;
    border: 1px solid var(--dpg-line);
    border-radius: 999px;
    padding: .55rem .75rem;
    text-align: center;
    font-family: var(--dpg-font-body);
    font-weight: 600;
}
.woocommerce div.product form.cart .button {
    padding: .65rem 1.5rem !important;
    font-size: .95rem !important;
}

/* Tabs full-width row below */
.woocommerce div.product .woocommerce-tabs {
    grid-column: 1 / -1;
    margin-top: 3rem;
}
.woocommerce div.product .related,
.woocommerce div.product .upsells {
    grid-column: 1 / -1;
    margin-top: 3rem;
}
.woocommerce div.product .related h2,
.woocommerce div.product .upsells h2 {
    font-family: var(--dpg-font-display);
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    color: var(--dpg-navy);
}

@media (max-width: 991.98px) {
    .woocommerce div.product { grid-template-columns: 1fr; gap: 1.5rem; }
    .woocommerce div.product .summary { padding: 1.5rem; }
}

/* =========================================================================
   List post card (used in index.php template-parts/content.php)
   ========================================================================= */
.dpg-list-post {
    background: #fff;
    border: 1px solid var(--dpg-line);
    border-radius: var(--dpg-radius-lg);
    padding: 1.25rem;
    margin-bottom: 1.25rem;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.dpg-list-post:hover { border-color: transparent; box-shadow: var(--dpg-shadow); }
.dpg-list-post__media {
    display: block;
    aspect-ratio: 4 / 3;
    border-radius: var(--dpg-radius);
    overflow: hidden;
    background: var(--dpg-bg-soft);
}
.dpg-list-post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.dpg-list-post:hover .dpg-list-post__media img { transform: scale(1.04); }
.dpg-list-post__title a { color: var(--dpg-ink); }
.dpg-list-post__title a:hover { color: var(--dpg-green); }
.dpg-list-post__more { color: var(--dpg-green); font-weight: 600; }
.dpg-list-post__more:hover { color: var(--dpg-navy); }

/* Header scroll state */
.dpg-header.is-scrolled { box-shadow: var(--dpg-shadow-sm); }

/* =========================================================================
   ============ v2.0.0 — NEW COMPONENTS APPENDED BELOW ============
   ========================================================================= */

/* ---------- Header sticky behavior + burger ---------- */
.dpg-header--sticky.is-stuck {
    position: sticky; top: 0; z-index: 1030;
    box-shadow: 0 6px 24px rgba(20,42,102,.08);
    backdrop-filter: saturate(140%) blur(8px);
    background: rgba(255,255,255,.94);
}
.dpg-burger {
    width: 42px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--dpg-bg-soft); border: 1px solid #E6EAF2;
    border-radius: 12px; cursor: pointer; transition: all .2s;
}
.dpg-burger:hover { background: #fff; border-color: var(--dpg-green); }
.dpg-burger__bars { display: inline-block; width: 20px; height: 16px; position: relative; }
.dpg-burger__bars::before,
.dpg-burger__bars::after,
.dpg-burger__bars span {
    content: ""; position: absolute; left: 0; right: 0;
    height: 2px; background: var(--dpg-navy); border-radius: 2px;
    transition: transform .25s, opacity .2s;
}
.dpg-burger__bars::before { top: 0; }
.dpg-burger__bars span    { top: 7px; }
.dpg-burger__bars::after  { bottom: 0; }

/* ---------- Reading progress bar (top of viewport on single posts) ---------- */
.dpg-reading-progress {
    position: fixed; top: 0; left: 0; right: 0; height: 3px;
    z-index: 1060; pointer-events: none;
}
.dpg-reading-progress__bar {
    height: 100%; width: 0;
    background: linear-gradient(90deg, var(--dpg-green), var(--dpg-navy));
    transition: width .12s linear;
}

/* ---------- TOC (auto-injected) ---------- */
.dpg-toc {
    background: var(--dpg-bg-soft);
    border: 1px solid #E6EAF2;
    border-left: 4px solid var(--dpg-green);
    border-radius: var(--dpg-radius);
    padding: 1.1rem 1.4rem;
    margin: 1.5rem 0 2rem;
    font-size: .95rem;
}
.dpg-toc__title {
    font-family: var(--dpg-font-display);
    font-size: 1.05rem; color: var(--dpg-navy);
    margin: 0 0 .6rem; display: flex; align-items: center; gap: .5rem;
}
.dpg-toc__title::before {
    content: ""; width: 18px; height: 18px;
    background: var(--dpg-green); mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M4 6h16v2H4zM4 11h10v2H4zM4 16h16v2H4z'/></svg>") center/contain no-repeat;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M4 6h16v2H4zM4 11h10v2H4zM4 16h16v2H4z'/></svg>") center/contain no-repeat;
}
.dpg-toc ul { list-style: none; padding-left: 0; margin: 0; }
.dpg-toc ul ul { padding-left: 1.2rem; margin-top: .25rem; }
.dpg-toc li { padding: .15rem 0; }
.dpg-toc a { color: var(--dpg-ink); text-decoration: none; border-bottom: 1px dashed transparent; }
.dpg-toc a:hover { color: var(--dpg-green); border-bottom-color: currentColor; }

/* ---------- Sticky share rail (desktop) + mobile share row ---------- */
.dpg-share-rail-wrap { position: relative; }
.dpg-share-rail {
    position: sticky; top: 110px;
    display: flex; flex-direction: column; gap: .5rem;
    align-items: center;
}
.dpg-share-rail__label {
    writing-mode: vertical-rl; transform: rotate(180deg);
    font-size: .7rem; letter-spacing: .12em; text-transform: uppercase;
    color: var(--dpg-muted); margin-bottom: .5rem;
}
.dpg-share-rail__btn {
    width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid #E6EAF2; border-radius: 50%;
    color: var(--dpg-navy); background: #fff;
    transition: all .2s; cursor: pointer;
}
.dpg-share-rail__btn:hover {
    background: var(--dpg-green); color: #fff; border-color: var(--dpg-green);
    transform: translateY(-2px);
}
.dpg-share-row { display: flex; gap: .5rem; align-items: center; }
.dpg-share-row__btn {
    width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid #E6EAF2; border-radius: 50%;
    color: var(--dpg-navy); background: #fff;
    transition: all .2s; cursor: pointer;
}
.dpg-share-row__btn:hover { background: var(--dpg-green); color: #fff; border-color: var(--dpg-green); }

/* ---------- Off-canvas mobile menu ---------- */
.dpg-offcanvas { max-width: 84vw; width: 320px; }
.dpg-offcanvas .offcanvas-header {
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid #E6EAF2;
}
.dpg-offcanvas .offcanvas-body { padding: .5rem 0; }
.dpg-offcanvas__nav { list-style: none; padding: 0; margin: 0; }
.dpg-offcanvas__nav .menu-item { border-bottom: 1px solid #F2F4F8; }
.dpg-offcanvas__nav .menu-item > a {
    display: flex; align-items: center; justify-content: space-between;
    padding: .9rem 1.25rem; color: var(--dpg-ink); font-weight: 600;
    text-decoration: none;
}
.dpg-offcanvas__nav .menu-item > a:hover { background: var(--dpg-bg-soft); color: var(--dpg-green); }
.dpg-offcanvas__nav .sub-menu {
    list-style: none; padding: 0; margin: 0;
    background: var(--dpg-bg-soft);
}
.dpg-offcanvas__nav .sub-menu .menu-item > a {
    padding-left: 2.5rem; font-weight: 500; font-size: .95rem;
}
.dpg-offcanvas__contact {
    padding: 1rem 1.25rem; border-top: 1px solid #E6EAF2;
    font-size: .9rem;
}
.dpg-offcanvas__contact strong { color: var(--dpg-navy); }
.dpg-offcanvas__cta {
    margin: 1rem 1.25rem; display: flex; gap: .5rem;
}

/* ---------- Mega Menu ---------- */
@media (min-width: 992px) {
    .dpg-navbar .nav-item.mega-menu { position: static; }
    .dpg-navbar .nav-item.mega-menu > .dropdown-menu {
        left: 0; right: 0; width: 100%;
        padding: 1.5rem 2rem; border-radius: 0 0 var(--dpg-radius) var(--dpg-radius);
        border: none; box-shadow: 0 12px 32px rgba(20,42,102,.10);
        display: none;
    }
    .dpg-navbar .nav-item.mega-menu > .dropdown-menu.show { display: grid; }
    .dpg-navbar .nav-item.mega-menu > .dropdown-menu {
        grid-template-columns: repeat(4, 1fr); gap: 1rem 2rem;
    }
    .dpg-navbar .nav-item.mega-menu .dropdown-item {
        padding: .4rem 0; font-size: .92rem;
    }
}

/* ---------- Search modal + AJAX suggestions ---------- */
.dpg-search-modal .modal-content {
    border: none; border-radius: var(--dpg-radius);
    box-shadow: 0 20px 60px rgba(20,42,102,.2);
}
.dpg-search-modal .modal-header { padding: 1rem 1.5rem; border-bottom: 1px solid #E6EAF2; }
.dpg-search-modal .modal-body { padding: 1.25rem 1.5rem 1.5rem; }
.dpg-search-modal__form {
    display: flex; gap: .5rem; align-items: center;
}
.dpg-search-modal__form input {
    flex: 1; padding: .85rem 1rem; font-size: 1.05rem;
    border: 1px solid #E6EAF2; border-radius: 12px;
}
.dpg-search-modal__form input:focus {
    outline: none; border-color: var(--dpg-green);
    box-shadow: 0 0 0 3px rgba(63,165,53,.15);
}
.dpg-search-suggest { margin-top: 1.25rem; min-height: 80px; }
.dpg-search-suggest h6 {
    font-size: .75rem; letter-spacing: .1em; text-transform: uppercase;
    color: var(--dpg-muted); margin-bottom: .5rem;
}
.dpg-suggest__list { list-style: none; padding: 0; margin: 0 0 1rem; }
.dpg-suggest__item { display: flex; align-items: center; gap: .75rem; padding: .55rem; border-radius: 10px; transition: background .15s; }
.dpg-suggest__item:hover { background: var(--dpg-bg-soft); }
.dpg-suggest__item img { width: 42px; height: 42px; object-fit: cover; border-radius: 8px; }
.dpg-suggest__item-body { flex: 1; min-width: 0; }
.dpg-suggest__item-title {
    display: block; color: var(--dpg-ink); font-weight: 600; font-size: .92rem;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dpg-suggest__item-meta { font-size: .8rem; color: var(--dpg-muted); }
.dpg-suggest__empty { color: var(--dpg-muted); padding: 1rem; text-align: center; }

/* ---------- Product card v2 (badges, hover gallery, quick view) ---------- */
.dpg-product-card,
ul.products li.product.dpg-product-card {
    list-style: none; background: #fff;
    border: 1px solid #EEF1F6; border-radius: var(--dpg-radius);
    overflow: hidden; transition: transform .25s, box-shadow .25s, border-color .25s;
    display: flex; flex-direction: column;
}
.dpg-product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(20,42,102,.10);
    border-color: var(--dpg-green);
}
.dpg-product-card__media { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: var(--dpg-bg-soft); }
.dpg-product-card__media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: opacity .35s, transform .5s;
}
.dpg-product-card__hover {
    position: absolute; inset: 0; opacity: 0; transition: opacity .35s;
}
.dpg-product-card__hover-img { width: 100%; height: 100%; object-fit: cover; }
.dpg-product-card:hover .dpg-product-card__hover { opacity: 1; }
.dpg-product-card:hover img.attachment-woocommerce_thumbnail { transform: scale(1.04); }

.dpg-product-card__body { padding: 1rem 1.1rem 1.25rem; flex: 1; display: flex; flex-direction: column; }
.dpg-product-card__cat {
    display: inline-block; font-size: .72rem; letter-spacing: .08em;
    text-transform: uppercase; color: var(--dpg-green); font-weight: 700;
    text-decoration: none; margin-bottom: .35rem;
}
.dpg-product-card__title { font-size: 1rem; line-height: 1.35; margin: 0 0 .4rem; min-height: 2.7em; }
.dpg-product-card__title a { color: var(--dpg-ink); text-decoration: none; }
.dpg-product-card__title a:hover { color: var(--dpg-green); }
.dpg-product-card__price { margin-bottom: .75rem; color: var(--dpg-navy); font-weight: 700; }
.dpg-product-card__price del { color: var(--dpg-muted); font-weight: 400; margin-right: .35rem; font-size: .9em; }
.dpg-product-card__price ins { background: transparent; text-decoration: none; color: var(--dpg-green); }
.dpg-product-card__actions { margin-top: auto; }

/* Badges */
.dpg-badges {
    position: absolute; top: .65rem; left: .65rem;
    display: flex; flex-direction: column; gap: .3rem; z-index: 2;
}
.dpg-badge {
    display: inline-flex; align-items: center; gap: .25rem;
    padding: .25rem .55rem; border-radius: 100px;
    font-size: .7rem; font-weight: 700; letter-spacing: .03em;
    box-shadow: 0 4px 10px rgba(0,0,0,.08);
}
.dpg-badge--sale { background: #E63946; color: #fff; }
.dpg-badge--new  { background: var(--dpg-green); color: #fff; }
.dpg-badge--oos  { background: #6c757d; color: #fff; }

/* Quick-view button (on card hover) */
.dpg-quick-view-btn {
    position: absolute; bottom: .65rem; right: .65rem;
    width: 38px; height: 38px;
    display: inline-flex; align-items: center; justify-content: center;
    border: none; background: #fff; color: var(--dpg-navy);
    border-radius: 50%; box-shadow: 0 6px 14px rgba(0,0,0,.12);
    opacity: 0; transform: translateY(6px); transition: all .2s;
    cursor: pointer; z-index: 3;
}
.dpg-product-card:hover .dpg-quick-view-btn { opacity: 1; transform: translateY(0); }
.dpg-quick-view-btn:hover { background: var(--dpg-green); color: #fff; }
@media (max-width: 767.98px) {
    .dpg-quick-view-btn { opacity: 1; transform: none; width: 34px; height: 34px; }
}

/* AJAX add-to-cart spinner + feedback */
.dpg-btn-cart {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    width: 100%; padding: .55rem .85rem;
    background: var(--dpg-navy); color: #fff !important; font-weight: 600;
    border: none; border-radius: 100px; text-decoration: none !important;
    transition: background .2s, transform .15s;
    font-size: .92rem;
}
.dpg-btn-cart:hover { background: var(--dpg-green); transform: translateY(-1px); }
.dpg-btn-cart.loading .dpg-btn-cart__label { opacity: .55; }
.dpg-btn-cart__spinner { display: none; width: 14px; height: 14px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: dpgSpin .7s linear infinite; }
.dpg-btn-cart.loading .dpg-btn-cart__spinner { display: inline-block; }
.dpg-btn-cart.added { background: var(--dpg-green); }
@keyframes dpgSpin { to { transform: rotate(360deg); } }

/* ---------- Quick view modal ---------- */
#dpg-quick-view-modal .modal-dialog { max-width: 920px; }
#dpg-quick-view-modal .modal-content {
    border: none; border-radius: var(--dpg-radius);
    box-shadow: 0 24px 64px rgba(20,42,102,.2);
}
.dpg-quick-view { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; padding: 2rem; }
@media (max-width: 767.98px) { .dpg-quick-view { grid-template-columns: 1fr; padding: 1.25rem; gap: 1.25rem; } }
.dpg-quick-view__gallery { }
.dpg-quick-view__main {
    aspect-ratio: 1/1; background: var(--dpg-bg-soft); border-radius: 14px;
    overflow: hidden; margin-bottom: .75rem;
}
.dpg-quick-view__main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dpg-quick-view__thumbs { display: flex; gap: .5rem; flex-wrap: wrap; }
.dpg-quick-view__thumb {
    width: 60px; height: 60px; border-radius: 8px; overflow: hidden;
    border: 2px solid transparent; padding: 0; background: none; cursor: pointer;
}
.dpg-quick-view__thumb img { width: 100%; height: 100%; object-fit: cover; }
.dpg-quick-view__thumb.is-active { border-color: var(--dpg-green); }
.dpg-quick-view__summary .dpg-eyebrow { margin-bottom: .25rem; }
.dpg-quick-view__title { font-size: 1.6rem; margin-bottom: .5rem; color: var(--dpg-navy); }
.dpg-quick-view__price { font-size: 1.4rem; font-weight: 700; color: var(--dpg-green); margin: .5rem 0 1rem; }
.dpg-quick-view__price del { color: var(--dpg-muted); font-weight: 400; font-size: 1.05rem; margin-right: .5rem; }
.dpg-quick-view__desc { color: var(--dpg-muted); margin-bottom: 1.25rem; line-height: 1.7; }
.dpg-quick-view__meta { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid #E6EAF2; font-size: .9rem; color: var(--dpg-muted); }
.dpg-quick-view__meta a { color: var(--dpg-navy); font-weight: 600; }

.dpg-quick-view-loader {
    display: flex; align-items: center; justify-content: center;
    min-height: 280px;
}
.dpg-spinner {
    width: 36px; height: 36px;
    border: 3px solid rgba(63,165,53,.18); border-top-color: var(--dpg-green);
    border-radius: 50%; animation: dpgSpin .8s linear infinite;
}

/* ---------- Sticky add-to-cart bar (mobile, single product) ---------- */
.dpg-sticky-atc {
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 1040; padding: .65rem .9rem;
    background: #fff; border-top: 1px solid #E6EAF2;
    box-shadow: 0 -10px 24px rgba(20,42,102,.08);
    display: none; align-items: center; gap: .75rem;
    transform: translateY(110%); transition: transform .25s;
}
.dpg-sticky-atc.is-visible { transform: translateY(0); }
.dpg-sticky-atc__thumb { width: 48px; height: 48px; flex-shrink: 0; border-radius: 8px; overflow: hidden; }
.dpg-sticky-atc__thumb img { width: 100%; height: 100%; object-fit: cover; }
.dpg-sticky-atc__body { flex: 1; min-width: 0; }
.dpg-sticky-atc__title { font-size: .88rem; font-weight: 600; color: var(--dpg-ink); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dpg-sticky-atc__price { font-size: .95rem; color: var(--dpg-green); font-weight: 700; }
.dpg-sticky-atc .btn { flex-shrink: 0; padding: .55rem 1rem; }
@media (max-width: 767.98px) {
    .dpg-sticky-atc { display: flex; }
    body.is-sticky-atc-active { padding-bottom: 80px; }
}

/* ---------- Floating contact buttons (Zalo / Messenger / Phone) ---------- */
.dpg-floating {
    position: fixed; right: 16px; bottom: 90px; z-index: 1035;
    display: flex; flex-direction: column-reverse; gap: .65rem;
}
@media (max-width: 767.98px) { .dpg-floating { bottom: 92px; right: 12px; } }
.dpg-floating__btn {
    position: relative;
    width: 52px; height: 52px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; color: #fff; text-decoration: none;
    box-shadow: 0 6px 18px rgba(20,42,102,.18);
    transition: transform .2s;
}
.dpg-floating__btn:hover { transform: scale(1.07); color: #fff; }
.dpg-floating__btn--zalo  { background: #0068FF; }
.dpg-floating__btn--msg   { background: #0084FF; }
.dpg-floating__btn--phone { background: var(--dpg-green); }
.dpg-floating__btn-label {
    position: absolute; right: calc(100% + 10px); top: 50%; transform: translateY(-50%);
    background: var(--dpg-navy); color: #fff; padding: .3rem .65rem;
    border-radius: 8px; font-size: .78rem; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: opacity .2s;
}
.dpg-floating__btn:hover .dpg-floating__btn-label { opacity: 1; }
.dpg-floating__pulse {
    position: absolute; inset: 0; border-radius: 50%;
    border: 3px solid currentColor; animation: dpgPulse 1.8s infinite;
}
@keyframes dpgPulse {
    0%   { transform: scale(.95); opacity: .85; }
    70%  { transform: scale(1.4); opacity: 0; }
    100% { transform: scale(.95); opacity: 0; }
}

/* ---------- Back to top button ---------- */
.dpg-back-to-top {
    position: fixed; right: 16px; bottom: 16px;
    width: 46px; height: 46px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; border: none; cursor: pointer;
    background: var(--dpg-navy); color: #fff;
    box-shadow: 0 6px 18px rgba(20,42,102,.25);
    opacity: 0; pointer-events: none; transform: translateY(8px);
    transition: all .25s; z-index: 1036;
}
.dpg-back-to-top.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.dpg-back-to-top:hover { background: var(--dpg-green); }

/* ---------- Recently viewed strip ---------- */
.dpg-recently-viewed { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #E6EAF2; }
.dpg-recently-viewed__inner ul.products { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; padding: 0; margin: 0; list-style: none; }

/* ---------- FAQ accordion ---------- */
.dpg-faq { margin: 1.5rem 0; }
.dpg-faq__item {
    border: 1px solid #E6EAF2; border-radius: 14px;
    margin-bottom: .65rem; overflow: hidden;
    background: #fff;
}
.dpg-faq__q {
    width: 100%; text-align: left;
    background: none; border: none; cursor: pointer;
    padding: 1rem 1.25rem; font-weight: 600; color: var(--dpg-navy);
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    font-size: 1rem;
}
.dpg-faq__q::after {
    content: ""; width: 14px; height: 14px; flex-shrink: 0;
    background: currentColor; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 16l-6-6h12z'/></svg>") center/contain no-repeat;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 16l-6-6h12z'/></svg>") center/contain no-repeat;
    transition: transform .25s;
}
.dpg-faq__q[aria-expanded="true"]::after { transform: rotate(180deg); }
.dpg-faq__a {
    padding: 0 1.25rem 1.1rem; color: var(--dpg-muted); line-height: 1.7;
}
.dpg-faq__a[hidden] { display: none; }

/* ---------- Category banner (homepage / front page) ---------- */
.dpg-banner {
    position: relative; border-radius: var(--dpg-radius); overflow: hidden;
    aspect-ratio: 1440 / 480; background: var(--dpg-navy);
}
@media (max-width: 767.98px) { .dpg-banner { aspect-ratio: 4 / 5; } }
.dpg-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dpg-banner__overlay {
    position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(20,42,102,.78) 0%, rgba(20,42,102,.4) 60%, transparent 100%);
    display: flex; align-items: center;
}
@media (max-width: 767.98px) { .dpg-banner__overlay { background: linear-gradient(180deg, rgba(20,42,102,.2) 0%, rgba(20,42,102,.8) 100%); align-items: flex-end; } }
.dpg-banner__copy { padding: 2.5rem 3rem; color: #fff; max-width: 560px; }
@media (max-width: 767.98px) { .dpg-banner__copy { padding: 1.5rem; max-width: 100%; } }
.dpg-banner__title { font-family: var(--dpg-font-display); font-size: clamp(1.6rem, 3vw, 2.4rem); color: #fff; margin-bottom: .75rem; }
.dpg-banner__lede { color: rgba(255,255,255,.85); margin-bottom: 1.25rem; }

/* ---------- Testimonials ---------- */
.dpg-testimonial {
    background: #fff; border: 1px solid #EEF1F6;
    border-radius: var(--dpg-radius); padding: 1.75rem;
    height: 100%; position: relative;
    transition: transform .25s, box-shadow .25s;
}
.dpg-testimonial:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(20,42,102,.08); }
.dpg-testimonial__quote {
    color: var(--dpg-green); opacity: .35;
    width: 36px; height: 36px; margin-bottom: .75rem;
}
.dpg-testimonial__text { color: var(--dpg-ink); line-height: 1.75; font-size: .97rem; margin-bottom: 1.25rem; }
.dpg-testimonial__who { display: flex; align-items: center; gap: .75rem; }
.dpg-testimonial__avatar {
    width: 44px; height: 44px; border-radius: 50%;
    background: var(--dpg-bg-soft); color: var(--dpg-navy);
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 1rem;
}
.dpg-testimonial__name { display: block; font-weight: 600; color: var(--dpg-navy); font-size: .95rem; }
.dpg-testimonial__role { display: block; color: var(--dpg-muted); font-size: .8rem; }

/* ---------- Social grid (footer) ---------- */
.dpg-social { display: flex; flex-wrap: wrap; gap: .5rem; }
.dpg-social a {
    width: 38px; height: 38px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; color: #fff; background: rgba(255,255,255,.08);
    transition: background .2s;
}
.dpg-social a:hover { background: var(--dpg-green); }

/* ---------- Footer post list ---------- */
.dpg-footer__posts { list-style: none; padding: 0; margin: 0; }
.dpg-footer__post {
    display: flex; gap: .65rem; padding: .55rem 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.dpg-footer__post:last-child { border-bottom: none; }
.dpg-footer__post-thumb {
    width: 54px; height: 54px; flex-shrink: 0;
    border-radius: 8px; overflow: hidden; background: rgba(255,255,255,.05);
}
.dpg-footer__post-thumb img { width: 100%; height: 100%; object-fit: cover; }
.dpg-footer__post-title { font-size: .82rem; line-height: 1.45; }
.dpg-footer__post-title a { color: #fff; text-decoration: none; }
.dpg-footer__post-title a:hover { color: var(--dpg-green-soft); }
.dpg-footer__post-date { font-size: .72rem; color: rgba(255,255,255,.5); }

/* ---------- Eyebrow link variant ---------- */
.dpg-eyebrow--link { text-decoration: none; transition: color .2s; }
.dpg-eyebrow--link:hover { color: var(--dpg-navy); }

/* ---------- Card-post (related posts) ---------- */
.dpg-card-post { background: #fff; border: 1px solid #EEF1F6; border-radius: var(--dpg-radius); overflow: hidden; transition: transform .25s, box-shadow .25s; height: 100%; display: flex; flex-direction: column; }
.dpg-card-post:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(20,42,102,.08); }
.dpg-card-post__thumb { display: block; aspect-ratio: 16/10; overflow: hidden; background: var(--dpg-bg-soft); }
.dpg-card-post__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.dpg-card-post:hover .dpg-card-post__thumb img { transform: scale(1.05); }
.dpg-card-post__thumb-fallback { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--dpg-bg-soft), #E6EFE2); }
.dpg-card-post__body { padding: 1rem 1.15rem 1.15rem; flex: 1; display: flex; flex-direction: column; gap: .3rem; }
.dpg-card-post__title { color: var(--dpg-ink); line-height: 1.4; margin: 0; font-weight: 600; }
.dpg-card-post__title a { color: inherit; text-decoration: none; }
.dpg-card-post__title a:hover { color: var(--dpg-green); }

/* ---------- Single post enhancements ---------- */
.dpg-single__title { font-size: clamp(1.7rem, 3vw, 2.4rem); color: var(--dpg-navy); margin-bottom: 1rem; line-height: 1.25; }
.dpg-single__hero { margin: 0 0 1.5rem; border-radius: var(--dpg-radius); overflow: hidden; }
.dpg-single__hero img { width: 100%; height: auto; display: block; }
.dpg-single__hero-caption { padding: .5rem 0; font-size: .85rem; color: var(--dpg-muted); text-align: center; }
.dpg-single__meta { display: flex; align-items: center; gap: .75rem; margin-top: .75rem; }
.dpg-single__meta-avatar { border-radius: 50%; }
.dpg-single__meta-text { display: flex; flex-direction: column; line-height: 1.3; }
.dpg-single__author { font-weight: 600; color: var(--dpg-navy); font-size: .92rem; }
.dpg-single__meta-sub { font-size: .82rem; color: var(--dpg-muted); }

/* ---------- Shop hero & breadcrumb on single product ---------- */
.dpg-shop-hero { padding: 2.5rem 0 1.5rem; }
.dpg-shop-hero__title { font-family: var(--dpg-font-display); font-size: clamp(1.8rem, 3vw, 2.6rem); color: var(--dpg-navy); }
.dpg-shop-hero__desc { max-width: 760px; }
.dpg-bc a { color: var(--dpg-muted); text-decoration: none; }
.dpg-bc a:hover { color: var(--dpg-green); }
.dpg-bc__sep { margin: 0 .35rem; color: #ccc; }

/* ---------- Elementor compat (page is built with Elementor) ---------- */
body.elementor-page .dpg-main { padding-top: 0; padding-bottom: 0; }

/* ---------- Skip link ---------- */
.skip-link {
    position: absolute; left: -9999px; top: -9999px;
    background: var(--dpg-navy); color: #fff; padding: .65rem 1rem; z-index: 9999;
    border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; top: 0; outline: 2px solid var(--dpg-green); }

/* ---------- Author box ---------- */
.dpg-author-box {
    display: flex; gap: 1.25rem; align-items: flex-start;
    padding: 1.5rem; background: var(--dpg-bg-soft);
    border-radius: var(--dpg-radius); border: 1px solid #E6EAF2;
}
.dpg-author-box__avatar { border-radius: 50%; flex-shrink: 0; }
.dpg-author-box__body h4 { color: var(--dpg-navy); margin-bottom: .2rem; }

/* ---------- Post nav (prev/next) ---------- */
.dpg-post-nav__item { background: #fff; border: 1px solid #E6EAF2; border-radius: var(--dpg-radius); padding: 1rem 1.25rem; display: block; transition: all .2s; text-decoration: none; }
.dpg-post-nav__item:hover { border-color: var(--dpg-green); background: var(--dpg-bg-soft); }
.dpg-post-nav__item small { color: var(--dpg-muted); display: block; margin-bottom: .35rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.dpg-post-nav__item span a { color: var(--dpg-navy); font-weight: 600; text-decoration: none; }
.dpg-post-nav__item span a:hover { color: var(--dpg-green); }

/* ---------- Toast (AJAX cart feedback) ---------- */
.dpg-toast {
    position: fixed; left: 50%; bottom: 110px;
    transform: translate(-50%, 30px); opacity: 0;
    background: var(--dpg-navy); color: #fff; padding: .75rem 1.25rem;
    border-radius: 100px; font-size: .9rem; font-weight: 600;
    box-shadow: 0 12px 28px rgba(20,42,102,.25);
    z-index: 1050; pointer-events: none;
    transition: opacity .2s, transform .25s;
    display: inline-flex; align-items: center; gap: .5rem;
}
.dpg-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.dpg-toast--success { background: var(--dpg-green); }
.dpg-toast--error   { background: #E63946; }

/* ---------- Accessibility helpers ---------- */
.screen-reader-text {
    border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
    height: 1px; margin: -1px; overflow: hidden; padding: 0;
    position: absolute !important; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus {
    background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0,0,0,.15);
    clip: auto !important; clip-path: none; color: #21759b; display: block;
    font-size: 14px; font-weight: 700; height: auto; left: 5px; line-height: normal;
    padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000;
}

/* ---------- Print ---------- */
@media print {
    .dpg-header, .dpg-footer, .dpg-floating, .dpg-back-to-top,
    .dpg-sticky-atc, .dpg-share-rail, .dpg-share-row, .dpg-reading-progress { display: none !important; }
    .dpg-main { padding: 0; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    .dpg-floating__pulse { display: none; }
}

/* =========================================================================
   ============ v2.1.0 — HERO CAROUSEL + Z-INDEX + OVERFLOW ============
   ========================================================================= */

/* ---------- Z-index fix: ensure dropdown appears above hero ---------- */
.dpg-header,
.dpg-header--sticky { z-index: 1040; position: relative; }
.dpg-navbar { position: relative; z-index: 1041; }
.dpg-navbar .dropdown-menu { z-index: 1050 !important; }
.dpg-navbar .nav-item.mega-menu > .dropdown-menu { z-index: 1050 !important; }

/* Hero stays BELOW header */
.dpg-hero { position: relative; z-index: 1; overflow: hidden; }
.dpg-hero__copy { position: relative; z-index: 2; }
.dpg-hero__visual { position: relative; z-index: 1; }
.dpg-hero__badge { z-index: 2; }

/* ---------- Hero visual: extend toward right edge (dramatic) ---------- */
@media (min-width: 992px) {
    .dpg-hero__visual {
        /* Push the visual into / past the right gutter */
        margin-right: -2rem;
    }
}
@media (min-width: 1200px) {
    .dpg-hero__visual {
        margin-right: -4rem;
        transform: scale(1.05);
        transform-origin: left center;
    }
}
@media (min-width: 1400px) {
    .dpg-hero__visual {
        margin-right: -6rem;
        transform: scale(1.1);
    }
}

/* ---------- Hero carousel ---------- */
.dpg-hero__carousel {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
    background: var(--dpg-bg-soft);
    box-shadow:
        inset 0 0 0 12px var(--dpg-green),
        inset 0 0 0 22px transparent,
        inset 0 0 0 34px var(--dpg-navy);
    /* The double-ring frame echoes the original .dpg-hero__frame look */
    user-select: none;
    touch-action: pan-y; /* allow vertical page scroll, swipe-x for carousel */
}
.dpg-hero__carousel.is-multi { cursor: grab; }
.dpg-hero__carousel.is-multi:active,
.dpg-hero__carousel.is-multi.is-dragging { cursor: grabbing; }

.dpg-hero__track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform .55s cubic-bezier(.4, 0, .2, 1);
    will-change: transform;
}
.dpg-hero__track.is-dragging { transition: none; }

.dpg-hero__slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    position: relative;
    background: var(--dpg-bg-soft);
}
.dpg-hero__slide img,
.dpg-hero__slide svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none; /* prevent native image drag */
    -webkit-user-drag: none;
}

/* Prev / Next buttons */
.dpg-hero__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    color: var(--dpg-navy);
    box-shadow: 0 6px 18px rgba(20, 42, 102, .14);
    cursor: pointer;
    z-index: 3;
    transition: all .2s;
    opacity: 0; /* show on hover */
}
.dpg-hero__carousel:hover .dpg-hero__nav,
.dpg-hero__carousel:focus-within .dpg-hero__nav { opacity: 1; }
.dpg-hero__nav:hover {
    background: #fff;
    color: var(--dpg-green);
    transform: translateY(-50%) scale(1.08);
}
.dpg-hero__prev { left: 12px; }
.dpg-hero__next { right: 12px; }
@media (max-width: 767.98px) {
    .dpg-hero__nav { opacity: 1; width: 38px; height: 38px; }
}

/* Dots */
.dpg-hero__dots {
    position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 3;
}
.dpg-hero__dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .55);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: all .25s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}
.dpg-hero__dot:hover { background: rgba(255, 255, 255, .85); }
.dpg-hero__dot.is-active {
    background: #fff;
    width: 26px;
    border-radius: 100px;
}

/* ---------- Override stale .dpg-hero__frame styles (legacy) ---------- */
.dpg-hero__frame {
    /* No longer used but kept for backward compat — make it transparent */
    background: transparent !important;
    box-shadow: none !important;
}

/* Hide carousel ring on mobile (too tight) */
@media (max-width: 767.98px) {
    .dpg-hero__carousel {
        box-shadow:
            inset 0 0 0 8px var(--dpg-green),
            inset 0 0 0 18px transparent,
            inset 0 0 0 26px var(--dpg-navy);
    }
}

/* ---------- Adjust hero badge so it doesn't sit on top of nav buttons ---------- */
.dpg-hero__badge {
    position: absolute;
    bottom: 8%;
    left: -2%;
    background: #fff;
    padding: .75rem 1rem;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(20, 42, 102, .12);
    display: flex;
    align-items: center;
    gap: .65rem;
    z-index: 4;
}
@media (max-width: 767.98px) {
    .dpg-hero__badge { left: 4%; bottom: 4%; padding: .5rem .85rem; }
}