/*
* Home 2026 template - header and footer ("BrightHire Homepage v3" handoff)
* Header: the site header (header-new.php, Max Mega Menu) restyled - 88px bar, logo 200 wide, nav beside the
* logo in light grey, Sign In + white Get a Demo button; once scrolled it turns white, with a purple Get a Demo.
* Since 2026-10-28 on every page with the site navigation (body.bhh-nav-2026, see brighthire_has_2026_nav());
* the older templates (header.php) show it white from the top. Footer: footer-home.php, white, five columns.
* Loaded on every page, since the footer is site-wide (see brighthire_home_blocks_styles()); the rest outside the
* header and footer is scoped to .page-template-home-2026.
*/

/* ---------- Header ----------
 * The horizontal bar is used from 769px up: Max Mega Menu only collapses the menu into the burger at 768px
 * (its breakpoint setting), so tablets get the bar too (compact sizes below 1100px). */
@media (min-width: 769px) {
    .bhh-nav-2026 header.navbar.home-header {
        min-height: 88px;
    }
    /* On wide screens the bar's content stays in the centred 1440px page column, in line with the sections below */
    .bhh-nav-2026 header.navbar.home-header .header-inner {
        box-sizing: border-box;
        width: 100%;
        max-width: 1440px;
        min-height: 88px;
        margin-left: auto;
        margin-right: auto;
        padding: 0 64px;
        justify-content: flex-start;
    }
    /* The theme caps the brand box at its old logo width */
    .bhh-nav-2026 header.navbar.home-header .navbar-brand {
        flex-shrink: 0;
        width: auto;
        max-width: none;
        padding: 0;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-brand img {
        width: 200px;
        max-width: none;
        height: auto;
        max-height: 56px;
    }
    .bhh-nav-2026 header.navbar.home-header.sticky-header .navbar-brand img {
        width: 172px;
    }
    /* Nav sits 56px after the logo, items 32px apart */
    .bhh-nav-2026 header.navbar.home-header .navbar-collapse {
        flex-grow: 1;
        margin-left: 56px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu {
        display: flex !important;
        justify-content: flex-start;
        gap: 32px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item {
        margin: 0;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link {
        padding: 0 18px 0 0;
        font-family: "BrightHire Home DM Sans", "DM Sans", sans-serif;
        font-size: 15px;
        font-weight: 400;
        line-height: 24px;
        letter-spacing: 0;
        /* the theme sets white with !important */
        color: #D4D7E3 !important;
    }
    /* the 18px is room for the dropdown arrow: without one (Pricing) the sticky header's hover line would run past the text */
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item:not(.mega-menu-item-has-children) > a.mega-menu-link {
        padding-right: 0;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link:hover,
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item.mega-toggle-on > a.mega-menu-link {
        color: #FFFFFF !important;
    }
    .bhh-nav-2026 header.navbar.home-header.sticky-header #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link {
        color: #283560 !important;
    }
    .bhh-nav-2026 header.navbar.home-header.sticky-header #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link:hover {
        color: #472EE7 !important;
    }
    /* The page you are on (e.g. Pricing): teal on the dark hero, purple on the white bar */
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
        color: #28E7C5 !important;
    }
    .bhh-nav-2026 header.navbar.home-header.sticky-header #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
        color: #472EE7 !important;
    }

    /* Sign In + Get a Demo */
    .bhh-nav-2026 .home-right-menu {
        margin-left: auto;
        flex-shrink: 0;
    }
    .bhh-nav-2026 .bhh-header-actions {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .bhh-nav-2026 .bhh-header-actions li {
        margin: 0;
        padding: 0;
    }
    .bhh-nav-2026 .bhh-header-actions li a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        padding: 10px 16px;
        border-radius: 8px;
        font-family: "BrightHire Home DM Sans", "DM Sans", sans-serif;
        font-size: 15px;
        font-weight: 400;
        line-height: 24px;
        text-decoration: none;
        color: #FFFFFF;
        transition: background-color 0.2s ease, color 0.2s ease;
    }
    .bhh-nav-2026 .bhh-header-actions li a:hover {
        color: #00FEE7;
    }
    .bhh-nav-2026 .bhh-header-actions li.bhh-header-demo a {
        padding: 10px 20px;
        background: #FFFFFF;
        font-weight: 600;
        color: #161616;
    }
    .bhh-nav-2026 .bhh-header-actions li.bhh-header-demo a:hover {
        background: #E2E9FF;
        color: #161616;
    }
    .bhh-nav-2026 .bhh-header-actions li a:focus-visible {
        outline: 2px solid #00FEE7 !important;
        outline-offset: 2px;
    }
    /* Scrolled: white bar */
    .bhh-nav-2026 header.sticky-header .bhh-header-actions li a {
        color: #161616;
    }
    .bhh-nav-2026 header.sticky-header .bhh-header-actions li a:hover {
        color: #472EE7;
    }
    .bhh-nav-2026 header.sticky-header .bhh-header-actions li.bhh-header-demo a {
        background: #472EE7;
        color: #FFFFFF;
    }
    .bhh-nav-2026 header.sticky-header .bhh-header-actions li.bhh-header-demo a:hover {
        background: #3A28B1;
        color: #FFFFFF;
    }
    .bhh-nav-2026 header.sticky-header .bhh-header-actions li a:focus-visible {
        outline-color: #472EE7 !important;
    }
}
/* Careers with its notice bar open: the header is in the flow there, and the hero was pulled up under a 72px bar */
@media (min-width: 769px) {
    .careers-page.top-bar-show.bhh-nav-2026 .career-banner-block {
        margin-top: -113px;
    }
}
/* Between 1100 and 1200 the full bar needs a little less room */
@media (min-width: 1100px) and (max-width: 1199px) {
    .bhh-nav-2026 header.navbar.home-header .header-inner {
        padding: 0 32px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-collapse {
        margin-left: 32px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu {
        gap: 20px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-brand img,
    .bhh-nav-2026 header.navbar.home-header.sticky-header .navbar-brand img {
        width: 160px;
    }
}
/* Tablets (769-1099): smaller logo, type and gaps so menu and buttons fit on one line */
@media (min-width: 769px) and (max-width: 1099px) {
    .bhh-nav-2026 header.navbar.home-header .header-inner {
        padding: 0 20px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-brand img,
    .bhh-nav-2026 header.navbar.home-header.sticky-header .navbar-brand img {
        width: 128px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-collapse {
        margin-left: 18px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu {
        gap: 12px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link {
        padding-right: 16px;
        font-size: 14px;
    }
    .bhh-nav-2026 .bhh-header-actions {
        gap: 2px;
    }
    .bhh-nav-2026 .bhh-header-actions li a {
        min-height: 40px;
        padding: 8px 10px;
        font-size: 14px;
        white-space: nowrap;
    }
    .bhh-nav-2026 .bhh-header-actions li.bhh-header-demo a {
        padding: 8px 14px;
    }
}
/* Narrowest tablets (769-849): a little tighter still, or Get a Demo runs off the edge */
@media (min-width: 769px) and (max-width: 849px) {
    .bhh-nav-2026 header.navbar.home-header .header-inner {
        padding: 0 16px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-brand img,
    .bhh-nav-2026 header.navbar.home-header.sticky-header .navbar-brand img {
        width: 112px;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-collapse {
        margin-left: 12px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu {
        gap: 8px;
    }
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-menu-item > a.mega-menu-link {
        padding-right: 15px;
        font-size: 13.5px;
    }
}
/* Mobile design: 64px bar, logo 136 wide, menu button on the right */
@media (max-width: 768px) {
    .bhh-nav-2026 header.navbar.home-header .navbar-brand {
        width: auto;
        max-width: none;
        padding: 10px 0;
    }
    .bhh-nav-2026 header.navbar.home-header .navbar-brand img,
    .bhh-nav-2026 header.navbar.home-header .navbar-collapse .mobile-collapse img {
        width: 136px;
        max-width: none;
        height: auto;
    }
    /* Open menu: the demo button in the design's purple */
    .bhh-nav-2026 header.navbar #mega-menu-wrap-new-header-menu #mega-menu-new-header-menu > li.mega-request-btn > a.mega-menu-link {
        border-radius: 8px;
        background: #472EE7 !important;
        box-shadow: none;
        font-family: "BrightHire Home DM Sans", "DM Sans", sans-serif;
        font-weight: 600;
        color: #FFFFFF !important;
    }
}

/* ---------- Footer ---------- */
.bhh-footer {
    background: #FFFFFF;
    font-size: 14px;
    line-height: 1.4;
}
.bhh-footer__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 96px 120px 56px;
    display: flex;
    flex-direction: column;
    gap: 64px;
}
.bhh-footer__grid {
    display: grid;
    /* first column at least 356px, so the newsletter card's email field has room for long addresses */
    /*
     * Link columns as wide as their links (up to 150px, longer ones wrap) and spread out, so the last
     * column ends on the right edge of the bottom bar, as in the design
     */
    grid-template-columns: minmax(356px, 380px) repeat(5, minmax(min-content, max-content));
    justify-content: space-between;
    column-gap: 32px;
    row-gap: 40px;
}
.bhh-footer__grid > .bhh-footer__col {
    max-width: 150px;
}
.bhh-footer__brand {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}
.bhh-footer .bhh-footer__logo {
    display: inline-flex;
    align-self: flex-start;
}
.bhh-footer .bhh-footer__logo img {
    width: 200px;
    height: auto;
}
.bhh-footer .bhh-footer__title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    color: #161616;
}
.bhh-footer__col {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}
.bhh-footer .bhh-footer__links,
.bhh-footer .bhh-footer__legal-links,
.bhh-footer .bhh-footer__social {
    margin: 0;
    padding: 0;
    list-style: none;
}
.bhh-footer .bhh-footer__links {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.bhh-footer .bhh-footer__links li,
.bhh-footer .bhh-footer__legal-links li,
.bhh-footer .bhh-footer__social li {
    margin: 0;
    padding: 0;
}
.bhh-footer .bhh-footer__links a,
.bhh-footer .bhh-footer__legal-links a {
    font-size: 14px;
    line-height: 1.4;
    text-decoration: none;
    color: var(--bhh-muted);
}
.bhh-footer .bhh-footer__links a:hover,
.bhh-footer .bhh-footer__legal-links a:hover,
.bhh-footer .bhh-footer__social a:hover {
    color: var(--bhh-purple);
}
.bhh-footer a:focus-visible {
    outline: 2px solid var(--bhh-purple) !important;
    outline-offset: 2px;
    border-radius: 2px;
}
.bhh-footer__bottom {
    padding-top: 24px;
    border-top: 1px solid var(--bhh-line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px 32px;
    font-size: 13px;
    color: var(--bhh-muted);
}
.bhh-footer .bhh-footer__copy {
    font-size: 13px;
    color: var(--bhh-muted);
}
.bhh-footer__legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 32px;
}
.bhh-footer .bhh-footer__legal-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 32px;
}
.bhh-footer .bhh-footer__legal-links a {
    font-size: 13px;
}
.bhh-footer .bhh-footer__social {
    display: flex;
    gap: 12px;
}
.bhh-footer .bhh-footer__social a {
    display: inline-flex;
    color: var(--bhh-muted);
}
.bhh-footer .bhh-footer__social svg {
    width: 18px;
    height: 18px;
}
.bhh-footer .bhh-footer__social svg path {
    fill: currentColor;
}

/*
 * Newsletter form (HubSpot embed): the email field uses the column's full width and the button sits under it,
 * so long addresses stay readable (beside the button the field was ~246px and cut them off).
 */
.bhh-footer .bhh-footer__form form {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin: 0;
}
/* HubSpot wraps the field in a <fieldset>, which is the actual row item */
.bhh-footer .bhh-footer__form form fieldset,
.bhh-footer .bhh-footer__form form .hs-form-field {
    flex: none;
    width: 100%;
    min-width: 0;
    max-width: none !important;
    margin: 0;
    padding: 0;
    border: 0;
}
.bhh-footer .bhh-footer__form form fieldset .hs-form-field {
    width: 100% !important;
    float: none !important;
}
.bhh-footer .bhh-footer__form form .hs-form-field > label,
.bhh-footer .bhh-footer__form form .hs_error_rollup,
.bhh-footer .bhh-footer__form form legend {
    display: none;
}
.bhh-footer .bhh-footer__form form .input {
    margin: 0 !important;
    box-shadow: none !important;
}
.bhh-footer .bhh-footer__form form input[type="email"] {
    width: 100% !important;
    height: 44px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid #D4D7E3 !important;
    border-radius: 999px !important;
    background: #FFFFFF;
    box-shadow: none;
    font-family: var(--bhh-font);
    font-size: 14px;
    color: #161616;
}
.bhh-footer .bhh-footer__form form input[type="email"]:focus {
    border-color: var(--bhh-purple) !important;
    box-shadow: 0 0 0 3px rgba(71, 46, 231, 0.15);
}
.bhh-footer .bhh-footer__form form input[type="email"]::placeholder {
    color: #7D88AB;
}
.bhh-footer .bhh-footer__form form .hs_submit,
.bhh-footer .bhh-footer__form form .actions {
    flex: none;
    width: 100%;
    margin: 0;
    padding: 0;
}
.bhh-footer .bhh-footer__form form input[type="submit"] {
    /* the theme pins HubSpot buttons inside the field (absolute, top right), covering the end of the address */
    position: static;
    display: block;
    /* full width under the field, as in the site's previous footer */
    width: 100% !important;
    height: 44px;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0;
    border-radius: 999px !important;
    background: linear-gradient(99deg, #472EE7 0%, #5B3BF0 55%, #7A4DFF 100%);
    box-shadow: 0 6px 16px -6px rgba(71, 46, 231, 0.55);
    font-family: var(--bhh-font);
    font-size: 15px !important;
    line-height: 44px !important;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: #FFFFFF;
    cursor: pointer;
}
.bhh-footer .bhh-footer__form form input[type="submit"]:hover,
.bhh-footer .bhh-footer__form form input[type="submit"]:focus-visible {
    background: var(--bhh-purple-dark);
}
.bhh-footer .bhh-footer__form form ul.hs-error-msgs {
    margin: 6px 0 0 18px;
    padding: 0;
    list-style: none;
    font-size: 12px;
    color: #D4580F;
}
.bhh-footer .bhh-footer__form .submitted-message {
    font-size: 14px;
    color: var(--bhh-muted);
}

@media (max-width: 1279px) {
    .bhh-footer__inner {
        padding: 80px 64px 48px;
    }
    .bhh-footer__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: stretch;
    }
    .bhh-footer__grid > .bhh-footer__col {
        max-width: none;
    }
    .bhh-footer__brand {
        grid-column: 1 / -1;
    }
}
/* Mobile design: logo + newsletter, then the columns two across, legal links stacked */
@media (max-width: 767px) {
    .bhh-footer__inner {
        padding: 44px 20px 36px;
        gap: 28px;
    }
    .bhh-footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 28px 20px;
    }
    .bhh-footer__brand {
        gap: 14px;
    }
    .bhh-footer .bhh-footer__logo img {
        width: 150px;
    }
    .bhh-footer__newsletter {
        max-width: none;
    }
    .bhh-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding-top: 18px;
    }
    .bhh-footer__legal {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .bhh-footer .bhh-footer__legal-links {
        gap: 8px 20px;
    }
}

/* ---------- Footer "Copyright bar only" (pricing page) ----------
 * The design's inner footer: white logo (32px high) and the copyright line on navy, 40px above and below;
 * stacked on phones. */
.bhh-footer-bar {
    border-top: 1px solid rgba(248, 249, 251, 0.12);
    background: #081528;
}
.bhh-footer-bar__inner {
    max-width: calc(1200px + 96px);
    margin: 0 auto;
    padding: 40px 48px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.bhh-footer-bar .bhh-footer-bar__logo {
    display: block;
    color: #F8F9FB;
}
.bhh-footer-bar .bhh-footer-bar__logo img {
    display: block;
    width: auto;
    height: 32px;
}
.bhh-footer-bar .bhh-footer-bar__copy {
    margin: 0;
    font-size: 14px;
    line-height: normal;
    color: #D6D8EA;
}
.bhh-footer-bar .bhh-footer-bar__logo:focus-visible {
    outline: 2px solid #28E7C5;
    outline-offset: 4px;
}
@media (max-width: 1279px) {
    .bhh-footer-bar__inner {
        padding-left: 40px;
        padding-right: 40px;
    }
}
@media (max-width: 767px) {
    .bhh-footer-bar__inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 32px 20px;
    }
}

/* ---------- "Trusted by" logo marquee on this template, phones (mobile design: 14px muted title, 20px logos) ---------- */
@media (max-width: 767px) {
    .page-template-home-2026 .logo-marquee-block {
        padding: 28px 0 24px;
    }
    .page-template-home-2026 .logo-marquee-block .logo-marquee-block__title {
        margin-bottom: 4px;
        font-family: "BrightHire Home DM Sans", "DM Sans", sans-serif;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.4;
        letter-spacing: 0;
        color: #4C5985;
    }
    .page-template-home-2026 .logo-marquee-block .logo-marquee-block__logo {
        padding: 10px 18px;
    }
    .page-template-home-2026 .logo-marquee-block .logo-marquee-block__mark {
        height: 20px;
    }
}

/*
 * Newsletter: a card under the logo, laid out like the site's previous footer (centred title, pill field,
 * full-width pill button) in the 2026 colours: lavender panel, purple button.
 */
.bhh-footer__newsletter {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-width: 356px;
    margin-top: 4px;
    padding: 22px 16px 18px;
    border: 1px solid #DCE3F7;
    border-radius: 18px;
    background: linear-gradient(180deg, #F0F5FD 0%, #E7ECFA 100%);
}
.bhh-footer .bhh-footer__newsletter-title {
    font-family: var(--bhh-font-head);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    text-align: center;
    color: var(--bhh-ink);
}
.bhh-footer .bhh-footer__form form .submitted-message,
.bhh-footer .bhh-footer__form .submitted-message {
    text-align: center;
}

/* Badges (AICPA SOC, Workday): under the newsletter, at the foot of the column; 72px wide as in the previous footer */
.bhh-footer__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
    margin-top: auto;
    padding-top: 20px;
}
.bhh-footer .bhh-footer__badges img {
    width: 72px;
    height: auto;
}
@media (max-width: 1279px) {
    .bhh-footer__badges {
        padding-top: 4px;
    }
}
@media (max-width: 767px) {
    .bhh-footer__badges {
        gap: 16px;
    }
    .bhh-footer .bhh-footer__badges img {
        width: 64px;
    }
}
@media (max-width: 1279px) {
    .bhh-footer__newsletter {
        max-width: 400px;
    }
}
@media (max-width: 767px) {
    .bhh-footer__newsletter {
        max-width: none;
        margin-top: 6px;
        padding: 20px 16px 16px;
    }
}


/* ---------- Wide screens (homepage) ----------
 * The design is 1440 wide; from a 1600px window the page grows by half of the extra width, up to 1680px
 * (a 1920 window gives a 1600px page). Backgrounds already run edge to edge; the content column, the hero
 * and the nav widen with it, and the hero and nav get 80px sides. Only the front page, as in the handoff. */
@media (min-width: 1600px) {
    .home {
        --bhh-page: min(1680px, calc(1440px + (100vw - 1600px) / 2));
    }
    .home .bhh .bhh-container {
        max-width: var(--bhh-page);
    }
    .home .bhh-hero__inner {
        max-width: var(--bhh-page);
        padding-left: 80px;
        padding-right: 80px;
    }
    .home.page-template-home-2026 header.navbar.home-header .header-inner {
        max-width: var(--bhh-page);
        padding: 0 80px;
    }
    .home .bhh-footer__inner {
        max-width: var(--bhh-page);
    }
}

/* ---------- One header and footer column on every page ----------
 * The nav and the footer share the 1520px column with 5vw (20-64px) sides on every page, old templates
 * included, so the logo and the footer columns start on one line site-wide. Wide pages (body.bhh-wide) put
 * their sections on the same column. */
@media (min-width: 769px) {
    .page-template-home-2026 header.navbar.home-header .header-inner,
    .home.page-template-home-2026 header.navbar.home-header .header-inner,
    body:not(.page-template-home-2026) header.navbar:not(.resquestdemo-header) .header-inner {
        box-sizing: border-box;
        width: 100%;
        max-width: 1520px;
        margin-left: auto;
        margin-right: auto;
        padding-left: clamp(20px, 5vw, 64px);
        padding-right: clamp(20px, 5vw, 64px);
    }
}
@media (min-width: 768px) {
    .bhh-footer .bhh-footer__inner {
        max-width: 1520px;
        padding-left: clamp(20px, 5vw, 64px);
        padding-right: clamp(20px, 5vw, 64px);
    }
}

/* Page Width "Wide" on the 2026 homepage blocks too, so every section of a wide page starts on the header's
   line (same 1520px column and 5vw sides). Comes after the front page's 1600px+ rules above, which it replaces. */
.bhh-wide .bhh-hero__inner,
.bhh-wide .bhh-platform__inner,
.bhh-wide .bhh-fraud .bhh-container,
.bhh-wide .bhh-integrations .bhh-container,
.bhh-wide .bhh-quotes .bhh-container,
.bhh-wide .bhh-enterprise .bhh-container,
.bhh-wide .bhh .bhh-spotlight__inner,
.bhh-wide .bhh-cta .bhh-container {
    max-width: 1520px;
    padding-left: clamp(20px, 5vw, 64px);
    padding-right: clamp(20px, 5vw, 64px);
}