/*
Theme Name: Ao Phong Dep
Theme URI: http://localhost/aophongdep
Author: Ao Phong Dep
Description: Theme WordPress cho website Ao Phong Dep
Version: 2.0
Text Domain: dongphucquangninh
*/

/* ===========================
   RESET & BASE
=========================== */
*, *::before, *::after { box-sizing: border-box; }
body {
    font-family: 'Inter', 'Roboto', Arial, sans-serif;
    font-size: 14px;
    color: #333;
    background: #f5f5f5;
    margin: 0; padding: 0;
}

/* Final header override: match dongphuchongha-style demo. */
.site-header__top {
    display: grid !important;
    grid-template-columns: minmax(260px, 380px) minmax(280px, 560px) minmax(320px, auto) !important;
    align-items: center !important;
    gap: 34px !important;
    min-height: 112px !important;
    padding-top: 18px !important;
    padding-bottom: 12px !important;
}

.site-header .header__logo {
    display: inline-flex !important;
    align-items: center !important;
    gap: 14px !important;
    min-width: 0 !important;
    color: #073d7c !important;
}

.site-header .header__logo-mark {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 86px !important;
    height: 86px !important;
    border: 6px solid #16d39a !important;
    color: #16d39a !important;
    background: #fff !important;
    font-size: 28px !important;
    font-weight: 950 !important;
}

.site-header .header__logo-text {
    color: #063a76 !important;
    font-size: 24px !important;
    font-weight: 950 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    text-shadow: 1px 1px 0 rgba(242, 92, 39, .55) !important;
}

.site-header .header__search {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.site-header .form-main {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 54px !important;
    min-height: 56px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #f7f7f7 !important;
    overflow: hidden !important;
}

.site-header .form-main input[type="text"] {
    height: 56px !important;
    padding: 0 18px !important;
    background: transparent !important;
    color: #556171 !important;
    font-size: 17px !important;
}

.site-header .form-main .btn-search {
    width: 54px !important;
    min-width: 54px !important;
    height: 56px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #111 !important;
    font-size: 24px !important;
    box-shadow: none !important;
}

.site-header .header__contact {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 26px !important;
}

.site-header .header__contact-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #064076 !important;
    font-size: 17px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}

.site-header .header__contact-link i {
    color: #10bd35 !important;
}

.site-header #menu-secondary {
    display: block !important;
    background: #fff !important;
    border: 0 !important;
}

.site-header #menu-secondary .inner-container {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    min-height: 42px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.site-header .menuSecondary__menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: visible !important;
}

.site-header .menuSecondary__menu li {
    position: relative !important;
}

.site-header .menuSecondary__menu > li > a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 42px !important;
    padding: 9px 17px !important;
    color: #073d7c !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    background: transparent !important;
}

.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover {
    color: #12bf32 !important;
}

.site-header .menuSecondary__menu .menu-item-has-children > a::after {
    content: "\f107" !important;
    margin-left: 7px !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.site-header .menuSecondary__menu .sub-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1001 !important;
    display: none !important;
    min-width: 280px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 1px solid #ececec !important;
    background: #fff !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .12) !important;
}

.site-header .menuSecondary__menu .sub-menu .sub-menu {
    top: 0 !important;
    left: 100% !important;
}

.site-header .menuSecondary__menu li:hover > .sub-menu,
.site-header .menuSecondary__menu li:focus-within > .sub-menu {
    display: block !important;
}

.site-header .menuSecondary__menu .sub-menu a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 48px !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #ececec !important;
    color: #444 !important;
    background: #fff !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

.site-header .menuSecondary__menu .sub-menu a:hover {
    color: #10bd35 !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(220px, 320px) minmax(240px, 1fr) !important;
        gap: 18px !important;
    }

    .site-header .header__contact {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 768px) {
    .site-header__top {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        min-height: 68px !important;
        padding: 10px 14px !important;
    }

    .site-header .mobile-menu-toggle {
        display: inline-flex !important;
    }

    .site-header .header__logo {
        justify-self: center !important;
    }

    .site-header .header__logo-mark {
        width: 46px !important;
        height: 46px !important;
        border-width: 4px !important;
        font-size: 17px !important;
    }

    .site-header .header__logo-text {
        max-width: 210px !important;
        font-size: 16px !important;
    }

    .site-header .header__search,
    .site-header .header__contact,
    .site-header #menu-secondary {
        display: none !important;
    }
}

/* Ao Phong Dep brand colors sampled from aphong-1.webp. */
:root {
    --dpqn-brand-red: #ff6000;
    --dpqn-brand-red-dark: #c94700;
    --dpqn-brand-black: #202020;
    --dpqn-brand-ink: #202020;
    --dpqn-brand-muted: #5f646d;
    --dpqn-brand-line: #ececec;
    --dpqn-brand-soft: #f7f7f7;
}

.site-header__top {
    grid-template-columns: minmax(360px, 460px) minmax(280px, 1fr) minmax(300px, auto) !important;
}

.site-header .header__logo {
    color: var(--dpqn-brand-black) !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    display: block !important;
    width: auto !important;
    max-width: 430px !important;
    max-height: 94px !important;
    object-fit: contain !important;
}

.site-header .header__logo-mark {
    border-color: var(--dpqn-brand-red) !important;
    color: var(--dpqn-brand-red) !important;
}

.site-header .header__logo-text {
    color: var(--dpqn-brand-black) !important;
    text-shadow: 1px 1px 0 rgba(229, 27, 35, .35) !important;
}

.site-header .form-main {
    background: var(--dpqn-brand-soft) !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .04) !important;
}

.site-header .form-main input[type="text"] {
    color: var(--dpqn-brand-muted) !important;
}

.site-header .form-main .btn-search {
    color: var(--dpqn-brand-black) !important;
}

.site-header .form-main .btn-search:hover,
.site-header .form-main:focus-within .btn-search {
    color: var(--dpqn-brand-red) !important;
}

.site-header .header__contact-link {
    color: var(--dpqn-brand-black) !important;
}

.site-header .header__contact-link:hover,
.site-header .header__contact-link:hover i,
.site-header .header__contact-link i {
    color: var(--dpqn-brand-red) !important;
}

.site-header #menu-secondary {
    border-top: 1px solid var(--dpqn-brand-line) !important;
}

.site-header .menuSecondary__menu > li > a {
    color: var(--dpqn-brand-black) !important;
}

.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover {
    color: var(--dpqn-brand-red) !important;
}

.site-header .menuSecondary__menu .sub-menu {
    border-color: var(--dpqn-brand-line) !important;
    border-top: 2px solid var(--dpqn-brand-red) !important;
}

.site-header .menuSecondary__menu .sub-menu a {
    border-bottom-color: var(--dpqn-brand-line) !important;
    color: var(--dpqn-brand-ink) !important;
}

.site-header .menuSecondary__menu .sub-menu a:hover {
    color: var(--dpqn-brand-red) !important;
    background: #fff5f5 !important;
}

.mobile-menu-toggle,
.btn-primary,
.button,
button[type="submit"],
input[type="submit"],
.product-card__badge,
.section-title::after,
.widget-title::after,
.archive-title::after {
    background-color: var(--dpqn-brand-red) !important;
    border-color: var(--dpqn-brand-red) !important;
}

.btn-primary:hover,
.button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background-color: var(--dpqn-brand-red-dark) !important;
    border-color: var(--dpqn-brand-red-dark) !important;
}

.site-header .form-main .btn-search,
.site-header .form-main .btn-search:hover {
    background: transparent !important;
    border-color: transparent !important;
}

a:hover,
.breadcrumb a:hover,
.post-card a:hover,
.product-card a:hover,
.footer a:hover {
    color: var(--dpqn-brand-red) !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(300px, 420px) minmax(240px, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* Header logo alignment: keep the brand locked to the left like the demo. */
.site-header__top {
    grid-template-columns: minmax(260px, 340px) minmax(300px, 1fr) minmax(300px, auto) !important;
    justify-items: stretch !important;
    gap: 34px !important;
}

.site-header .header__logo {
    justify-self: start !important;
    margin-left: 0 !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    max-width: 330px !important;
    max-height: 88px !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(240px, 310px) minmax(240px, 1fr) !important;
        gap: 22px !important;
    }
}

@media (max-width: 768px) {
    .site-header__top {
        grid-template-columns: 44px minmax(0, 1fr) !important;
    }

    .site-header .header__logo {
        justify-self: center !important;
    }

    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* Hong Ha-style header rebuild. */
.full-container {
    background: #fff;
    border-bottom: 1px solid #e7e7e7;
}

.site-header {
    background: #fff;
}

.site-header__top {
    display: grid;
    grid-template-columns: minmax(250px, 380px) minmax(260px, 560px) minmax(300px, auto);
    align-items: center;
    gap: 34px;
    min-height: 112px;
    padding-top: 18px;
    padding-bottom: 12px;
}

.site-header .header__logo {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    color: #073d7c;
}

.site-header .header__logo-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 86px;
    height: 86px;
    border: 6px solid #16d39a;
    color: #16d39a;
    background: #fff;
    font-size: 28px;
    font-weight: 950;
    line-height: 1;
}

.site-header .header__logo-text {
    color: #063a76;
    font-size: 24px;
    font-weight: 950;
    line-height: 1.1;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 rgba(242, 92, 39, .55);
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    width: auto !important;
    max-width: 360px !important;
    max-height: 92px !important;
    object-fit: contain;
}

.site-header .header__search {
    width: 100%;
    max-width: none;
    margin: 0;
}

.site-header .form-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 54px;
    min-height: 56px;
    border: 0;
    border-radius: 4px;
    background: #f7f7f7;
    overflow: hidden;
}

.site-header .form-main input[type="text"] {
    min-width: 0;
    height: 56px;
    padding: 0 18px;
    border: 0;
    background: transparent;
    color: #556171;
    font-size: 17px;
    outline: 0;
}

.site-header .form-main .btn-search {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    min-width: 54px;
    height: 56px;
    padding: 0 !important;
    border: 0;
    background: transparent !important;
    color: #111;
    font-size: 24px;
    box-shadow: none;
}

.site-header .header__contact {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 26px;
    min-width: 0;
}

.site-header .header__contact-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #064076;
    font-size: 17px;
    font-weight: 850;
    white-space: nowrap;
}

.site-header .header__contact-link i {
    color: #10bd35;
    font-size: 19px;
}

.site-header #menu-secondary,
.site-header .header__nav {
    background: #fff !important;
    border: 0;
}

.site-header #menu-secondary .inner-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 42px;
    padding-top: 0;
    padding-bottom: 0;
}

.site-header .menuSecondary__menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
    width: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: visible;
}

.site-header .menuSecondary__menu li {
    position: relative;
}

.site-header .menuSecondary__menu > li > a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 9px 17px;
    color: #073d7c !important;
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    background: transparent !important;
}

.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover {
    color: #12bf32 !important;
}

.site-header .menuSecondary__menu .menu-item-has-children > a::after {
    content: "\f107";
    margin-left: 7px;
    font-family: "Font Awesome 6 Free";
    font-size: 13px;
    font-weight: 900;
}

.site-header .menuSecondary__menu .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1001;
    display: none;
    min-width: 280px;
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid #ececec;
    background: #fff;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .12);
}

.site-header .menuSecondary__menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
}

.site-header .menuSecondary__menu li:hover > .sub-menu,
.site-header .menuSecondary__menu li:focus-within > .sub-menu {
    display: block;
}

.site-header .menuSecondary__menu .sub-menu a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 12px 16px;
    border-bottom: 1px solid #ececec;
    color: #444 !important;
    background: #fff !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    text-transform: none;
    white-space: nowrap;
}

.site-header .menuSecondary__menu .sub-menu li:last-child > a {
    border-bottom: 0;
}

.site-header .menuSecondary__menu .sub-menu a:hover {
    color: #10bd35 !important;
    background: #fafafa !important;
}

.site-header .mobile-menu-toggle {
    display: none;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(220px, 320px) minmax(240px, 1fr);
        gap: 18px;
    }

    .site-header .header__contact {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
}

@media (max-width: 768px) {
    .site-header__top {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 10px;
        min-height: 68px;
        padding: 10px 14px;
    }

    .site-header .mobile-menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: 1px solid #e0e8f2;
        border-radius: 6px;
        background: #fff;
        color: #073d7c;
        font-size: 20px;
    }

    .site-header .header__logo {
        justify-self: center;
    }

    .site-header .header__logo-mark {
        width: 46px;
        height: 46px;
        border-width: 4px;
        font-size: 17px;
    }

    .site-header .header__logo-text {
        max-width: 210px;
        font-size: 16px;
    }

    .site-header .header__search,
    .site-header .header__contact,
    .site-header #menu-secondary {
        display: none !important;
    }
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; margin: 0; padding: 0; }
.inner-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 15px;
}
.full-container { background: #fff; }

/* ===========================
   HEADER TOP
=========================== */
.header-top {
    background: #f8f8f8;
    border-bottom: 1px solid #e0e0e0;
    padding: 5px 0;
    font-size: 12px;
}
.header-top .inner-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header-top__hotline {
    font-weight: 700;
    color: #e51b23;
    font-size: 13px;
}
.header-top__menu {
    display: flex;
    align-items: center;
    gap: 0;
}
.header-top__menu li {
    position: relative;
}
.header-top__menu li a {
    display: block;
    padding: 4px 12px;
    color: #555;
    font-size: 12px;
    border-right: 1px solid #ddd;
    transition: color 0.2s;
}
.header-top__menu li:last-child a { border-right: none; }
.header-top__menu li a:hover { color: #e51b23; }
/* Policy dropdown */
.header-top__menu .policy { position: relative; }
.header-top__menu .policy__info {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #ddd;
    z-index: 999;
    min-width: 220px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.header-top__menu .policy:hover .policy__info { display: block; }
.header-top__menu .policy__info li a { border-right: none; border-bottom: 1px solid #f0f0f0; padding: 8px 15px; }

/* ===========================
   HEADER MAIN
=========================== */
.header {
    background: #fff;
    padding: 12px 0;
    border-bottom: 1px solid #eee;
}
.header .inner-container {
    display: flex;
    align-items: center;
    gap: 20px;
}
.header__logo {
    flex: 0 0 auto;
    min-width: 160px;
}
.header__logo img { height: 55px; width: auto; }
.header__logo-text {
    font-size: 20px;
    font-weight: 900;
    color: #e51b23;
    line-height: 1.2;
}
.header__logo-text span { color: #084b94; }/* Search */
.header__search {
    flex: 1;
    max-width: 700px;
    margin: 0 30px;
}
.form-main {
    display: flex;
    border: 2px solid #e51b23; /* Updated to Red */
    border-radius: 4px;
    overflow: hidden;
}
.form-main input[type="text"] {
    flex: 1;
    border: none;
    padding: 10px 15px;
    font-size: 14px;
    outline: none;
}
.form-main .btn-search {
    background: #e51b23; /* Updated to Red */
    color: #fff;
    border: none;
    padding: 10px 25px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s;
}
.form-main .btn-search:hover { background: #d94a1a; }

/* Header actions (New Buttons) */
.header__actions.new-actions {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-left: auto;
}
.btn-tuvan {
    background: #084b94; /* Deep Blue */
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 20px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s;
}
.btn-tuvan:hover {
    background: #063973;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(8, 75, 148, 0.3);
}
.btn-tuvan i { font-size: 18px; }

.btn-zalo-top {
    background: #0088FF;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 20px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s;
}
.btn-zalo-top img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.btn-zalo-top:hover {
    background: #0070d6;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 136, 255, 0.3);
}
    font-size: 13px;
    cursor: pointer;
    transition: color 0.2s;
    position: relative;
}
.header__action:hover { color: #e51b23; }
.header__action i {
    font-size: 22px;
    color: #084b94;
}
.header__action .title {
    font-weight: 700;
    display: block;
    font-size: 13px;
    line-height: 1.3;
}
.header__action small { color: #888; font-size: 11px; }
.cart-count-mobi {
    position: absolute;
    top: -6px; right: -8px;
    background: #e51b23;
    color: #fff;
    font-size: 10px;
    width: 18px; height: 18px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700;
}

/* ===========================
   NAV SECONDARY (horizontal, right of menu spacer)
=========================== */
#menu-secondary {
    background: #084b94;
    border-bottom: none;
}
#menu-secondary .inner-container {
    display: flex;
    align-items: center;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 15px;
}
.menu-secondary-spacer {
    width: 230px;
    flex-shrink: 0;
    background: #e51b23;
    height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    color: #fff;
    font-weight: 900;
    font-size: 14px;
    letter-spacing: -.01em;
    text-transform: uppercase;
}
.menu-secondary-spacer i {
    font-size: 15px;
    line-height: 1;
}
.menu-secondary-spacer span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.menuSecondary__menu {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    flex: 1;
}
.menuSecondary__menu li a {
    display: block;
    padding: 12px 16px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    transition: color 0.2s;
    white-space: nowrap;
    line-height: 1;
}
.menuSecondary__menu li a:hover { color: #e51b23; }
.menuSecondary__menu li a.yellow,
.menuSecondary__menu li.menu-item-highlight > a { color: #e51b23; font-weight: 700; }
.menuSecondary__menu li a.yellow:hover,
.menuSecondary__menu li.menu-item-highlight > a:hover { color: #ff6b72; }

/* ===========================
   HOME LAYOUT: Vertical Menu LEFT + Content RIGHT
=========================== */
.full-content { background: #f5f5f5; }
.full-content > .inner-container {
    padding: 0 15px;
    max-width: 1340px;
    margin: 0 auto;
}
.home-layout {
    display: flex;
    gap: 0;
    align-items: stretch;
    position: relative;
}

/* LEFT: Vertical Category Menu */
.home-layout__menu {
    width: 230px;
    flex-shrink: 0;
    background: #084b94;
    position: relative;
    z-index: 100;
}
.menu__cate-title {
    display: none;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    background: linear-gradient(135deg, #07346f, #0b4a94);
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: -.01em;
    text-transform: uppercase;
    white-space: nowrap;
}
.menu__cate-title i {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 14px;
}
.menu__main { }
.menu__main > .menu-item {
    border-bottom: 1px solid rgba(255,255,255,0.08);
    position: static;
}
.menu__main > .menu-item > .menu-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    transition: background 0.2s;
    position: relative;
}
.menu__main > .menu-item > .menu-link .menu-icon {
    width: 22px;
    height: 22px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 3px;
}
.menu__main > .menu-item > .menu-link:hover,
.menu__main > .menu-item:hover > .menu-link {
    background: #e51b23;
}
.menu__main > .menu-item.has-child > .menu-link::after {
    content: '\f054';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 9px;
    margin-left: auto;
    opacity: 0.6;
}
/* Mega Menu dropdown */
.menu__main > .menu-item > .mega-menu {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    width: 230px;
    background: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 4px 4px 16px rgba(0,0,0,0.12);
    z-index: 300;
    padding: 6px 0;
    max-height: 450px;
    overflow-y: auto;
    scrollbar-width: thin;
}
.menu__main > .menu-item:hover > .mega-menu { display: block; }
.menu__main > .menu-item > .mega-menu li a {
    display: block;
    padding: 9px 18px;
    color: #333;
    font-size: 13px;
    border-bottom: 1px solid #f5f5f5;
    transition: all 0.15s;
}
.menu__main > .menu-item > .mega-menu li a:hover {
    background: #fff3f3;
    color: #e51b23;
    padding-left: 24px;
}
.menu__main > .viewall-item > .menu-link {
    background: rgba(0,0,0,0.15);
    color: #e51b23;
    font-weight: 700;
    justify-content: center;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.menu__main > .viewall-item > .menu-link:hover {
    background: #e51b23;
    color: #fff;
}

/* RIGHT: Slider + content column */
.home-layout__content {
    flex: 1;
    min-width: 0;
    padding-left: 12px;
    display: flex;
    flex-direction: column;
}



/* Mobile menu button */
.btn-menu-mobi {
    background: #084b94;
    border: none;
    color: #fff;
    padding: 8px 14px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
}

/* ===========================
   MAIN CONTENT WRAPPER
=========================== */
.full-content { background: #f5f5f5; }

/* ===========================
   SECTION: SLIDER (inside home-layout__content)
=========================== */
.slider-section { 
    background: #fff; 
    padding: 8px 0 0; 
    flex: 1;
    display: flex;
    flex-direction: column;
}
.slider__grid {
    display: flex;
    gap: 8px;
    align-items: stretch;
    flex: 1; /* Automatically fill remaining height */
    min-height: 380px; /* Fallback */
}
.slider__wrap {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    border-radius: 4px;
    position: relative;
}
.slider__wrap .slick-slider,
.slider__wrap .slick-list,
.slider__wrap .slick-track,
.slider__wrap .slick-slide,
.slider__wrap .slick-slide > div,
.slider__wrap .item {
    height: 100%;
}
.slider__main .item img {
    width: 100%;
    object-fit: cover;
    border-radius: 4px;
    height: 100%;
    display: block;
}
/* Side banners - 2 banners stack to fill full slider height */
.slider__side {
    width: 180px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.slider__banner {
    flex: 1;
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    cursor: pointer;
}
.slider__banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s;
}
.slider__banner:hover img { transform: scale(1.03); }
.slider__banner-label {
    position: absolute;
    top: 0; left: 0; right: 0;
    background: rgba(0,0,0,0.55);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    padding: 8px 6px;
    line-height: 1.3;
}

/* Activity blocks (NHẬP KHẨU, MAY MẶC...) */
.activities { margin-top: 8px; }
.activity-list {
    display: flex;
    gap: 8px;
}
.activity-item { flex: 1; }
.activity {
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
}
.activity__image img {
    width: 100%;
    height: 110px;
    object-fit: cover;
    filter: brightness(0.55);
    transition: filter 0.3s;
    display: block;
}
.activity:hover .activity__image img { filter: brightness(0.38); }
.activity__title {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: rgba(0,0,0,0.5);
    color: #fff;
    text-align: center;
    padding: 7px 4px;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

/* ===========================
   SECTION: NAV CATEGORIES (icons row)
=========================== */
.nav-cate { background: #fff; padding: 15px 0; margin-top: 10px; }
.nav-cate .inner-container {}
.nav-cate__list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: flex-start;
}
.nav-cate__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(100% / 9 - 5px);
    padding: 10px 6px;
    border: 1px solid #eee;
    border-radius: 6px;
    transition: all 0.25s;
    background: #fff;
    text-align: center;
    cursor: pointer;
}
.nav-cate__item:hover {
    border-color: #e51b23;
    box-shadow: 0 2px 10px rgba(211,47,47,0.15);
    transform: translateY(-3px);
}
.nav-cate__item .image {
    width: 50px;
    height: 50px;
    object-fit: contain;
    margin-bottom: 6px;
}
.nav-cate__item .title {
    font-size: 11px;
    font-weight: 600;
    color: #333;
    line-height: 1.3;
    text-align: center;
}
.nav-cate__item:hover .title { color: #e51b23; }

/* ===========================
   SECTION: CATEGORY HOME (products by category)
=========================== */
.cate-home { background: #f5f5f5; padding: 10px 0; }
.cate-home .inner-container { padding: 15px 15px; }
.cate-home__block {
    background: #fff;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid #eee;
}
.cate-home__top {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    border-bottom: 2px solid #084b94;
    background: #fff;
    margin-bottom: 10px;
}
.cate-home__title {
    background: #3783db; /* Slightly lighter blue for the title box as per image */
    color: #fff;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
    display: flex;
    align-items: center;
}
.cate-home__title::after {
    display: none;
}
.cate-home__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    flex: 1;
    align-items: center;
    padding: 0 15px;
}
.cate-home__nav .nav-item {
    font-size: 13px;
    color: #3783db;
    font-weight: 500;
    border: none;
    padding: 0;
    background: transparent;
}
.cate-home__nav .nav-item:hover {
    background: transparent;
    color: #e51b23;
}
.cate-home__viewall {
    padding: 9px 18px;
    background: #073d7c;
    color: #fff !important;
    border: 1px solid rgba(7, 61, 124, .12);
    border-radius: 999px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 8px 20px rgba(7, 52, 111, .12);
}
.cate-home__viewall:hover { 
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: #fff !important;
    transform: translateY(-1px);
}
.cate-home__footer {
    display: flex;
    justify-content: center;
    padding: 12px 0 4px;
}

.cate-home__content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.cate-home__banner {
    width: 100%;
    height: 170px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid var(--brand-line);
    background: var(--brand-navy);
    position: relative;
}
.cate-home__banner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(circle at 24% 20%, rgba(255, 255, 255, .18), transparent 26%),
        linear-gradient(110deg, transparent 0%, transparent 44%, rgba(255, 255, 255, .16) 50%, transparent 58%, transparent 100%);
    background-size: 100% 100%, 220% 100%;
    background-position: center, 140% 0;
    mix-blend-mode: screen;
    pointer-events: none;
    animation: cateBannerShine 5.8s ease-in-out infinite;
}
.cate-home__banner::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(100deg, #031c3e 0%, #052a58 42%, #07346f 56%, rgba(7, 52, 111, .88) 61%, rgba(7, 52, 111, .18) 74%, rgba(7, 52, 111, .02) 100%),
        linear-gradient(135deg, transparent 39%, rgba(229, 27, 35, .95) 39%, rgba(229, 27, 35, .95) 42.5%, transparent 42.5%),
        linear-gradient(135deg, transparent 51%, rgba(255, 255, 255, .14) 51%, rgba(255, 255, 255, .14) 52.5%, transparent 52.5%);
    pointer-events: none;
}
.cate-home__banner img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: fill;
    object-position: center;
}
.cate-home__banner-copy {
    position: absolute;
    z-index: 3;
    left: 34px;
    top: 50%;
    width: min(48%, 640px);
    transform: translateY(-50%);
    color: #fff;
    text-shadow: 0 10px 28px rgba(0, 0, 0, .34);
}
.cate-home__banner-copy h3 {
    position: relative;
    display: inline-block;
    margin: 0 0 8px;
    font-size: clamp(26px, 2.15vw, 38px);
    line-height: 1.15;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: -0.045em;
    color: #fff;
    text-wrap: balance;
    filter: drop-shadow(0 7px 14px rgba(0, 0, 0, .32));
}
.cate-home__banner-copy h3::before {
    content: "";
    position: absolute;
    left: -14px;
    top: 7px;
    bottom: 8px;
    width: 5px;
    border-radius: 999px;
    background: linear-gradient(180deg, #e51b23, var(--brand-orange));
    box-shadow: 0 0 18px rgba(229, 27, 35, .72);
}
.cate-home__banner-copy h3::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 46%;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--brand-orange), rgba(255, 255, 255, .86), transparent);
    box-shadow: 0 0 18px rgba(229, 27, 35, .52);
}
.cate-home__banner-copy p {
    margin: 12px 0 0;
    max-width: 560px;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 800;
    color: rgba(255, 255, 255, .95);
}
.cate-home__banner-items {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}
.cate-home__banner-items span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 6px 12px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 800;
    backdrop-filter: blur(8px);
}
.cate-home__banner-items span::before {
    content: "\f058";
    margin-right: 7px;
    color: #ffccd0;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}
@keyframes cateBannerShine {
    0%, 62%, 100% {
        background-position: center, 140% 0;
        opacity: .65;
    }
    76% {
        background-position: center, -45% 0;
        opacity: 1;
    }
}
.cate-home__img {
    width: 200px;
    flex-shrink: 0;
    padding: 10px;
}
.cate-home__img img {
    width: 100%;
    border-radius: 6px;
    object-fit: cover;
    height: 100%;
}
.cate-home__list {
    flex: 1;
    min-width: 0;
}
.cate-home__products {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1px;
    background: #eee;
}

/* ===========================
   PRODUCT CARD
=========================== */
.product-item {
    background: #fff;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: box-shadow 0.25s;
    position: relative;
}
.product-item:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.12); z-index: 1; }
.product-item__image {
    width: 100%;
    padding-bottom: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 8px;
}
.product-item__image img {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.3s;
}
.product-item:hover .product-item__image img { transform: scale(1.05); }
.product-item__name {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.product-item__name:hover { color: #e51b23; }
.product-item__price {
    color: #e51b23;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 4px;
}
.product-item__price-old {
    color: #999;
    text-decoration: line-through;
    font-size: 12px;
}
.product-item__discount {
    position: absolute;
    top: 8px; left: 8px;
    background: #e51b23;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
}
.btn-contact {
    display: block;
    width: 100%;
    text-align: center;
    padding: 5px;
    background: #fff0f1;
    border: 1px solid #e51b23;
    color: #b80f17;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    margin-top: 6px;
    transition: all 0.2s;
}
.btn-contact:hover {
    background: #e51b23;
    color: #fff;
}

/* ===========================
   FOOTER
=========================== */
.footer {
    background: #1c2a3a;
    color: #bbb;
    padding: 40px 0 20px;
    margin-top: 20px;
}
.footer__grid {
    display: grid;
    grid-template-columns: 2.5fr 1fr 1fr 1.5fr;
    gap: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.footer h4 {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 16px;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 8px;
}
.footer h4::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 30px; height: 2px;
    background: #e51b23;
}
.footer ul li {
    margin-bottom: 9px;
    font-size: 13px;
}
.footer ul li a { color: #bbb; transition: color 0.2s; }
.footer ul li a:hover { color: #fff; }
.footer__contact li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}
.footer__contact li i { color: #e51b23; margin-top: 2px; }
.footer__social {
    display: flex;
    gap: 12px;
    margin-top: 15px;
}
.footer__social a {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    transition: all 0.2s;
}
.footer__social a.fb { background: #1877f2; color: #fff; }
.footer__social a.yt { background: #ff0000; color: #fff; }
.footer__social a.tk { background: #010101; color: #fff; }
.footer__social a:hover { transform: translateY(-3px); }

.footer__newsletter form {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}
.footer__newsletter input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,0.2);
    background: rgba(255,255,255,0.08);
    color: #fff;
    border-radius: 4px;
    font-size: 13px;
    outline: none;
}
.footer__newsletter input::placeholder { color: #888; }
.footer__newsletter button {
    background: #e51b23;
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: background 0.2s;
}
.footer__newsletter button:hover { background: #b71c1c; }

.footer__bottom {
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    flex-wrap: wrap;
    gap: 10px;
}
.footer__bottom img { height: 36px; }

/* ===========================
   SECTION TITLE COMMON
=========================== */
.section-title {
    font-size: 20px;
    font-weight: 800;
    color: #084b94;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 8px;
    margin-bottom: 16px;
}
.section-title::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 50px; height: 3px;
    background: #e51b23;
}

/* ===========================
   SLICK OVERRIDES
=========================== */
.slick-prev, .slick-next {
    z-index: 10;
    width: 36px; height: 36px;
    background: rgba(0,0,0,0.4) !important;
    border-radius: 50%;
}
.slick-prev:hover, .slick-next:hover { background: rgba(211,47,47,0.8) !important; }
.slick-prev { left: 10px; }
.slick-next { right: 10px; }
.slick-dots li button:before { font-size: 8px; color: #e51b23; }
.slick-dots li.slick-active button:before { color: #e51b23; }

/* ===========================
   UTILITIES
=========================== */
.text-red { color: #e51b23 !important; }
.bg-red { background: #e51b23 !important; }
.d-none { display: none; }
.d-flex { display: flex; }

/* ===========================
   SECTION: WHY US
=========================== */
.why-us {
    background: #fff;
    padding: 40px 0;
    margin-top: 10px;
}
.why-us .section-title { text-align: center; }
.why-us .section-title::after { left: 50%; transform: translateX(-50%); }
.why-us__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px;
}
.why-us__item {
    text-align: center;
    padding: 24px 18px;
    border: 1px solid #eee;
    border-radius: 8px;
    transition: all 0.3s;
}
.why-us__item:hover {
    border-color: #e51b23;
    box-shadow: 0 4px 15px rgba(211,47,47,0.1);
    transform: translateY(-3px);
}
.why-us__icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(7, 52, 111, 0.08), rgba(242, 92, 39, 0.10));
    color: var(--brand-navy);
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease;
}
.why-us__icon svg {
    width: 38px;
    height: 38px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.why-us__item:hover .why-us__icon {
    transform: translateY(-2px);
    background: var(--brand-orange);
    color: #fff;
}
.why-us__item h5 {
    font-weight: 700;
    margin-bottom: 8px;
    color: #222;
    font-size: 15px;
}
.why-us__item p {
    font-size: 13px;
    color: #777;
    margin: 0;
    line-height: 1.6;
}

/* ===========================
   SECTION: NEWS HOME
=========================== */
.news-home {
    background: #f5f5f5;
    padding: 20px 0;
}
.news-home__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #084b94;
    margin-bottom: 15px;
    padding-bottom: 8px;
}
.news-home__title {
    font-size: 18px;
    font-weight: 800;
    color: #333;
    margin: 0;
    text-transform: uppercase;
    position: relative;
}
.news-home__title::after {
    content: '';
    position: absolute;
    bottom: -9px;
    left: 0;
    width: 60px;
    height: 3px;
    background: #e51b23;
}
.news-home__viewall {
    font-size: 13px;
    color: #084b94;
}
.news-home__viewall:hover {
    color: #e51b23;
}
.news-home__list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
}
.news-home__carousel {
    position: relative;
}
.news-home__nav {
    display: none;
}
.news-item {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
}
.news-item__image {
    display: block;
    width: 100%;
    padding-bottom: 60%;
    position: relative;
    background: #eee;
}
.news-item__image img {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.news-item__content {
    padding: 12px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.news-item__title {
    font-size: 14px;
    font-weight: 700;
    color: #333;
    line-height: 1.4;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.news-item__title:hover { color: #e51b23; }
.news-item__excerpt {
    font-size: 12px;
    color: #666;
    margin-bottom: 10px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}
.news-item__date {
    font-size: 11px;
    color: #999;
    display: flex;
    align-items: center;
    gap: 5px;
}

@media (max-width: 640px) {
    .news-home {
        padding: 14px 0;
    }

    .news-home .inner-container {
        padding-left: 10px;
        padding-right: 10px;
    }

    .news-home__top {
        margin-bottom: 10px;
        padding-bottom: 6px;
    }

    .news-home__title {
        font-size: 17px;
    }

    .news-home__viewall {
        font-size: 12px;
        font-weight: 800;
    }

    .news-home__carousel {
        padding: 0 30px;
    }

    .news-home__list {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scroll-padding: 0;
        padding: 2px 0 8px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .news-home__list::-webkit-scrollbar {
        display: none;
    }

    .news-home__list .news-item {
        flex: 0 0 calc((100% - 10px) / 2);
        min-width: 0;
        scroll-snap-align: start;
        border: 1px solid rgba(7, 61, 124, .08);
        box-shadow: 0 8px 18px rgba(7, 52, 111, .08);
    }

    .news-item__image {
        padding-bottom: 64%;
    }

    .news-item__content {
        padding: 8px;
    }

    .news-item__title {
        font-size: 12px;
        line-height: 1.35;
        min-height: 32px;
        margin-bottom: 5px;
    }

    .news-item__excerpt {
        font-size: 11px;
        line-height: 1.45;
        -webkit-line-clamp: 2;
        margin-bottom: 7px;
    }

    .news-item__date {
        font-size: 10px;
        gap: 4px;
    }

    .news-home__nav {
        width: 30px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        z-index: 5;
        transform: translateY(-50%);
        border: 1px solid rgba(7, 61, 124, .16);
        border-radius: 8px;
        background: #073d7c;
        color: #fff;
        box-shadow: 0 10px 24px rgba(7, 52, 111, .18);
    }

    .news-home__nav--prev {
        left: 0;
    }

    .news-home__nav--next {
        right: 0;
    }

    .news-home__nav:active {
        background: var(--brand-orange);
        border-color: var(--brand-orange);
    }
}

/* ===========================
   SECTION: ABOUT HOME
=========================== */
.about-home {
    background: #fff;
    padding: 40px 0;
}
.about-home__grid {
    display: flex;
    gap: 30px;
    align-items: center;
}
.about-home__image {
    width: 45%;
    flex-shrink: 0;
    min-height: 320px;
    overflow: hidden;
    border-radius: 8px;
    background: #f5f8fb;
}
.about-home__image img {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
    display: block;
    object-fit: cover;
}
.about-home__text {
    flex: 1;
}
.about-home__title {
    font-size: 22px;
    font-weight: 800;
    color: #333;
    margin-bottom: 15px;
    line-height: 1.4;
}
.about-home__desc p {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 12px;
}
.about-home__desc p:last-child {
    margin-bottom: 0;
}
.about-home__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}
.about-home__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.2;
}
.about-home__btn--primary {
    background: #e51b23;
    color: #fff;
    box-shadow: 0 10px 20px rgba(242, 92, 39, .16);
}
.about-home__btn--secondary {
    border: 1px solid #e4e9f1;
    background: #fff;
    color: #07346f;
}
.about-home__btn:hover {
    transform: translateY(-1px);
}
.about-home__btn--primary:hover {
    color: #fff;
    background: #df4d18;
}
.about-home__btn--secondary:hover {
    border-color: #e51b23;
    color: #e51b23;
}

/* ===========================
   FLOATING CONTACT BUTTONS
=========================== */
.floating-contact {
    position: fixed;
    right: 18px;
    bottom: 56px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.f-btn {
    position: relative;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    isolation: isolate;
    transition: transform .22s ease, filter .22s ease;
}
.f-btn:hover {
    transform: translateY(-3px) scale(1.03);
    filter: saturate(1.08);
}
.f-btn-icon {
    position: relative;
    z-index: 2;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 22px;
    box-shadow: 0 12px 24px rgba(7,52,111,.22), inset 0 1px 0 rgba(255,255,255,.28);
    border: 2px solid rgba(255,255,255,.42);
}
.f-btn-icon i {
    line-height: 1;
}
.f-btn-icon--zalo {
    overflow: hidden;
    padding: 0;
}
.f-btn-icon--zalo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.f-btn::before, .f-btn::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 100%; height: 100%;
    border-radius: 50%;
    z-index: -1;
    animation: sonarEffect 2.4s infinite;
    filter: blur(.2px);
}
.f-btn::after { animation-delay: 1.2s; }

@keyframes sonarEffect {
    0% { transform: translate(-50%, -50%) scale(.82); opacity: .52; }
    100% { transform: translate(-50%, -50%) scale(1.62); opacity: 0; }
}

.btn-zalo .f-btn-icon { background: #0068ff; }
.btn-zalo::before, .btn-zalo::after { background: rgba(0, 104, 255, 0.24); }
.btn-phone .f-btn-icon { background: linear-gradient(135deg, #23d56b, #059a45); }
.btn-phone::before, .btn-phone::after { background: rgba(5, 154, 69, 0.24); }
.btn-email .f-btn-icon { background: linear-gradient(135deg, #e51b23, #e51b23); }
.btn-email::before, .btn-email::after { background: rgba(242, 92, 39, 0.25); }

/* ===========================
   RESPONSIVE
=========================== */
@media (max-width: 1024px) {
    .menu__cate { width: 200px; }
    .cate-home__products { grid-template-columns: repeat(4, 1fr); }
    .nav-cate__item { width: calc(100% / 6 - 5px); }
    .slider__grid { height: 320px; }
    .slider__side { width: 150px; }
}
@media (max-width: 768px) {
    .home-layout__menu { display: none; }
    .menuSecondary { display: none !important; }
    .header__actions .header__action:not(.header__action--cart) { display: none; }
    .slider__grid { flex-direction: column; height: auto; }
    .slider__side { width: 100%; flex-direction: row; height: 120px; }
    .slider__banner { flex: 1; }
    .slider__main .item img { height: 220px; }
    .activity__image img { height: 80px; }
    .nav-cate__item { width: calc(100% / 4 - 5px); }
    .cate-home__products { grid-template-columns: repeat(2, 1fr); }
    .cate-home__content { flex-direction: column; }
    .cate-home__img { width: 100%; height: 160px; }
    .footer__grid { grid-template-columns: 1fr 1fr; }
    .header .inner-container { flex-wrap: wrap; }
    .header__search { order: 3; max-width: 100%; width: 100%; }
    .why-us__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .floating-contact {
        right: 12px;
        bottom: 72px;
        gap: 12px;
    }
    .f-btn {
        width: 54px;
        height: 54px;
    }
    .f-btn-icon {
        width: 43px;
        height: 43px;
        font-size: 19px;
    }
    .nav-cate__item { width: calc(100% / 3 - 5px); }
    .footer__grid { grid-template-columns: 1fr; }
    .why-us__grid { grid-template-columns: 1fr; }
}

/* ===========================
   BRAND POLISH OVERRIDES
   Logo tone: orange + charcoal
=========================== */
:root {
    --brand-navy: #202020;
    --brand-navy-soft: #3a3a3a;
    --brand-orange: #ff6000;
    --brand-orange-soft: #fff1e8;
    --brand-ink: #202020;
    --brand-muted: #66615e;
    --brand-line: #ebe3de;
    --brand-surface: #ffffff;
    --brand-bg: #faf8f6;
    --brand-shadow: 0 10px 28px rgba(32, 32, 32, 0.09);
}

html { scroll-behavior: smooth; }
body {
    color: var(--brand-ink);
    background: var(--brand-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a,
button,
img,
.product-item,
.nav-cate__item,
.why-us__item,
.slider__banner,
.btn-contact {
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .22s ease, transform .22s ease, opacity .2s ease;
}

.header-top__hotline,
.header-top__menu li a:hover,
.text-red,
.product-item__price,
.product-item__name:hover,
.nav-cate__item:hover .title,
.cate-home__nav .nav-item:hover,
.cate-home__viewall:hover,
.news-home__viewall:hover,
.news-item__title:hover {
    color: var(--brand-orange) !important;
}

.header__logo img,
.custom-logo {
    max-width: 330px;
    height: auto;
}

.form-main {
    border-color: var(--brand-orange);
    border-radius: 8px;
}
.form-main .btn-search,
.bg-red,
.menu__main > .menu-item > .menu-link:hover,
.menu__main > .menu-item:hover > .menu-link,
.menu__main > .viewall-item > .menu-link:hover,
.cate-home__title,
.footer__newsletter button,
.product-detail__btn--primary,
.btn-contact:hover {
    background: var(--brand-orange) !important;
    color: #fff !important;
}

#menu-secondary,
.home-layout__menu,
.btn-tuvan,
.menu-secondary-spacer,
.btn-zalo-top,
.footer,
.product-detail__btn--secondary:hover,
.f-btn-icon {
    background: var(--brand-navy) !important;
    color: #fff !important;
}
.btn-zalo .f-btn-icon {
    background: #0068ff !important;
}

.btn-tuvan,
.btn-zalo-top,
.btn-contact,
.product-detail__btn {
    border-radius: 8px;
}

.btn-zalo-top {
    box-shadow: none;
}
.btn-zalo-top:hover,
.btn-tuvan:hover {
    background: var(--brand-orange) !important;
    transform: translateY(-1px);
    box-shadow: var(--brand-shadow);
}

.full-content { background: var(--brand-bg); }
.slider-section,
.cate-home__block,
.product-item,
.nav-cate__item,
.why-us__item,
.news-item,
.product-detail__card,
.product-detail__content,
.product-breadcrumb {
    border-color: var(--brand-line) !important;
    box-shadow: none;
}

.slider__wrap,
.slider__banner,
.activity,
.cate-home__block,
.product-item,
.nav-cate__item,
.why-us__item,
.news-item {
    border-radius: 8px;
}

.slider__grid {
    min-height: 392px;
}
.slider__main:not(.slick-initialized) .item {
    display: none;
}
.slider__main:not(.slick-initialized) .item.is-active,
.slider__main:not(.slick-initialized) .item:first-child {
    display: block;
    height: 100%;
}
.slider__main .item {
    position: relative;
}
.slider__main .item::after,
.slider__banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(7,52,111,.58), rgba(7,52,111,.05) 55%, rgba(7,52,111,.14));
    pointer-events: none;
}
.slider__banner-label {
    background: rgba(7,52,111,.86);
    color: #fff;
    letter-spacing: 0;
}
.slick-prev,
.slick-next {
    background: rgba(7,52,111,.82) !important;
}
.slick-prev:hover,
.slick-next:hover {
    background: var(--brand-orange) !important;
}
.slick-dots li button:before,
.slick-dots li.slick-active button:before {
    color: var(--brand-orange);
}

.nav-cate__item:hover,
.why-us__item:hover,
.product-item:hover,
.news-item:hover {
    border-color: rgba(229,27,35,.45) !important;
    box-shadow: var(--brand-shadow);
    transform: translateY(-2px);
}
.nav-cate__item .image,
.menu-icon {
    background: var(--brand-orange-soft);
}
.nav-cate__item.image-fallback::before,
.menu-link.image-fallback::before {
    content: '';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    background: var(--brand-orange);
    color: #fff;
    border-radius: 6px;
}
.nav-cate__item.image-fallback::before {
    width: 50px;
    height: 50px;
    margin-bottom: 6px;
    box-shadow: inset 0 0 0 7px var(--brand-navy);
}
.menu-link.image-fallback::before {
    width: 22px;
    height: 22px;
    box-shadow: inset 0 0 0 4px var(--brand-navy);
}
img.is-missing {
    display: none !important;
}

.cate-home__top,
.news-home__top {
    border-bottom-color: var(--brand-navy);
}
.cate-home__nav .nav-item,
.cate-home__viewall,
.news-home__viewall,
.section-title {
    color: var(--brand-navy) !important;
}
.section-title::after,
.news-home__title::after,
.footer h4::after {
    background: var(--brand-orange);
}
.cate-home__products {
    gap: 8px;
    background: transparent;
    padding: 8px;
}

/* Homepage category/banner visual polish */
.cate-home__top,
.news-home__top {
    overflow: hidden;
    border-bottom: 2px solid rgba(7, 52, 111, .95);
    background:
        linear-gradient(180deg, #fff, #f8fbff),
        radial-gradient(circle at 12% 0%, rgba(229, 27, 35, .08), transparent 28%);
}
.cate-home__title {
    position: relative;
    isolation: isolate;
    gap: 9px;
    min-height: 52px;
    padding: 13px 24px !important;
    border-radius: 8px 18px 0 0;
    background: linear-gradient(135deg, #e51b23 0%, #e51b23 54%, #b80f17 100%) !important;
    box-shadow: 10px 0 24px rgba(229, 27, 35, .18);
    font-size: 18px;
    font-weight: 900;
    letter-spacing: -.02em;
}
.cate-home__title::before {
    content: "\f0e7";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    font-family: "Font Awesome 6 Free";
    font-size: 12px;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}
.cate-home__title::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -28px;
    width: 56px;
    height: 100%;
    background: inherit;
    transform: skewX(-24deg);
    transform-origin: left top;
    z-index: -1;
}
.cate-home__nav {
    gap: 8px;
}
.cate-home__nav .nav-item {
    padding: 7px 12px;
    border-radius: 999px;
    color: var(--brand-navy) !important;
    font-size: 14px;
    font-weight: 750;
}
.cate-home__nav .nav-item:hover {
    background: rgba(229, 27, 35, .10);
    color: var(--brand-orange) !important;
    transform: translateY(-1px);
}
.cate-home__viewall,
.news-home__viewall {
    font-weight: 800;
}
.cate-home__viewall:hover,
.news-home__viewall:hover {
    transform: translateX(2px);
}
.section-title,
.news-home__title,
.about-home__title {
    position: relative;
    color: var(--brand-navy) !important;
    font-weight: 950;
    letter-spacing: -.035em;
}
.section-title::before,
.news-home__title::before,
.about-home__title::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 10px;
    border-radius: 999px;
    background: var(--brand-orange);
    box-shadow: 0 0 0 6px rgba(229, 27, 35, .13);
    vertical-align: middle;
}
.product-item {
    border: 1px solid rgba(7, 52, 111, 0.10);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(7, 52, 111, 0.035);
}
.product-item__image {
    background: #fff;
    border-radius: 9px;
}
.product-item__image a {
    position: absolute;
    inset: 0;
    display: block;
    background: #fff;
}
.product-item__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: normal;
    filter: contrast(1.03) saturate(1.02);
}
.product-item:hover {
    border-color: rgba(242, 92, 39, 0.28);
    box-shadow: 0 8px 24px rgba(7, 52, 111, 0.08);
}
.btn-contact {
    background: var(--brand-orange-soft);
    border-color: rgba(229,27,35,.35);
    color: var(--brand-orange);
    padding: 8px 10px;
}

.footer__social a,
.btn-phone .f-btn-icon,
.btn-email .f-btn-icon,
.btn-zalo .f-btn-icon {
    background: var(--brand-navy) !important;
    color: #fff !important;
}
.btn-phone::before,
.btn-phone::after,
.btn-email::before,
.btn-email::after,
.btn-zalo::before,
.btn-zalo::after {
    background: rgba(229,27,35,.28) !important;
}

/* Product detail */
.product-detail {
    padding: 22px 15px 30px;
}
.product-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    padding: 11px 14px;
    background: var(--brand-surface);
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    font-size: 13px;
    color: var(--brand-muted);
}
.product-breadcrumb a {
    color: var(--brand-navy);
    font-weight: 600;
}
.product-detail__card {
    display: grid;
    grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
    gap: 24px;
    background: var(--brand-surface);
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    padding: 22px;
}
.product-detail__image {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    width: 100%;
    padding: 0;
    cursor: default;
}
.product-detail__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform: scale(1);
    transition: transform .28s ease, filter .28s ease;
    will-change: transform;
}
.product-detail__image.is-zooming img {
    transform: none;
    filter: none;
}
.product-detail__zoom-hint {
    position: absolute;
    left: 14px;
    bottom: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 999px;
    background: rgba(7, 52, 111, .78);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(7,52,111,.18);
    backdrop-filter: blur(8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
}
.product-detail__image.is-zooming .product-detail__zoom-hint {
    opacity: 0;
    transform: translateY(6px);
}
.product-image-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--brand-orange-soft);
    color: var(--brand-navy);
    font-weight: 900;
    font-size: 48px;
}
.product-detail__summary h1 {
    margin: 0 0 12px;
    color: var(--brand-ink);
    font-size: 25px;
    line-height: 1.35;
    font-weight: 850;
}
.product-detail__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    padding-bottom: 14px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--brand-line);
    color: var(--brand-muted);
    font-size: 13px;
}
.product-detail__meta strong,
.product-detail__meta a {
    color: var(--brand-navy);
}
.product-detail__price {
    display: grid;
    gap: 4px;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(229,27,35,.22);
    border-radius: 8px;
    background: var(--brand-orange-soft);
}
.product-detail__price strong {
    color: var(--brand-orange);
    font-size: 27px;
    line-height: 1.25;
}
.product-detail__price span,
.product-detail__excerpt {
    color: var(--brand-muted);
    line-height: 1.7;
}
.product-detail__excerpt {
    margin-bottom: 18px;
    padding: 14px 16px;
    border-left: 3px solid var(--brand-navy);
    background: #f8fbff;
    border-radius: 8px;
}
.product-detail__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.product-detail__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 12px 16px;
    font-weight: 750;
    text-align: center;
}
.product-detail__btn--secondary {
    border: 2px solid var(--brand-navy);
    color: var(--brand-navy);
    background: #fff;
}
.product-detail__policies {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fbfcff;
}
.product-detail__policies li {
    position: relative;
    padding-left: 20px;
    font-size: 13px;
    color: var(--brand-ink);
}
.product-detail__policies li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .45em;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--brand-orange);
    box-shadow: 0 0 0 3px var(--brand-orange-soft);
}
.product-detail__content {
    margin-top: 20px;
    padding: 28px;
    background: var(--brand-surface);
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    color: var(--brand-ink);
    font-size: 17px;
    line-height: 1.9;
    text-align: justify;
    text-justify: inter-word;
}
.product-detail__content h2 {
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--brand-orange);
    color: var(--brand-navy);
    font-size: 19px;
    text-transform: uppercase;
}

.product-detail--demo {
    background: #fff;
}
.product-detail__card--demo {
    grid-template-columns: minmax(360px, 38%) minmax(420px, 1fr) minmax(245px, 285px);
    gap: 24px;
    align-items: flex-start;
    border: 1px solid rgba(7, 52, 111, 0.08);
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 14px 38px rgba(7, 52, 111, 0.07);
}
.product-detail__gallery--demo {
    position: sticky;
    top: 12px;
}
.product-detail__image--demo {
    border: none;
    border-radius: 14px;
    min-height: 390px;
    padding: 0;
    background: #f8fafc;
    box-shadow: inset 0 0 0 1px rgba(7, 52, 111, 0.06);
}
.product-detail__image--demo img {
    display: block;
    object-fit: cover;
    border-radius: 14px;
}
.product-detail__thumb-slider {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}
.product-detail__thumbs {
    display: flex;
    gap: 10px;
    flex: 1;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding: 2px 1px 4px;
}
.product-detail__thumbs::-webkit-scrollbar {
    display: none;
}
.product-detail__thumb {
    width: 86px;
    min-width: 86px;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(7, 52, 111, 0.10);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
    padding: 0;
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.product-detail__thumb.is-active {
    border-color: var(--brand-orange);
    box-shadow: 0 0 0 2px rgba(229, 27, 35, .14), 0 8px 18px rgba(7, 52, 111, .08);
}
.product-detail__thumb:hover {
    transform: translateY(-1px);
    border-color: rgba(229, 27, 35, .45);
}
.product-detail__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.product-detail__thumb-nav {
    width: 34px;
    min-width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(7, 52, 111, 0.10);
    border-radius: 50%;
    background: rgba(255, 255, 255, .95);
    color: var(--brand-navy);
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(7, 52, 111, .10);
    transition: color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.product-detail__thumb-nav:hover {
    color: var(--brand-orange);
    border-color: rgba(229, 27, 35, .35);
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(229, 27, 35, .16);
}
.product-lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    background: rgba(3, 16, 34, .88);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
}
.product-lightbox.is-open {
    opacity: 1;
    visibility: visible;
}
.product-lightbox__img {
    max-width: min(1120px, 94vw);
    max-height: 88vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 26px 80px rgba(0, 0, 0, .38);
    transform: scale(.96);
    transition: transform .2s ease;
}
.product-lightbox.is-open .product-lightbox__img {
    transform: scale(1);
}
.product-lightbox__close {
    position: fixed;
    top: 18px;
    right: 20px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 34px;
    line-height: 1;
    box-shadow: 0 12px 30px rgba(0,0,0,.22);
    backdrop-filter: blur(10px);
}
.product-lightbox__close:hover {
    background: var(--brand-orange);
}
body.product-lightbox-open {
    overflow: hidden;
}
.product-detail__summary--demo h1 {
    margin-bottom: 10px;
    font-size: 28px;
    font-weight: 850;
    color: #111827;
}
.product-detail__meta--demo {
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.product-detail__price--demo {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 14px;
    padding: 0;
    border: none;
    background: transparent;
}
.product-detail__price--demo span {
    color: #111827;
    font-size: 18px;
    font-weight: 700;
}
.product-detail__price--demo strong {
    color: var(--brand-orange);
    font-size: 32px;
    font-weight: 900;
}
.product-detail__benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 12px 0;
    border: 1px solid rgba(229, 27, 35, 0.12);
    border-radius: 14px;
    background: linear-gradient(180deg, #fff, #fff5f5);
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(229, 27, 35, 0.055);
}
.product-detail__benefits div {
    min-height: 82px;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 8px;
    padding: 12px 8px;
    border-right: 1px solid rgba(229, 27, 35, 0.22);
    background: transparent;
    text-align: center;
    color: #111827;
    font-size: 13px;
    font-weight: 700;
}
.product-detail__benefits div:last-child {
    border-right: none;
}
.product-detail__benefits i {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e51b23, var(--brand-orange));
    color: #fff;
    font-size: 17px;
    box-shadow: 0 8px 18px rgba(229, 27, 35, 0.28);
}
.product-detail__bulk-note {
    margin: 8px 0 12px;
    color: #4b5563;
    font-size: 14px;
}
.product-detail__specs {
    display: grid;
    gap: 7px;
    margin-bottom: 14px;
    padding-left: 20px;
    color: #1f2937;
    line-height: 1.55;
}
.product-detail__specs li {
    list-style: disc;
}
.product-detail__excerpt--demo {
    margin-bottom: 14px;
    padding: 12px 14px;
    background: #f8fafc;
    border-left-color: var(--brand-orange);
}
.product-detail__size-row,
.product-detail__buy-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 12px 0 8px;
}
.product-detail__option-label {
    min-width: 78px;
    color: #111827;
    font-weight: 800;
}
.product-detail__size-guide {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid #2f80ff;
    border-radius: 5px;
    color: #1f6fff;
    background: #fff;
    font-weight: 600;
}
.product-detail__sizes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}
.product-detail__sizes button {
    min-width: 78px;
    min-height: 38px;
    padding: 7px 12px;
    border: 1px solid #d7dce3;
    border-radius: 6px;
    background: #fff;
    color: #111827;
    font-weight: 700;
    cursor: default;
}
.product-detail__sizes button.is-active {
    border-color: var(--brand-orange);
    color: var(--brand-orange);
    box-shadow: 0 0 0 2px rgba(229, 27, 35, .13);
}
.product-detail__qty {
    display: inline-flex;
    height: 38px;
    border: 1px solid #d7dce3;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.product-detail__qty button,
.product-detail__qty input {
    width: 38px;
    border: none;
    border-right: 1px solid #d7dce3;
    background: #fff;
    color: #111827;
    text-align: center;
    font-weight: 800;
}
.product-detail__qty button:last-child {
    border-right: none;
}
.product-detail__stock {
    color: #138a3d;
    font-weight: 800;
}
.product-detail__actions--demo {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 16px 0 10px;
}
.product-detail__actions--demo .product-detail__btn {
    min-height: 52px;
    border-radius: 8px;
    font-size: 16px;
    text-transform: uppercase;
}
.product-detail__consult-btn {
    border: 2px solid var(--brand-navy);
    cursor: pointer;
}
.product-detail__ship-note {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--brand-navy);
    font-weight: 750;
}
.product-detail__contact-card {
    position: sticky;
    top: 12px;
    padding: 22px 20px;
    border: 1px solid rgba(7, 52, 111, 0.12);
    border-radius: 16px;
    background: #fff;
    color: #1f2937;
    line-height: 1.55;
    box-shadow: 0 12px 30px rgba(7, 52, 111, 0.065);
}
.product-detail__contact-card h2 {
    margin: 0 0 14px;
    color: #111827;
    text-align: center;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 900;
}
.product-detail__contact-item,
.product-detail__contact-phone {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: flex-start;
}
.product-detail__contact-item {
    margin-bottom: 13px;
}
.product-detail__contact-item p,
.product-detail__contact-phone span {
    margin: 0;
}
.product-detail__contact-item i,
.product-detail__contact-phone i {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, #eaf2ff, #fff0f1);
    color: #2f80ff;
    font-size: 16px;
    box-shadow: inset 0 0 0 1px rgba(47, 128, 255, 0.10);
}
.product-detail__contact-item a {
    color: #1f2937;
    word-break: break-word;
}
.product-detail__hotline-title {
    margin: 18px 0 14px;
    color: #f32121;
    font-weight: 850;
}
.product-detail__contact-phone {
    margin-top: 12px;
    color: #1f2937;
}
.product-detail__contact-phone:hover {
    color: var(--brand-orange);
}
.product-detail__contact-phone strong {
    display: block;
    color: #111827;
}
.product-detail__content--demo {
    border-radius: 12px;
}
.product-detail__content--demo .entry-content {
    font-size: 18px;
    line-height: 1.95;
    letter-spacing: -0.01em;
}
.product-detail__content--demo .entry-content p,
.product-detail__content--demo .entry-content li {
    margin-bottom: 14px;
    text-align: justify;
    text-justify: inter-word;
}
.product-detail__content--demo .entry-content ul,
.product-detail__content--demo .entry-content ol {
    padding-left: 1.35em;
}
.product-detail__content--demo h2 {
    text-align: center;
    border-bottom: none;
    color: #111827;
    font-size: 27px;
    line-height: 1.35;
}
.product-detail__body-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
    gap: 24px;
    align-items: start;
    margin-top: 20px;
}
.product-detail__body-grid .product-detail__content--demo {
    margin-top: 0;
}
.product-detail__related-sidebar {
    position: sticky;
    top: 12px;
    border: 1px solid #d7dce3;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}
.product-detail__related-sidebar h2 {
    margin: 0;
    padding: 14px 12px;
    border-bottom: 1px solid #d7dce3;
    color: #111827;
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 900;
}
.product-detail__related-list {
    display: grid;
    gap: 0;
    padding: 12px;
}
.product-detail-related-card {
    display: grid;
    color: #111827;
    background: #fff;
}
.product-detail-related-card:hover {
    color: var(--brand-orange);
}
.product-detail-related-card--sidebar {
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #eef1f5;
}
.product-detail-related-card--sidebar:first-child {
    padding-top: 0;
}
.product-detail-related-card--sidebar:last-child {
    padding-bottom: 0;
    border-bottom: none;
}
.product-detail-related-card__image {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    border: 1px solid #edf0f4;
    border-radius: 7px;
    background: #fff;
    overflow: hidden;
}
.product-detail-related-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.product-detail-related-card__fallback {
    color: var(--brand-navy);
    font-weight: 900;
}
.product-detail-related-card__body {
    display: grid;
    align-content: start;
    gap: 6px;
}
.product-detail-related-card__body strong {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #1f6fff;
    font-size: 15px;
    line-height: 1.35;
}
.product-detail-related-card__body em {
    color: var(--brand-orange);
    font-style: normal;
    font-weight: 900;
}
.product-detail__brand-products {
    margin-top: 24px;
}
.product-detail__section-heading {
    margin-bottom: 18px;
    border-top: 3px solid #2f80ff;
}
.product-detail__section-heading h2 {
    display: inline-flex;
    margin: 0;
    padding: 10px 24px;
    background: #2f80ff;
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 850;
}
.product-detail__brand-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.product-detail-related-card--grid {
    min-height: 100%;
    padding: 12px;
    border: 1px solid #d7dce3;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(7, 52, 111, 0.035);
}
.product-detail-related-card--grid .product-detail-related-card__image {
    margin-bottom: 12px;
    border: none;
}
.product-detail-related-card--grid .product-detail-related-card__body strong {
    min-height: 60px;
    color: #111827;
    text-align: center;
    font-size: 16px;
}
.product-detail-related-card--grid .product-detail-related-card__body em {
    text-align: center;
    font-size: 18px;
}

/* Product category/archive */
.product-archive {
    padding: 22px 15px 34px;
}
.product-archive__layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}
.product-archive__sidebar {
    position: sticky;
    top: 12px;
}
.product-archive__sidebox,
.product-archive__breadcrumb,
.product-archive__header,
.product-archive__seo,
.product-archive__faq {
    background: #fff;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .045);
}
.product-archive__sidebox {
    overflow: hidden;
}
.product-archive__side-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 15px;
    background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-soft));
    color: #fff;
    font-size: 14px;
    font-weight: 850;
    text-transform: uppercase;
}
.product-archive__cat-list {
    list-style: none;
    margin: 0;
    padding: 8px;
}
.product-archive__cat-list a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    border-radius: 9px;
    color: #263548;
    font-size: 13px;
    font-weight: 650;
}
.product-archive__cat-list a:hover,
.product-archive__cat-list a.is-active {
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
}
.product-archive__filter {
    margin-top: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .045);
}
.product-archive__side-title--filter {
    background: linear-gradient(135deg, var(--brand-orange), #e51b23);
}
.product-archive__filter-group {
    border-top: 1px solid var(--brand-line);
}
.product-archive__filter-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 14px;
    border: 0;
    background: #fff;
    color: var(--brand-navy);
    font-size: 14px;
    font-weight: 850;
    text-align: left;
}
.product-archive__filter-title i {
    transition: transform .2s ease;
}
.product-archive__filter-group.is-closed .product-archive__filter-title i {
    transform: rotate(-90deg);
}
.product-archive__filter-options {
    display: grid;
    gap: 6px;
    padding: 0 12px 12px;
}
.product-archive__filter-group.is-closed .product-archive__filter-options {
    display: none;
}
.product-archive__filter-option {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    margin: 0;
    padding: 7px 9px;
    border: 1px solid rgba(7, 52, 111, .08);
    border-radius: 10px;
    background: #f8fbff;
    color: #263548;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
.product-archive__filter-option:hover {
    border-color: rgba(229, 27, 35, .28);
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
}
.product-archive__filter-option input {
    width: 15px;
    height: 15px;
    accent-color: var(--brand-orange);
}
.product-archive__filter-actions {
    display: grid;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--brand-line);
    background: #fbfdff;
}
.product-archive__filter-actions button,
.product-archive__filter-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}
.product-archive__filter-actions button {
    border: 0;
    background: var(--brand-orange);
    color: #fff;
}
.product-archive__filter-actions a {
    border: 1px solid var(--brand-line);
    background: #fff;
    color: var(--brand-navy);
}
.product-archive__main {
    min-width: 0;
}
.product-archive__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    padding: 10px 14px;
    color: var(--brand-muted);
    font-size: 13px;
}
.product-archive__breadcrumb a {
    color: var(--brand-navy);
    font-weight: 750;
}
.product-archive__header {
    margin-bottom: 14px;
    padding: 18px 20px;
}
.product-archive__header h1 {
    margin: 0 0 8px;
    color: var(--brand-navy);
    font-size: 25px;
    font-weight: 900;
    text-transform: uppercase;
}
.product-archive__header p {
    max-width: 860px;
    margin: 0;
    color: var(--brand-muted);
    line-height: 1.65;
}
.product-archive__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.product-archive__loadmore-wrap {
    margin: 24px 0 0;
    text-align: center;
}
.product-archive__loadmore {
    min-width: 210px;
    min-height: 46px;
    padding: 11px 22px;
    border: 1px solid rgba(229, 27, 35, .30);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--brand-orange), #e51b23);
    color: #fff;
    font-weight: 850;
    box-shadow: 0 10px 24px rgba(229, 27, 35, .20);
}
.product-archive__loadmore:disabled {
    opacity: .72;
}
.product-archive__empty {
    padding: 56px 20px;
    background: #fff;
    border: 1px solid var(--brand-line);
    border-radius: 14px;
    text-align: center;
    color: var(--brand-muted);
}
.product-archive__empty i {
    display: block;
    margin-bottom: 16px;
    color: #cbd5e1;
    font-size: 54px;
}
.product-archive__seo,
.product-archive__faq {
    margin-top: 24px;
    padding: 24px;
    color: var(--brand-ink);
    line-height: 1.75;
}
.product-archive__seo h2,
.product-archive__faq h2 {
    margin: 0 0 14px;
    color: var(--brand-navy);
    font-size: 23px;
    font-weight: 900;
}
.product-archive__seo h3 {
    margin: 0 0 8px;
    color: #111827;
    font-size: 17px;
    font-weight: 850;
}
.product-archive__seo-points {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}
.product-archive__seo-points > div {
    padding: 16px;
    border: 1px solid rgba(7, 52, 111, .08);
    border-radius: 12px;
    background: #f8fbff;
}
.product-archive__faq details {
    border-top: 1px solid var(--brand-line);
    padding: 14px 0;
}
.product-archive__faq details:last-child {
    padding-bottom: 0;
}
.product-archive__faq summary {
    cursor: pointer;
    color: #111827;
    font-weight: 850;
}
.product-archive__faq p {
    margin: 10px 0 0;
    color: var(--brand-muted);
}
.tuvan-modal__product {
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(229, 27, 35, .18);
    border-left: 4px solid var(--brand-orange);
    border-radius: 12px;
    background: linear-gradient(135deg, #fff5f5, #f7fbff);
    box-shadow: 0 8px 20px rgba(7, 52, 111, .055);
}
.tuvan-modal__product span {
    display: block;
    margin-bottom: 4px;
    color: var(--brand-muted);
    font-size: 13px;
    font-weight: 700;
}
.tuvan-modal__product strong {
    display: block;
    color: var(--brand-ink);
    font-size: 16px;
    line-height: 1.35;
}
.tuvan-modal__product small {
    display: block;
    margin-top: 5px;
    color: var(--brand-navy);
    font-weight: 700;
}

/* Font icon fallback when CDN fonts are unavailable */
.fa-solid,
.fa-regular,
.fa-brands {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15em;
    min-width: 1.15em;
    font-style: normal;
    line-height: 1;
}
.menu-secondary-spacer::before,
.menu__main > .menu-item.has-child > .menu-link::after {
    font-family: inherit;
}
.menu-secondary-spacer::before {
    content: '\2630';
}
.menu__main > .menu-item.has-child > .menu-link::after {
    content: '\203A';
}

/* Local category icon set */
.menu__main > .menu-item > .menu-link::before,
.nav-cate__item::before {
    display: none !important;
}
.menu__main > .menu-item > .menu-link .menu-icon,
.nav-cate__item .image {
    display: block !important;
    background: transparent;
}
.menu__main > .menu-item > .menu-link .menu-icon {
    width: 28px;
    height: 28px;
    padding: 2px;
    border-radius: 8px;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.12));
}
.nav-cate__item .image {
    width: 64px;
    height: 64px;
    object-fit: contain;
    margin-bottom: 8px;
    filter: drop-shadow(0 6px 12px rgba(7,52,111,.12));
}
.activity::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(135deg, rgba(7,52,111,.7), rgba(229,27,35,.3));
    pointer-events: none;
}
.activity__image img {
    filter: grayscale(1) contrast(1.05) brightness(.72);
}
.activity__title {
    z-index: 2;
    background: rgba(7,52,111,.78);
}

@media (max-width: 1200px) {
    .product-detail__card--demo {
        grid-template-columns: minmax(300px, 42%) minmax(0, 1fr);
    }
    .product-detail__contact-card {
        grid-column: 1 / -1;
        position: static;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px 18px;
    }
    .product-detail__contact-card h2,
    .product-detail__hotline-title {
        grid-column: 1 / -1;
    }
    .product-detail__contact-phone {
        margin-top: 0;
    }
    .product-detail__body-grid {
        grid-template-columns: 1fr;
    }
    .product-detail__related-sidebar {
        position: static;
    }
    .product-detail__related-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
    .product-detail-related-card--sidebar {
        border: 1px solid #eef1f5;
        border-radius: 8px;
        padding: 10px;
    }
    .product-detail__brand-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .product-detail__card {
        grid-template-columns: 1fr;
        padding: 16px;
    }
    .product-detail__gallery--demo {
        position: static;
    }
    .product-detail__image--demo {
        min-height: auto;
    }
    .product-detail__thumb {
        width: 74px;
        min-width: 74px;
    }
    .product-detail__thumb-nav {
        width: 30px;
        min-width: 30px;
        height: 30px;
        font-size: 22px;
    }
    .product-detail__summary--demo h1 {
        font-size: 21px;
    }
    .product-detail__price--demo strong {
        font-size: 25px;
    }
    .product-detail__benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .product-detail__actions--demo {
        grid-template-columns: 1fr;
    }
    .product-detail__contact-card {
        display: block;
    }
    .product-detail__related-list,
    .product-detail__brand-grid {
        grid-template-columns: 1fr;
    }
    .product-detail-related-card--sidebar {
        grid-template-columns: 96px minmax(0, 1fr);
    }
    .product-detail__section-heading h2 {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
    .cate-home__banner {
        height: 120px;
    }
    .cate-home__banner::after {
        width: 78%;
    }
    .cate-home__banner-copy {
        left: 16px;
        width: 68%;
    }
    .cate-home__banner-copy h3 {
        font-size: 18px;
        margin-bottom: 5px;
    }
    .cate-home__banner-copy p {
        font-size: 12px;
        line-height: 1.35;
    }
    .cate-home__banner-items {
        gap: 6px;
        margin-top: 8px;
    }
    .cate-home__banner-items span {
        min-height: 22px;
        padding: 4px 8px;
        font-size: 10px;
    }
    .product-detail__actions,
    .product-detail__policies {
        grid-template-columns: 1fr;
    }
    .product-detail__summary h1 {
        font-size: 21px;
    }
    .product-detail__price strong {
        font-size: 22px;
    }
}

@media (max-width: 1200px) {
    .product-archive__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .product-archive__layout {
        grid-template-columns: 1fr;
    }
    .product-archive__sidebar {
        position: static;
    }
    .product-archive__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .product-archive__seo-points {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .product-archive {
        padding-left: 8px;
        padding-right: 8px;
    }
    .product-archive__grid {
        gap: 8px;
    }
    .product-archive__header,
    .product-archive__seo,
    .product-archive__faq {
        padding: 18px 16px;
    }
}

/* Product taxonomy pages: danh muc san pham */
.dpqn-tax-archive {
    padding: 18px 0 44px;
    background: #fff;
}

.dpqn-tax-archive__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #e6e9ee;
    background: #fff;
    color: #6b7280;
    font-size: 14px;
    font-weight: 700;
}

.dpqn-tax-archive__breadcrumb a {
    color: var(--brand-navy);
    font-weight: 850;
}

.dpqn-tax-archive__breadcrumb strong {
    color: var(--brand-orange);
}

.dpqn-tax-archive__promo {
    margin: 0 0 18px;
    padding: 20px 22px 22px;
    border-radius: 6px;
    background: linear-gradient(135deg, var(--brand-blue) 0%, #0b5799 58%, var(--brand-blue-dark) 100%);
    color: #fff;
    font-family: 'Inter', 'Roboto', Arial, sans-serif;
    box-shadow: 0 16px 34px rgba(6,64,118,.16);
}

.dpqn-tax-archive__promo h2 {
    margin: 0 auto 14px;
    color: #fff;
    font-size: clamp(17px, 1.6vw, 22px);
    line-height: 1.35;
    font-weight: 450;
    letter-spacing: 0;
    text-align: center;
    text-transform: none;
}

.dpqn-tax-archive__promo ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dpqn-tax-archive__promo li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,.94);
    font-size: 16px;
    line-height: 1.5;
    font-weight: 450;
    letter-spacing: 0;
}

.dpqn-tax-archive__promo li span {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 15px;
    padding: 0 4px;
    border-radius: 3px;
    background: #e51b23;
    color: #fff;
    font-size: 9px;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.45);
}

.dpqn-tax-archive__promo p {
    margin: 16px 0 0;
    color: rgba(255,255,255,.96);
    font-size: 16px;
    line-height: 1.55;
    font-weight: 450;
    letter-spacing: 0;
    text-align: center;
    text-transform: none;
}

.dpqn-tax-archive__promo a {
    color: #ffccd0 !important;
    font-weight: 650;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.dpqn-tax-archive__service-strip {
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.dpqn-tax-archive__service-strip div {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 12px 14px;
    border: 1px solid rgba(6,64,118,.10);
    border-left: 4px solid var(--brand-orange);
    background: #f8fbff;
    color: var(--brand-navy);
    font-weight: 850;
}

.dpqn-tax-archive__service-strip i {
    color: var(--brand-orange);
    font-size: 19px;
}

.dpqn-tax-archive__layout {
    display: grid;
    grid-template-columns: 290px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.dpqn-tax-archive__sidebar {
    position: sticky;
    top: 14px;
    display: grid;
    gap: 16px;
}

.dpqn-tax-sidebox {
    overflow: hidden;
    border: 1px solid #e5e8ee;
    background: #fff;
}

.dpqn-tax-sidebox h2 {
    margin: 0;
    padding: 14px 16px;
    background: var(--brand-navy);
    color: #fff;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 950;
    text-transform: uppercase;
}

.dpqn-tax-cat-toggle {
    all: unset;
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-transform: inherit;
    box-sizing: border-box;
    pointer-events: none;
}

.dpqn-tax-cat-toggle i {
    display: none;
    flex: 0 0 auto;
    font-size: 12px;
    transition: transform .2s ease;
}

.dpqn-tax-cat-list,
.dpqn-tax-cat-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dpqn-tax-cat-list > li + li,
.dpqn-tax-cat-list ul li + li {
    border-top: 1px solid #edf0f4;
}

.dpqn-tax-cat-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 45px;
    padding: 11px 14px;
    color: #606975;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 900;
    text-transform: uppercase;
}

.dpqn-tax-cat-list ul {
    border-top: 1px solid #edf0f4;
    background: #fbfcfe;
}

.dpqn-tax-cat-list ul a {
    min-height: 39px;
    padding: 9px 14px 9px 26px;
    font-size: 13px;
    font-weight: 800;
    text-transform: none;
}

.dpqn-tax-cat-list a em {
    color: #8b95a5;
    font-size: 12px;
    font-style: normal;
    font-weight: 750;
}

.dpqn-tax-cat-list a:hover,
.dpqn-tax-cat-list a.is-active {
    background: #fff0f1;
    color: var(--brand-orange) !important;
}

.dpqn-tax-cat-list a:hover em,
.dpqn-tax-cat-list a.is-active em {
    color: var(--brand-orange);
}

.dpqn-tax-child-list {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.dpqn-tax-child-list a {
    padding: 10px 12px;
    border: 1px solid #edf0f4;
    background: #f8fbff;
    color: var(--brand-navy);
    font-size: 13px;
    font-weight: 850;
}

.dpqn-tax-child-list a:hover,
.dpqn-tax-child-list a.is-active {
    border-color: rgba(229,27,35,.22);
    background: #fff0f1;
    color: var(--brand-orange) !important;
}

.dpqn-tax-sidebox--children {
    display: none !important;
}

.dpqn-tax-sidebox--support {
    padding-bottom: 14px;
}

.dpqn-tax-sidebox--support p {
    margin: 0;
    padding: 14px 16px;
    color: #5d6675;
    line-height: 1.6;
    font-weight: 650;
}

.dpqn-tax-sidebox--support a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 16px;
    min-height: 44px;
    background: var(--brand-orange);
    color: #fff !important;
    font-weight: 900;
}

.dpqn-tax-archive__main {
    min-width: 0;
}

.dpqn-tax-archive__header {
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e5e8ee;
}

.dpqn-tax-archive__header h1 {
    margin: 0 0 8px;
    color: #0b0b0b;
    font-size: clamp(24px, 2.5vw, 34px);
    line-height: 1.2;
    font-weight: 900;
    text-transform: uppercase;
}

.dpqn-tax-archive__header p {
    max-width: 920px;
    margin: 0;
    color: #5d6675;
    line-height: 1.7;
    font-weight: 600;
}

.dpqn-tax-archive__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
    padding: 10px 0;
    color: #5d6675;
    font-size: 14px;
    font-weight: 650;
}

.dpqn-tax-archive__toolbar form {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
}

.dpqn-tax-archive__toolbar label {
    margin: 0;
    color: #475467;
    font-weight: 800;
}

.dpqn-tax-archive__toolbar select {
    min-width: 180px;
    height: 38px;
    padding: 0 34px 0 12px;
    border: 1px solid #d7dce3;
    background: #fff;
    color: #111827;
    font-weight: 700;
}

.dpqn-tax-archive__grid.product-archive__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.dpqn-tax-archive__empty {
    display: grid;
    place-items: center;
    gap: 12px;
    min-height: 220px;
    border: 1px solid #e5e8ee;
    background: #f8fbff;
    color: #667085;
    text-align: center;
    font-weight: 750;
}

.dpqn-tax-archive__empty i {
    color: #cbd5e1;
    font-size: 48px;
}

.dpqn-tax-archive__seo {
    margin-top: 28px;
    padding: 22px 0 0;
    border-top: 1px solid #e5e8ee;
    color: #374151;
    line-height: 1.75;
    font-weight: 600;
}

.dpqn-tax-archive__seo h2 {
    margin: 0 0 12px;
    color: var(--brand-navy);
    font-size: 23px;
    font-weight: 900;
}

@media (max-width: 1180px) {
    .dpqn-tax-archive__layout {
        grid-template-columns: 250px minmax(0, 1fr);
    }

    .dpqn-tax-archive__grid.product-archive__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .dpqn-tax-archive__service-strip,
    .dpqn-tax-archive__layout {
        grid-template-columns: 1fr;
    }

    .dpqn-tax-archive__sidebar {
        position: static;
    }

    .dpqn-tax-archive__breadcrumb {
        flex-wrap: nowrap;
        gap: 6px;
        overflow: hidden;
        padding: 10px 12px;
        white-space: nowrap;
    }

    .dpqn-tax-archive__breadcrumb a,
    .dpqn-tax-archive__breadcrumb > span {
        flex: 0 0 auto;
    }

    .dpqn-tax-archive__breadcrumb strong {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dpqn-tax-sidebox--cats h2 {
        padding: 0;
    }

    .dpqn-tax-cat-toggle {
        position: relative;
        min-height: 48px;
        padding: 13px 42px 13px 16px;
        cursor: pointer;
        pointer-events: auto;
    }

    .dpqn-tax-cat-toggle span {
        white-space: nowrap;
    }

    .dpqn-tax-cat-toggle i {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 16px;
        transform: translateY(-50%);
    }

    .dpqn-tax-cat-toggle[aria-expanded="true"] i {
        transform: translateY(-50%) rotate(180deg);
    }

    body.logged-in .dpqn-tax-cat-toggle {
        padding-right: 130px;
    }

    body.logged-in .dpqn-tax-cat-toggle i {
        right: 116px;
    }

    .dpqn-tax-cat-list[hidden] {
        display: none !important;
    }

    .dpqn-tax-archive__toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .dpqn-tax-archive__toolbar form,
    .dpqn-tax-archive__toolbar select {
        width: 100%;
    }

    .dpqn-tax-archive__promo li,
    .dpqn-tax-archive__promo p {
        font-size: 15px;
    }
}

@media (max-width: 520px) {
    .dpqn-tax-archive {
        padding-top: 12px;
    }

    .dpqn-tax-archive__grid.product-archive__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .dpqn-tax-archive__breadcrumb {
        font-size: 12px;
    }

    .dpqn-tax-archive__service-strip {
        gap: 8px;
    }

    .dpqn-tax-archive__service-strip div {
        min-height: 46px;
        padding: 10px 12px;
        font-size: 13px;
    }

    .dpqn-tax-archive__promo {
        padding: 15px 14px;
    }

    .dpqn-tax-archive__promo ul {
        gap: 7px;
    }

    .dpqn-tax-archive__promo li {
        align-items: flex-start;
        font-size: 14px;
    }

    .dpqn-tax-archive__promo p {
        font-size: 14px;
        text-transform: none;
    }
}

/* Refined homepage commitment cards */
.why-us {
    background:
        radial-gradient(circle at 18% 0%, rgba(229, 27, 35, .08), transparent 26%),
        linear-gradient(180deg, #fff 0%, #f7fbff 100%);
    padding: 46px 0 50px;
}

.why-us__heading {
    justify-content: center;
    text-align: center;
    margin-bottom: 0;
}

.why-us__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 28px;
}

.why-us__item {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 190px;
    padding: 30px 22px 26px;
    border: 1px solid rgba(7, 52, 111, .10) !important;
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.90)),
        radial-gradient(circle at 50% 0%, rgba(229, 27, 35, .10), transparent 48%);
    box-shadow: 0 14px 34px rgba(7, 52, 111, .06);
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.why-us__item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24px;
    right: 24px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--brand-orange), transparent);
    opacity: .72;
}

.why-us__item::after {
    content: "";
    position: absolute;
    inset: auto -26px -46px auto;
    width: 115px;
    height: 115px;
    border-radius: 50%;
    background: rgba(7, 52, 111, .045);
    z-index: -1;
}

.why-us__item:hover {
    border-color: rgba(229, 27, 35, .38) !important;
    box-shadow: 0 20px 44px rgba(7, 52, 111, .10);
    transform: translateY(-5px);
}

.why-us__icon {
    width: 78px;
    height: 78px;
    margin: 0 auto 17px;
    border-radius: 24px;
    background:
        linear-gradient(135deg, #fff5f5, #edf5ff);
    color: var(--brand-navy);
    box-shadow:
        inset 0 0 0 1px rgba(7, 52, 111, .06),
        0 12px 24px rgba(7, 52, 111, .09);
    transition: transform .28s ease, color .28s ease, background .28s ease, box-shadow .28s ease;
}

.why-us__icon i {
    font-size: 31px;
    line-height: 1;
}

.why-us__icon svg {
    display: none;
}

.why-us__item:hover .why-us__icon {
    transform: translateY(-4px) scale(1.04);
    color: #fff;
    background: linear-gradient(135deg, var(--brand-orange), #e51b23);
    box-shadow: 0 16px 30px rgba(229, 27, 35, .28);
}

.why-us__item h5 {
    margin: 0 0 10px;
    color: var(--brand-navy);
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.02em;
}

.why-us__item p {
    max-width: 286px;
    margin: 0 auto;
    color: #667085;
    font-size: 14px;
    line-height: 1.65;
}

@media (max-width: 992px) {
    .why-us__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .why-us__grid {
        grid-template-columns: 1fr;
    }

    .why-us__item {
        min-height: auto;
    }
}

/* Softer product detail benefit icons */
.product-detail__benefits {
    border-color: rgba(229, 27, 35, .16);
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,248,245,.72));
    box-shadow: 0 10px 26px rgba(7, 52, 111, .045);
}

.product-detail__benefits div {
    min-height: 86px;
    gap: 9px;
    border-right-color: rgba(229, 27, 35, .16);
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.35;
}

.product-detail__benefits i {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(229, 27, 35, .26);
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,241,234,.78));
    color: var(--brand-orange);
    font-size: 20px;
    font-weight: 400;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 8px 18px rgba(229, 27, 35, .10);
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.product-detail__benefits .fa-tag,
.product-detail__benefits .fa-truck-fast {
    font-size: 18px;
}

.product-detail__benefits div:hover i {
    transform: translateY(-2px);
    border-color: rgba(229, 27, 35, .42);
    background:
        linear-gradient(145deg, #fff, rgba(255, 230, 218, .92));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 12px 24px rgba(229, 27, 35, .15);
}

/* Softer contact price text on product detail */
.product-detail__price--demo {
    gap: 8px;
    margin-bottom: 12px;
}

.product-detail__price--demo span {
    font-size: 17px;
    font-weight: 700;
}

.product-detail__price strong,
.product-detail__price--demo strong {
    display: inline-block;
    color: var(--brand-orange);
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.18;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
}

@media (max-width: 576px) {
    .product-detail__price strong,
    .product-detail__price--demo strong {
        font-size: 22px;
    }
}

/* Homepage nav category title sits on the horizontal menu bar */
.menu-secondary-spacer {
    background: linear-gradient(135deg, #e51b23 0%, #e51b23 58%, #b80f17 100%) !important;
    color: #fff !important;
}

.menu-secondary-spacer::before {
    content: none !important;
}

.menu__cate-title {
    display: none !important;
}

/* Blog/category archive */
.blog-archive {
    padding: 24px 15px 42px;
}

.blog-archive__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 13px 18px;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 16px;
    background: #fff;
    color: #667085;
    font-size: 14px;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .045);
}

.blog-archive__breadcrumb a {
    color: var(--brand-navy);
    font-weight: 800;
}

.blog-archive__hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 24px;
    align-items: center;
    margin-bottom: 22px;
    padding: 34px;
    border-radius: 22px;
    background:
        radial-gradient(circle at 78% 20%, rgba(229, 27, 35, .22), transparent 28%),
        linear-gradient(135deg, #064076 0%, #0a5796 54%, #042c56 100%);
    color: #fff;
    box-shadow: 0 18px 44px rgba(7, 52, 111, .16);
}

.blog-archive__hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg, rgba(255,255,255,.08) 0 12%, transparent 12% 28%, rgba(255,255,255,.05) 28% 40%, transparent 40%);
    pointer-events: none;
}

.blog-archive__eyebrow {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    font-weight: 800;
}

.blog-archive__hero h1 {
    position: relative;
    z-index: 1;
    margin: 0 0 12px;
    max-width: 820px;
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 950;
    letter-spacing: -.045em;
    line-height: 1.08;
    text-transform: uppercase;
}

.blog-archive__hero p,
.blog-archive__desc {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 16px;
    line-height: 1.75;
}

.blog-archive__desc p {
    margin: 0;
}

.blog-archive__hero-card {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 8px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 20px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(10px);
}

.blog-archive__hero-card i {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--brand-orange);
    color: #fff;
    font-size: 22px;
}

.blog-archive__hero-card strong {
    font-size: 18px;
    font-weight: 900;
}

.blog-archive__hero-card span {
    color: rgba(255,255,255,.82);
    line-height: 1.6;
}

.blog-featured {
    display: grid;
    grid-template-columns: 1.35fr .9fr;
    gap: 16px;
    margin-bottom: 24px;
}

.blog-featured__item {
    overflow: hidden;
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    align-items: stretch;
    min-height: 170px;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(7, 52, 111, .055);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.blog-featured__item--large {
    grid-row: span 2;
    grid-template-columns: 1fr;
}

.blog-featured__item:hover {
    transform: translateY(-3px);
    border-color: rgba(229, 27, 35, .34);
    box-shadow: 0 18px 42px rgba(7, 52, 111, .09);
}

.blog-featured__image {
    position: relative;
    display: block;
    height: 170px;
    min-height: 170px;
    background: #edf3fb;
}

.blog-featured__item--large .blog-featured__image {
    height: auto;
    min-height: 0;
    max-height: 380px;
    aspect-ratio: 16 / 10;
}

.blog-featured__image img,
.blog-card__image img,
.blog-sidebar__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.blog-featured__item--large .blog-featured__image img {
    object-fit: contain;
    padding: 18px;
    background: #fff;
}

.blog-featured__image span,
.blog-card__fallback,
.blog-sidebar__thumb i {
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--brand-navy);
    font-size: 32px;
}

.blog-featured__content {
    padding: 18px;
}

.blog-featured__content h2 {
    margin: 8px 0;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.35;
}

.blog-featured__item--large .blog-featured__content h2 {
    font-size: 25px;
}

.blog-featured__content h2 a,
.blog-card h2 a {
    color: #111827;
}

.blog-featured__content h2 a:hover,
.blog-card h2 a:hover,
.blog-sidebar__post:hover strong {
    color: var(--brand-orange);
}

.blog-featured__content p {
    margin: 0;
    color: #667085;
    line-height: 1.65;
}

.blog-archive__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: start;
}

.blog-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(7, 52, 111, .92);
}

.blog-section-head h2 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 22px;
    font-weight: 950;
    letter-spacing: -.03em;
}

.blog-section-head span {
    color: var(--brand-muted);
    font-weight: 750;
}

.blog-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.blog-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(7, 52, 111, .045);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.blog-card:hover {
    transform: translateY(-3px);
    border-color: rgba(229, 27, 35, .34);
    box-shadow: 0 18px 38px rgba(7, 52, 111, .09);
}

.blog-card__image {
    position: relative;
    height: 210px;
    display: block;
    background: #edf3fb;
}

.blog-card__image em {
    position: absolute;
    left: 12px;
    bottom: 12px;
    max-width: calc(100% - 24px);
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(7, 52, 111, .88);
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.blog-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 18px;
}

.blog-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    color: #7a8594;
    font-size: 12.5px;
    font-weight: 650;
}

.blog-card h2 {
    margin: 10px 0 9px;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.38;
}

.blog-card p {
    margin: 0 0 14px;
    color: #667085;
    line-height: 1.68;
}

.blog-card__readmore {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    color: var(--brand-orange);
    font-weight: 850;
}

.blog-sidebar {
    position: sticky;
    top: 12px;
    display: grid;
    gap: 16px;
}

.blog-sidebar__box,
.blog-archive__seo,
.blog-archive__empty {
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(7, 52, 111, .045);
}

.blog-sidebar__box {
    overflow: hidden;
}

.blog-sidebar__box h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-soft));
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}

.blog-sidebar__cats {
    margin: 0;
    padding: 10px;
}

.blog-sidebar__cats a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 11px;
    border-radius: 12px;
    color: #263548;
    font-weight: 750;
}

.blog-sidebar__cats a:hover {
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
}

.blog-sidebar__cats em {
    min-width: 26px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #f2f5f9;
    color: #667085;
    text-align: center;
    font-size: 12px;
    font-style: normal;
}

.blog-sidebar__latest {
    display: grid;
    gap: 0;
    padding: 8px;
}

.blog-sidebar__post {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 11px;
    padding: 9px;
    border-radius: 14px;
}

.blog-sidebar__post:hover {
    background: #f8fbff;
}

.blog-sidebar__thumb {
    overflow: hidden;
    width: 78px;
    height: 66px;
    border-radius: 12px;
    background: #edf3fb;
}

.blog-sidebar__post strong {
    display: -webkit-box;
    overflow: hidden;
    color: #1f2937;
    font-size: 13.5px;
    font-weight: 850;
    line-height: 1.35;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.blog-sidebar__post em {
    display: block;
    margin-top: 5px;
    color: #8a94a3;
    font-size: 12px;
    font-style: normal;
}

.blog-sidebar__contact {
    padding-bottom: 16px;
}

.blog-sidebar__contact p {
    margin: 14px 16px;
    color: #667085;
    line-height: 1.65;
}

.blog-sidebar__contact a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 16px;
    min-height: 42px;
    padding: 10px 16px;
    border-radius: 12px;
    background: var(--brand-orange);
    color: #fff;
    font-weight: 850;
}

.blog-archive__loadmore-wrap {
    margin-top: 22px;
    text-align: center;
}

.blog-archive__loadmore {
    min-height: 44px;
    padding: 10px 24px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--brand-orange), #e51b23);
    color: #fff;
    font-weight: 900;
    box-shadow: 0 12px 26px rgba(229, 27, 35, .22);
}

.blog-archive__loadmore:disabled {
    opacity: .72;
}

.blog-archive__empty {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 46px 24px;
    color: #667085;
}

.blog-archive__empty i {
    color: var(--brand-orange);
    font-size: 34px;
}

.blog-archive__seo {
    margin-top: 24px;
    padding: 26px;
}

.blog-archive__seo h2 {
    margin: 0 0 12px;
    color: var(--brand-navy);
    font-size: 24px;
    font-weight: 950;
    letter-spacing: -.03em;
}

.blog-archive__seo p {
    color: #4b5563;
    font-size: 16px;
    line-height: 1.8;
}

.blog-archive__seo-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.blog-archive__seo-grid > div {
    padding: 18px;
    border-radius: 16px;
    background: #f8fbff;
}

.blog-archive__seo-grid h3 {
    margin: 0 0 8px;
    color: var(--brand-navy);
    font-size: 17px;
    font-weight: 900;
}

.blog-archive__seo-grid p {
    margin: 0;
    font-size: 15px;
}

@media (max-width: 1200px) {
    .blog-archive__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .blog-archive__hero,
    .blog-featured,
    .blog-archive__layout {
        grid-template-columns: 1fr;
    }

    .blog-sidebar {
        position: static;
    }
}

@media (max-width: 640px) {
    .blog-archive {
        padding-left: 10px;
        padding-right: 10px;
    }

    .blog-archive__hero {
        padding: 24px 18px;
        border-radius: 18px;
    }

    .blog-featured__item,
    .blog-archive__grid,
    .blog-archive__seo-grid {
        grid-template-columns: 1fr;
    }

    .blog-featured__image,
    .blog-featured__item--large .blog-featured__image,
    .blog-card__image {
        min-height: 0;
        height: 210px;
    }
}

/* Floating contact: polished motion */
.floating-contact {
    right: 16px;
    bottom: 38px;
    gap: 12px;
    align-items: flex-end;
}

.f-btn {
    width: auto;
    height: 46px;
    min-width: 46px;
    justify-content: flex-end;
    border-radius: 999px;
    animation: contactFloat 3.8s ease-in-out infinite;
}

.btn-phone { animation-delay: .35s; }
.btn-email { animation-delay: .7s; }

.f-btn-icon {
    width: 42px;
    height: 42px;
    border: 2px solid rgba(255,255,255,.88);
    font-size: 17px;
    box-shadow: 0 12px 26px rgba(7, 52, 111, .22);
    transition: transform .24s ease, box-shadow .24s ease, filter .24s ease;
}

.f-btn-label {
    position: absolute;
    right: 52px;
    top: 50%;
    transform: translate(8px, -50%);
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    padding: 8px 0;
    border-radius: 999px;
    background: rgba(7, 52, 111, .96);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    opacity: 0;
    box-shadow: 0 10px 24px rgba(7, 52, 111, .18);
    transition: max-width .28s ease, padding .28s ease, opacity .2s ease, transform .28s ease;
    pointer-events: none;
}

.f-btn:hover .f-btn-label {
    max-width: 132px;
    padding-left: 13px;
    padding-right: 13px;
    opacity: 1;
    transform: translate(0, -50%);
}

.f-btn::before {
    content: "";
    position: absolute;
    right: 2px;
    top: 2px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: currentColor;
    opacity: .18;
    transform: scale(1);
    animation: contactHalo 2.6s ease-out infinite;
    z-index: -1;
}

.f-btn::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 8px;
    width: 13px;
    height: 7px;
    border-radius: 999px;
    background: rgba(255,255,255,.58);
    filter: blur(.2px);
    z-index: 3;
    pointer-events: none;
}

.f-btn:hover .f-btn-icon {
    transform: translateX(-3px) scale(1.05);
    box-shadow: 0 16px 30px rgba(7, 52, 111, .28);
    filter: saturate(1.06);
}

.btn-zalo {
    color: #0b86ff;
}

.btn-zalo .f-btn-icon {
    background: #fff !important;
}

.btn-phone {
    color: #07346f;
}

.btn-phone .f-btn-icon {
    background: linear-gradient(145deg, #0a438a, #062c62) !important;
}

.btn-email {
    color: #e51b23;
}

.btn-email .f-btn-icon {
    background: linear-gradient(145deg, #0a438a, #062c62) !important;
}

@keyframes contactHalo {
    0% {
        opacity: .22;
        transform: scale(.92);
    }
    75%, 100% {
        opacity: 0;
        transform: scale(1.68);
    }
}

@keyframes contactFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
}

@media (max-width: 640px) {
    .floating-contact {
        right: 10px;
        bottom: 46px;
        gap: 9px;
    }

    .f-btn {
        height: 40px;
        min-width: 40px;
        animation-duration: 4.4s;
    }

    .f-btn-icon {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }

    .f-btn-label {
        display: none;
    }

    .f-btn::before {
        right: 1px;
        top: 1px;
        width: 38px;
        height: 38px;
    }

    .f-btn::after {
        right: 8px;
        top: 7px;
    }
}

@media (max-width: 640px) {
    .header-top {
        padding: 7px 0;
    }

    .header-top .inner-container {
        justify-content: center;
    }

    .header-top__hotline {
        display: block;
        text-align: center;
        line-height: 1.45;
        font-size: 13px;
    }

    .header-top__menu {
        display: none;
    }

    .header {
        padding: 14px 0;
    }

    .header .inner-container {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .header__logo {
        justify-self: center;
        min-width: 0;
    }

    .header__logo img,
    .custom-logo {
        max-width: 240px;
        height: auto;
    }

    .header__actions.new-actions {
        justify-content: center;
        gap: 10px;
        margin-left: 0;
        width: 100%;
    }

    .btn-tuvan,
    .btn-zalo-top {
        min-height: 40px;
        padding: 10px 13px;
        font-size: 13px;
        border-radius: 8px;
    }

    .btn-tuvan i {
        font-size: 15px;
    }

    .btn-zalo-top img {
        width: 18px;
        height: 18px;
    }

    .header__search {
        order: 3;
        width: 100%;
        max-width: none;
        margin: 0;
    }

    .form-main {
        width: 100%;
        min-width: 0;
    }

    .form-main input[type="text"] {
        min-width: 0;
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-main .btn-search {
        flex: 0 0 auto;
        padding: 10px 14px;
        font-size: 13px;
    }

    #menu-secondary .inner-container {
        display: block;
        padding: 0;
    }

    .menu-secondary-spacer {
        width: 100%;
        height: 38px;
        justify-content: center;
        font-size: 13px;
    }

    .menuSecondary__menu {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0 10px;
    }

    .menuSecondary__menu::-webkit-scrollbar {
        display: none;
    }

    .menuSecondary__menu li {
        flex: 0 0 auto;
    }

    .menuSecondary__menu li a {
        padding: 13px 12px;
        font-size: 12px;
        font-weight: 850;
    }
}

/* Professional polish for static brand pages */
.brand-page .brand-hero,
.brand-page .contact-hero,
.brand-page .brand-section,
.brand-page .contact-panel,
.brand-page .contact-request,
.brand-page .brand-stats div,
.brand-page .contact-action,
.brand-page .brand-feature-list article {
    border-color: #e6ebf2;
    box-shadow: 0 6px 18px rgba(7, 52, 111, .045);
}

.brand-page .brand-hero,
.brand-page .contact-hero {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 62%, #fff5f5 100%);
}

.brand-page .brand-hero__eyebrow,
.brand-page .brand-section__label {
    padding: 6px 10px;
    background: #fff0f1;
    color: #d9470f;
    font-size: 11px;
    letter-spacing: 0;
}

.brand-page .brand-hero__eyebrow i,
.brand-page .brand-section__label i {
    font-size: 12px;
}

.brand-page .brand-feature-list article,
.brand-page .contact-location-list article {
    background: #fff;
    box-shadow: none;
}

.brand-page .brand-feature-list i,
.brand-page .contact-location-list i,
.brand-page .contact-request h2 i {
    width: 34px;
    height: 34px;
    border: 1px solid #f7d7c7;
    border-radius: 8px;
    background: #fff5f5;
    color: #d9470f;
    font-size: 14px;
    box-shadow: none;
}

.brand-page .brand-feature-list article {
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    padding: 15px;
}

.brand-page .brand-feature-list h3 {
    align-self: center;
    font-size: 15px;
}

.brand-page .brand-feature-list p {
    margin-top: 8px;
    color: #5f6b7a;
}

.brand-page .brand-category-grid a {
    background: #fff;
    box-shadow: none;
}

.brand-page .contact-action {
    box-shadow: none;
}

.brand-page .contact-action i,
.brand-page .contact-action img {
    width: 38px;
    height: 38px;
}

.brand-page .contact-action i {
    border: 1px solid #f7d7c7;
    background: #fff5f5;
    color: #d9470f;
    font-size: 15px;
}

.brand-page .contact-action {
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 14px;
}

.brand-page .contact-hero__hotline {
    background: #07346f;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.brand-page .brand-btn {
    min-height: 42px;
    box-shadow: none;
}

.brand-page .brand-btn--primary {
    background: #e51b23;
}

.brand-page .brand-btn--ghost {
    background: #fff;
}

.page-id-454 .floating-contact {
    display: none;
}

.floating-contact {
    right: 14px;
    bottom: 36px;
    gap: 10px;
}

.f-btn {
    width: 48px;
    height: 48px;
}

.f-btn-icon {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.72);
    font-size: 17px;
    box-shadow: 0 8px 18px rgba(7, 52, 111, .18);
}

.f-btn::before,
.f-btn::after {
    content: none;
}

.f-btn:hover {
    transform: translateY(-2px);
}

@media (max-width: 640px) {
    .brand-page .brand-hero,
    .brand-page .contact-hero {
        padding-right: 18px;
    }

    .brand-page .brand-hero p,
    .brand-page .contact-hero p {
        font-size: 15px;
        line-height: 1.65;
    }

    .brand-page .brand-feature-list article,
    .brand-page .contact-location-list article {
        padding: 13px;
    }

    .brand-page .contact-action strong {
        font-size: 15px;
        overflow-wrap: anywhere;
    }

    .floating-contact {
        right: 10px;
        bottom: 48px;
        gap: 8px;
    }

    .f-btn {
        width: 42px;
        height: 42px;
    }

    .f-btn-icon {
        width: 36px;
        height: 36px;
        font-size: 15px;
    }
}

/* ===========================
   ABOUT & CONTACT PAGES
=========================== */
.brand-page {
    padding: 20px 15px 44px;
}

.brand-page__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    color: #667085;
    font-size: 13px;
    font-weight: 700;
}

.brand-page__breadcrumb a {
    color: var(--brand-navy);
}

.brand-hero,
.contact-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
    gap: 28px;
    align-items: stretch;
    margin-bottom: 18px;
    padding: 28px;
    border-radius: 8px;
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 52%, #fff0f1 100%);
    border: 1px solid var(--brand-line);
    box-shadow: var(--brand-shadow);
    overflow: hidden;
}

.brand-hero__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.brand-hero__eyebrow,
.brand-section__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    margin-bottom: 12px;
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.brand-hero h1,
.contact-hero h1 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 34px;
    line-height: 1.18;
    font-weight: 950;
}

.brand-hero p,
.contact-hero p {
    margin: 14px 0 0;
    max-width: 680px;
    color: #475467;
    font-size: 16px;
    line-height: 1.75;
}

.brand-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.brand-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 11px 16px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-weight: 900;
    line-height: 1.2;
}

.brand-btn--primary {
    background: var(--brand-orange);
    color: #fff;
    box-shadow: 0 10px 18px rgba(229, 27, 35, .18);
}

.brand-btn--ghost {
    background: #fff;
    color: var(--brand-navy);
    border-color: var(--brand-line);
}

.brand-hero__media {
    min-height: 320px;
    margin: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #eef3f8;
}

.brand-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.brand-visual-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
    min-height: 320px;
    padding: 28px;
    border-radius: 8px;
    background:
        radial-gradient(circle at 88% 12%, rgba(229, 27, 35, .18), transparent 28%),
        linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-navy-soft) 100%);
    color: #fff;
}

.brand-visual-card__top {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.18);
    font-weight: 900;
}

.brand-visual-card__top i {
    color: #fff;
}

.brand-visual-card strong {
    max-width: 420px;
    font-size: 30px;
    line-height: 1.18;
    font-weight: 950;
}

.brand-visual-card ul {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.brand-visual-card li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255,255,255,.9);
    font-weight: 800;
}

.brand-visual-card li i {
    color: var(--brand-red);
    background: #fff;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 12px;
}

.brand-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 20px 0 22px;
}

.brand-stats div,
.brand-feature-list article,
.contact-action,
.contact-panel,
.contact-request,
.brand-section {
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(7, 52, 111, .06);
}

.brand-stats div {
    position: relative;
    overflow: hidden;
    min-height: 152px;
    padding: 24px 22px;
    background:
        linear-gradient(145deg, #fff 0%, #f8fbff 62%, #fff0f1 100%);
    border-color: rgba(6,64,118,.10);
    box-shadow: 0 14px 34px rgba(6,64,118,.08);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.brand-stats div::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--brand-red), var(--brand-navy));
}

.brand-stats div::after {
    content: "";
    position: absolute;
    right: -34px;
    bottom: -34px;
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background: rgba(6,64,118,.06);
}

.brand-stats div:hover {
    transform: translateY(-4px);
    border-color: rgba(229,27,35,.22);
    box-shadow: 0 20px 42px rgba(6,64,118,.13);
}

.brand-stats div > i {
    position: relative;
    z-index: 1;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 8px;
    background: var(--brand-navy);
    color: #fff;
    box-shadow: 0 10px 22px rgba(6,64,118,.18);
}

.brand-stats strong {
    position: relative;
    z-index: 1;
    display: block;
    color: var(--brand-navy);
    font-size: 30px;
    line-height: 1.05;
    font-weight: 950;
}

.brand-stats span {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: 12px;
    color: #536174;
    line-height: 1.45;
    font-weight: 800;
}

.about-premium-banner {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 24px;
    align-items: end;
    min-height: 360px;
    margin: 18px 0;
    padding: 34px;
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(4,44,86,.94) 0%, rgba(6,64,118,.82) 48%, rgba(229,27,35,.22) 100%),
        var(--about-banner-image) center/cover no-repeat;
    box-shadow: 0 18px 44px rgba(6, 64, 118, .16);
    color: #fff;
}

.about-premium-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(255,255,255,.10) 0 10%, transparent 10% 28%, rgba(255,255,255,.06) 28% 38%, transparent 38%);
    pointer-events: none;
}

.about-premium-banner__content,
.about-premium-banner__badges {
    position: relative;
    z-index: 1;
}

.about-premium-banner__content span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.about-premium-banner h2 {
    max-width: 760px;
    margin: 0;
    color: #fff;
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.08;
    font-weight: 950;
}

.about-premium-banner p {
    max-width: 760px;
    margin: 16px 0 0;
    color: rgba(255,255,255,.9);
    font-size: 17px;
    line-height: 1.7;
    font-weight: 600;
}

.about-premium-banner__badges {
    display: grid;
    gap: 10px;
}

.about-premium-banner__badges strong {
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 13px 16px;
    border-radius: 8px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.20);
    color: #fff;
    font-size: 16px;
    font-weight: 950;
    backdrop-filter: blur(8px);
}

.brand-section {
    margin-top: 18px;
    padding: 24px;
}

.brand-section--split {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(340px, 1.1fr);
    gap: 34px;
    align-items: center;
    padding: 34px;
    background:
        linear-gradient(135deg, #ffffff 0%, #f7fbff 64%, #fff6f6 100%);
    border-color: rgba(6,64,118,.10);
    color: var(--brand-ink);
    box-shadow: 0 14px 36px rgba(6,64,118,.08);
}

.brand-section--split::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: linear-gradient(180deg, var(--brand-red), var(--brand-navy));
    pointer-events: none;
}

.brand-section--split > * {
    position: relative;
    z-index: 1;
}

.brand-section--split .brand-section__label {
    background: #fff0f1;
    border: 1px solid rgba(229,27,35,.14);
    color: var(--brand-red);
}

.brand-section--split h2 {
    color: var(--brand-navy);
    font-size: clamp(27px, 3vw, 38px);
    line-height: 1.16;
}

.brand-section--split p {
    max-width: 640px;
    color: #4b5a70;
    font-size: 16px;
    font-weight: 500;
}

.brand-section h2,
.contact-panel h2,
.contact-request h2 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 24px;
    line-height: 1.3;
    font-weight: 950;
}

.brand-section p {
    margin: 12px 0 0;
    color: #475467;
    font-size: 15px;
    line-height: 1.75;
}

.about-showcase {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
    gap: 16px;
    margin-top: 18px;
}

.about-showcase figure {
    position: relative;
    overflow: hidden;
    margin: 0;
    border-radius: 8px;
    border: 1px solid var(--brand-line);
    background: #fff;
    box-shadow: 0 12px 28px rgba(6,64,118,.08);
}

.about-showcase img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-showcase__placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: inherit;
    place-items: center;
    color: var(--brand-blue);
    background: linear-gradient(145deg, #edf5fb, #dceaf5);
    font-size: clamp(58px, 9vw, 104px);
}

.about-showcase__large {
    min-height: 430px;
}

.about-showcase__large figcaption {
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: 22px;
    padding: 18px;
    border-radius: 8px;
    background: rgba(4,44,86,.88);
    color: #fff;
    backdrop-filter: blur(8px);
}

.about-showcase__large figcaption span {
    display: block;
    margin-bottom: 6px;
    color: rgba(255,255,255,.78);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.about-showcase__large figcaption strong {
    display: block;
    color: #fff;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 950;
}

.about-showcase__side {
    display: grid;
    gap: 16px;
}

.about-showcase__side figure {
    min-height: 207px;
}

.about-showcase__side figcaption {
    position: absolute;
    left: 14px;
    bottom: 14px;
    padding: 9px 12px;
    border-radius: 999px;
    background: #fff;
    color: var(--brand-navy);
    font-weight: 950;
    box-shadow: 0 8px 20px rgba(6,64,118,.14);
}

.brand-feature-list {
    display: grid;
    gap: 12px;
    counter-reset: workflow-step;
}

.brand-feature-list article {
    position: relative;
    counter-increment: workflow-step;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 42px;
    gap: 14px;
    align-items: start;
    min-height: 124px;
    padding: 18px;
    border-color: rgba(6,64,118,.10);
    background: #fff;
    box-shadow: 0 10px 24px rgba(6,64,118,.06);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.brand-feature-list article::after {
    content: "0" counter(workflow-step);
    grid-column: 3;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: end;
    color: rgba(6,64,118,.16);
    font-size: 28px;
    line-height: 1;
    font-weight: 950;
}

.brand-feature-list article:hover {
    transform: translateY(-2px);
    border-color: rgba(229,27,35,.20);
    box-shadow: 0 16px 30px rgba(6,64,118,.10);
}

.brand-feature-list i,
.contact-location-list i,
.contact-request h2 i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
}

.brand-section--split .brand-feature-list i {
    width: 46px;
    height: 46px;
    background: #fff0f1;
    color: var(--brand-red);
    box-shadow: none;
    border: 1px solid rgba(229,27,35,.14);
}

.brand-feature-list h3,
.contact-location-list h3 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 18px;
    font-weight: 950;
}

.brand-feature-list h3,
.brand-feature-list p {
    grid-column: 2;
}

.brand-feature-list p,
.contact-location-list p {
    margin: 8px 0 0;
    color: #667085;
    line-height: 1.65;
    font-weight: 600;
}

.brand-section__head {
    margin-bottom: 16px;
}

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

.brand-category-grid a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    color: var(--brand-navy);
    font-weight: 900;
}

.brand-category-grid a:hover {
    border-color: var(--brand-orange);
    color: var(--brand-orange);
}

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

.brand-promise-grid article {
    padding: 18px;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fbfcfe;
}

.brand-promise-grid article > i {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    border-radius: 8px;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
    font-size: 18px;
}

.brand-promise-grid h3 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 17px;
    font-weight: 950;
}

.brand-promise-grid p {
    margin: 8px 0 0;
    color: #667085;
    line-height: 1.65;
}

.contact-hero {
    grid-template-columns: minmax(0, 1fr) 320px;
}

.contact-hero__hotline {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 22px;
    border-radius: 8px;
    background: var(--brand-navy);
    color: #fff;
}

.contact-hero__hotline span,
.contact-hero__hotline small {
    color: rgba(255,255,255,.78);
    font-weight: 800;
}

.contact-hero__hotline a {
    margin: 8px 0;
    color: #fff;
    font-size: 28px;
    font-weight: 950;
}

.contact-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}

.contact-action {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 16px;
}

.contact-action i,
.contact-action img {
    grid-row: span 2;
    width: 46px;
    height: 46px;
    border-radius: 50%;
}

.contact-action i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
    font-size: 18px;
}

.contact-action span {
    color: #667085;
    font-weight: 800;
}

.contact-action strong {
    color: var(--brand-navy);
    font-size: 16px;
    font-weight: 950;
}

.contact-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 18px;
}

.contact-panel,
.contact-request {
    padding: 24px;
}

.contact-location-list {
    display: grid;
    gap: 12px;
}

.contact-location-list article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fbfcfe;
}

.contact-request {
    align-self: start;
}

.contact-request h2 {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 20px;
}

.contact-request ul {
    display: grid;
    gap: 10px;
    margin: 18px 0;
}

.contact-request li {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 9px;
    color: #475467;
    line-height: 1.55;
    font-weight: 700;
}

.contact-request li i {
    margin-top: 3px;
    color: var(--brand-orange);
}

.contact-form {
    display: grid;
    gap: 13px;
    margin-top: 18px;
}

.contact-form label {
    display: grid;
    gap: 7px;
    color: var(--brand-navy);
    font-weight: 900;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fff;
    color: #243044;
    font: inherit;
    font-weight: 600;
    outline: none;
}

.contact-form input {
    height: 46px;
    padding: 0 13px;
}

.contact-form textarea {
    min-height: 128px;
    padding: 12px 13px;
    resize: vertical;
}

.contact-form input:focus,
.contact-form textarea:focus {
    border-color: var(--brand-red);
    box-shadow: 0 0 0 4px rgba(229, 27, 35, .08);
}

.contact-form .brand-btn {
    width: 100%;
    cursor: pointer;
}

.contact-form-alert {
    margin-top: 16px;
    padding: 12px 14px;
    border-radius: 8px;
    font-weight: 800;
    line-height: 1.5;
}

.contact-form-alert--success {
    background: #eefbf2;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.contact-form-alert--error {
    background: var(--brand-orange-soft);
    color: var(--brand-red);
    border: 1px solid rgba(229, 27, 35, .18);
}

.brand-editor-content {
    color: #475467;
    line-height: 1.75;
}

@media (max-width: 992px) {
    .brand-hero,
    .contact-hero,
    .about-premium-banner,
    .about-showcase,
    .brand-section--split,
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .brand-stats,
    .brand-promise-grid,
    .brand-category-grid,
    .contact-actions {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .brand-page {
        padding-left: 10px;
        padding-right: 10px;
    }

    .brand-hero,
    .contact-hero,
    .brand-section,
    .contact-panel,
    .contact-request {
        padding: 18px;
    }

    .brand-page .brand-hero,
    .brand-page .contact-hero {
        padding-right: 58px;
    }

    .about-premium-banner {
        min-height: 420px;
        padding: 22px;
    }

    .about-premium-banner h2 {
        font-size: 27px;
    }

    .about-premium-banner p {
        font-size: 15px;
    }

    .brand-feature-list article {
        grid-template-columns: 46px minmax(0, 1fr);
        min-height: auto;
    }

    .brand-feature-list article::after {
        position: absolute;
        top: 16px;
        right: 16px;
        font-size: 22px;
    }

    .brand-hero h1,
    .contact-hero h1 {
        font-size: 25px;
    }

    .brand-hero__media {
        min-height: 220px;
    }

    .brand-visual-card {
        min-height: auto;
        padding: 20px;
    }

    .brand-visual-card strong {
        font-size: 24px;
    }

    .about-showcase__large,
    .about-showcase__side figure {
        min-height: 260px;
    }

    .about-showcase__large figcaption {
        left: 14px;
        right: 14px;
        bottom: 14px;
    }

    .about-showcase__large figcaption strong {
        font-size: 18px;
    }

    .brand-stats,
    .brand-promise-grid,
    .brand-category-grid,
    .contact-actions {
        grid-template-columns: 1fr;
    }

    .contact-hero__hotline a {
        font-size: 24px;
    }
}

/* Static page template */
.static-page {
    padding: 24px 15px 44px;
}

.static-page__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    padding: 13px 18px;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 16px;
    background: #fff;
    color: #667085;
    font-size: 14px;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .045);
}

.static-page__breadcrumb a {
    color: var(--brand-navy);
    font-weight: 800;
}

.static-page__hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 24px;
    align-items: center;
    margin-bottom: 24px;
    padding: 34px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 84% 16%, rgba(229, 27, 35, .24), transparent 28%),
        linear-gradient(135deg, #064076 0%, #0a5796 55%, #042c56 100%);
    color: #fff;
    box-shadow: 0 18px 44px rgba(7, 52, 111, .16);
}

.static-page__hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg, rgba(255,255,255,.08) 0 12%, transparent 12% 30%, rgba(255,255,255,.045) 30% 42%, transparent 42%);
    pointer-events: none;
}

.static-page__hero-content,
.static-page__hero-card {
    position: relative;
    z-index: 1;
}

.static-page__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    font-weight: 850;
}

.static-page__hero h1 {
    margin: 0 0 12px;
    max-width: 860px;
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    letter-spacing: -.045em;
    line-height: 1.08;
    text-transform: uppercase;
}

.static-page__hero p {
    max-width: 820px;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 16px;
    line-height: 1.75;
}

.static-page__hero-card {
    display: grid;
    gap: 8px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 20px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(10px);
}

.static-page__hero-card i {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--brand-orange);
    color: #fff;
    font-size: 22px;
}

.static-page__hero-card strong {
    font-size: 18px;
    font-weight: 900;
}

.static-page__hero-card span {
    color: rgba(255,255,255,.82);
    line-height: 1.6;
}

.static-page__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: start;
}

.static-page__featured {
    overflow: hidden;
    margin: 0 0 18px;
    border-radius: 20px;
    background: #edf3fb;
    box-shadow: 0 12px 30px rgba(7, 52, 111, .055);
}

.static-page__featured img {
    width: 100%;
    max-height: 430px;
    object-fit: cover;
}

.static-page__content,
.static-page__box,
.static-page__cta {
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(7, 52, 111, .045);
}

.static-page__content {
    padding: 30px;
    color: #1f2937;
    font-size: 17px;
    line-height: 1.85;
}

.static-page__content > *:first-child {
    margin-top: 0;
}

.static-page__content > *:last-child {
    margin-bottom: 0;
}

.static-page__content p {
    margin: 0 0 18px;
    text-align: justify;
}

.static-page__content h2,
.static-page__content h3,
.static-page__content h4 {
    color: var(--brand-navy);
    font-weight: 950;
    letter-spacing: -.03em;
    line-height: 1.25;
}

.static-page__content h2 {
    margin: 30px 0 14px;
    padding-left: 14px;
    border-left: 4px solid var(--brand-orange);
    font-size: 27px;
}

.static-page__content h3 {
    margin: 24px 0 12px;
    font-size: 22px;
}

.static-page__content h4 {
    margin: 20px 0 10px;
    font-size: 19px;
}

.static-page__content ul,
.static-page__content ol {
    margin: 0 0 18px 22px;
    padding: 0;
}

.static-page__content li {
    margin-bottom: 8px;
}

.static-page__content a {
    color: var(--brand-orange);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.static-page__content blockquote {
    margin: 24px 0;
    padding: 18px 20px;
    border-left: 4px solid var(--brand-orange);
    border-radius: 0 16px 16px 0;
    background: #fff5f5;
    color: #374151;
    font-weight: 650;
}

.static-page__content table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 14px;
    font-size: 15px;
}

.static-page__content th,
.static-page__content td {
    padding: 12px 14px;
    border: 1px solid var(--brand-line);
}

.static-page__content th {
    background: #f0f5ff;
    color: var(--brand-navy);
    font-weight: 900;
}

.static-page__content img {
    border-radius: 16px;
}

.static-page__links {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--brand-line);
}

.static-page__sidebar {
    position: sticky;
    top: 12px;
    display: grid;
    gap: 16px;
}

.static-page__box {
    overflow: hidden;
}

.static-page__box h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-soft));
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}

.static-page__related,
.static-page__checks {
    margin: 0;
    padding: 10px;
}

.static-page__related a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 11px;
    border-radius: 12px;
    color: #263548;
    font-weight: 750;
}

.static-page__related a:hover {
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
}

.static-page__checks {
    display: grid;
    gap: 10px;
    color: #344054;
    font-weight: 700;
}

.static-page__checks li {
    display: flex;
    gap: 9px;
    line-height: 1.45;
}

.static-page__checks i {
    margin-top: 3px;
    color: var(--brand-orange);
}

.static-page__contact {
    padding-bottom: 16px;
}

.static-page__contact p {
    margin: 14px 16px;
    color: #667085;
    line-height: 1.65;
}

.static-page__contact a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 16px;
    min-height: 42px;
    padding: 10px 16px;
    border-radius: 12px;
    background: var(--brand-orange);
    color: #fff;
    font-weight: 900;
}

.static-page__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    padding: 24px;
    background:
        radial-gradient(circle at 94% 0%, rgba(229, 27, 35, .16), transparent 28%),
        #fff;
}

.static-page__cta h2 {
    margin: 0 0 6px;
    color: var(--brand-navy);
    font-size: 24px;
    font-weight: 950;
    letter-spacing: -.03em;
}

.static-page__cta p {
    margin: 0;
    color: #667085;
    line-height: 1.65;
}

.static-page__cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 48px;
    padding: 12px 22px;
    border: none;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--brand-orange), #e51b23);
    color: #fff;
    font-weight: 950;
    white-space: nowrap;
    box-shadow: 0 12px 26px rgba(229, 27, 35, .22);
}

@media (max-width: 992px) {
    .static-page__hero,
    .static-page__layout {
        grid-template-columns: 1fr;
    }

    .static-page__sidebar {
        position: static;
    }
}

@media (max-width: 640px) {
    .static-page {
        padding-left: 10px;
        padding-right: 10px;
    }

    .static-page__hero,
    .static-page__content,
    .static-page__cta {
        padding: 22px 18px;
    }

    .static-page__content {
        font-size: 16px;
    }

    .static-page__content p {
        text-align: left;
    }

    .static-page__cta {
        align-items: stretch;
        flex-direction: column;
    }
}

/* Single blog post */
.single-post-page {
    padding: 24px 15px 44px;
}

.single-post__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    padding: 13px 18px;
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 16px;
    background: #fff;
    color: #667085;
    font-size: 14px;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .045);
}

.single-post__breadcrumb a {
    color: var(--brand-navy);
    font-weight: 800;
}

.single-post__hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
    padding: 36px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 90% 8%, rgba(229, 27, 35, .24), transparent 28%),
        linear-gradient(135deg, #07346f 0%, #0b4a94 54%, #062b5c 100%);
    color: #fff;
    box-shadow: 0 18px 44px rgba(7, 52, 111, .16);
}

.single-post__hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg, rgba(255,255,255,.08) 0 12%, transparent 12% 30%, rgba(255,255,255,.045) 30% 42%, transparent 42%);
    pointer-events: none;
}

.single-post__hero-copy {
    position: relative;
    z-index: 1;
    max-width: 940px;
}

.single-post__cat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    color: #fff;
    font-weight: 850;
}

.single-post__hero h1 {
    margin: 0 0 14px;
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 950;
    letter-spacing: -.045em;
    line-height: 1.1;
}

.single-post__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-bottom: 14px;
    color: rgba(255,255,255,.84);
    font-weight: 700;
}

.single-post__meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.single-post__hero p {
    max-width: 820px;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 16px;
    line-height: 1.75;
}

.single-post__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: start;
}

.single-post__featured {
    overflow: hidden;
    margin: 0 0 18px;
    border-radius: 20px;
    background: #edf3fb;
    box-shadow: 0 12px 30px rgba(7, 52, 111, .055);
}

.single-post__featured img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
}

.single-post__content,
.single-post__author,
.single-post__box,
.single-post__related {
    border: 1px solid rgba(7, 52, 111, .10);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(7, 52, 111, .045);
}

.single-post__content {
    padding: 32px;
    color: #1f2937;
    font-size: 17px;
    line-height: 1.9;
}

.single-post__content > *:first-child {
    margin-top: 0;
}

.single-post__content > *:last-child {
    margin-bottom: 0;
}

.single-post__content p {
    margin: 0 0 18px;
    text-align: justify;
}

.single-post__content h2,
.single-post__content h3,
.single-post__content h4 {
    color: var(--brand-navy);
    font-weight: 950;
    letter-spacing: -.03em;
    line-height: 1.25;
}

.single-post__content h2 {
    margin: 32px 0 14px;
    padding-left: 14px;
    border-left: 4px solid var(--brand-orange);
    font-size: 28px;
}

.single-post__content h3 {
    margin: 24px 0 12px;
    font-size: 22px;
}

.single-post__content h4 {
    margin: 20px 0 10px;
    font-size: 19px;
}

.single-post__content ul,
.single-post__content ol {
    margin: 0 0 18px 22px;
    padding: 0;
}

.single-post__content li {
    margin-bottom: 8px;
}

.single-post__content a {
    color: var(--brand-orange);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.single-post__content blockquote {
    margin: 24px 0;
    padding: 18px 20px;
    border-left: 4px solid var(--brand-orange);
    border-radius: 0 16px 16px 0;
    background: #fff5f5;
    color: #374151;
    font-weight: 650;
}

.single-post__content img {
    border-radius: 16px;
}

.single-post__content table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 14px;
    font-size: 15px;
}

.single-post__content th,
.single-post__content td {
    padding: 12px 14px;
    border: 1px solid var(--brand-line);
}

.single-post__content th {
    background: #f0f5ff;
    color: var(--brand-navy);
    font-weight: 900;
}

.single-post__author {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    margin-top: 18px;
    padding: 20px;
}

.single-post__author-avatar,
.single-post__author-avatar img {
    overflow: hidden;
    width: 72px;
    height: 72px;
    border-radius: 50%;
}

.single-post__author span {
    color: var(--brand-orange);
    font-weight: 850;
    text-transform: uppercase;
    font-size: 12px;
}

.single-post__author h2 {
    margin: 4px 0 6px;
    color: var(--brand-navy);
    font-size: 19px;
    font-weight: 950;
}

.single-post__author p {
    margin: 0;
    color: #667085;
    line-height: 1.65;
}

.single-post__related {
    margin-top: 20px;
    padding: 22px;
}

.single-post__section-head {
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(7, 52, 111, .9);
}

.single-post__section-head h2 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 22px;
    font-weight: 950;
}

.single-post__related-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.single-post__sidebar {
    position: sticky;
    top: 12px;
    display: grid;
    gap: 16px;
}

.single-post__box {
    overflow: hidden;
}

.single-post__box h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-soft));
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}

.single-post__consult {
    padding-bottom: 16px;
}

.single-post__consult p {
    margin: 14px 16px;
    color: #667085;
    line-height: 1.65;
}

.single-post__consult button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 16px;
    min-height: 42px;
    padding: 10px 16px;
    border: none;
    border-radius: 12px;
    background: var(--brand-orange);
    color: #fff;
    font-weight: 900;
}

.single-post__cat-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px;
}

.single-post__cat-list a {
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
    font-weight: 850;
    font-size: 13px;
}

@media (max-width: 992px) {
    .single-post__layout {
        grid-template-columns: 1fr;
    }

    .single-post__sidebar {
        position: static;
    }
}

@media (max-width: 640px) {
    .single-post-page {
        padding-left: 10px;
        padding-right: 10px;
    }

    .single-post__hero,
    .single-post__content,
    .single-post__related {
        padding: 22px 18px;
    }

    .single-post__content {
        font-size: 16px;
    }

    .single-post__content p {
        text-align: left;
    }

    .single-post__related-grid,
    .single-post__author {
        grid-template-columns: 1fr;
    }
}

/* Mobile header reset: logo centered, one menu icon, drawer content below. */
.mobile-menu-toggle,
.mobile-site-menu {
    display: none;
}

@media (max-width: 768px) {
    .header-top,
    .header__search,
    .header__actions.new-actions,
    #menu-secondary {
        display: none !important;
    }

    .full-container {
        position: sticky;
        top: 0;
        z-index: 1000;
        background: #fff;
        box-shadow: 0 8px 24px rgba(7, 52, 111, .08);
    }

    .admin-bar .full-container {
        top: 46px;
    }

    .header {
        padding: 10px 0 !important;
        border-bottom: 1px solid #e7edf5;
    }

    .header .inner-container {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) 44px !important;
        align-items: center;
        gap: 0 !important;
        min-height: 54px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .mobile-menu-toggle {
        display: inline-flex;
        grid-column: 1;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: 1px solid #e0e8f2;
        border-radius: 8px;
        background: #fff;
        color: var(--brand-navy);
        font-size: 20px;
        box-shadow: 0 8px 18px rgba(7, 52, 111, .08);
    }

    .mobile-menu-toggle[aria-expanded="true"] {
        background: var(--brand-navy);
        color: #fff;
        border-color: var(--brand-navy);
    }

    .header__logo {
        grid-column: 2;
        justify-self: center !important;
        min-width: 0 !important;
        width: auto;
    }

    .header__logo img,
    .header__logo .custom-logo {
        display: block;
        max-width: 205px !important;
        max-height: 54px !important;
        width: auto !important;
        height: auto !important;
    }

    .mobile-site-menu {
        display: block;
        padding: 12px 14px 16px;
        border-bottom: 1px solid #e7edf5;
        background: #fff;
    }

    .mobile-site-menu[hidden] {
        display: none !important;
    }

    .mobile-site-menu__search {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 44px;
        overflow: hidden;
        margin-bottom: 10px;
        border: 1px solid var(--brand-orange);
        border-radius: 8px;
        background: #fff;
    }

    .mobile-site-menu__search input {
        min-width: 0;
        height: 42px;
        padding: 0 12px;
        border: 0;
        color: #26364a;
        font-size: 14px;
        outline: none;
    }

    .mobile-site-menu__search button {
        border: 0;
        background: var(--brand-orange);
        color: #fff;
    }

    .mobile-site-menu__category,
    .mobile-site-menu__actions a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 42px;
        border-radius: 8px;
        font-weight: 900;
    }

    .mobile-site-menu__category {
        margin-bottom: 10px;
        background: var(--brand-orange);
        color: #fff;
        text-transform: uppercase;
        font-size: 13px;
    }

    .mobile-site-menu__nav {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 0 0 10px;
        padding: 0;
        list-style: none;
    }

    .mobile-site-menu__nav li {
        min-width: 0;
    }

    .mobile-site-menu__nav .menu-item-has-children {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 42px;
        gap: 8px;
        align-items: stretch;
    }

    .mobile-site-menu__nav a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        min-height: 40px;
        padding: 8px 12px;
        border: 1px solid #e7edf5;
        border-radius: 8px;
        background: #f7faff;
        color: var(--brand-navy);
        font-size: 13px;
        font-weight: 900;
        text-align: left;
    }

    .mobile-site-menu__nav .sub-menu {
        grid-column: 1 / -1;
        display: none;
        grid-template-columns: 1fr;
        gap: 7px;
        margin: 0;
        padding: 0 0 0 12px;
        list-style: none;
    }

    .mobile-site-menu__nav .is-submenu-open > .sub-menu {
        display: grid;
    }

    .mobile-site-menu__nav .sub-menu a {
        min-height: 38px;
        background: #fff;
        font-size: 12.5px;
        font-weight: 800;
    }

    .mobile-submenu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        padding: 0;
        border: 1px solid #e7edf5;
        border-radius: 8px;
        background: #f7faff;
        color: var(--brand-navy);
        font-size: 13px;
        line-height: 1;
    }

    .mobile-submenu-toggle i {
        transition: transform .18s ease;
    }

    .mobile-site-menu__nav .is-submenu-open > .mobile-submenu-toggle i {
        transform: rotate(180deg);
    }

    .mobile-site-menu__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .mobile-site-menu__actions a {
        background: var(--brand-navy);
        color: #fff;
        font-size: 13px;
    }

    .mobile-site-menu__actions img {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background: #fff;
    }

    .home-layout {
        display: block;
    }

    .home-layout__content {
        width: 100%;
    }

    .slider__grid {
        display: block;
    }

    .slider__main,
    .slider__main .item,
    .slider__main .slick-list,
    .slider__main .slick-track {
        min-height: 0;
    }

    .slider__main .item img {
        aspect-ratio: 16 / 9;
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .slider__side {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 8px;
    }

    .slider__banner {
        min-height: 92px;
    }

    .slider__banner-label {
        font-size: 11px;
        line-height: 1.25;
    }

    .nav-cate__list {
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 8px;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .nav-cate__list::-webkit-scrollbar {
        display: none;
    }

    .nav-cate__item {
        flex: 0 0 96px;
        width: 96px !important;
        min-height: 92px;
    }

    .cate-home__top {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        align-items: center;
    }

    .cate-home__title {
        min-width: 0;
        font-size: 17px !important;
        line-height: 1.25;
    }

    .cate-home__nav {
        display: none;
    }

    .cate-home__viewall {
        white-space: nowrap;
        padding: 9px 18px;
        font-size: 12px;
    }

    .cate-home__banner {
        width: 100%;
        min-height: 150px;
        height: auto !important;
    }
}

/* Production polish: dynamic footer, search, 404 and mobile product filters. */
.footer__logo-wrap {
    margin-bottom: 16px;
    text-align: center;
}

.footer__logo-wrap a {
    display: inline-block;
}

.footer__logo-wrap img,
.footer__logo-wrap .custom-logo {
    display: block;
    width: auto;
    max-height: 58px;
    margin: 0 auto;
    padding: 6px 10px;
    border-radius: 8px;
    background: #fff;
}

.footer__newsletter-desc {
    margin: 0 0 12px;
    color: rgba(255, 255, 255, .78);
    font-size: 13px;
    line-height: 1.6;
}

.footer__bottom p {
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 12px;
}

.tuvan-modal {
    overflow: hidden;
    border: none;
    border-radius: 12px;
}

.tuvan-modal__header {
    padding: 20px;
    border-bottom: none;
    background: #084b94;
    color: #fff;
}

.tuvan-modal__header .modal-title {
    font-weight: 900;
    text-transform: uppercase;
}

.tuvan-modal__body {
    padding: 28px;
}

.tuvan-modal__body p {
    margin-bottom: 20px;
    color: #555;
}

.tuvan-modal__body .form-label {
    font-weight: 700;
}

.tuvan-modal__submit {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    background: #e51b23;
    color: #fff;
    font-weight: 800;
}

.search-page,
.error-page {
    padding-top: 24px;
    padding-bottom: 44px;
}

.search-page__hero,
.error-page__panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 24px;
    align-items: center;
    margin-bottom: 24px;
    padding: 28px;
    border: 1px solid var(--brand-line);
    border-radius: 12px;
    background: linear-gradient(135deg, #fff 0%, #f7fbff 60%, #fff0f1 100%);
    box-shadow: 0 14px 34px rgba(7, 52, 111, .06);
}

.error-page__panel {
    grid-template-columns: 1fr;
    max-width: 860px;
    margin: 24px auto;
}

.search-page__hero h1,
.error-page__panel h1 {
    margin: 8px 0 12px;
    color: var(--brand-navy);
    font-size: 34px;
    font-weight: 950;
    line-height: 1.15;
}

.search-page__hero p,
.error-page__panel p {
    margin: 0;
    color: #475467;
    font-size: 16px;
    line-height: 1.75;
}

.search-page__form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    overflow: hidden;
    border: 2px solid var(--brand-orange);
    border-radius: 10px;
    background: #fff;
}

.search-page__form input {
    min-width: 0;
    height: 50px;
    padding: 0 16px;
    border: 0;
    outline: none;
}

.search-page__form button {
    border: 0;
    padding: 0 18px;
    background: var(--brand-orange);
    color: #fff;
    font-weight: 900;
}

.search-page__section {
    margin-top: 22px;
}

.search-page__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--brand-navy);
}

.search-page__head h2 {
    margin: 0;
    color: var(--brand-navy);
    font-size: 24px;
    font-weight: 950;
}

.search-page__head span {
    color: #667085;
    font-weight: 800;
}

.search-page__more {
    display: inline-flex;
    margin-top: 14px;
    padding: 11px 16px;
    border-radius: 8px;
    background: var(--brand-navy);
    color: #fff;
    font-weight: 900;
}

.search-page__empty {
    padding: 36px;
    border: 1px solid var(--brand-line);
    border-radius: 12px;
    background: #fff;
    text-align: center;
}

.search-page__empty > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    margin-bottom: 14px;
    border-radius: 50%;
    background: var(--brand-orange-soft);
    color: var(--brand-orange);
    font-size: 24px;
}

.error-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.product-filter-toggle {
    display: none;
}

@media (max-width: 768px) {
    .search-page,
    .error-page {
        padding-top: 14px;
    }

    .search-page__hero,
    .error-page__panel {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 20px 18px;
        border-radius: 10px;
    }

    .search-page__hero h1,
    .error-page__panel h1 {
        font-size: 26px;
    }

    .search-page__form {
        grid-template-columns: 1fr;
    }

    .search-page__form button {
        min-height: 44px;
    }

    .search-page__head {
        align-items: flex-start;
        flex-direction: column;
    }

    .product-filter-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        min-height: 44px;
        margin-bottom: 12px;
        border: none;
        border-radius: 8px;
        background: var(--brand-orange);
        color: #fff;
        font-weight: 950;
        text-transform: uppercase;
    }

    .product-archive__layout {
        display: block;
    }

    .product-archive__sidebar {
        display: none;
        margin-bottom: 14px;
    }

    .product-archive__sidebar.is-open,
    .product-archive__sidebar:has(input:checked) {
        display: block;
    }
}

/* Logo sizing hard stop after legacy logo rules. */
.header__logo img,
.header__logo .custom-logo {
    width: auto !important;
    max-width: 245px !important;
    height: auto !important;
    max-height: 58px !important;
    object-fit: contain;
}

.footer .footer__logo-wrap img,
.footer .footer__logo-wrap .custom-logo {
    width: auto !important;
    max-width: 280px !important;
    height: auto !important;
    max-height: 54px !important;
    object-fit: contain;
}

@media (max-width: 768px) {
    .header__logo img,
    .header__logo .custom-logo {
        max-width: 205px !important;
        max-height: 50px !important;
    }

    .footer .footer__logo-wrap img,
    .footer .footer__logo-wrap .custom-logo {
        max-width: 230px !important;
        max-height: 48px !important;
    }
}

.product-item__actions {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(82px, .72fr) minmax(92px, .88fr);
    gap: 6px;
    margin-top: auto;
    align-items: stretch;
}

.product-item__actions .product-item__price,
.product-item__actions .btn-contact {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 0 !important;
    padding: 6px 8px !important;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    white-space: nowrap;
}

.product-item__actions .product-item__price {
    border: 1px solid rgba(7, 61, 124, .16);
    background: #073d7c;
    color: #fff !important;
    box-shadow: 0 6px 14px rgba(7, 61, 124, .12);
}

.product-item__actions .product-item__price:hover {
    background: #0a4d99 !important;
    border-color: #0a4d99;
    color: #fff !important;
}

.product-item__actions .btn-contact {
    width: auto;
    min-width: 0;
    border: 1px solid rgba(229, 27, 35, .32);
    background: linear-gradient(180deg, #fff5f5 0%, #fff0f1 100%);
    color: var(--brand-orange);
    box-shadow: 0 6px 14px rgba(229, 27, 35, .08);
}

.product-item__actions .btn-contact:hover {
    background: var(--brand-orange) !important;
    border-color: var(--brand-orange);
    color: #fff !important;
}

@media (max-width: 420px) {
    .product-item__actions {
        grid-template-columns: 1fr;
        gap: 6px;
    }
}

.cate-home__footer {
    width: 100%;
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    text-align: center;
}

.cate-home__footer .cate-home__viewall {
    width: max-content;
    min-width: 138px;
    margin: 0 auto !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px 20px !important;
    border-radius: 999px;
    background: #073d7c !important;
    border: 1px solid rgba(7, 61, 124, .12);
    color: #fff !important;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(7, 52, 111, .14);
}

.cate-home__footer .cate-home__viewall:hover {
    background: var(--brand-orange) !important;
    border-color: var(--brand-orange);
    color: #fff !important;
    transform: translateY(-1px);
}

@media (max-width: 640px) {
    .cate-home__footer {
        padding: 10px 0 4px;
    }

    .cate-home__footer .cate-home__viewall {
        min-width: 132px;
        padding: 9px 18px !important;
        font-size: 12px;
    }
}

@media (max-width: 640px) {
    .about-home {
        padding: 18px 0 22px;
        background: #f4f7fb;
    }

    .about-home .inner-container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .about-home__grid {
        display: flex !important;
        flex-direction: column;
        gap: 0;
        align-items: stretch;
        overflow: hidden;
        border: 1px solid rgba(7, 61, 124, .10);
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 12px 28px rgba(7, 52, 111, .08);
    }

    .about-home__image {
        order: 1;
        width: 100% !important;
        min-height: 0;
        height: auto;
        border-radius: 0;
        background: #eef4fb;
    }

    .about-home__image img {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
        object-fit: cover;
    }

    .about-home__text {
        order: 2;
        width: 100%;
        padding: 18px 16px 16px;
    }

    .about-home__title {
        margin: 0 0 10px;
        color: var(--brand-navy);
        font-size: 20px;
        line-height: 1.28;
        letter-spacing: 0;
    }

    .about-home__title::before {
        width: 8px;
        height: 8px;
        margin-right: 8px;
        box-shadow: 0 0 0 5px rgba(229, 27, 35, .13);
    }

    .about-home__desc {
        color: #394b63;
    }

    .about-home__desc p {
        margin-bottom: 10px;
        color: #394b63;
        font-size: 14px;
        line-height: 1.62;
    }

    .about-home__actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin-top: 14px;
    }

    .about-home__btn {
        min-height: 38px;
        padding: 9px 12px;
        border-radius: 8px;
        font-size: 13px;
    }
}

@media (max-width: 640px) {
    .footer {
        padding: 28px 0 18px;
    }

    .footer__grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 22px 18px;
        padding-bottom: 22px;
    }

    .footer__grid > div:nth-child(1),
    .footer__grid > div:nth-child(4) {
        grid-column: 1 / -1;
    }

    .footer__grid > div:nth-child(2),
    .footer__grid > div:nth-child(3) {
        min-width: 0;
        padding: 14px 12px;
        border: 1px solid rgba(255, 255, 255, .08);
        border-radius: 10px;
        background: rgba(255, 255, 255, .035);
    }

    .footer h4 {
        margin-bottom: 12px;
        padding-bottom: 8px;
        font-size: 13px;
        line-height: 1.25;
    }

    .footer ul {
        margin: 0;
        padding: 0;
    }

    .footer ul li {
        margin-bottom: 9px;
        font-size: 12px;
        line-height: 1.45;
    }

    .footer ul li:last-child {
        margin-bottom: 0;
    }

    .footer__contact li {
        font-size: 13px;
    }

    .footer__newsletter form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .footer__grid > div:nth-child(4) {
        text-align: center;
    }

    .footer__grid > div:nth-child(4) h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .footer__newsletter-desc {
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
    }

    .footer__newsletter {
        max-width: 330px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Footer logo: larger visual mark without increasing footer block height. */
.footer .footer__logo-wrap {
    margin-bottom: 8px !important;
    line-height: 0;
}

.footer .footer__logo-wrap a {
    line-height: 0;
}

.footer .footer__logo-wrap img,
.footer .footer__logo-wrap .custom-logo {
    box-sizing: border-box;
    width: auto !important;
    max-width: 330px !important;
    height: auto !important;
    max-height: 76px !important;
    padding: 4px 10px !important;
    object-fit: contain;
}

@media (max-width: 768px) {
    .footer .footer__logo-wrap img,
    .footer .footer__logo-wrap .custom-logo {
        max-width: 280px !important;
        max-height: 66px !important;
    }
}

/* Final header override: match dongphuchongha-style demo. */
.full-container {
    background: #fff !important;
    border-bottom: 1px solid #e7e7e7 !important;
}

.site-header {
    background: #fff !important;
}

.site-header__top {
    display: grid !important;
    grid-template-columns: minmax(260px, 380px) minmax(280px, 560px) minmax(320px, auto) !important;
    align-items: center !important;
    gap: 34px !important;
    min-height: 112px !important;
    padding-top: 18px !important;
    padding-bottom: 12px !important;
}

.site-header .header__logo {
    display: inline-flex !important;
    align-items: center !important;
    gap: 14px !important;
    min-width: 0 !important;
    color: #073d7c !important;
    text-decoration: none !important;
}

.site-header .header__logo-mark {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 86px !important;
    height: 86px !important;
    border: 6px solid #16d39a !important;
    color: #16d39a !important;
    background: #fff !important;
    font-size: 28px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

.site-header .header__logo-text {
    color: #063a76 !important;
    font-size: 24px !important;
    font-weight: 950 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    text-shadow: 1px 1px 0 rgba(242, 92, 39, .55) !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    width: auto !important;
    max-width: 360px !important;
    max-height: 92px !important;
    object-fit: contain !important;
}

.site-header .header__search {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.site-header .form-main {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 54px !important;
    min-height: 56px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #f7f7f7 !important;
    overflow: hidden !important;
}

.site-header .form-main input[type="text"] {
    min-width: 0 !important;
    height: 56px !important;
    padding: 0 18px !important;
    border: 0 !important;
    background: transparent !important;
    color: #556171 !important;
    font-size: 17px !important;
    outline: 0 !important;
}

.site-header .form-main .btn-search {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px !important;
    min-width: 54px !important;
    height: 56px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #111 !important;
    font-size: 24px !important;
    box-shadow: none !important;
}

.site-header .header__contact {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 26px !important;
    min-width: 0 !important;
}

.site-header .header__contact-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #064076 !important;
    font-size: 17px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}

.site-header .header__contact-link i {
    color: #10bd35 !important;
}

.site-header #menu-secondary {
    display: block !important;
    background: #fff !important;
    border: 0 !important;
}

.site-header #menu-secondary .inner-container {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    min-height: 42px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.site-header .menuSecondary__menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: visible !important;
}

.site-header .menuSecondary__menu li {
    position: relative !important;
}

.site-header .menuSecondary__menu a {
    text-decoration: none !important;
}

.site-header .menuSecondary__menu > li > a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 42px !important;
    padding: 9px 17px !important;
    color: #073d7c !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    background: transparent !important;
}

.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover {
    color: #12bf32 !important;
}

.site-header .menuSecondary__menu .menu-item-has-children > a::after {
    content: "\f107" !important;
    margin-left: 7px !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.site-header .menuSecondary__menu .sub-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1001 !important;
    display: none !important;
    min-width: 280px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 1px solid #ececec !important;
    background: #fff !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .12) !important;
}

.site-header .menuSecondary__menu .sub-menu .sub-menu {
    top: 0 !important;
    left: 100% !important;
}

.site-header .menuSecondary__menu li:hover > .sub-menu,
.site-header .menuSecondary__menu li:focus-within > .sub-menu {
    display: block !important;
}

.site-header .menuSecondary__menu .sub-menu a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 48px !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #ececec !important;
    color: #444 !important;
    background: #fff !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

.site-header .menuSecondary__menu .sub-menu a:hover {
    color: #10bd35 !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(220px, 320px) minmax(240px, 1fr) !important;
        gap: 18px !important;
    }

    .site-header .header__contact {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 768px) {
    .site-header__top {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        min-height: 68px !important;
        padding: 10px 14px !important;
    }

    .site-header .mobile-menu-toggle {
        display: inline-flex !important;
    }

    .site-header .header__logo {
        justify-self: center !important;
    }

    .site-header .header__logo-mark {
        width: 46px !important;
        height: 46px !important;
        border-width: 4px !important;
        font-size: 17px !important;
    }

    .site-header .header__logo-text {
        max-width: 210px !important;
        font-size: 16px !important;
    }

    .site-header .header__search,
    .site-header .header__contact,
    .site-header #menu-secondary {
        display: none !important;
    }
}

/* DPQN final brand override. */
:root {
    --dpqn-brand-red: #ff6000;
    --dpqn-brand-red-dark: #c94700;
    --dpqn-brand-black: #202020;
    --dpqn-brand-ink: #202020;
    --dpqn-brand-muted: #5f646d;
    --dpqn-brand-line: #ececec;
    --dpqn-brand-soft: #f7f7f7;
}

.site-header__top {
    grid-template-columns: minmax(360px, 460px) minmax(280px, 1fr) minmax(300px, auto) !important;
}

.site-header .header__logo,
.site-header .menuSecondary__menu > li > a,
.site-header .header__contact-link {
    color: var(--dpqn-brand-black) !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    display: block !important;
    width: auto !important;
    max-width: 430px !important;
    max-height: 94px !important;
    object-fit: contain !important;
}

.site-header .header__logo-mark {
    border-color: var(--dpqn-brand-red) !important;
    color: var(--dpqn-brand-red) !important;
}

.site-header .header__logo-text {
    color: var(--dpqn-brand-black) !important;
    text-shadow: 1px 1px 0 rgba(229, 27, 35, .35) !important;
}

.site-header .form-main {
    background: var(--dpqn-brand-soft) !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .04) !important;
}

.site-header .form-main input[type="text"] {
    color: var(--dpqn-brand-muted) !important;
}

.site-header .form-main .btn-search,
.site-header .form-main .btn-search:hover {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--dpqn-brand-black) !important;
}

.site-header .form-main:focus-within .btn-search,
.site-header .form-main .btn-search:hover {
    color: var(--dpqn-brand-red) !important;
}

.site-header .header__contact-link:hover,
.site-header .header__contact-link i,
.site-header .header__contact-link:hover i {
    color: var(--dpqn-brand-red) !important;
}

.site-header #menu-secondary {
    border-top: 1px solid var(--dpqn-brand-line) !important;
}

.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover,
.site-header .menuSecondary__menu .sub-menu a:hover,
a:hover,
.breadcrumb a:hover,
.post-card a:hover,
.product-card a:hover,
.footer a:hover {
    color: var(--dpqn-brand-red) !important;
}

.site-header .menuSecondary__menu .sub-menu {
    border-color: var(--dpqn-brand-line) !important;
    border-top: 2px solid var(--dpqn-brand-red) !important;
}

.site-header .menuSecondary__menu .sub-menu a {
    border-bottom-color: var(--dpqn-brand-line) !important;
    color: var(--dpqn-brand-ink) !important;
}

.site-header .menuSecondary__menu .sub-menu a:hover {
    background: #fff5f5 !important;
}

.mobile-menu-toggle,
.btn-primary,
.button,
button[type="submit"],
input[type="submit"],
.product-card__badge,
.section-title::after,
.widget-title::after,
.archive-title::after {
    background-color: var(--dpqn-brand-red) !important;
    border-color: var(--dpqn-brand-red) !important;
}

.btn-primary:hover,
.button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background-color: var(--dpqn-brand-red-dark) !important;
    border-color: var(--dpqn-brand-red-dark) !important;
}

.site-header .form-main .btn-search,
.site-header .form-main .btn-search:hover {
    background: transparent !important;
    border-color: transparent !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(300px, 420px) minmax(240px, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* Header logo alignment: keep the brand locked to the left like the demo. */
.site-header__top {
    grid-template-columns: minmax(260px, 340px) minmax(300px, 1fr) minmax(300px, auto) !important;
    justify-items: stretch !important;
    gap: 34px !important;
}

.site-header .header__logo {
    justify-self: start !important;
    margin-left: 0 !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    max-width: 330px !important;
    max-height: 88px !important;
}

@media (max-width: 1180px) {
    .site-header__top {
        grid-template-columns: minmax(240px, 310px) minmax(240px, 1fr) !important;
        gap: 22px !important;
    }
}

@media (max-width: 768px) {
    .site-header__top {
        grid-template-columns: 44px minmax(0, 1fr) !important;
    }

    .site-header .header__logo {
        justify-self: center !important;
    }

    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* Demo-accurate header container and alignment. */
.site-header > .inner-container,
.site-header #menu-secondary > .inner-container {
    width: min(1524px, calc(100% - 112px)) !important;
    max-width: 1524px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.site-header__top.inner-container {
    grid-template-columns: 360px 552px minmax(360px, 1fr) !important;
    column-gap: 38px !important;
    min-height: 136px !important;
    padding-top: 16px !important;
    padding-bottom: 14px !important;
}

.site-header .header__logo {
    justify-self: start !important;
    align-self: center !important;
    width: 360px !important;
    max-width: 360px !important;
    margin: 0 !important;
}

.site-header .header__logo img,
.site-header .header__logo .custom-logo {
    width: 360px !important;
    max-width: 360px !important;
    max-height: 104px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.site-header .header__search {
    align-self: center !important;
    width: 552px !important;
    max-width: 552px !important;
}

.site-header .form-main {
    min-height: 53px !important;
}

.site-header .form-main input[type="text"] {
    height: 53px !important;
    font-size: 17px !important;
}

.site-header .form-main .btn-search {
    height: 53px !important;
}

.site-header .header__contact {
    align-self: center !important;
    justify-self: end !important;
    gap: 28px !important;
}

.site-header #menu-secondary .inner-container {
    justify-content: flex-end !important;
    min-height: 43px !important;
}

.site-header .menuSecondary__menu > li > a {
    min-height: 43px !important;
    padding: 9px 18px !important;
    font-size: 17px !important;
}

@media (max-width: 1280px) {
    .site-header > .inner-container,
    .site-header #menu-secondary > .inner-container {
        width: min(1180px, calc(100% - 40px)) !important;
    }

    .site-header__top.inner-container {
        grid-template-columns: 300px minmax(300px, 1fr) !important;
        column-gap: 24px !important;
    }

    .site-header .header__logo,
    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        width: 300px !important;
        max-width: 300px !important;
    }

    .site-header .header__search {
        width: 100% !important;
        max-width: none !important;
    }
}

@media (max-width: 768px) {
    .site-header > .inner-container,
    .site-header #menu-secondary > .inner-container {
        width: 100% !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .site-header__top.inner-container {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        min-height: 68px !important;
    }

    .site-header .header__logo {
        justify-self: center !important;
        width: auto !important;
        max-width: none !important;
    }

    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        width: auto !important;
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* Hard fix: desktop header must match the demo in one row. */
@media (min-width: 769px) {
    .site-header > .inner-container,
    .site-header #menu-secondary > .inner-container {
        width: min(1524px, calc(100% - 112px)) !important;
        max-width: 1524px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .site-header__top.inner-container {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 36px !important;
        min-height: 136px !important;
        padding-top: 14px !important;
        padding-bottom: 12px !important;
    }

    .site-header .mobile-menu-toggle {
        display: none !important;
    }

    .site-header .header__logo {
        flex: 0 0 360px !important;
        width: 360px !important;
        max-width: 360px !important;
        margin: 0 !important;
        justify-self: auto !important;
        align-self: center !important;
    }

    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        display: block !important;
        width: 360px !important;
        max-width: 360px !important;
        height: auto !important;
        max-height: 104px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    .site-header .header__search {
        flex: 0 0 552px !important;
        width: 552px !important;
        max-width: 552px !important;
        margin: 0 !important;
        align-self: center !important;
    }

    .site-header .form-main {
        min-height: 53px !important;
    }

    .site-header .form-main input[type="text"] {
        height: 53px !important;
    }

    .site-header .form-main .btn-search {
        height: 53px !important;
    }

    .site-header .header__contact {
        flex: 1 1 auto !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 28px !important;
        grid-column: auto !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        align-self: center !important;
        justify-self: auto !important;
    }

    .site-header .header__contact-link {
        white-space: nowrap !important;
        font-size: 17px !important;
    }

    .site-header #menu-secondary .inner-container {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        min-height: 43px !important;
    }
}

@media (min-width: 769px) and (max-width: 1280px) {
    .site-header > .inner-container,
    .site-header #menu-secondary > .inner-container {
        width: min(1180px, calc(100% - 40px)) !important;
    }

    .site-header__top.inner-container {
        gap: 24px !important;
    }

    .site-header .header__logo,
    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        flex-basis: 300px !important;
        width: 300px !important;
        max-width: 300px !important;
    }

    .site-header .header__search {
        flex: 0 1 480px !important;
        width: 480px !important;
        max-width: 480px !important;
    }

    .site-header .header__contact {
        gap: 18px !important;
    }

    .site-header .header__contact-link {
        font-size: 15px !important;
    }
}

/* Final position fix: align logo left edge with page content edge. */
@media (min-width: 769px) {
    .site-header__top.inner-container {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: clamp(24px, 7.55vw, 145px) !important;
        padding-right: 56px !important;
        box-sizing: border-box !important;
    }

    .site-header .header__logo {
        flex: 0 0 400px !important;
        width: 400px !important;
        max-width: 400px !important;
        margin-left: 0 !important;
        transform: none !important;
    }

    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        width: 400px !important;
        max-width: 400px !important;
        max-height: 118px !important;
        object-position: left center !important;
    }

    .site-header .header__search {
        flex: 0 0 690px !important;
        width: 690px !important;
        max-width: 690px !important;
    }

    .site-header .header__contact {
        justify-content: flex-end !important;
    }
}

@media (min-width: 769px) and (max-width: 1280px) {
    .site-header__top.inner-container {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }

    .site-header .header__logo,
    .site-header .header__logo img,
    .site-header .header__logo .custom-logo {
        flex-basis: 300px !important;
        width: 300px !important;
        max-width: 300px !important;
    }

    .site-header .header__search {
        flex: 0 1 520px !important;
        width: 520px !important;
        max-width: 520px !important;
    }
}

/* Authoritative header row: no inherited centered container. */
@media (min-width: 769px) {
    .site-header .dpqn-header-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 14px 56px 12px 145px !important;
        min-height: 136px !important;
        gap: 36px !important;
        box-sizing: border-box !important;
    }

    .site-header .dpqn-header-row .mobile-menu-toggle {
        display: none !important;
    }

    .site-header .dpqn-header-row .header__logo {
        flex: 0 0 400px !important;
        width: 400px !important;
        max-width: 400px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    .site-header .dpqn-header-row .header__logo img,
    .site-header .dpqn-header-row .header__logo .custom-logo {
        display: block !important;
        width: 400px !important;
        max-width: 400px !important;
        height: auto !important;
        max-height: 118px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    .site-header .dpqn-header-row .header__search {
        flex: 0 0 690px !important;
        width: 690px !important;
        max-width: 690px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-header .dpqn-header-row .form-main {
        min-height: 53px !important;
    }

    .site-header .dpqn-header-row .form-main input[type="text"],
    .site-header .dpqn-header-row .form-main .btn-search {
        height: 53px !important;
    }

    .site-header .dpqn-header-row .header__contact {
        flex: 1 1 auto !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 28px !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-column: auto !important;
    }

    .site-header .dpqn-header-row .header__contact-link {
        white-space: nowrap !important;
        font-size: 17px !important;
    }
}

@media (min-width: 769px) and (max-width: 1280px) {
    .site-header .dpqn-header-row {
        padding-left: 32px !important;
        padding-right: 32px !important;
        gap: 24px !important;
    }

    .site-header .dpqn-header-row .header__logo,
    .site-header .dpqn-header-row .header__logo img,
    .site-header .dpqn-header-row .header__logo .custom-logo {
        flex-basis: 300px !important;
        width: 300px !important;
        max-width: 300px !important;
    }

    .site-header .dpqn-header-row .header__search {
        flex: 0 1 520px !important;
        width: 520px !important;
        max-width: 520px !important;
    }
}

@media (max-width: 768px) {
    .site-header .dpqn-header-row {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 68px !important;
        padding: 10px 14px !important;
        box-sizing: border-box !important;
    }

    .site-header .dpqn-header-row .header__logo {
        justify-self: center !important;
        width: auto !important;
        max-width: none !important;
    }

    .site-header .dpqn-header-row .header__logo img,
    .site-header .dpqn-header-row .header__logo .custom-logo {
        width: auto !important;
        max-width: 245px !important;
        max-height: 56px !important;
    }
}

/* ============================================================
   AO PHONG DEP - BRAND COLOR OVERRIDE
   Palette sampled from aphong-1.webp
   Logo colors: Orange #ff6000 + Charcoal #202020
   ============================================================ */

/* --- Root brand tokens (authoritative) --- */
:root {
    --brand-blue:      #202020;
    --brand-blue-dark: #111111;
    --brand-red:       #ff6000;
    --brand-red-dark:  #c94700;
    --brand-navy:      var(--brand-blue);
    --brand-navy-soft: #3a3a3a;
    --brand-orange:    var(--brand-red);
    --brand-orange-soft: #fff1e8;
    --brand-bg:        #faf8f6;
    --brand-line:      #ebe3de;
    --brand-soft:      #fff8f3;
}

/* --- Header: phone/email icon color -> red --- */
.site-header .header__contact-link i,
.dpqn-demo-contact i { color: var(--brand-red) !important; }

/* --- Header nav links: active/hover -> red --- */
.site-header .menuSecondary__menu > li.current-menu-item > a,
.site-header .menuSecondary__menu > li.current-menu-ancestor > a,
.site-header .menuSecondary__menu > li > a:hover,
.dpqn-demo-nav-menu > li.current-menu-item > a,
.dpqn-demo-nav-menu > li.current-menu-ancestor > a,
.dpqn-demo-nav-menu > li > a:hover { color: var(--brand-red) !important; }

/* --- Nav submenu top border -> red --- */
.site-header .menuSecondary__menu .sub-menu,
.dpqn-demo-nav-menu .sub-menu {
    border-top: 2px solid var(--brand-red) !important;
}

/* --- Nav submenu hover -> red --- */
.site-header .menuSecondary__menu .sub-menu a:hover,
.dpqn-demo-nav-menu .sub-menu a:hover {
    color: var(--brand-red) !important;
    background: #fff5f5 !important;
}

/* --- Logo mark border -> red --- */
.site-header .header__logo-mark {
    border-color: var(--brand-red) !important;
    color: var(--brand-red) !important;
}

/* --- Buttons -> red background --- */
.btn-primary,
button[type=submit],
input[type=submit],
.mobile-menu-toggle,
.about-home__btn--primary,
.cate-home__viewall,
.footer__newsletter button {
    background-color: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
    color: #fff !important;
}

.btn-primary:hover,
button[type=submit]:hover,
input[type=submit]:hover,
.cate-home__viewall:hover {
    background-color: var(--brand-red-dark) !important;
    border-color: var(--brand-red-dark) !important;
}

/* --- Section titles accent bar -> red --- */
.section-title::after,
.widget-title::after,
.archive-title::after,
.cate-home__title::after,
.news-home__title::after,
.about-home__title::after,
.why-us__heading::after { background-color: var(--brand-red) !important; }

/* --- Category nav item hover -> red --- */
.nav-cate__item:hover .title,
.nav-cate__item:hover { color: var(--brand-red) !important; }

/* --- Category home child nav link hover -> red --- */
.cate-home__nav .nav-item:hover { color: var(--brand-red) !important; }
.cate-home__nav .nav-item.active { color: var(--brand-red) !important; border-bottom-color: var(--brand-red) !important; }

/* --- Why us icon -> red --- */
.why-us__icon i { color: var(--brand-red) !important; }

/* --- Floating buttons -> red (phone) and blue (zalo) --- */
.f-btn.btn-phone { background-color: var(--brand-red) !important; }
.f-btn.btn-zalo  { background-color: #0068ff !important; }
.f-btn.btn-email { background-color: var(--brand-blue) !important; }

/* --- Footer -> navy background --- */
.footer { background-color: var(--brand-blue) !important; }
.footer h4, .footer a, .footer p, .footer li,
.footer__contact li, .footer__contact i,
.footer__bottom p { color: #fff !important; }
.footer a:hover { color: var(--brand-red) !important; }

/* --- General link hover -> red --- */
a:hover { color: var(--brand-red) !important; }

/* --- Search button hover -> red --- */
.site-header .form-main .btn-search:hover,
.dpqn-demo-search-box button:hover { color: var(--brand-red) !important; }

/* --- Tuvan modal submit -> red --- */
.tuvan-modal__submit { background-color: var(--brand-red) !important; }

/* --- Product card badge -> red --- */
.product-card__badge { background-color: var(--brand-red) !important; }

/* --- Breadcrumb separator and current -> red --- */
.breadcrumb li.active, .breadcrumb li:last-child { color: var(--brand-red) !important; }

/* --- Pagination active -> red --- */
.pagination .page-numbers.current,
.pagination .page-numbers:hover {
    background-color: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
    color: #fff !important;
}

/* --- NEWS section view-all link -> red --- */
.news-home__viewall:hover { color: var(--brand-red) !important; }

/* --- About section secondary CTA -> blue --- */
.about-home__btn--secondary {
    background-color: var(--brand-blue) !important;
    border-color: var(--brand-blue) !important;
    color: #fff !important;
}
.about-home__btn--secondary:hover {
    background-color: var(--brand-blue-dark) !important;
    border-color: var(--brand-blue-dark) !important;
}

/* Header softening: remove hard frames around logo, search, and nav. */
.dpqn-demo-header {
    border-bottom: 0 !important;
    box-shadow: 0 8px 24px rgba(7, 52, 111, .05) !important;
}

.dpqn-demo-logo {
    border-right: 0 !important;
}

.dpqn-demo-search-box,
.site-header .form-main {
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 18px rgba(7, 52, 111, .08) !important;
}

.dpqn-demo-nav,
.site-header #menu-secondary,
.site-header .header__nav {
    border-top: 0 !important;
    border-bottom: 0 !important;
}

.dpqn-demo-nav-menu .sub-menu,
.site-header .menuSecondary__menu .sub-menu {
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 34px rgba(7, 52, 111, .13) !important;
    overflow: hidden;
}

.dpqn-demo-nav-menu .sub-menu a,
.site-header .menuSecondary__menu .sub-menu a {
    border-bottom: 0 !important;
}

/* Product detail demo style */
.dpqn-product-demo {
    padding: 22px 0 48px;
    background: #f3f6fa;
}

.dpqn-product-demo__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid rgba(6,64,118,.10);
    border-radius: 8px;
    background: #fff;
    color: #667085;
    font-size: 14px;
    font-weight: 700;
}

.dpqn-product-demo__breadcrumb a {
    color: var(--brand-blue);
    font-weight: 900;
}

.dpqn-product-demo__breadcrumb strong {
    color: var(--brand-red);
}

.dpqn-product-demo__top {
    display: grid;
    grid-template-columns: minmax(330px, 420px) minmax(0, 1fr) 280px;
    gap: 20px;
    align-items: start;
    margin-bottom: 22px;
}

.dpqn-product-demo__gallery,
.dpqn-product-demo__summary,
.dpqn-product-demo__contact,
.dpqn-product-demo__category-side,
.dpqn-product-demo__content,
.dpqn-product-demo__related-side {
    border: 1px solid rgba(6,64,118,.10);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(6,64,118,.07);
}

.dpqn-product-demo__gallery {
    padding: 14px;
}

.dpqn-product-demo__main-image {
    position: relative;
    overflow: hidden;
    margin: 0;
    aspect-ratio: 1 / 1;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #f8fbff;
    cursor: default;
}

.dpqn-product-demo__main-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transform: none !important;
    transition: none !important;
}

.dpqn-product-demo__image-placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--brand-blue);
    background: linear-gradient(145deg, #edf5fb, #dceaf5);
    font-size: clamp(64px, 10vw, 112px);
}

.dpqn-product-demo__main-image span {
    position: absolute;
    left: 12px;
    bottom: 12px;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(6,64,118,.88);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}

.dpqn-product-demo__thumb-slider {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}

.dpqn-product-demo__thumbs {
    display: flex;
    gap: 10px;
    min-width: 0;
    overflow-x: auto;
    padding: 2px 1px 5px;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.dpqn-product-demo__thumbs::-webkit-scrollbar {
    display: none;
}

.dpqn-product-demo__thumbs button {
    flex: 0 0 88px;
    width: 88px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    background: #f8fbff;
    cursor: pointer;
}

.dpqn-product-demo__thumbs button.is-active {
    border-color: var(--brand-red);
}

.dpqn-product-demo__thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none !important;
    transition: none !important;
}

.dpqn-product-demo__thumbs span {
    height: 100%;
    display: grid;
    place-items: center;
    color: var(--brand-blue);
    font-size: 28px;
}

.dpqn-product-demo__thumb-nav {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(6,64,118,.14);
    border-radius: 999px;
    background: #fff;
    color: var(--brand-blue);
    font-size: 13px;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(6,64,118,.10);
}

.dpqn-product-demo__thumb-nav:hover:not(:disabled) {
    border-color: rgba(229,27,35,.34);
    color: var(--brand-red);
}

.dpqn-product-demo__thumb-nav:disabled {
    opacity: .35;
    cursor: default;
    box-shadow: none;
}

.dpqn-product-demo__summary {
    padding: 22px;
}

.dpqn-product-demo__badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
}

.dpqn-product-demo__badge,
.dpqn-product-demo__badge-row a {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 950;
}

.dpqn-product-demo__badge {
    background: #fff0f1;
    color: var(--brand-red);
}

.dpqn-product-demo__badge-row a {
    background: #f2f6fb;
    color: var(--brand-blue);
}

.dpqn-product-demo__summary h1 {
    margin: 0;
    color: var(--brand-blue);
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.15;
    font-weight: 950;
}

.dpqn-product-demo__summary > .dpqn-product-demo__badge-row,
.dpqn-product-demo__summary > .dpqn-product-demo__meta,
.dpqn-product-demo__summary > .dpqn-product-demo__price,
.dpqn-product-demo__summary > .dpqn-product-demo__note,
.dpqn-product-demo__summary > .dpqn-product-demo__benefits,
.dpqn-product-demo__summary > .dpqn-product-demo__specs,
.dpqn-product-demo__summary > .dpqn-product-demo__size-row,
.dpqn-product-demo__summary > .dpqn-product-demo__qty-row,
.dpqn-product-demo__summary > .dpqn-product-demo__actions {
    display: none;
}

.dpqn-product-demo__offer {
    display: grid;
    gap: 5px;
    margin: 18px 0 10px;
}

.dpqn-product-demo__offer strong {
    color: var(--brand-red);
    font-size: clamp(20px, 2.1vw, 28px);
    line-height: 1.18;
    font-style: italic;
    font-weight: 900;
    text-transform: uppercase;
}

.dpqn-product-demo__demo-info {
    display: grid;
    gap: 12px;
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
    color: #111827;
    font-size: 16px;
    line-height: 1.55;
}

.dpqn-product-demo__demo-info li {
    margin: 0;
}

.dpqn-product-demo__demo-info strong {
    color: #050505;
    font-weight: 900;
}

.dpqn-product-demo__demo-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 8px;
}

.dpqn-product-demo__demo-actions a,
.dpqn-product-demo__demo-actions button {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 18px;
    border: 0;
    border-radius: 8px;
    background: #1f66ac;
    color: #fff !important;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(6,64,118,.16);
}

.dpqn-product-demo__demo-actions a {
    background: #275f93;
}

.dpqn-product-demo__demo-actions a:hover,
.dpqn-product-demo__demo-actions button:hover {
    background: var(--brand-blue);
}

.dpqn-product-demo__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-top: 14px;
    color: #667085;
    font-size: 14px;
    font-weight: 700;
}

.dpqn-product-demo__meta strong {
    color: var(--brand-blue);
}

.dpqn-product-demo__price {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 18px 0 10px;
    padding: 16px;
    border-radius: 8px;
    background: #fff0f1;
}

.dpqn-product-demo__price span {
    color: #667085;
    font-weight: 900;
}

.dpqn-product-demo__price strong {
    color: var(--brand-red);
    font-size: 34px;
    line-height: 1;
    font-weight: 950;
}

.dpqn-product-demo__note {
    margin: 0 0 16px;
    color: #4b5a70;
    line-height: 1.65;
    font-weight: 600;
}

.dpqn-product-demo__benefits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.dpqn-product-demo__benefits div {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 9px 10px;
    border-radius: 8px;
    background: #f8fbff;
    color: var(--brand-blue);
    font-size: 13px;
    font-weight: 850;
}

.dpqn-product-demo__benefits i {
    color: var(--brand-red);
}

.dpqn-product-demo__specs {
    display: grid;
    gap: 9px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.dpqn-product-demo__specs li {
    position: relative;
    padding-left: 18px;
    color: #4b5a70;
    line-height: 1.55;
    font-weight: 600;
}

.dpqn-product-demo__specs li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .7em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--brand-red);
}

.dpqn-product-demo__size-row,
.dpqn-product-demo__qty-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.dpqn-product-demo__size-row > strong,
.dpqn-product-demo__qty-row > strong {
    color: var(--brand-blue);
    min-width: 72px;
}

.dpqn-product-demo__size-row div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.dpqn-product-demo__size-row button {
    min-width: 44px;
    height: 36px;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
    background: #fff;
    color: var(--brand-blue);
    font-weight: 900;
}

.dpqn-product-demo__size-row button.is-active {
    border-color: var(--brand-red);
    background: var(--brand-red);
    color: #fff;
}

.dpqn-product-demo__qty {
    display: inline-grid;
    grid-template-columns: 36px 52px 36px;
    overflow: hidden;
    border: 1px solid var(--brand-line);
    border-radius: 8px;
}

.dpqn-product-demo__qty button,
.dpqn-product-demo__qty input {
    height: 36px;
    border: 0;
    background: #fff;
    text-align: center;
    color: var(--brand-blue);
    font-weight: 900;
}

.dpqn-product-demo__qty-row > span {
    color: #16a34a;
    font-weight: 900;
}

.dpqn-product-demo__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.dpqn-product-demo__btn {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 8px;
    font-weight: 950;
    cursor: pointer;
}

.dpqn-product-demo__btn--primary {
    background: var(--brand-red);
    color: #fff !important;
    box-shadow: 0 12px 24px rgba(229,27,35,.20);
}

.dpqn-product-demo__btn--secondary {
    background: var(--brand-blue);
    color: #fff;
}

.dpqn-product-demo__ship {
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 8px;
    background: #f8fbff;
    color: var(--brand-blue);
    font-weight: 850;
}

.dpqn-product-demo__ship i {
    color: var(--brand-red);
    margin-right: 7px;
}

.dpqn-product-demo__contact {
    padding: 18px;
}

.dpqn-product-demo__contact h2 {
    margin: 0 0 14px;
    color: var(--brand-blue);
    font-size: 22px;
    font-weight: 950;
}

.dpqn-product-demo__contact p {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
    margin: 0 0 12px;
    color: #4b5a70;
    line-height: 1.5;
    font-weight: 650;
}

.dpqn-product-demo__contact p i {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff0f1;
    color: var(--brand-red);
}

.dpqn-product-demo__contact div {
    margin: 16px 0 10px;
    color: var(--brand-blue);
    font-weight: 950;
}

.dpqn-product-demo__contact a {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-top: 10px;
    padding: 12px;
    border-radius: 8px;
    background: var(--brand-blue);
    color: #fff !important;
}

.dpqn-product-demo__contact a i {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--brand-red);
}

.dpqn-product-demo__contact a strong,
.dpqn-product-demo__contact a span {
    display: block;
}

.dpqn-product-demo__category-side {
    overflow: hidden;
    align-self: start;
}

.dpqn-product-demo__category-side h2 {
    margin: 0;
    padding: 15px 16px;
    background: var(--brand-blue);
    color: #fff;
    font-size: 17px;
    line-height: 1.25;
    font-weight: 950;
    text-transform: uppercase;
}

.dpqn-product-demo__category-toggle {
    all: unset;
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    color: #fff;
    font: inherit;
    line-height: inherit;
    text-transform: inherit;
    box-sizing: border-box;
    pointer-events: none;
}

.dpqn-product-demo__category-toggle i {
    display: none;
    flex: 0 0 auto;
    font-size: 12px;
    transition: transform .2s ease;
}

.dpqn-product-demo__category-side ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dpqn-product-demo__category-side > ul > li + li {
    border-top: 1px solid #edf1f6;
}

.dpqn-product-demo__category-side li ul {
    border-top: 1px solid #f0f3f7;
    background: #fbfcfe;
}

.dpqn-product-demo__category-side li ul li + li {
    border-top: 1px solid #eef2f6;
}

.dpqn-product-demo__category-side a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 44px;
    padding: 11px 14px;
    color: #5d6675;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 900;
    text-transform: uppercase;
}

.dpqn-product-demo__category-side li ul a {
    min-height: 38px;
    padding: 9px 14px 9px 26px;
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    text-transform: none;
}

.dpqn-product-demo__category-side a span {
    min-width: 0;
}

.dpqn-product-demo__category-side a em {
    flex: 0 0 auto;
    color: #8b95a5;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.dpqn-product-demo__category-side a:hover,
.dpqn-product-demo__category-side a.is-active {
    background: #fff0f1;
    color: var(--brand-red) !important;
}

.dpqn-product-demo__category-side a:hover em,
.dpqn-product-demo__category-side a.is-active em {
    color: var(--brand-red);
}

.dpqn-product-demo__content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 20px;
}

.dpqn-product-demo__content {
    padding: 24px;
}

.dpqn-product-demo__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--brand-line);
    padding-bottom: 12px;
}

.dpqn-product-demo__tabs span {
    padding: 10px 14px;
    border-radius: 999px;
    background: #f2f6fb;
    color: var(--brand-blue);
    font-weight: 900;
}

.dpqn-product-demo__tabs span.is-active {
    background: var(--brand-red);
    color: #fff;
}

.dpqn-product-demo__content .entry-content {
    color: #354155;
    line-height: 1.78;
    font-weight: 600;
}

.dpqn-product-demo__content .entry-content p,
.dpqn-product-demo__content .entry-content li {
    text-align: justify;
    text-align-last: left;
    text-justify: inter-word;
    overflow-wrap: break-word;
}

.dpqn-product-demo__content .entry-content h2,
.dpqn-product-demo__content .entry-content h3 {
    color: var(--brand-blue);
    font-weight: 950;
}

.dpqn-product-demo__content .entry-content li {
    margin-bottom: 8px;
}

.dpqn-product-demo__content-featured {
    width: min(100%, 820px);
    margin: 28px auto 34px;
    padding: 10px 10px 12px;
    border: 1px solid rgba(255, 96, 0, .16);
    border-radius: 14px;
    background: linear-gradient(180deg, #fff, #faf8f6);
    box-shadow: 0 14px 34px rgba(32, 32, 32, .08);
    overflow: hidden;
}

.dpqn-product-demo__content-featured-image {
    display: block;
    width: 100%;
    height: auto;
    max-height: 720px;
    margin: 0 auto;
    border-radius: 9px;
    background: #f7f7f7;
    object-fit: contain;
}

.dpqn-product-demo__content-featured figcaption {
    margin-top: 10px;
    padding: 0 8px;
    color: #687386;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}

.dpqn-product-demo__related-side {
    padding: 18px;
    align-self: start;
}

.dpqn-product-demo__related-side h2 {
    margin: 0 0 14px;
    color: var(--brand-blue);
    font-size: 20px;
    font-weight: 950;
}

.dpqn-product-demo__related-side a {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid var(--brand-line);
    color: var(--brand-blue);
}

.dpqn-product-demo__related-side span {
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #f8fbff;
    color: var(--brand-red);
    grid-row: span 2;
}

.dpqn-product-demo__related-side span img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 8px;
}

.dpqn-product-demo__related-side strong {
    color: var(--brand-blue);
    line-height: 1.35;
    font-weight: 900;
}

.dpqn-product-demo__related-side em {
    color: var(--brand-red);
    font-style: normal;
    font-weight: 900;
}

@media (max-width: 1180px) {
    .dpqn-product-demo__top,
    .dpqn-product-demo__content-grid {
        grid-template-columns: 1fr;
    }

    .dpqn-product-demo__contact,
    .dpqn-product-demo__category-side {
        order: 3;
    }
}

@media (max-width: 720px) {
    .dpqn-product-demo__breadcrumb {
        flex-wrap: nowrap;
        gap: 6px;
        overflow: hidden;
        padding: 10px 12px;
        font-size: 12px;
        white-space: nowrap;
    }

    .dpqn-product-demo__breadcrumb a,
    .dpqn-product-demo__breadcrumb > span {
        flex: 0 0 auto;
    }

    .dpqn-product-demo__breadcrumb .dpqn-product-demo__breadcrumb-category {
        display: none;
    }

    .dpqn-product-demo__breadcrumb strong {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dpqn-product-demo__top {
        gap: 14px;
    }

    .dpqn-product-demo__summary,
    .dpqn-product-demo__content,
    .dpqn-product-demo__contact,
    .dpqn-product-demo__related-side {
        padding: 16px;
    }

    .dpqn-product-demo__content-featured {
        margin: 22px auto 26px;
        padding: 6px 6px 9px;
        border-radius: 10px;
    }

    .dpqn-product-demo__content-featured-image {
        border-radius: 7px;
    }

    .dpqn-product-demo__category-side h2 {
        padding: 0;
        font-size: 16px;
    }

    .dpqn-product-demo__category-toggle {
        position: relative;
        min-height: 48px;
        padding: 13px 42px 13px 14px;
        color: #fff !important;
        cursor: pointer;
        pointer-events: auto;
    }

    .dpqn-product-demo__category-toggle span {
        display: block;
        color: #fff !important;
        white-space: nowrap;
    }

    .dpqn-product-demo__category-toggle i {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 14px;
        color: #fff;
        transform: translateY(-50%);
    }

    .dpqn-product-demo__category-toggle[aria-expanded="true"] i {
        transform: translateY(-50%) rotate(180deg);
    }

    #dpqn-product-demo-category-list[hidden] {
        display: none !important;
    }

    .dpqn-product-demo__benefits,
    .dpqn-product-demo__actions,
    .dpqn-product-demo__demo-actions {
        grid-template-columns: 1fr;
    }

    .dpqn-product-demo__summary h1 {
        font-size: 26px;
    }

    .dpqn-product-demo__offer strong {
        font-size: 20px;
    }

    .dpqn-product-demo__demo-info {
        font-size: 15px;
        gap: 9px;
    }
}

/* Uniform archive page: /san-pham/ */
.uniform-archive {
    padding: 24px 0 48px;
    background: #f3f6fa;
}

.uniform-archive__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid rgba(6,64,118,.10);
    border-radius: 8px;
    background: #fff;
    color: #687386;
    font-weight: 700;
}

.uniform-archive__breadcrumb a {
    color: var(--brand-blue);
    font-weight: 900;
}

.uniform-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 28px;
    align-items: stretch;
    min-height: 410px;
    padding: 34px;
    border-radius: 8px;
    background:
        radial-gradient(circle at 86% 12%, rgba(229,27,35,.20), transparent 28%),
        linear-gradient(135deg, var(--brand-blue) 0%, #0b5799 54%, var(--brand-blue-dark) 100%);
    color: #fff;
    box-shadow: 0 18px 44px rgba(6,64,118,.18);
    overflow: hidden;
}

.uniform-hero__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.uniform-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    margin-bottom: 14px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #fff0f1;
    color: var(--brand-red);
    font-size: 12px;
    font-weight: 950;
    text-transform: none;
}

.uniform-hero .uniform-eyebrow {
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.18);
    color: #fff;
}

.uniform-hero h1 {
    max-width: 760px;
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.08;
    font-weight: 950;
}

.uniform-hero p {
    max-width: 780px;
    margin: 18px 0 0;
    color: rgba(255,255,255,.88);
    font-size: 17px;
    line-height: 1.72;
    font-weight: 600;
}

.uniform-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}

.uniform-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 46px;
    padding: 12px 18px;
    border-radius: 8px;
    font-weight: 950;
    text-decoration: none;
}

.uniform-btn--primary {
    background: var(--brand-red);
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(229,27,35,.22);
}

.uniform-btn--ghost {
    background: #fff;
    color: var(--brand-blue) !important;
}

.uniform-hero__panel {
    align-self: center;
    padding: 24px;
    border-radius: 8px;
    background: rgba(255,255,255,.96);
    color: var(--brand-blue);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.28), 0 18px 34px rgba(4,44,86,.18);
}

.uniform-hero__panel strong {
    display: block;
    margin-bottom: 16px;
    color: var(--brand-blue);
    font-size: 21px;
    line-height: 1.35;
    font-weight: 850;
    text-transform: none;
}

.uniform-hero__panel ul {
    display: grid;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.uniform-hero__panel li {
    color: #263548;
    font-size: 17px;
    line-height: 1.4;
    font-weight: 650;
}

.uniform-hero__panel li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    padding: 2px 4px;
    border-radius: 4px;
    background: var(--brand-red);
    color: #fff;
    font-size: 10px;
    font-weight: 950;
}

.uniform-benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 22px 0;
}

.uniform-benefits article {
    padding: 24px 20px;
    border: 1px solid rgba(6,64,118,.10);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(6,64,118,.07);
    text-align: center;
}

.uniform-benefits i {
    width: 58px;
    height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 14px;
    background: #fff0f1;
    color: var(--brand-red);
    font-size: 24px;
}

.uniform-benefits h2 {
    margin: 0 0 8px;
    color: var(--brand-blue);
    font-size: 18px;
    font-weight: 950;
}

.uniform-benefits p {
    margin: 0;
    color: #667085;
    line-height: 1.6;
    font-weight: 600;
}

.uniform-categories,
.uniform-products,
.uniform-advice {
    margin-top: 22px;
    padding: 28px;
    border: 1px solid rgba(6,64,118,.10);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(6,64,118,.07);
}

.uniform-section-head {
    max-width: 860px;
    margin: 0 auto 24px;
    text-align: center;
}

.uniform-section-head h2 {
    margin: 0;
    color: var(--brand-blue);
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.18;
    font-weight: 950;
    text-transform: none;
}

.uniform-section-head p {
    margin: 12px 0 0;
    color: #667085;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 600;
}

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

.uniform-category-card {
    overflow: hidden;
    display: block;
    border-radius: 8px;
    border: 1px solid rgba(6,64,118,.10);
    background: #fff;
    box-shadow: 0 10px 24px rgba(6,64,118,.07);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.uniform-category-card:hover {
    transform: translateY(-4px);
    border-color: rgba(229,27,35,.24);
    box-shadow: 0 18px 36px rgba(6,64,118,.13);
}

.uniform-category-card figure {
    aspect-ratio: 4 / 3;
    margin: 0;
    overflow: hidden;
    background: #eef3f8;
}

.uniform-category-card__placeholder {
    display: grid !important;
    width: 100%;
    height: 100%;
    place-items: center;
    margin: 0 !important;
    color: var(--brand-blue) !important;
    background: linear-gradient(145deg, #edf5fb, #dceaf5);
    font-size: 54px !important;
}

.uniform-category-card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .28s ease;
}

.uniform-category-card:hover img {
    transform: scale(1.055);
}

.uniform-category-card div {
    padding: 16px;
}

.uniform-category-card span {
    display: block;
    margin-bottom: 7px;
    color: var(--brand-red);
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.uniform-category-card h3 {
    min-height: 50px;
    margin: 0;
    color: var(--brand-blue);
    font-size: 18px;
    line-height: 1.35;
    font-weight: 950;
}

.uniform-category-card small {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    color: #667085;
    font-size: 13px;
    font-weight: 800;
}

.uniform-products .uniform-section-head {
    max-width: 760px;
}

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

.uniform-products__loadmore {
    margin-top: 24px;
}

.uniform-advice {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 28px;
    align-items: start;
}

.uniform-advice h2 {
    margin: 0;
    color: var(--brand-blue);
    font-size: clamp(26px, 3vw, 36px);
    line-height: 1.18;
    font-weight: 950;
}

.uniform-advice p {
    margin: 14px 0 0;
    color: #4b5a70;
    font-size: 16px;
    line-height: 1.78;
    font-weight: 600;
}

.uniform-advice aside {
    padding: 22px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-dark));
    color: #fff;
}

.uniform-advice aside strong {
    display: block;
    margin-bottom: 14px;
    color: #fff;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 950;
}

.uniform-advice aside ul {
    display: grid;
    gap: 10px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.uniform-advice aside li {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 8px;
    color: rgba(255,255,255,.88);
    line-height: 1.5;
    font-weight: 700;
}

.uniform-advice aside li i {
    margin-top: 3px;
    color: #fff;
}

@media (max-width: 1024px) {
    .uniform-hero,
    .uniform-advice {
        grid-template-columns: 1fr;
    }

    .uniform-benefits,
    .uniform-product-grid,
    .uniform-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .uniform-archive {
        padding-top: 14px;
    }

    .uniform-hero,
    .uniform-categories,
    .uniform-advice {
        padding: 20px;
    }

    .uniform-hero h1 {
        font-size: 30px;
    }

    .uniform-hero__panel strong {
        font-size: 18px;
    }

    .uniform-benefits,
    .uniform-product-grid,
    .uniform-category-grid {
        grid-template-columns: 1fr;
    }
}

/* Floating contact buttons - compact, aligned, brand-safe. */
.floating-contact {
    right: 18px !important;
    bottom: 28px !important;
    gap: 10px !important;
    align-items: flex-end !important;
    z-index: 999 !important;
}

.floating-contact .f-btn {
    position: relative !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    animation: none !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.floating-contact .f-btn::before,
.floating-contact .f-btn::after {
    display: none !important;
}

.floating-contact .f-btn-icon {
    width: 52px !important;
    height: 52px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: 2px solid rgba(255,255,255,.96) !important;
    color: #fff !important;
    font-size: 19px !important;
    line-height: 1 !important;
    box-shadow: 0 10px 24px rgba(6,64,118,.22) !important;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.floating-contact .f-btn-icon i {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 1em !important;
    height: 1em !important;
    line-height: 1 !important;
}

.floating-contact .btn-zalo .f-btn-icon {
    background: #fff !important;
    border-color: #0b78ff !important;
    color: #0b78ff !important;
}

.floating-contact .btn-zalo .f-btn-icon img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

.floating-contact .btn-phone .f-btn-icon {
    background: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
    color: #fff !important;
}

.floating-contact .btn-email .f-btn-icon {
    background: var(--brand-blue) !important;
    border-color: rgba(255,255,255,.9) !important;
    color: #fff !important;
}

.floating-contact .f-btn:hover .f-btn-icon {
    transform: translateY(-2px) scale(1.04) !important;
    box-shadow: 0 14px 30px rgba(6,64,118,.28) !important;
    filter: saturate(1.05) !important;
}

.floating-contact .f-btn-label {
    right: 62px !important;
    background: var(--brand-blue) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(6,64,118,.20) !important;
}

@media (max-width: 640px) {
    .floating-contact {
        right: 12px !important;
        bottom: 18px !important;
        gap: 8px !important;
    }

    .floating-contact .f-btn,
    .floating-contact .f-btn-icon {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        font-size: 17px !important;
    }

    .floating-contact .btn-zalo .f-btn-icon img {
        width: 32px !important;
        height: 32px !important;
    }
}

/* Mobile header alignment: center the logo on the viewport and balance the menu icon. */
@media (max-width: 768px) {
    .site-header .dpqn-demo-inner {
        position: relative !important;
        display: block !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 92px !important;
        padding: 10px 20px !important;
        gap: 0 !important;
        box-sizing: border-box !important;
    }

    .site-header .dpqn-demo-logo {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        z-index: 2 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        max-width: min(225px, 64vw) !important;
        margin: 0 !important;
        padding: 0 !important;
        border-right: 0 !important;
        transform: translate(-50%, -50%) !important;
    }

    .site-header .dpqn-demo-logo img {
        display: block !important;
        width: auto !important;
        max-width: min(225px, 64vw) !important;
        max-height: 72px !important;
        height: auto !important;
        object-fit: contain !important;
    }

    .site-header .dpqn-demo-right,
    .site-header .dpqn-demo-top {
        min-width: 0 !important;
    }

    .site-header .dpqn-demo-right {
        display: block !important;
        height: 100% !important;
    }

    .site-header .dpqn-demo-top {
        position: absolute !important;
        top: 50% !important;
        right: 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        padding: 0 !important;
        gap: 0 !important;
        transform: translateY(-50%) !important;
    }

    .site-header .dpqn-demo-mobile-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: var(--brand-red) !important;
        color: #fff !important;
        font-size: 18px !important;
        line-height: 1 !important;
        box-shadow: 0 8px 18px rgba(229, 27, 35, .22) !important;
    }

    .site-header .dpqn-demo-mobile-toggle i {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 1em !important;
        height: 1em !important;
        margin: 0 !important;
        line-height: 1 !important;
    }
}

/* Compact homepage banner on mobile, matching the tighter Bao Ho Ha Noi layout. */
@media (max-width: 768px) {
    .slider-section-full {
        width: calc(100% - 32px) !important;
        max-width: 390px !important;
        margin: 0 auto 26px !important;
        padding: 0 !important;
        overflow: visible !important;
        border-radius: 7px !important;
        background: #fff !important;
        box-shadow: 0 8px 22px rgba(6, 64, 118, .08) !important;
    }

    .slider-section-full .slider__main,
    .slider-section-full .slider__main .slick-list,
    .slider-section-full .slider__main .slick-track,
    .slider-section-full .slider__main .item {
        height: clamp(168px, 47vw, 190px) !important;
        min-height: 0 !important;
        border-radius: 7px !important;
        overflow: hidden !important;
    }

    .slider-section-full .slider__main .item img {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: auto !important;
        display: block !important;
        object-fit: cover !important;
        object-position: center center !important;
        margin: 0 !important;
    }

    .slider-section-full .slider__main .item::after {
        border-radius: 7px !important;
        background: linear-gradient(90deg, rgba(6, 64, 118, .22), rgba(6, 64, 118, .02) 62%, rgba(6, 64, 118, .12)) !important;
    }

    .slider-section-full .slick-prev,
    .slider-section-full .slick-next {
        width: 30px !important;
        height: 30px !important;
        z-index: 3 !important;
    }

    .slider-section-full .slick-prev {
        left: 10px !important;
    }

    .slider-section-full .slick-next {
        right: 10px !important;
    }

    .slider-section-full .slick-dots {
        bottom: -24px !important;
        margin: 0 !important;
    }

    .dpqn-hero-action {
        margin: 24px 0 18px !important;
        text-align: center !important;
    }

    .dpqn-btn-detail {
        min-height: 38px !important;
        padding: 8px 24px !important;
        font-size: 14px !important;
        line-height: 20px !important;
    }
}

/* Featured category carousel on mobile. */
.dpqn-cats-carousel {
    position: relative;
}

.dpqn-cats-nav {
    display: none;
}

@media (max-width: 768px) {
    .dpqn-featured-cats {
        margin-bottom: 26px !important;
    }

    .dpqn-featured-cats .inner-container {
        width: calc(100% - 32px) !important;
        max-width: 390px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .dpqn-section-title {
        max-width: 310px !important;
        margin: 0 auto 24px !important;
        font-size: 22px !important;
        line-height: 1.22 !important;
    }

    .dpqn-cats-carousel {
        margin: 0 auto !important;
        overflow: visible !important;
    }

    .dpqn-cats-grid {
        display: flex !important;
        grid-template-columns: none !important;
        gap: 14px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 0 0 4px !important;
        scrollbar-width: none !important;
    }

    .dpqn-cats-grid::-webkit-scrollbar {
        display: none !important;
    }

    .dpqn-cat-card {
        flex: 0 0 100% !important;
        width: 100% !important;
        scroll-snap-align: start !important;
        border-radius: 7px !important;
        box-shadow: 0 8px 22px rgba(6, 64, 118, .08) !important;
    }

    .dpqn-cat-card img {
        height: clamp(210px, 62vw, 252px) !important;
        border-radius: 7px !important;
    }

    .dpqn-cat-title {
        min-height: 42px !important;
        padding: 10px 12px !important;
        background: rgba(6, 64, 118, .96) !important;
        font-size: 15px !important;
        line-height: 20px !important;
    }

    .dpqn-cats-nav {
        position: absolute !important;
        top: 50% !important;
        z-index: 4 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 34px !important;
        height: 34px !important;
        padding: 0 !important;
        border: 2px solid rgba(255, 255, 255, .94) !important;
        border-radius: 50% !important;
        background: rgba(6, 64, 118, .88) !important;
        color: #fff !important;
        font-size: 14px !important;
        line-height: 1 !important;
        box-shadow: 0 8px 18px rgba(6, 64, 118, .24) !important;
        transform: translateY(-50%) !important;
    }

    .dpqn-cats-nav--prev {
        left: 10px !important;
    }

    .dpqn-cats-nav--next {
        right: 10px !important;
    }

    .dpqn-cats-nav i {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 1em !important;
        height: 1em !important;
        line-height: 1 !important;
    }
}

/* About page brand color sync and compact 2-column stat cards on mobile. */
.brand-page--about .brand-hero,
.brand-page--about .contact-hero {
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 58%, #f1f7ff 100%) !important;
}

.brand-page--about .brand-hero__eyebrow,
.brand-page--about .brand-section__label {
    background: #eef6ff !important;
    color: var(--brand-blue) !important;
}

.brand-page--about .brand-hero__eyebrow i,
.brand-page--about .brand-section__label i {
    color: var(--brand-red) !important;
}

.brand-page--about .brand-btn--primary {
    background: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
    color: #fff !important;
}

.brand-page--about .brand-btn--primary:hover {
    background: var(--brand-red-dark) !important;
    border-color: var(--brand-red-dark) !important;
}

.brand-page--about .brand-btn--ghost {
    color: var(--brand-blue) !important;
    border-color: rgba(6, 64, 118, .16) !important;
}

.brand-page--about .brand-stats div {
    border-color: rgba(6, 64, 118, .12) !important;
    background: linear-gradient(145deg, #fff 0%, #f6fbff 72%, #fff5f6 100%) !important;
}

.brand-page--about .brand-feature-list i,
.brand-page--about .contact-location-list i,
.brand-page--about .contact-request h2 i,
.brand-page--about .brand-promise-grid article > i {
    border-color: rgba(6, 64, 118, .14) !important;
    background: var(--brand-blue) !important;
    color: #fff !important;
}

@media (max-width: 640px) {
    .brand-page--about {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .brand-page--about .brand-hero {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .brand-page--about .brand-visual-card {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 22px 18px !important;
        box-sizing: border-box !important;
    }

    .brand-page--about .brand-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin: 16px 0 18px !important;
    }

    .brand-page--about .brand-stats div {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 142px !important;
        padding: 18px 10px !important;
        text-align: center !important;
    }

    .brand-page--about .brand-stats div > i {
        width: 38px !important;
        height: 38px !important;
        margin: 0 auto 12px !important;
        border-radius: 8px !important;
        background: var(--brand-blue) !important;
        color: #fff !important;
    }

    .brand-page--about .brand-stats strong {
        font-size: clamp(21px, 7vw, 28px) !important;
        line-height: 1.1 !important;
        text-align: center !important;
        overflow-wrap: anywhere !important;
    }

    .brand-page--about .brand-stats span {
        max-width: 145px !important;
        margin: 8px auto 0 !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        text-align: center !important;
    }

    .brand-page--about .brand-promise-grid article {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        padding: 20px 16px !important;
        text-align: center !important;
    }

    .brand-page--about .brand-promise-grid article > i {
        width: 56px !important;
        height: 56px !important;
        min-width: 56px !important;
        margin: 0 auto !important;
        border-radius: 12px !important;
        font-size: 24px !important;
        line-height: 1 !important;
    }

    .brand-page--about .brand-promise-grid h3,
    .brand-page--about .brand-promise-grid p {
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }
}

/* Contact page mobile cards: center and enlarge icons. */
.brand-page--contact .brand-promise-grid article,
.brand-page--contact .contact-location-list article {
    text-align: center !important;
}

.brand-page--contact .brand-promise-grid article > i,
.brand-page--contact .contact-location-list article > i {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    background: #fff0f1 !important;
    color: var(--brand-red) !important;
}

@media (max-width: 640px) {
    .brand-page--contact .brand-promise-grid article,
    .brand-page--contact .contact-location-list article {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        padding: 20px 16px !important;
    }

    .brand-page--contact .brand-promise-grid article > i,
    .brand-page--contact .contact-location-list article > i {
        width: 56px !important;
        height: 56px !important;
        min-width: 56px !important;
        border-radius: 12px !important;
        font-size: 24px !important;
        line-height: 1 !important;
    }

    .brand-page--contact .brand-promise-grid h3,
    .brand-page--contact .contact-location-list h3 {
        width: 100% !important;
        margin: 0 !important;
        text-align: center !important;
    }

    .brand-page--contact .brand-promise-grid p,
    .brand-page--contact .contact-location-list p {
        width: 100% !important;
        margin: 0 !important;
        text-align: center !important;
    }
}

/* ============================================================
   FINAL LOGO PALETTE — aphong-1.webp
   Orange #ff6000 · Charcoal #202020 · Warm neutrals
   Keep this layer last so legacy blue/red rules cannot leak through.
   ============================================================ */
:root {
    --brand-primary: #ff6000;
    --brand-primary-dark: #c94700;
    --brand-charcoal: #202020;
    --brand-charcoal-soft: #3a3a3a;
    --brand-warm-bg: #faf8f6;
    --brand-warm-soft: #fff1e8;
    --brand-warm-line: #ebe3de;
}

body {
    color: var(--brand-charcoal);
    background-color: var(--brand-warm-bg);
}

::selection {
    background: var(--brand-primary);
    color: #fff;
}

a:hover,
.site-header .header__contact-link:hover,
.site-header .header__contact-link i,
.dpqn-demo-contact a:hover,
.dpqn-demo-contact i,
.dpqn-demo-nav-menu > li.current-menu-item > a,
.dpqn-demo-nav-menu > li.current-menu-ancestor > a,
.dpqn-demo-nav-menu > li > a:hover,
.menuSecondary__menu > li.current-menu-item > a,
.menuSecondary__menu > li.current-menu-ancestor > a,
.menuSecondary__menu > li > a:hover,
.product-item__name:hover,
.news-item__title:hover,
.dpqn-news-title a:hover,
.dpqn-news-title-small a:hover {
    color: var(--brand-primary) !important;
}

.dpqn-section-title,
.dpqn-testimonials-title,
.dpqn-about-title,
.dpqn-news-heading,
.archive-title,
.single-title,
.brand-hero h1,
.brand-section h2,
.contact-request h2,
.advisory-hero h1,
.advisory-section h2,
.dpqn-product-demo__title,
.dpqn-product-demo__content h2,
.dpqn-product-demo__category-side h2,
.dpqn-product-demo__related-side h2 {
    color: var(--brand-charcoal) !important;
}

.btn-primary,
.dpqn-btn-detail,
.cate-home__viewall,
.about-home__btn--primary,
.brand-btn--primary,
.advisory-cta,
.contact-submit,
.tuvan-modal__submit,
.footer__newsletter button,
button[type="submit"],
input[type="submit"],
.mobile-menu-toggle,
.dpqn-demo-mobile-toggle {
    border-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(255, 96, 0, .20) !important;
}

.btn-primary:hover,
.dpqn-btn-detail:hover,
.cate-home__viewall:hover,
.about-home__btn--primary:hover,
.brand-btn--primary:hover,
.advisory-cta:hover,
.contact-submit:hover,
.tuvan-modal__submit:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    border-color: var(--brand-primary-dark) !important;
    background: var(--brand-primary-dark) !important;
    color: #fff !important;
}

.dpqn-cat-title,
.category-heading,
.menu-cate__title,
.dpqn-product-demo__contact h2,
.dpqn-product-demo__main-image span,
.footer {
    background-color: var(--brand-charcoal) !important;
    color: #fff !important;
}

.section-title::after,
.widget-title::after,
.archive-title::after,
.cate-home__title::after,
.news-home__title::after,
.about-home__title::after,
.why-us__heading::after,
.product-card__badge,
.slick-dots li.slick-active button,
.dpqn-testimonials-slider .slick-dots .slick-active button {
    background-color: var(--brand-primary) !important;
}

.product-item__price,
.product-price,
.dpqn-product-demo__price,
.breadcrumb li.active,
.breadcrumb li:last-child,
.why-us__icon i,
.brand-hero__eyebrow i,
.brand-section__label i,
.text-red {
    color: var(--brand-primary) !important;
}

.brand-hero__eyebrow,
.brand-section__label,
.brand-page--contact .brand-promise-grid article > i,
.brand-page--contact .contact-location-list article > i,
.product-card__badge--soft {
    border-color: rgba(255, 96, 0, .18) !important;
    background: var(--brand-warm-soft) !important;
    color: var(--brand-primary-dark) !important;
}

.brand-page--about .brand-hero,
.brand-page--contact .brand-hero {
    background: linear-gradient(135deg, #fff 0%, #fff8f3 58%, #fff1e8 100%) !important;
}

.brand-visual-card {
    background:
        radial-gradient(circle at 88% 12%, rgba(255, 96, 0, .24), transparent 30%),
        linear-gradient(135deg, var(--brand-charcoal) 0%, var(--brand-charcoal-soft) 100%) !important;
}

.about-premium-banner {
    background:
        linear-gradient(90deg, rgba(17, 17, 17, .97) 0%, rgba(32, 32, 32, .92) 56%, rgba(255, 96, 0, .70) 100%),
        var(--about-banner-image) center/cover no-repeat !important;
    box-shadow: 0 18px 44px rgba(32, 32, 32, .16) !important;
}

.uniform-archive,
.product-archive,
.dpqn-tax-archive,
.blog-archive,
.static-page,
.single-post-page {
    background-color: var(--brand-warm-bg) !important;
}

.uniform-hero,
.dpqn-tax-archive__promo,
.blog-archive__hero,
.static-page__hero,
.single-post__hero,
.uniform-advice aside {
    background:
        radial-gradient(circle at 86% 12%, rgba(255, 96, 0, .28), transparent 30%),
        linear-gradient(135deg, var(--brand-charcoal) 0%, var(--brand-charcoal-soft) 70%, #5a2a12 100%) !important;
    box-shadow: 0 18px 44px rgba(32, 32, 32, .16) !important;
}

.menu__cate-title {
    background: linear-gradient(135deg, var(--brand-charcoal), var(--brand-charcoal-soft)) !important;
}

.cate-home__banner::after {
    background:
        linear-gradient(100deg, #111 0%, #202020 50%, rgba(32, 32, 32, .90) 62%, rgba(32, 32, 32, .16) 78%, transparent 100%),
        linear-gradient(135deg, transparent 39%, rgba(255, 96, 0, .96) 39%, rgba(255, 96, 0, .96) 42.5%, transparent 42.5%) !important;
}

.site-header .form-main,
.dpqn-demo-search-box,
.product-item,
.dpqn-cat-card,
.news-item,
.brand-card,
.advisory-card,
.contact-location-list article,
.brand-promise-grid article {
    border-color: var(--brand-warm-line) !important;
    box-shadow: 0 10px 28px rgba(32, 32, 32, .07) !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 3px rgba(255, 96, 0, .12) !important;
    outline: none;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
    border-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    color: #fff !important;
}

.dpqn-cats-nav,
.slider-section-full .slick-prev,
.slider-section-full .slick-next {
    border-color: rgba(255, 255, 255, .94) !important;
    background: rgba(32, 32, 32, .90) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(32, 32, 32, .24) !important;
}

.dpqn-cats-nav:hover,
.slider-section-full .slick-prev:hover,
.slider-section-full .slick-next:hover {
    background: var(--brand-primary) !important;
}

.f-btn.btn-phone,
.btn-email .f-btn-icon {
    background: var(--brand-primary) !important;
}

.f-btn.btn-email {
    background: var(--brand-charcoal) !important;
}

.footer a:hover,
.footer__contact li i {
    color: #ff9a5c !important;
}

/* ============================================================
   APD ABOUT + CONTACT — independent editorial layouts
   ============================================================ */
.apd-about,
.apd-contact {
    padding: 0 0 72px;
    background: #faf8f6;
    color: #202020;
}

.apd-about *,
.apd-contact * {
    box-sizing: border-box;
}

.apd-crumb {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 52px;
    color: #77716d;
    font-size: 13px;
    font-weight: 700;
}

.apd-crumb a {
    color: #202020;
    text-decoration: none;
}

.apd-crumb i {
    color: #b8afa9;
    font-size: 10px;
}

.apd-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    color: #c94700;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.apd-kicker::before {
    content: "";
    width: 24px;
    height: 2px;
    background: #ff6000;
}

.apd-kicker i + * {
    margin-left: 0;
}

.apd-kicker--dark {
    color: #ff9a5c;
}

.apd-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 12px 20px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.apd-button:hover {
    transform: translateY(-2px);
}

.apd-button--orange {
    border-color: #ff6000 !important;
    background: #ff6000 !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(255, 96, 0, .22) !important;
}

.apd-button--orange:hover {
    border-color: #c94700 !important;
    background: #c94700 !important;
}

.apd-button--line {
    border-color: #d8d0cb;
    background: #fff;
    color: #202020;
}

.apd-section-head {
    max-width: 760px;
    margin-bottom: 30px;
}

.apd-section-head h2 {
    margin: 12px 0 0;
    color: #202020;
    font-size: clamp(28px, 3.5vw, 44px);
    line-height: 1.12;
    letter-spacing: -.035em;
}

.apd-section-head--row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    max-width: none;
}

.apd-section-head--row > a {
    flex: 0 0 auto;
    color: #c94700;
    font-weight: 850;
    text-decoration: none;
}

/* About: asymmetric product-led hero. */
.apd-about-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
    gap: clamp(30px, 5vw, 72px);
    align-items: center;
    min-height: 610px;
    padding: clamp(34px, 5vw, 72px);
    border: 1px solid #ebe3de;
    border-radius: 18px;
    background:
        radial-gradient(circle at 8% 10%, rgba(255, 96, 0, .11), transparent 28%),
        linear-gradient(135deg, #fff 0%, #fffaf6 100%);
}

.apd-about-hero::after {
    content: "";
    position: absolute;
    left: -70px;
    bottom: -90px;
    width: 230px;
    height: 230px;
    border: 46px solid rgba(255, 96, 0, .07);
    border-radius: 50%;
    pointer-events: none;
}

.apd-about-hero__copy {
    position: relative;
    z-index: 1;
}

.apd-about-hero h1 {
    max-width: 760px;
    margin: 18px 0 22px;
    color: #202020;
    font-size: clamp(40px, 5.2vw, 68px);
    line-height: 1.02;
    letter-spacing: -.052em;
}

.apd-about-hero__copy > p {
    max-width: 690px;
    margin: 0;
    color: #655f5b;
    font-size: 17px;
    line-height: 1.75;
}

.apd-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.apd-hero-notes {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
    margin-top: 26px;
    color: #514c48;
    font-size: 13px;
    font-weight: 750;
}

.apd-hero-notes i {
    margin-right: 5px;
    color: #ff6000;
}

.apd-about-gallery {
    position: relative;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    grid-template-rows: 1fr 1fr;
    gap: 10px;
    min-height: 470px;
    padding: 10px;
    border-radius: 16px;
    background: #202020;
    box-shadow: 0 28px 60px rgba(32, 32, 32, .18);
}

.apd-about-gallery__item {
    position: relative;
    overflow: hidden;
    min-width: 0;
    border-radius: 10px;
    background: #3a3a3a;
}

.apd-about-gallery__item:first-child {
    grid-row: 1 / 3;
}

.apd-about-gallery__item img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .45s ease;
}

.apd-about-gallery__item:hover img {
    transform: scale(1.035);
}

.apd-about-gallery__item > span {
    position: absolute;
    right: 10px;
    bottom: 10px;
    left: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    background: rgba(17, 17, 17, .76);
    color: #fff;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
    backdrop-filter: blur(5px);
}

.apd-about-gallery__stamp {
    position: absolute;
    left: -22px;
    bottom: 36px;
    display: grid;
    width: 142px;
    min-height: 104px;
    place-items: center;
    padding: 14px;
    border: 5px solid #fff;
    border-radius: 12px;
    background: #ff6000;
    color: #fff;
    text-align: center;
    box-shadow: 0 14px 32px rgba(255, 96, 0, .28);
}

.apd-about-gallery__stamp strong {
    font-size: 28px;
    line-height: 1;
}

.apd-about-gallery__stamp span {
    font-size: 10px;
    font-weight: 800;
    line-height: 1.3;
    text-transform: uppercase;
}

@media (min-width: 761px) {
    .apd-about-gallery__item:first-child > span {
        padding-left: 132px;
    }
}

.apd-about-gallery__fallback {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 22px;
}

.apd-proof {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 18px 0 70px;
    border: 1px solid #ebe3de;
    border-radius: 12px;
    background: #fff;
}

.apd-proof article {
    min-width: 0;
    padding: 25px 28px;
    border-right: 1px solid #ebe3de;
}

.apd-proof article:last-child {
    border-right: 0;
}

.apd-proof strong {
    display: block;
    margin-bottom: 5px;
    color: #ff6000;
    font-size: 25px;
    line-height: 1;
}

.apd-proof span {
    color: #6b6561;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}

.apd-story {
    display: grid;
    grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
    gap: clamp(40px, 8vw, 110px);
    align-items: start;
    margin: 0 0 82px;
}

.apd-story__intro {
    position: sticky;
    top: 110px;
}

.apd-story__intro h2 {
    margin: 15px 0 18px;
    color: #202020;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.1;
    letter-spacing: -.04em;
}

.apd-story__intro p {
    color: #655f5b;
    line-height: 1.75;
}

.apd-story__intro a {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    margin-top: 10px;
    color: #c94700;
    font-weight: 850;
    text-decoration: none;
}

.apd-principles {
    border-top: 1px solid #dcd3cd;
}

.apd-principles article {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 22px;
    padding: 32px 0;
    border-bottom: 1px solid #dcd3cd;
}

.apd-principles article > span {
    color: #ff6000;
    font-size: 14px;
    font-weight: 900;
}

.apd-principles h3 {
    margin: 0 0 10px;
    color: #202020;
    font-size: 24px;
}

.apd-principles p {
    margin: 0;
    color: #655f5b;
    line-height: 1.72;
}

.apd-process {
    margin: 0 0 82px;
    padding: clamp(30px, 5vw, 58px);
    border-radius: 18px;
    background: #202020;
}

.apd-process .apd-kicker,
.apd-process .apd-section-head h2 {
    color: #fff;
}

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

.apd-process__grid article {
    position: relative;
    min-height: 250px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 10px;
    background: rgba(255, 255, 255, .055);
    color: #fff;
}

.apd-process__number {
    position: absolute;
    top: 18px;
    right: 18px;
    color: rgba(255, 255, 255, .22);
    font-size: 28px;
    font-weight: 900;
}

.apd-process__grid article > i {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 44px;
    place-items: center;
    border-radius: 10px;
    background: #ff6000;
    color: #fff;
    font-size: 19px;
}

.apd-process__grid h3 {
    margin: 0 0 9px;
    color: #fff;
    font-size: 19px;
}

.apd-process__grid p {
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 13px;
    line-height: 1.65;
}

.apd-lines {
    margin-bottom: 82px;
}

.apd-lines__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid #dcd3cd;
    border-left: 1px solid #dcd3cd;
}

.apd-lines__grid a {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 98px;
    padding: 20px;
    border-right: 1px solid #dcd3cd;
    border-bottom: 1px solid #dcd3cd;
    background: #fff;
    color: #202020;
    text-decoration: none;
}

.apd-lines__grid a:hover {
    background: #fff1e8;
}

.apd-lines__grid span {
    color: #ff6000;
    font-size: 11px;
    font-weight: 900;
}

.apd-lines__grid strong {
    min-width: 0;
    font-size: 16px;
}

.apd-lines__grid i {
    color: #a69d97;
    font-size: 12px;
}

.apd-quality {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr) 280px;
    gap: clamp(25px, 5vw, 60px);
    align-items: center;
    padding: clamp(32px, 5vw, 62px);
    border-radius: 18px;
    background:
        radial-gradient(circle at 90% 10%, rgba(255, 96, 0, .24), transparent 30%),
        #202020;
    color: #fff;
}

.apd-quality h2 {
    margin: 14px 0;
    color: #fff;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.12;
}

.apd-quality p {
    margin: 0;
    color: rgba(255, 255, 255, .7);
    line-height: 1.7;
}

.apd-quality ul {
    display: grid;
    gap: 13px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.apd-quality li {
    color: #fff;
    font-size: 14px;
    font-weight: 750;
}

.apd-quality li i {
    width: 24px;
    margin-right: 7px;
    color: #ff7a26;
}

.apd-quality aside {
    display: grid;
    gap: 8px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    background: rgba(255, 255, 255, .07);
}

.apd-quality aside > span,
.apd-quality aside small {
    color: rgba(255, 255, 255, .65);
}

.apd-quality aside strong {
    font-size: 22px;
}

.apd-quality aside a {
    margin-top: 8px;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, .14);
    color: #ff9a5c;
    font-weight: 850;
    text-decoration: none;
}

/* Contact: dark channel hub + bright form workspace. */
.apd-crumb--contact {
    color: #756f6b;
}

.apd-contact-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr);
    gap: clamp(35px, 7vw, 90px);
    align-items: center;
    min-height: 500px;
    padding: clamp(36px, 6vw, 76px);
    border-radius: 18px;
    background:
        radial-gradient(circle at 82% 12%, rgba(255, 96, 0, .3), transparent 28%),
        linear-gradient(135deg, #161616 0%, #2c2c2c 72%, #51250f 100%);
    color: #fff;
}

.apd-contact-hero h1 {
    max-width: 760px;
    margin: 18px 0 20px;
    color: #fff;
    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.02;
    letter-spacing: -.05em;
}

.apd-contact-hero__copy > p {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 17px;
    line-height: 1.72;
}

.apd-contact-hero__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.apd-contact-hero__facts span {
    padding: 9px 11px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 6px;
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .8);
    font-size: 11px;
    font-weight: 750;
}

.apd-contact-hero__facts strong {
    margin-right: 5px;
    color: #ff8b42;
}

.apd-contact-hero__channels {
    display: grid;
    gap: 10px;
}

.apd-contact-hero__channels > a {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 84px;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 10px;
    background: rgba(255, 255, 255, .075);
    color: #fff;
    text-decoration: none;
    backdrop-filter: blur(8px);
}

.apd-contact-hero__channels > a:hover {
    border-color: rgba(255, 96, 0, .8);
    background: rgba(255, 96, 0, .14);
}

.apd-contact-hero__channels > a > i:first-child {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 10px;
    background: #ff6000;
    color: #fff;
}

.apd-contact-hero__channels > a > i:last-child {
    color: rgba(255, 255, 255, .45);
    font-size: 11px;
}

.apd-contact-hero__channels span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.apd-contact-hero__channels small {
    color: rgba(255, 255, 255, .55);
    font-size: 11px;
}

.apd-contact-hero__channels strong {
    overflow: hidden;
    color: #fff;
    font-size: 15px;
    text-overflow: ellipsis;
}

.apd-contact-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(330px, .65fr);
    gap: 18px;
    margin: 18px 0 76px;
}

.apd-inquiry,
.apd-contact-aside {
    border: 1px solid #ebe3de;
    border-radius: 16px;
    background: #fff;
}

.apd-inquiry {
    padding: clamp(28px, 5vw, 52px);
}

.apd-inquiry header h2 {
    margin: 12px 0 8px;
    color: #202020;
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.13;
}

.apd-inquiry header p {
    margin: 0;
    color: #756f6b;
}

.apd-inquiry__form {
    display: grid;
    gap: 20px;
    margin-top: 30px;
}

.apd-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.apd-inquiry__form label {
    display: grid;
    gap: 8px;
}

.apd-inquiry__form label > span {
    color: #393532;
    font-size: 12px;
    font-weight: 850;
}

.apd-inquiry__form input,
.apd-inquiry__form textarea {
    width: 100%;
    border: 1px solid #dcd3cd;
    border-radius: 8px;
    background: #fdfcfa;
    color: #202020;
    font: inherit;
}

.apd-inquiry__form input {
    height: 50px;
    padding: 0 15px;
}

.apd-inquiry__form textarea {
    min-height: 150px;
    padding: 14px 15px;
    resize: vertical;
}

.apd-inquiry__submit {
    display: flex;
    align-items: center;
    gap: 18px;
}

.apd-inquiry__submit small {
    color: #817a75;
    line-height: 1.4;
}

.apd-inquiry__submit small i {
    margin-right: 5px;
    color: #ff6000;
}

.apd-form-alert {
    display: flex;
    gap: 9px;
    align-items: center;
    margin-top: 22px;
    padding: 12px 14px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 750;
}

.apd-form-alert--success {
    background: #eaf8ef;
    color: #176b37;
}

.apd-form-alert--error {
    background: #fff0ed;
    color: #a3331d;
}

.apd-contact-aside {
    padding: clamp(28px, 4vw, 42px);
    background: #fff8f3;
}

.apd-contact-aside h2 {
    margin: 12px 0 26px;
    color: #202020;
    font-size: 30px;
}

.apd-contact-aside ol {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.apd-contact-aside li {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 14px;
    padding-bottom: 25px;
}

.apd-contact-aside li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 40px;
    bottom: 0;
    left: 19px;
    width: 1px;
    background: #e2d5cc;
}

.apd-contact-aside li > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid #ffc39d;
    border-radius: 50%;
    background: #fff;
    color: #d65000;
    font-weight: 900;
}

.apd-contact-aside li strong {
    display: block;
    margin: 2px 0 5px;
    color: #202020;
}

.apd-contact-aside li p {
    margin: 0;
    color: #756f6b;
    font-size: 13px;
    line-height: 1.55;
}

.apd-contact-aside__note {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 8px;
    padding: 18px;
    border-radius: 10px;
    background: #202020;
    color: #fff;
}

.apd-contact-aside__note > i {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 9px;
    background: #ff6000;
}

.apd-contact-aside__note div {
    display: grid;
    gap: 2px;
}

.apd-contact-aside__note small {
    color: rgba(255, 255, 255, .58);
}

.apd-contact-aside__note a {
    color: #fff;
    font-size: 17px;
    font-weight: 900;
    text-decoration: none;
}

.apd-prepare {
    margin-bottom: 76px;
}

.apd-prepare .apd-section-head--row > p {
    max-width: 420px;
    margin: 0;
    color: #756f6b;
    line-height: 1.65;
}

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

.apd-prepare__grid article {
    min-height: 220px;
    padding: 25px;
    border: 1px solid #e2d9d3;
    border-radius: 12px;
    background: #fff;
}

.apd-prepare__grid article > i {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 34px;
    place-items: center;
    border-radius: 10px;
    background: #fff1e8;
    color: #e65500;
    font-size: 19px;
}

.apd-prepare__grid h3 {
    margin: 0 0 8px;
    color: #202020;
    font-size: 18px;
}

.apd-prepare__grid p {
    margin: 0;
    color: #756f6b;
    font-size: 13px;
    line-height: 1.65;
}

.apd-contact-faq {
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
    gap: clamp(35px, 8vw, 100px);
    align-items: start;
    padding: clamp(30px, 5vw, 58px);
    border-radius: 18px;
    background: #fff;
}

.apd-contact-faq header h2 {
    margin: 14px 0 12px;
    color: #202020;
    font-size: clamp(28px, 3.3vw, 42px);
    line-height: 1.12;
}

.apd-contact-faq header p {
    margin: 0;
    color: #756f6b;
    line-height: 1.7;
}

.apd-contact-faq details {
    border-bottom: 1px solid #e2d9d3;
}

.apd-contact-faq details:first-child {
    border-top: 1px solid #e2d9d3;
}

.apd-contact-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 0;
    color: #202020;
    font-weight: 850;
    cursor: pointer;
    list-style: none;
}

.apd-contact-faq summary::-webkit-details-marker {
    display: none;
}

.apd-contact-faq summary i {
    color: #ff6000;
    transition: transform .2s ease;
}

.apd-contact-faq details[open] summary i {
    transform: rotate(45deg);
}

.apd-contact-faq details p {
    margin: -4px 0 20px;
    padding-right: 40px;
    color: #756f6b;
    line-height: 1.7;
}

@media (max-width: 1050px) {
    .apd-about-hero,
    .apd-contact-hero {
        grid-template-columns: 1fr;
    }

    .apd-about-gallery {
        min-height: 520px;
    }

    .apd-proof,
    .apd-process__grid,
    .apd-prepare__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .apd-proof article:nth-child(2) {
        border-right: 0;
    }

    .apd-proof article:nth-child(-n+2) {
        border-bottom: 1px solid #ebe3de;
    }

    .apd-quality {
        grid-template-columns: 1fr 1fr;
    }

    .apd-quality aside {
        grid-column: 1 / 3;
    }

    .apd-contact-workspace {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .apd-about,
    .apd-contact {
        padding-bottom: 44px;
    }

    .apd-about-hero,
    .apd-contact-hero {
        min-height: 0;
        padding: 28px 18px;
        border-radius: 12px;
    }

    .apd-about-hero h1,
    .apd-contact-hero h1 {
        font-size: clamp(34px, 10.5vw, 48px);
    }

    .apd-about-hero__copy > p,
    .apd-contact-hero__copy > p {
        font-size: 15px;
    }

    .apd-hero-actions,
    .apd-inquiry__submit {
        align-items: stretch;
        flex-direction: column;
    }

    .apd-button {
        width: 100%;
    }

    .apd-about-gallery {
        grid-template-columns: 1fr 1fr;
        min-height: 390px;
    }

    .apd-about-gallery__stamp {
        left: 50%;
        bottom: -18px;
        width: 132px;
        min-height: 88px;
        transform: translateX(-50%);
    }

    .apd-about-gallery__item:first-child > span {
        display: none;
    }

    .apd-proof {
        margin-top: 38px;
        margin-bottom: 52px;
    }

    .apd-proof article {
        padding: 20px 16px;
    }

    .apd-story,
    .apd-contact-faq {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .apd-story__intro {
        position: static;
    }

    .apd-principles article {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
    }

    .apd-process,
    .apd-contact-faq {
        padding: 30px 18px;
        border-radius: 12px;
    }

    .apd-process__grid,
    .apd-prepare__grid {
        grid-template-columns: 1fr;
    }

    .apd-process__grid article,
    .apd-prepare__grid article {
        min-height: 0;
    }

    .apd-process__grid article > i,
    .apd-prepare__grid article > i {
        margin-bottom: 22px;
    }

    .apd-section-head--row {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .apd-lines__grid {
        grid-template-columns: 1fr;
    }

    .apd-quality {
        grid-template-columns: 1fr;
        padding: 30px 20px;
        border-radius: 12px;
    }

    .apd-quality aside {
        grid-column: auto;
    }

    .apd-contact-hero__channels > a {
        grid-template-columns: 42px minmax(0, 1fr) auto;
    }

    .apd-contact-workspace {
        margin-bottom: 54px;
    }

    .apd-inquiry,
    .apd-contact-aside {
        padding: 26px 18px;
        border-radius: 12px;
    }

    .apd-field-row {
        grid-template-columns: 1fr;
    }

    .apd-prepare,
    .apd-story,
    .apd-process,
    .apd-lines {
        margin-bottom: 54px;
    }
}

@media (max-width: 440px) {
    .apd-proof {
        grid-template-columns: 1fr;
    }

    .apd-proof article,
    .apd-proof article:nth-child(2) {
        border-right: 0;
        border-bottom: 1px solid #ebe3de;
    }

    .apd-proof article:last-child {
        border-bottom: 0;
    }

    .apd-about-gallery {
        min-height: 340px;
    }

    .apd-about-gallery__item > span {
        font-size: 10px;
    }
}