
/* ============================================================
   BOJANGLES HOMEPAGE V4
   CANES-STYLE CARD + SIDEBAR SYSTEM
   ============================================================ */


/* ROOT */

body.home .site-content,
body.home .site-content > .ast-container,
body.home .site-content > .ast-container > .bjp4-home {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:block !important;
}

.bjp4-home {
    width:100%;
    background:#f7f8fa;
    color:#252a31;
}

.bjp4-wrap {
    width:min(1360px, calc(100% - 52px));
    margin:0 auto;
}

.bjp4-kicker {
    display:inline-block;
    margin-bottom:8px;
    color:#df1821;
    font-size:11px;
    font-weight:850;
    letter-spacing:.09em;
    text-transform:uppercase;
}


/* ============================================================
   HEADER - CANES PROPORTIONS
   ============================================================ */

body.home .bjp-site-header {
    width:100%;
    background:#fff;
    border-bottom:1px solid #eceef0;
    position:relative;
    z-index:9999;
}

body.home .bjp-site-header .bjp-global-shell.bjp-header-row {
    width:min(1320px, calc(100% - 48px));
    min-height:76px;
    margin:0 auto;
    padding:8px 0;

    display:grid;
    grid-template-columns:minmax(220px,auto) minmax(0,1fr);
    align-items:center;
    gap:30px;
}

body.home .bjp-site-brand {
    min-width:0;
    display:flex;
    align-items:center;
    line-height:0;
}

body.home .bjp-site-logo {
    width:auto;
    height:auto;
    max-width:220px;
    max-height:55px;
    display:block;
    object-fit:contain;
}

body.home .bjp-primary-nav {
    margin-left:auto;
}

body.home .bjp-primary-menu {
    margin:0 !important;
    padding:0 !important;

    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:2px;

    list-style:none;
}

body.home .bjp-primary-menu > li {
    margin:0;
    padding:0;
    list-style:none;
}

body.home .bjp-primary-menu > li > a {
    min-height:42px;
    padding:0 10px;

    display:flex;
    align-items:center;

    color:#20242a;
    background:transparent;

    border:0;
    border-radius:7px;

    font-size:14px;
    font-weight:650;
    line-height:1.25;

    white-space:nowrap;
    text-decoration:none;
}

body.home .bjp-primary-menu > li > a:hover,
body.home .bjp-primary-menu > li.current-menu-item > a {
    color:#df1821;
    background:#fff4f4;
}

body.home .bjp-menu-toggle {
    display:none;
}


/* ============================================================
   HERO CARD
   ============================================================ */

.bjp4-hero {
    padding:34px 0 26px;
    background:#f7f8fa;
}

.bjp4-hero-card {
    min-height:430px;
    padding:48px 52px;

    display:grid;
    grid-template-columns:minmax(0, 1.08fr) minmax(440px, .92fr);
    align-items:center;

    gap:58px;

    background:#ffffff;

    border:1px solid #e3e6e9;
    border-radius:13px;

    box-shadow:0 5px 20px rgba(20,25,32,.055);
}

.bjp4-hero-copy h1 {
    max-width:720px;
    margin:0 0 18px;

    color:#181c21;

    font-size:clamp(46px, 4.1vw, 62px);
    font-weight:850;
    line-height:1.03;
    letter-spacing:-.042em;
}

.bjp4-hero-copy > p {
    max-width:700px;
    margin:0 0 25px;

    color:#535b64;

    font-size:17px;
    line-height:1.78;
}

.bjp4-hero-meta {
    margin-bottom:22px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.bjp4-hero-meta > div {
    padding:12px 13px;

    background:#fafafa;
    border:1px solid #e7e9eb;
    border-radius:7px;
}

.bjp4-hero-meta strong {
    display:block;
    margin-bottom:3px;

    color:#242a30;
    font-size:12px;
}

.bjp4-hero-meta span {
    color:#717880;
    font-size:11px;
    line-height:1.35;
}

.bjp4-hero-actions {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:14px;
}

.bjp4-btn-primary {
    min-height:43px;
    padding:0 18px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    color:#fff !important;
    background:#df1821;

    border-radius:6px;

    font-size:13px;
    font-weight:800;
    text-decoration:none !important;
}

.bjp4-btn-primary:hover {
    background:#bd141b;
}

.bjp4-btn-link {
    color:#343a40 !important;
    font-size:13px;
    font-weight:700;
    text-decoration:none !important;
}

.bjp4-btn-link:hover {
    color:#df1821 !important;
}

.bjp4-hero-image img {
    width:100%;
    max-height:360px;

    display:block;

    object-fit:contain;

    border-radius:10px;
}


/* ============================================================
   MAIN + SIDEBAR
   ============================================================ */

.bjp4-layout {
    padding:8px 0 68px;

    display:grid;
    grid-template-columns:minmax(0, 1fr) 300px;
    align-items:start;

    gap:26px;
}

.bjp4-main {
    min-width:0;
}

.bjp4-sidebar {
    min-width:0;
    position:sticky;
    top:20px;
}


/* ============================================================
   MAIN WHITE CARDS
   ============================================================ */

.bjp4-card {
    margin-bottom:22px;
    padding:32px 34px;

    background:#ffffff;

    border:1px solid #e3e6e9;
    border-radius:10px;

    box-shadow:0 4px 15px rgba(20,25,32,.045);
}

.bjp4-card-head {
    margin-bottom:20px;
}

.bjp4-card-head h2,
.bjp4-card > h2,
.bjp4-editorial > h2 {
    margin:0 0 11px;

    color:#1d2228;

    font-size:28px;
    font-weight:820;
    line-height:1.22;
    letter-spacing:-.02em;
}

.bjp4-card-head p {
    max-width:850px;
    margin:0;

    color:#68717a;

    font-size:15px;
    line-height:1.7;
}

.bjp4-head-row {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
}

.bjp4-head-row > a {
    color:#d71820 !important;
    font-size:12px;
    font-weight:750;
}


/* CATEGORY CARDS */

.bjp4-category-grid {
    display:grid;
    grid-template-columns:repeat(5, minmax(0,1fr));
    gap:12px;
}

.bjp4-category-grid a {
    min-height:105px;
    padding:18px 12px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    color:#252a30 !important;
    background:#ffffff;

    border:1px solid #e2e5e8;
    border-radius:8px;

    text-align:center;
    text-decoration:none !important;
}

.bjp4-category-grid strong {
    margin-bottom:5px;

    font-size:14px;
    font-weight:800;
}

.bjp4-category-grid span {
    color:#737b83;

    font-size:12px;
    line-height:1.4;
}

.bjp4-category-grid a:hover {
    border-color:#e7b5b8;
    box-shadow:0 6px 16px rgba(20,25,32,.055);
}


/* ============================================================
   PRODUCT GRID
   ============================================================ */

.bjp4-products {
    display:grid;
    grid-template-columns:repeat(5, minmax(0,1fr));
    gap:13px;
}

.bjp4-product {
    min-width:0;
    overflow:hidden;

    background:#fff;

    border:1px solid #e2e5e8;
    border-radius:8px;
}

.bjp4-product-image {
    height:160px;
    padding:12px;

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

    background:#fafafa;

    border-bottom:1px solid #eceef0;
}

.bjp4-product-image img {
    width:100%;
    height:100%;
    max-width:100%;

    object-fit:contain;
}

.bjp4-product-body {
    padding:13px;
}

.bjp4-product-body h3 {
    min-height:42px;
    margin:0 0 9px;

    color:#282d33;

    font-size:13px;
    font-weight:740;
    line-height:1.42;
}

.bjp4-price {
    display:inline-block;

    padding:5px 8px;

    color:#16191d;
    background:#fedb00;

    border-radius:4px;

    font-size:12px;
    font-weight:850;
}


/* ============================================================
   EDITORIAL CONTENT
   ============================================================ */

.bjp4-editorial p,
.bjp4-copy p,
.bjp4-copy li {
    color:#474f58;

    font-size:16px;
    line-height:1.82;
}

.bjp4-editorial p,
.bjp4-copy p {
    margin:0 0 15px;
}

.bjp4-editorial h3 {
    margin:28px 0 10px;

    color:#252a30;

    font-size:21px;
    font-weight:800;
    line-height:1.3;
}

.bjp4-editorial a,
.bjp4-copy a {
    color:#d71820;
    font-weight:650;
}


/* ============================================================
   MENU GUIDE INNER SECTIONS
   ============================================================ */

.bjp4-guide-card {
    padding:28px;
}

.bjp4-menu-section {
    padding:34px 0;

    border-top:1px solid #eceef0;
}

.bjp4-menu-section:first-of-type {
    border-top:0;
}

.bjp4-menu-section > h2 {
    margin:0 0 15px;
    padding:0;

    color:#23282f;
    background:transparent;

    border:0;

    font-size:22px;
    font-weight:820;
    line-height:1.3;
}

.bjp4-menu-section .bjp4-products {
    display:grid;

    grid-template-columns:repeat(3, minmax(0,1fr));

    gap:14px;

    margin-top:20px;
}

.bjp4-menu-section .bjp4-product-image {
    height:185px;
    padding:14px;
}


/* ============================================================
   TABLES
   ============================================================ */

.bjp4-table {
    width:100%;
    margin-top:17px;
    overflow-x:auto;
}

.bjp4-table style {
    display:none !important;
}

.bjp4-table table {
    width:100% !important;
    min-width:560px;

    margin:0 !important;

    border-collapse:separate !important;
    border-spacing:0 !important;

    border:1px solid #dfe3e6 !important;
    border-radius:6px !important;

    overflow:hidden;
}

.bjp4-table th,
.bjp4-table td {
    padding:13px 15px !important;

    color:#343a40 !important;
    background:#ffffff !important;

    border:0 !important;
    border-bottom:1px solid #e7eaed !important;

    font-size:14px !important;
    line-height:1.5 !important;

    text-align:left !important;
}

.bjp4-table thead th,
.bjp4-table tr:first-child th,
.bjp4-table tr:first-child td {
    color:#fff !important;
    background:#a70f18 !important;
    font-weight:800 !important;
}

.bjp4-table tbody tr:nth-child(even) td {
    background:#f7f8f9 !important;
}


/* ============================================================
   DUAL CARDS
   ============================================================ */

.bjp4-dual-grid {
    margin-bottom:20px;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.bjp4-dual-grid .bjp4-card {
    margin-bottom:0;
}

.bjp4-small-btn {
    min-height:34px;
    padding:0 12px;

    display:inline-flex;
    align-items:center;

    color:#fff !important;
    background:#df1821;

    border-radius:5px;

    font-size:11px;
    font-weight:800;
    text-decoration:none !important;
}


/* ============================================================
   RESOURCE GRID
   ============================================================ */

.bjp4-resource-grid {
    margin-top:18px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
}

.bjp4-resource-grid a {
    padding:12px;

    color:#343a40 !important;
    background:#fafafa;

    border:1px solid #e5e8ea;
    border-radius:6px;

    font-size:11px;
    font-weight:700;
    text-decoration:none !important;
}

.bjp4-resource-grid a:hover {
    color:#df1821 !important;
    background:#fff;
}



#faq.bjp4-card > h2 {
    margin:0 0 20px;

    color:#1e2329;

    font-size:29px;
    font-weight:820;
    line-height:1.25;
}


/* ============================================================
   FAQ
   ============================================================ */

.bjp4-faq style {
    display:none !important;
}

.bjp4-faq details {
    margin:0 0 9px !important;

    overflow:hidden;

    background:#ffffff !important;

    border:1px solid #e1e4e7 !important;
    border-radius:7px !important;
}

.bjp4-faq details:first-child {
    border-radius:6px 6px 0 0 !important;
}

.bjp4-faq details:last-child {
    border-bottom:1px solid #e2e5e8 !important;
    border-radius:0 0 6px 6px !important;
}

.bjp4-faq summary {
    padding:17px 18px !important;

    color:#252a30 !important;
    background:#ffffff !important;

    font-size:15px !important;
    font-weight:750 !important;
    line-height:1.5 !important;

    cursor:pointer;
}

.bjp4-faq details[open] summary {
    color:#a70f18 !important;
    background:#fff8f8 !important;
}

.bjp4-faq details p {
    padding:1px 18px 18px !important;

    color:#525a63 !important;
    background:#ffffff !important;

    font-size:15px !important;
    line-height:1.8 !important;
}


/* ============================================================
   SIDEBAR
   ============================================================ */

.bjp4-side-card {
    margin-bottom:14px;
    padding:20px;

    background:#ffffff;

    border:1px solid #e3e6e9;
    border-radius:8px;

    box-shadow:0 3px 12px rgba(20,25,32,.045);
}

.bjp4-side-card > strong {
    display:block;
    margin-bottom:11px;

    color:#23282e;

    font-size:16px;
    font-weight:820;
    line-height:1.35;
}

.bjp4-side-label {
    display:block;
    margin-bottom:5px;

    color:#df1821;

    font-size:9px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.bjp4-side-card nav {
    display:flex;
    flex-direction:column;
}

.bjp4-side-card nav a {
    padding:10px 0;

    color:#4e555c !important;

    border-bottom:1px solid #eceef0;

    font-size:13px;
    font-weight:650;

    text-decoration:none !important;
}

.bjp4-side-card nav a:last-child {
    border-bottom:0;
}

.bjp4-side-card p {
    margin:0 0 11px;

    color:#606872;

    font-size:13px;
    line-height:1.72;
}

.bjp4-side-card > a {
    color:#d71820 !important;
    font-size:10.5px;
    font-weight:750;
}

.bjp4-side-red {
    color:#fff;
    background:#df1821;
    border-color:#df1821;
}

.bjp4-side-red .bjp4-side-label,
.bjp4-side-red > strong,
.bjp4-side-red p {
    color:#fff !important;
}


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

body.home .bjp-site-footer {
    background:#1d252e;
}

body.home .bjp-footer-main {
    width:min(1320px, calc(100% - 48px));
    margin:0 auto;
    padding:44px 0;

    display:grid;
    grid-template-columns:minmax(260px,1.3fr) repeat(3,minmax(140px,.6fr));
    gap:36px;
}

body.home .bjp-site-footer strong {
    color:#fff;
}

body.home .bjp-site-footer p {
    color:#c5ccd3;
    font-size:12px;
    line-height:1.7;
}

body.home .bjp-site-footer a {
    color:#d8dde2;
    text-decoration:none;
}

body.home .bjp-site-footer a:hover {
    color:#fff;
}


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

@media(max-width:1050px) {

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

    .bjp4-category-grid {
        grid-template-columns:repeat(3,1fr);
    }

    .bjp4-products {
        grid-template-columns:repeat(4,1fr);
    }

}


/* ============================================================
   MOBILE HEADER + LAYOUT
   ============================================================ */

@media(max-width:900px) {

    body.home .bjp-site-header .bjp-global-shell.bjp-header-row {
        width:calc(100% - 28px);
        max-width:none;
        min-height:70px;
        margin:0 auto;
        padding:8px 0;

        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:center;
        gap:10px;

        position:relative;
    }

    body.home .bjp-site-logo {
        width:min(195px,100%);
        max-width:100%;
        max-height:50px;
    }

    body.home .bjp-menu-toggle {
        width:58px;
        min-width:58px;
        height:38px;
        padding:0 8px;

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

        color:#fff;
        background:#df1821;

        border:0;
        border-radius:7px;

        font-size:12px;
        font-weight:800;
    }

    body.home .bjp-primary-nav {
        display:none;

        width:100%;

        position:absolute;
        top:100%;
        left:0;
        right:0;

        margin:0;
        padding:8px 14px 12px;

        background:#fff;

        border-top:1px solid #eceef0;
        border-bottom:1px solid #e4e6e8;

        box-shadow:0 12px 25px rgba(15,23,42,.10);

        z-index:99999;
    }

    body.home .bjp-primary-nav.is-open {
        display:block;
    }

    body.home .bjp-primary-menu {
        width:100%;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:0;
    }

    body.home .bjp-primary-menu > li {
        width:100%;
    }

    body.home .bjp-primary-menu > li > a {
        width:100%;
        min-height:44px;
        padding:11px 8px;

        color:#232931;
        background:#fff;

        border-bottom:1px solid #eee;
        border-radius:0;

        white-space:normal;
    }

    .bjp4-layout {
        grid-template-columns:1fr;
    }

    .bjp4-sidebar {
        position:static;

        display:grid;
        grid-template-columns:1fr 1fr;
        gap:12px;
    }

}


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

@media(max-width:767px) {

    .bjp4-wrap {
        width:calc(100% - 28px);
    }

    .bjp4-hero {
        padding:18px 0;
    }

    .bjp4-hero-card {
        min-height:0;
        padding:24px;

        grid-template-columns:1fr;
        gap:24px;
    }

    .bjp4-hero-copy h1 {
        font-size:37px;
    }

    .bjp4-hero-meta {
        grid-template-columns:1fr;
    }

    .bjp4-card,
    .bjp4-guide-card {
        padding:20px;
    }

    .bjp4-category-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .bjp4-products,
    .bjp4-menu-section .bjp4-products {
        grid-template-columns:repeat(2,1fr);
    }

    .bjp4-product-image,
    .bjp4-menu-section .bjp4-product-image {
        height:125px;
    }

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

    .bjp4-resource-grid {
        grid-template-columns:1fr 1fr;
    }

    .bjp4-sidebar {
        grid-template-columns:1fr;
    }

    body.home .bjp-footer-main {
        width:calc(100% - 28px);
        grid-template-columns:1fr 1fr;
    }

}


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

@media(max-width:420px) {

    body.home .bjp-site-logo {
        width:min(165px,100%);
        max-height:45px;
    }

    body.home .bjp-menu-toggle {
        width:54px;
        min-width:54px;
        height:36px;
        font-size:11px;
    }

    .bjp4-resource-grid {
        grid-template-columns:1fr;
    }

    body.home .bjp-footer-main {
        grid-template-columns:1fr;
    }

}



/* ============================================================
   V4 HERO FINAL BRAND POLISH
   ============================================================ */

.bjp4-hero-copy h1 {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:2px;
}

.bjp4-title-main {
    display:block;
    color:#181c21;
}

.bjp4-title-red {
    display:block;
    color:#d71920;
}

.bjp4-hero-image {
    display:flex;
    align-items:center;
    justify-content:center;

    background:#ffffff;

    border:0;
    box-shadow:none;

    overflow:hidden;
}

.bjp4-hero-image img {
    width:100%;
    height:auto;
    max-height:390px;

    display:block;

    object-fit:contain;

    background:transparent;

    border:0;
    border-radius:0;

    box-shadow:none;
    filter:none;
}

.bjp4-hero-card {
    position:relative;
    overflow:hidden;
}

.bjp4-hero-card::before {
    content:"";

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:4px;

    background:#d71920;
}

.bjp4-hero-meta > div {
    background:#fff;
    border-color:#e3e6e9;
}

.bjp4-btn-primary {
    box-shadow:
        0 7px 17px
        rgba(215,25,32,.18);
}

.bjp4-btn-primary:hover {
    transform:translateY(-1px);
}

.bjp4-category-grid a:hover,
.bjp4-product:hover {
    transform:translateY(-2px);

    box-shadow:
        0 8px 18px
        rgba(20,25,32,.07);
}

.bjp4-menu-section > h2::after {
    content:"";

    display:block;

    width:42px;
    height:3px;

    margin-top:7px;

    background:#d71920;

    border-radius:3px;
}

@media(max-width:767px) {

    .bjp4-hero-copy h1 {
        gap:0;
    }

    .bjp4-title-main,
    .bjp4-title-red {
        width:100%;
    }

    .bjp4-hero-image img {
        max-height:300px;
    }
}

/* ============================================================
   V4 FINAL HERO V4
   ============================================================ */


/* ============================================================
   HERO ROOT
   ============================================================ */

.bjp4-hero {
    width:100%;

    margin:0;

    padding:68px 0 70px;

    background:#fff9e8 !important;

    border-top:1px solid #f4ecd6;
    border-bottom:1px solid #ece3ca;
}


/*
 * Wide open shell like reference.
 */

.bjp4-hero .bjp4-wrap {
    width:min(1640px, calc(100% - 80px));

    max-width:none;

    margin:0 auto;
}


/* ============================================================
   HERO GRID
   ============================================================ */

.bjp4-hero-card {
    width:100%;
    min-height:510px;

    margin:0;
    padding:0;

    display:grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    align-items:center;

    gap:82px;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    overflow:visible !important;
}


.bjp4-hero-card::before,
.bjp4-hero-card::after {
    display:none !important;

    content:none !important;
}


/* ============================================================
   LEFT SIDE
   ============================================================ */

.bjp4-hero-copy {
    width:100%;

    max-width:760px;

    padding-left:4px;
}


.bjp4-hero-copy .bjp4-kicker {
    display:block;

    margin:0 0 22px;

    color:#df1821;

    font-size:13px;
    font-weight:850;

    line-height:1.2;

    letter-spacing:.12em;

    text-transform:uppercase;
}


/* H1 */

.bjp4-hero-copy h1 {
    max-width:760px;

    margin:0 0 30px !important;

    padding:0 !important;

    display:block !important;

    color:#171b20 !important;

    background:transparent !important;

    font-size:
        clamp(
            56px,
            4.15vw,
            72px
        ) !important;

    font-weight:850 !important;

    line-height:1.04 !important;

    letter-spacing:-.045em !important;
}


/*
 * Reference has one black heading.
 * Keep existing PHP spans but visually combine them.
 */

.bjp4-title-main,
.bjp4-title-red {
    display:inline !important;

    color:#171b20 !important;
}


.bjp4-title-main::after {
    content:" ";
}


/* DESCRIPTION */

.bjp4-hero-copy > p {
    max-width:745px;

    margin:0 0 30px !important;

    color:#505a63;

    font-size:18px !important;

    line-height:1.72 !important;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.bjp4-hero-actions {
    margin:0 0 28px;

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:13px;
}


.bjp4-btn-primary {
    min-height:52px;

    padding:0 25px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    color:#fff !important;

    background:#e71922 !important;

    border:1px solid #e71922 !important;
    border-radius:7px;

    box-shadow:none !important;

    font-size:15px;
    font-weight:800;

    line-height:1;

    text-decoration:none !important;

    transition:
        background .15s ease,
        border-color .15s ease;
}


.bjp4-btn-primary:hover {
    color:#fff !important;

    background:#c9151c !important;

    border-color:#c9151c !important;

    transform:none !important;
}


.bjp4-btn-link {
    min-height:52px;

    padding:0 24px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    color:#242a30 !important;

    background:#fff !important;

    border:1px solid #d8dde1 !important;
    border-radius:7px;

    box-shadow:none !important;

    font-size:15px;
    font-weight:750;

    line-height:1;

    text-decoration:none !important;
}


.bjp4-btn-link:hover {
    color:#d71920 !important;

    background:#fff !important;

    border-color:#d8adaf !important;
}


/* ============================================================
   TRUST LABELS
   ============================================================ */

.bjp4-hero-meta {
    margin:0;

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:12px 29px;
}


.bjp4-hero-meta > div {
    min-width:0;

    margin:0;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;
}


.bjp4-hero-meta strong {
    display:inline;

    margin:0;

    color:#4d5760;

    font-size:13px;

    font-weight:800;

    line-height:1.4;
}


.bjp4-hero-meta span {
    display:none !important;
}


/* ============================================================
   RIGHT IMAGE
   ============================================================ */

.bjp4-hero-image {
    width:100%;
    min-width:0;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#fff9e8 !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    overflow:visible !important;

    isolation:isolate;
}


/*
 * KEY FIX:
 *
 * Image itself contains white pixels.
 * multiply makes white pixels inherit the cream hero background
 * visually without editing the actual image.
 */

.bjp4-hero-image img {
    width:100%;

    max-width:760px;
    max-height:500px;

    height:auto;

    display:block;

    object-fit:contain;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    filter:none !important;

    mix-blend-mode:multiply;
}


/* ============================================================
   HEADER – REFERENCE SCALE
   ============================================================ */

body.home .bjp-site-header {
    width:100%;

    background:#fff !important;

    border-bottom:1px solid #eceef0;

    box-shadow:none;
}


body.home
.bjp-site-header
.bjp-global-shell.bjp-header-row {

    width:min(1640px, calc(100% - 80px));

    min-height:88px;

    margin:0 auto;

    padding:8px 0;

    display:grid;

    grid-template-columns:
        minmax(245px,auto)
        minmax(0,1fr);

    align-items:center;

    gap:38px;
}


body.home .bjp-site-logo {
    width:auto;
    height:auto;

    max-width:245px;
    max-height:65px;

    display:block;

    object-fit:contain;
}


body.home .bjp-primary-menu {
    gap:2px;
}


body.home .bjp-primary-menu > li > a {
    min-height:50px;

    padding:0 13px;

    display:flex;

    align-items:center;

    color:#20252b;

    font-size:15px;
    font-weight:700;

    line-height:1.25;

    border-radius:8px;

    white-space:nowrap;
}


body.home
.bjp-primary-menu
> li.current-menu-item
> a {

    color:#df1821;

    background:#fff4f4;
}


/* ============================================================
   LARGE DESKTOP
   ============================================================ */

@media(min-width:1700px) {

    .bjp4-hero .bjp4-wrap,
    body.home
    .bjp-site-header
    .bjp-global-shell.bjp-header-row {

        width:min(
            1700px,
            calc(100% - 100px)
        );
    }


    .bjp4-hero-card {
        grid-template-columns:
            minmax(0,.96fr)
            minmax(0,1.04fr);

        gap:96px;
    }


    .bjp4-hero-image img {
        max-width:800px;
        max-height:520px;
    }
}


/* ============================================================
   LAPTOP
   ============================================================ */

@media(max-width:1250px) {

    .bjp4-hero .bjp4-wrap {
        width:calc(100% - 50px);
    }


    .bjp4-hero-card {
        grid-template-columns:
            minmax(0,1fr)
            minmax(440px,.92fr);

        gap:48px;
    }


    .bjp4-hero-copy h1 {
        font-size:52px !important;
    }


    .bjp4-hero-copy > p {
        font-size:16px !important;
    }


    .bjp4-hero-image img {
        max-width:620px;
    }
}


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

@media(max-width:900px) {

    .bjp4-hero {
        padding:42px 0 46px;
    }


    .bjp4-hero .bjp4-wrap {
        width:calc(100% - 30px);
    }


    .bjp4-hero-card {
        min-height:0;

        grid-template-columns:1fr;

        gap:34px;
    }


    .bjp4-hero-copy {
        max-width:none;

        padding-left:0;
    }


    .bjp4-hero-copy h1 {
        max-width:none;

        font-size:
            clamp(
                40px,
                10vw,
                52px
            ) !important;

        margin-bottom:21px !important;
    }


    .bjp4-hero-copy > p {
        max-width:680px;

        margin-bottom:24px !important;
    }


    .bjp4-hero-image {
        justify-content:center;
    }


    .bjp4-hero-image img {
        width:100%;

        max-width:680px;
        max-height:none;
    }


    body.home
    .bjp-site-header
    .bjp-global-shell.bjp-header-row {

        width:calc(100% - 28px);

        min-height:70px;

        grid-template-columns:
            minmax(0,1fr)
            auto;

        gap:10px;
    }


    body.home .bjp-site-logo {
        max-width:190px;
        max-height:52px;
    }
}


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

@media(max-width:480px) {

    .bjp4-hero {
        padding:31px 0 36px;
    }


    .bjp4-hero-copy h1 {
        font-size:38px !important;
    }


    .bjp4-hero-actions {
        gap:10px;
    }


    .bjp4-btn-primary,
    .bjp4-btn-link {
        min-height:47px;

        padding:0 17px;

        font-size:14px;
    }


    .bjp4-hero-meta {
        flex-direction:column;

        align-items:flex-start;

        gap:7px;
    }
}

/* END V4 FINAL HERO V4 */



/* ============================================================
   HOMEPAGE HERO + CATEGORY FINAL POLISH V1
   ============================================================ */


/* ------------------------------------------------------------
   V3 HERO IMAGE
   Remove visible white rectangle.
   ------------------------------------------------------------ */

body.home .bjp3-hero {
    background:#fff9e8 !important;
}


body.home .bjp3-hero-image,
body.home .bjp3-hero-media,
body.home .bjp3-hero-visual {
    background:transparent !important;

    border:0 !important;

    box-shadow:none !important;
}


body.home .bjp3-hero img {
    background:transparent !important;

    box-shadow:none !important;

    filter:none !important;
}


/*
 * Uploaded/old hero artwork contains white pixels.
 * Multiply visually blends those whites into cream.
 */

body.home .bjp3-hero-image img,
body.home .bjp3-hero-media img,
body.home .bjp3-hero-visual img {
    mix-blend-mode:multiply;

    border:0 !important;

    box-shadow:none !important;
}


/* ------------------------------------------------------------
   HERO TITLE CONTRAST
   ------------------------------------------------------------ */

body.home .bjp3-hero h1 {
    color:#171b20 !important;

    line-height:1.04 !important;

    letter-spacing:-.04em !important;
}


.bjp-hero-title-black {
    display:block;

    color:#171b20 !important;
}


.bjp-hero-title-red {
    display:block;

    color:#d71920 !important;
}


/* ------------------------------------------------------------
   HEADER LOGO / POSITION
   ------------------------------------------------------------ */

body.home .bjp-site-header
.bjp-global-shell.bjp-header-row {

    width:min(
        1420px,
        calc(100% - 56px)
    ) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    grid-template-columns:
        225px
        minmax(0,1fr) !important;

    gap:34px !important;
}


body.home .bjp-site-brand {
    width:225px;

    display:flex;

    align-items:center;

    justify-content:flex-start;
}


body.home .bjp-site-logo {
    width:auto !important;
    height:auto !important;

    max-width:205px !important;
    max-height:58px !important;

    margin:0 !important;

    object-fit:contain;
}


/* ------------------------------------------------------------
   CATEGORY SECTION
   5 cards only - FAQ removed from UI.
   ------------------------------------------------------------ */

body.home .bjp4-category-grid {
    margin-top:20px;

    display:grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0,1fr)
        );

    gap:13px;
}


body.home .bjp4-category-card {
    min-width:0;
    min-height:155px;

    padding:13px 12px 14px;

    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:flex-start;

    color:#252a30 !important;

    background:#fff !important;

    border:1px solid #e3e6e9 !important;

    border-radius:9px !important;

    box-shadow:
        0 3px 11px
        rgba(20,25,32,.035);

    text-align:center;

    text-decoration:none !important;

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


body.home .bjp4-category-card:hover {
    transform:translateY(-3px);

    border-color:#e7bec0 !important;

    box-shadow:
        0 8px 20px
        rgba(20,25,32,.07);
}


/* IMAGE AREA */

body.home .bjp4-category-image {
    width:100%;
    height:82px;

    margin-bottom:10px;

    padding:5px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#fafafa;

    border-radius:6px;

    overflow:hidden;
}


body.home .bjp4-category-image img {
    width:100%;
    height:100%;

    max-width:115px;

    display:block;

    object-fit:contain;

    background:transparent !important;

    border:0 !important;

    box-shadow:none !important;

    transition:
        transform .18s ease;
}


body.home
.bjp4-category-card:hover
.bjp4-category-image img {

    transform:scale(1.05);
}


/* CATEGORY TITLE */

body.home .bjp4-category-card strong {
    display:block;

    margin:0 0 4px;

    color:#22272d;

    font-size:13.5px;

    font-weight:800;

    line-height:1.35;
}


/* CATEGORY DESCRIPTION */

body.home .bjp4-category-desc {
    display:block;

    color:#747c84 !important;

    font-size:11px;

    font-weight:500;

    line-height:1.4;
}


/* ------------------------------------------------------------
   TABLET
   ------------------------------------------------------------ */

@media(max-width:1050px) {

    body.home .bjp4-category-grid {
        grid-template-columns:
            repeat(3,1fr);
    }

}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media(max-width:767px) {

    body.home .bjp-site-header
    .bjp-global-shell.bjp-header-row {

        width:calc(100% - 28px) !important;

        grid-template-columns:
            minmax(0,1fr)
            auto !important;

        gap:10px !important;
    }


    body.home .bjp-site-brand {
        width:auto;
    }


    body.home .bjp-site-logo {
        max-width:175px !important;
        max-height:48px !important;
    }


    body.home .bjp4-category-grid {
        grid-template-columns:
            repeat(2,1fr);

        gap:10px;
    }


    body.home .bjp4-category-card {
        min-height:145px;

        padding:11px 9px 12px;
    }


    body.home .bjp4-category-image {
        height:76px;
    }

}


/* ------------------------------------------------------------
   SMALL PHONE
   ------------------------------------------------------------ */

@media(max-width:390px) {

    body.home .bjp4-category-grid {
        grid-template-columns:1fr 1fr;
    }


    body.home .bjp4-category-image {
        height:70px;
    }

}

/* END HOMEPAGE HERO + CATEGORY FINAL POLISH V1 */
