html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-family: 'Hitachi Sans';
}

a {
    text-decoration: none;
}

/* Video Modal */
#videoModal.videomodal .modal-dialog {
    width: calc(100% - 30px);
    max-width: 1000px;
    margin: 1.75rem auto;
}

#videoModal.videomodal .modal-content {
    position: relative;
    background: #000;
    border: 0;
    border-radius: 0;
    overflow: hidden;
}

/* Modal Header */
#videoModal.videomodal .modal-header {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    width: auto;
    padding: 0;
    border: 0;
}

/* Close Button */
#videoModal.videomodal .modal-header .close {
    position: relative;
    width: 40px;
    height: 40px;
    margin: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    font-size: 30px;
    font-weight: 300;
    line-height: 36px;
    text-align: center;
    cursor: pointer;
    opacity: 1;
    z-index: 20;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}

#videoModal.videomodal .modal-header .close:hover {
    background: rgba(0, 0, 0, 0.9);
    opacity: 0.8;
}

#videoModal.videomodal .modal-header .close:focus {
    outline: none;
    box-shadow: none;
}

/* Modal Body */
#videoModal.videomodal .modal-body {
    padding: 0;
    background: #000;
}

/* Video Container */
#videoModal.videomodal .embed-container {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: 0;
    background: #000;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

/* * JavaScript adds .visible when a video is loaded. */
#videoModal.videomodal .embed-container.visible {
    opacity: 1;
    visibility: visible;
}

/* Iframes */
#videoModal.videomodal .embed-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    display: none;
}

/* Backdrop */
#videoModal.videomodal+.modal-backdrop {
    opacity: 0.8;
}

/* Mobile */
@media (max-width: 767px) {
    #videoModal.videomodal .modal-dialog {
        width: calc(100% - 20px);
        max-width: none;
        margin: 1rem auto;
    }

    #videoModal.videomodal .modal-header .close {
        width: 34px;
        height: 34px;
        margin: 8px;
        font-size: 26px;
        line-height: 30px;
    }
}

/* Very Small Screens */
@media (max-width: 480px) {
    #videoModal.videomodal .modal-dialog {
        width: calc(100% - 10px);
    }

    #videoModal.videomodal .modal-header .close {
        width: 32px;
        height: 32px;
        margin: 6px;
        font-size: 24px;
        line-height: 28px;
    }
}

/* Single Leader page More Leaders carousel start */
.hd-leader-more__slider {
    display: block;
    margin-top: 40px;
}

.hd-leader-more__slider .slick-list {
    margin: 0 -12px;
}

.hd-leader-more__slider .slick-slide {
    box-sizing: border-box;
    padding: 0 12px;
    height: auto;
}

.hd-leader-more__slider .slick-slide>div {
    height: 100%;
}

.hd-leader-more__slider .hd-person {
    height: 100%;
    box-sizing: border-box;
}

/* Keep navigation buttons clickable */
.hd-leader-more__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.hd-leader-more .hd-round-btn {
    cursor: pointer;
}

/* Disabled arrow state */
.hd-leader-more .hd-round-btn.slick-disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Optional: prevent horizontal overflow */
.hd-leader-more {
    min-width: 0;
}

.hd-leader-more__slider .slick-list {
    overflow: hidden;
}

/* Single Leader page More Leaders carousel end */

.btn-hd-outline,
.btn-hd-outline:visited {
    --bs-btn-hover-bg: var(--hd-ink) !important;
    --bs-btn-hover-border-color: var(--hd-ink) !important
}

/* ======================404 page style start======================== */
.hd-404 {
    display: flex;
    align-items: center;
    min-height: 30vh;
    /* padding: clamp(64px, 10vw, 140px) 0; */
}

.hd-404>.container-hd {
    width: 100%;
}

.hd-404__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 24px;
    align-items: center;
}

.hd-404__title {
    margin: 0;
    font-size: clamp(3.5rem, 8vw, 5rem);
    font-weight: 700;
    line-height: 1;
    color: inherit;
}

.hd-404__text {
    max-width: 36rem;
    margin: 0 0 24px;
    font-size: 1.25rem;
    line-height: 1.7;
    color: #4a4a4a;
}

@media (max-width: 767px) {
    .hd-404 {
        min-height: 0;
        padding: 56px 0 72px;
    }

    .hd-404__grid {
        grid-template-columns: 1fr;
    }
}

/* ======================404 page style END======================== */

/*=================== Contact page marketo form start===================== */

/* .hd-form__card form.mktoForm {
    container-type: inline-size;
    display: flex !important;
    flex-wrap: wrap;
    column-gap: 16px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 32px 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    font-family: inherit !important;
    font-size: 1rem !important;
    color: var(--hdf-ink) !important;

    --hdf-red: #cc0000;
    --hdf-black: #000000;
    --hdf-ink: #1e1e1e;
    --hdf-muted: #5a5a5a;
    --hdf-border: #cfcfcf;
    --hdf-radius: 4px;
}

.hd-form__card form.mktoForm>.mktoFormRow {
    flex: 0 0 100%;
    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
}

.hd-form__card form.mktoForm>.mktoFormRow:has(> input[type="hidden"]) {
    display: none !important;
}

@media (min-width: 600px) {
    #contact .hd-form__card form.mktoForm>.mktoFormRow:nth-of-type(-n+4) {
        flex: 0 0 calc(50% - 8px);
        width: calc(50% - 8px) !important;
    }
}

.hd-form__card .mktoForm .mktoFieldDescriptor,
.hd-form__card .mktoForm .mktoFormCol,
.hd-form__card .mktoForm .mktoFieldWrap,
.hd-form__card .mktoForm .mktoLogicalField {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
}

.hd-form__card .mktoForm .mktoFieldDescriptor {
    margin-bottom: 16px !important;
}

.hd-form__card .mktoForm .mktoFieldWrap {
    position: relative;
}

.hd-form__card .mktoForm .mktoOffset,
.hd-form__card .mktoForm .mktoGutter,
.hd-form__card .mktoForm .mktoClear {
    display: none !important;
}

.hd-form__card .mktoForm .mktoAsterix {
    display: none;
}

.hd-form__card .mktoForm .mktoFieldWrap>.mktoLabel {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip-path: inset(50%);
    white-space: nowrap;
}

.hd-form__card .mktoForm .mktoFieldWrap.mktoRequiredField>.mktoLabel {
    display: block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 4px !important;
}

.hd-form__card .mktoForm input.mktoField:not([type="hidden"]):not([type="checkbox"]),
.hd-form__card .mktoForm select.mktoField,
.hd-form__card .mktoForm textarea.mktoField {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px;
    margin: 0 !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    border: 1px solid var(--hdf-border) !important;
    border-radius: var(--hdf-radius) !important;
    background-color: #fff;
    box-shadow: none !important;
    color: var(--hdf-muted) !important;
    font: inherit !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
}

.hd-form__card .mktoForm textarea.mktoField {
    height: auto !important;
    min-height: 120px;
}

.hd-form__card .mktoForm input.mktoField:not([type="hidden"]):not([type="checkbox"]):focus,
.hd-form__card .mktoForm select.mktoField:focus,
.hd-form__card .mktoForm textarea.mktoField:focus {
    outline: none;
    border-color: var(--hdf-red) !important;
    box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.18) !important;
}

.hd-form__card .mktoForm .mktoField::placeholder {
    color: var(--hdf-muted) !important;
    ;
    opacity: 1;
}

.hd-form__card .mktoForm select.mktoField {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 44px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231e1e1e' stroke-width='1.8'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    background-size: 12px 8px !important;
}

.hd-form__card .mktoForm .mktoError {
    position: static !important;
    display: block;
    width: 100%;
}

.hd-form__card .mktoForm .mktoErrorArrowWrap {
    display: none !important;
}

.hd-form__card .mktoForm .mktoErrorMsg {
    display: block;
    max-width: 100% !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    color: #b00000 !important;
    font-size: 0.875rem !important;
    font-weight: 400 !important;
}

.hd-form__card .mktoForm input.mktoField.mktoInvalid:not([type="hidden"]):not([type="checkbox"]),
.hd-form__card .mktoForm select.mktoField.mktoInvalid,
.hd-form__card .mktoForm textarea.mktoField.mktoInvalid {
    border-color: var(--hdf-red) !important;
}

.hd-form__card .mktoForm .mktoCheckboxList {
    display: flex !important;
    align-items: flex-start;
    gap: 12px;
    margin-top: 16px !important;
}

.hd-form__card .mktoForm .mktoCheckboxList>input[type="checkbox"] {
    position: static !important;
    opacity: 1 !important;
    flex: 0 0 auto;
    width: 20px !important;
    height: 20px !important;
    margin: 2px 0 0 !important;
    accent-color: var(--hdf-red);
    cursor: pointer;
}

.hd-form__card .mktoForm .mktoCheckboxList>label {
    display: block !important;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--hdf-muted);
    font-size: 0.9375rem !important;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.hd-form__card .mktoForm .mktoCheckboxList>label::before,
.hd-form__card .mktoForm .mktoCheckboxList>label::after {
    content: none !important;
    display: none !important;
}

.hd-form__card .mktoForm .mktoCheckboxList>label a {
    color: var(--hdf-ink) !important;
    font-size: inherit !important;
    text-decoration: underline !important;
}

.hd-form__card .mktoForm .mktoCheckboxList>label a:hover {
    color: var(--hdf-red) !important;
}

.hd-form__card .mktoForm .mktoButtonRow {
    flex: 0 0 100%;
    width: 100% !important;
    margin: 8px 0 0 !important;
    text-align: left !important;
}

.hd-form__card .mktoForm .mktoButtonRow .mktoButtonWrap {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
}

.hd-form__card form.mktoForm .mktoButtonWrap.mktoSimple .mktoButton {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    float: none !important;
    width: auto !important;
    max-width: 100%;
    height: auto !important;
    min-height: 48px;
    margin: 0 !important;
    padding: 12px 32px !important;
    border: 2px solid var(--hdf-red) !important;
    border-radius: 999px !important;
    background: var(--hdf-red) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    color: #fff !important;
    font: inherit !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: normal;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.hd-form__card form.mktoForm .mktoButtonWrap.mktoSimple .mktoButton::after {
    content: "";
    flex: 0 0 auto;
    width: 9px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='16' viewBox='0 0 9 16'%3E%3Cpath d='M1 1l7 7-7 7' stroke='%23fff' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat center / contain;
}

.hd-form__card form.mktoForm .mktoButtonWrap.mktoSimple .mktoButton:hover,
.hd-form__card form.mktoForm .mktoButtonWrap.mktoSimple .mktoButton:active {
    background: var(--hdf-black) !important;
    background-image: none !important;
    border-color: var(--hdf-black) !important;
    color: #fff !important;
}

.hd-form__card form.mktoForm .mktoButtonWrap.mktoSimple .mktoButton:focus-visible {
    outline: 3px solid var(--hdf-red);
    outline-offset: 3px;
}

/* Gap only above the Select Country field */
/* .hd-form__card :has(> select) {
    margin-top: 20px !important;
} */ 

/* ==========================Contact page marketo form end============================ */

/* Footer privacy links start */
@media (max-width: 767px) {
    .hd-footer__legal {
        align-items: flex-start;
        flex-direction: column;
    }

    .hd-footer__legal li+li {
        border-left: none;
    }

    .hd-footer__legal a {
        padding: 0;
    }
}

/* Footer privacy links end */


/* ================ HOME PAGE Industries Section CSS Fixed Start ======================= */

@media (max-width: 767.98px) {

    .hd-panels .hd-panel {
        display: flex;
        align-items: center;
    }

    .hd-panels .hd-panel:not(.is-active) {
        flex: 0 0 auto;
        height: auto;
        min-height: 84px;
    }

    .hd-panels .hd-panel__body {
        position: relative;
        z-index: 2;
        width: 100%;
        margin: 0;
        padding: 20px 28px;
        flex-direction: column;
        justify-content: center;
        align-self: center;
    }

    .hd-panels .hd-panel__name {
        margin: 0;
    }

    .hd-panels .hd-panel:not(.is-active) .hd-panel__text {
        display: none;
    }

    .hd-panels .hd-panel.is-active .hd-panel__text {
        margin-top: 8px;
    }
}

/* ================ HOME PAGE Industries Section CSS Fixed END======================= */

/* ====================== Before Hero Section Padding issue================= */

@media (max-width: 767.98px) {
    .hd-featured {
        padding-top: 0;
    }
}

/* ====================== Before Hero Section Padding issue================= */

/* ==================Insights Hero Section Text Fixed===================== */
@media (max-width: 767.98px) {
    .hd-featured--overlay {
        display: block;
        min-height: 0;
        padding: 0 !important;
        background: #000;
    }

    .hd-featured--overlay .hd-featured__link {
        display: flex;
        align-items: flex-end;
        position: relative;
        min-height: 480px;
        overflow: hidden;
        isolation: isolate;
        color: #fff;
    }

    .hd-featured--overlay .hd-featured__img {
        display: block;
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 0;
    }

    .hd-featured--overlay .hd-featured__img img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hd-featured--overlay .hd-featured__link::after {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.6);
        z-index: 1;
    }

    .hd-featured--overlay .hd-featured__link .hd-featured__content {
        display: block;
        position: relative;
        z-index: 2;
        width: 100%;
        padding: 64px var(--hd-pad, 20px) 40px;
    }
}

/* ==================Insights Hero Section Text Fixed=====================  */

/* ==================   One leader per row on mobile ================= */
@media (max-width: 767.98px) {

    .hd-people .hd-people__grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}


/* =====================Mobile Header cross icon Fix Start==================== */
.hd-offcanvas .offcanvas-header {
    justify-content: space-between;
}

.hd-offcanvas .offcanvas-header .hd-icon-btn {
    margin-left: auto;
    margin-right: -12px;
}

/* =====================Mobile Header cross icon Fix End==================== */

/* Insight filter start */
.list_filter_block {
    width: 100%;
    display: block;
    padding: 40px 0 0;
}

.list_filter_block .list_filter_area {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 10px;
    padding: 0 0 10px;
}

.list_filter_block .serviceCount,
.list_filter_block .industryCount {
    position: relative;
}

.list_filter_block .serviceCount .select-count,
.list_filter_block .industryCount .select-count {
    position: absolute;
    bottom: 9px;
    right: 40px;
    font-size: 12px;
    padding: 3px 8px;
    background: #e6e7e8;
    color: #414042;
    border-radius: 25px;
    font-weight: 600;
}

@media screen and (min-width: 768px) {
    .list_filter_block .list_filter_area select {
        padding-right: 40px;
        background-position: 92% 50%;
    }
}

@media screen and (min-width: 768px) {

    .list_filter_block .list_filter_area input,
    .list_filter_block .list_filter_area select {
        padding: 10px 15px;
        font-size: 18px;
        line-height: 120%;
        font-weight: 600;
        letter-spacing: 0;
    }
}

.list_filter_block .list_filter_area select {
    padding-right: 30px;
    background-image: url('../images/dropDown.svg');
    background-repeat: no-repeat;
    background-position: 92% 50%;
    background-size: auto 16px;
    -webkit-transition: all linear 0.2s;
    transition: all linear 0.2s;
    cursor: pointer;
}

.list_filter_block .list_filter_area input,
.list_filter_block .list_filter_area select {
    border: solid 1px #484F6B;
    border-radius: 30px;
    padding: 10px 8px;
    font-size: 16px;
    line-height: 120%;
    font-weight: 600;
    letter-spacing: 0;
}

.list_filter_block .selectpicker1,
.list_filter_block .selectpicker2 {
    width: 220px;
    height: 41px;
    overflow-y: hidden;
    padding: 10px;
}

.list_filter_block .selectpicker1 {
    height: 40px;
}

.list_filter_block .selectpicker1 option,
.list_filter_block .selectpicker2 option {
    font-size: 16px;
    line-height: 120%;
    font-weight: 600;
    letter-spacing: 0;
    color: #181A24;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-toggle {
    border: solid 1px #484F6B;
    border-radius: 30px;
    padding: 10px 40px 10px 15px;
    font-size: 16px;
    line-height: 120%;
    font-weight: 600;
    letter-spacing: 0;
    color: #181A24 !important;
    background-color: #fff;
    background-image: url('../images/dropDown.svg');
    background-repeat: no-repeat;
    background-position: 92% 50%;
    background-size: auto 16px;
    outline: none !important;
    -webkit-transition: all linear 0.2s;
    transition: all linear 0.2s;
    cursor: pointer;
}

.bootstrap-select>.dropdown-toggle:after {
    display: none;
}

.list_filter_block .list_filter_area .bootstrap-select .filter-option-inner-inner {
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu {
    max-height: 250px;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item:active {
    background-color: #F2F3F6;
    color: var(--bs-dropdown-link-hover-color);
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 10px 8px 40px;
    position: relative;
    -webkit-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item {
    text-decoration: none;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu li.selected .dropdown-item:before {
    -webkit-box-shadow: inset 0 0 0 10px var(--hd-red);
    box-shadow: inset 0 0 0 10px var(--hd-red);
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item:before {
    content: "";
    position: absolute;
    left: 10px;
    width: 20px;
    height: 20px;
    display: block;
    -webkit-box-shadow: inset 0 0 0 1px #484F6B;
    box-shadow: inset 0 0 0 1px #484F6B;
    border-radius: 2px;
    -webkit-transition: all ease-in-out 0.2s;
    transition: all ease-in-out 0.2s;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item:active {
    background-color: #F2F3F6;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item .check-mark {
    left: 17px !important;
    top: 12px !important;
}

.list_filter_block .list_filter_area .bootstrap-select .dropdown-menu .dropdown-item .check-mark:after {
    font-size: 12px;
    border-color: #fff;
    border-width: 0 2px 2px 0;
}

@media screen and (min-width: 768px) {
    .list_filter_block .list_filter_area .clear_filter {
        font-size: 18px;
        line-height: 120%;
        font-weight: 600;
        letter-spacing: 0;
        margin-top: 0;
    }
}

.list_filter_block .list_filter_area .clear_filter {
    width: auto;
    display: block;
    font-size: 16px;
    line-height: 120%;
    font-weight: 600;
    letter-spacing: 0;
    color: #484F6B;
    padding: 0 0 0 32px;
    background: transparent url('../images/close.svg') no-repeat 5% 50%;
    border: none;
}

.list_filter_block .list_filter_area .clear_filter:hover {
    text-decoration: none;
}

.list_filter_block .list_tag_area {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 6px;
    padding: 10px 0;
}

.list_filter_block .list_tag_area .list_tag_btn {
    width: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #ACDDFF;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    letter-spacing: 0;
    color: #000;
    padding: 5px;
    gap: 10px;
}

.list_filter_block .list_tag_area .list_tag_btn.cat1 {
    background-color: #D1C4FF;
}

.list_filter_block .list_tag_area .list_tag_btn .tag_close {
    width: 16px;
    aspect-ratio: 1;
    display: block;
    background: transparent url('../images/close.svg') no-repeat center;
    background-size: 14px;
    border: none;
    padding: 0;
}

.pagination_area {
    width: 100%;
    display: block;
    margin: 70px 0 0;
}

.pagination_area .pagination {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 8px;
}

.pagination_area .page-numbers.current {
    width: 47px;
    background-color: #181A24;
    font-size: 21px;
    line-height: 130%;
    font-weight: 600;
    letter-spacing: -.2px;
    color: #fff;
}

.pagination_area .page-numbers {
    width: 35px;
    aspect-ratio: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    border-radius: 50%;
    background-color: #F2F3F6;
    font-size: 16px;
    line-height: 130%;
    font-weight: 600;
    color: #181A24;
}

.pagination_area a.page-numbers {
    text-decoration: none;
}

span.page-numbers {
    font-size: 13px;
    color: #6d6e71;
}

@media screen and (min-width: 768px) {

    .pagination_area .page-numbers.next,
    .pagination_area .page-numbers.prev {
        margin: 0 40px;
    }
}

.pagination_area .page-numbers.next,
.pagination_area .page-numbers.prev {
    font-size: 0;
    background: transparent url('../images/arrow-dark.svg') no-repeat center;
    margin: 0 26px;
}

.pagination_area .page-numbers.prev {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

/* Insight filter end */


/* .list_filter_block .list_filter_area{
    display: none;
} */
.list_filter_block {
    padding-top: 0px;
}


/*====================== Insight section =======================*/

.insight-section {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 40px;
    justify-content: space-between;
    align-items: center;
    padding: 40px;
    background-color: #f9f9f9;
    border-radius: 8px;
}

.insight-section__title {
    margin: 0;
    font-size: 2rem;
    max-width: 600px;
    color: #000;
    line-height: 1.2;
}

.hd-prose blockquote {
    font-weight: 400;
}


.hd-prose blockquote p {
    font-weight: 400;
    font-size: 20px;
}


.hd-prose blockquote p strong {
    font-weight: 700;
}



/*====================== Insight section =======================*/


.hd-space-default {
    padding-top: clamp(72px, 9vw, 30px) !important;
    padding-bottom: clamp(72px, 9vw, 100px);
}

.hd-insight-body {
    padding-top: clamp(48px, 5vw, 80px);
    padding-bottom: clamp(64px, 7vw, 50px);
}

/* List Rows: numbered (Careers) */
.hd-rows--numbered .hd-h3 {
    font-size: clamp(24px, 2.2vw, 30px);
    line-height: 1.3;
    letter-spacing: -.4px;
    margin-bottom: 0
}

.hd-rows--numbered .hd-h3+.hd-lead {
    margin-top: 24px;
    font-size: 16px;
    line-height: 24px
}

.hd-rows--numbered .hd-row {
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 24px;
    padding: 18px 0
}

.hd-rows--numbered .hd-row:last-child {
    border-bottom: 1px solid var(--hd-grey-201)
}

.hd-rows--numbered .hd-row__num {
    flex: 0 0 20px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    color: var(--hd-red)
}

.hd-rows--numbered .hd-row__label {
    flex: 1 1 auto;
    font-size: 20px;
    line-height: 28px
}

.hd-bg-dark .hd-rows--numbered .hd-row__num,
.hd-rows--numbered.hd-bg-dark .hd-row__num {
    color: var(--hd-red-on-dark)
}


/* ===================Download Card ACF(whitepaper, case study, any file) START===================== */
/* Download Card (whitepaper, case study, any file) — compact */
.hd-download__box {
    --hd-cut: 22px;
    max-width: 680px;
    margin: 0 auto;
    padding: clamp(24px, 3vw, 40px) clamp(24px, 3.4vw, 44px);
    background: var(--hd-grey-244);
    clip-path: polygon(var(--hd-cut) 0, calc(100% - var(--hd-cut)) 0, 100% var(--hd-cut), 100% calc(100% - var(--hd-cut)), calc(100% - var(--hd-cut)) 100%, var(--hd-cut) 100%, 0 calc(100% - var(--hd-cut)), 0 var(--hd-cut))
}

.hd-bg-grey .hd-download__box {
    background: #fff
}

/* Heading and file sit side by side (not 50/50) */
.hd-download__box > .row {
    --bs-gutter-x: clamp(24px, 2.6vw, 36px);
    --bs-gutter-y: 20px;
    align-items: flex-start !important
}

@media (min-width:768px) {
    .hd-download__box > .row > .col-md-6 {
        flex: 0 0 auto;
        width: auto;
        max-width: 60%
    }

    .hd-download__box > .row > .col-md-6:first-child {
        max-width: 200px
    }
}

.hd-download__title {
    margin: 0;
    font-size: clamp(20px, 1.7vw, 24px);
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: -.3px;
    text-wrap: balance
}

.hd-download__text {
    margin: 10px 0 0;
    font-size: 14px;
    line-height: 20px;
    color: var(--hd-grey-77)
}

.hd-download__file {
    display: flex;
    align-items: center;
    gap: 20px
}

.hd-download__icon {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    background: var(--hd-ink);
    color: #fff
}

.hd-download__icon span {
    margin-top: -12px;
    font-size: 6px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .2px
}

.hd-download__icon svg {
    width: 16px;
    height: 20px
}

.hd-download__info {
    display: flex;
    flex-direction: column;
    min-width: 0
}

.hd-download__name {
    font-size: 13px;
    line-height: 18px;
    font-weight: 700;
    overflow-wrap: anywhere
}

.hd-download__meta {
    font-size: 12px;
    line-height: 18px;
    color: var(--hd-ink)
}

.hd-download__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    min-height: 38px;
    padding: 0 18px;
    font-size: 14px;
    line-height: 20px
}

.hd-download__btn .hd-i {
    width: 12px;
    height: 12px
}

.hd-bg-dark .hd-download__box {
    background: rgba(255, 255, 255, .06)
}

.hd-bg-dark .hd-download__icon {
    background: #fff;
    color: var(--hd-ink)
}

.hd-bg-dark .hd-download__text,
.hd-bg-dark .hd-download__meta {
    color: var(--hd-grey-201)
}

@media (max-width:767.98px) {
    .hd-download__box {
        --hd-cut: 16px
    }
}
/* ===================Download Card ACF(whitepaper, case study, any file) END===================== */


/* Blog: tags full width under the article */
.hd-topic-tags--full {
    margin-top: 32px
}

/* Blog: tags after Hitachi blocks (posts built with Rich Text) */
.hd-section:has(+ .hd-blog-tags) {
    padding-bottom: 32px
}

.hd-blog-tags {
    padding-bottom: clamp(48px, 5vw, 80px)
}

/* Blog: tags full width under the article */
.hd-topic-tags--full {
    margin-top: 32px
}

/* Blog: tags after Hitachi blocks (posts built with Rich Text) */
.hd-section:has(+ .hd-blog-tags) {
    padding-bottom: 32px
}

.hd-blog-tags {
    padding-bottom: clamp(48px, 5vw, 80px)
}

/* Blog: tags under the author/share bar */
.hd-topic-tags--top {
    margin-top: 24px
}



/* ======================Method template (page-templates/template-method.php) — styles for the Method blocks. */
/* Service Hero (+ notice bar) START===============================*/
.hd-notice {
    background: var(--hd-ink);
    color: #fff
}

.hd-notice[hidden] {
    display: none
}

.hd-notice__in {
    padding-top: 14px;
    padding-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 16px
}

.hd-notice__in>span {
    flex: 1;
    min-width: 0;
    font-size: 16px;
    line-height: 24px;
    text-wrap: pretty
}

.hd-notice__in strong {
    font-weight: 700
}

.hd-notice button {
    flex: none;
    width: 44px;
    height: 44px;
    border: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0
}

.hd-notice button .hd-i {
    width: 16px;
    height: 16px
}

.hd-notice button:hover {
    color: var(--hd-red-on-dark)
}

.hd-shero {
    position: relative;
    min-height: clamp(540px, 72vh, 780px);
    overflow: hidden;
    background: var(--hd-ink);
    display: flex;
    align-items: flex-end
}

.hd-shero__img,
.hd-shero>.hd-img-empty {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.hd-shero__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0, 0, 0, var(--hd-shero-shade, .7)) 0%, rgba(0, 0, 0, calc(var(--hd-shero-shade, .7) * .36)) 70%, rgba(0, 0, 0, .1) 100%);
    pointer-events: none
}

.hd-shero__shade2 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50%;
    background: linear-gradient(to top, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
    pointer-events: none
}

.hd-shero__body {
    position: relative;
    z-index: 2;
    padding-top: clamp(120px, 14vw, 200px);
    padding-bottom: clamp(56px, 6vw, 96px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: #fff
}

.hd-shero__pill {
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    color: #fff;
    padding: 6px 14px;
    border-radius: 24px;
    background: var(--hd-red)
}

.hd-shero__title {
    margin: 20px 0 0;
    color: #fff;
    font-weight: 700;
    font-size: clamp(44px, 6.6vw, 100px);
    line-height: 1.04;
    letter-spacing: -1.5px;
    max-width: 960px;
    text-wrap: balance
}

.hd-shero__sub {
    margin: 12px 0 0;
    font-weight: 700;
    font-size: clamp(24px, 2.6vw, 40px);
    line-height: 1.15;
    letter-spacing: -.75px
}

.hd-shero__text {
    margin: 24px 0 0;
    font-size: clamp(18px, 1.5vw, 22px);
    line-height: 1.55;
    max-width: 680px;
    text-wrap: pretty
}

.hd-shero__cta {
    margin-top: 36px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px 32px
}

.hd-shero__note {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    line-height: 24px
}

.hd-shero__dash {
    width: 24px;
    height: 2px;
    background: #fff;
    flex: none
}

/* Shared head (Method blocks) */
.hd-svc-head {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
    gap: 24px clamp(40px, 6vw, 96px);
    align-items: end
}

.hd-svc-head__t {
    display: flex;
    flex-direction: column
}

.hd-svc-head__t .hd-eyebrow {
    margin-bottom: 16px
}

.hd-svc-head__lead {
    margin: 0;
    font-size: clamp(16px, 1.4vw, 20px);
    line-height: 1.7;
    color: var(--hd-grey-77);
    text-wrap: pretty
}

.hd-bg-dark .hd-svc-head__lead {
    color: rgb(220, 220, 220)
}

/* Pillars */
.hd-pillars__grid {
    margin-top: clamp(40px, 4vw, 56px);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 40px 24px
}

.hd-pillar {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 24px;
    border-top: 2px solid var(--hd-ink);
    min-width: 0
}

.hd-pillar__n {
    font-size: 48px;
    line-height: 1;
    font-weight: 700;
    color: var(--hd-red);
    letter-spacing: -1px
}

.hd-pillar__t {
    margin-top: 12px;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;
    letter-spacing: -.4px;
    text-wrap: balance
}

.hd-pillar__p {
    font-size: 16px;
    line-height: 24px;
    color: var(--hd-grey-77);
    text-wrap: pretty
}

.hd-bg-dark .hd-pillar {
    border-top-color: #fff
}

.hd-bg-dark .hd-pillar__n {
    color: var(--hd-red-on-dark)
}

.hd-bg-dark .hd-pillar__p {
    color: var(--hd-grey-201)
}

/* Offer Tabs / Slider */
.hd-offers__tabs {
    margin-top: clamp(40px, 4vw, 56px);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    column-gap: 24px;
    border-bottom: 1px solid var(--hd-grey-201)
}

.hd-offers__tab {
    display: flex;
    gap: 16px;
    align-items: baseline;
    text-align: left;
    padding: 20px 16px 20px 0;
    border: 0;
    border-top: 3px solid transparent;
    background: transparent;
    font-family: inherit;
    color: var(--hd-grey-116);
    cursor: pointer;
    transition: color .2s ease-out, border-color .2s ease-out;
    min-width: 0
}

.hd-offers__tab:hover {
    color: var(--hd-red)
}

.hd-offers__tab.is-active {
    color: var(--hd-ink);
    border-top-color: var(--hd-red)
}

.hd-offers__tab-n {
    flex: none;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    color: var(--hd-red)
}

.hd-offers__tab-t {
    font-size: clamp(20px, 1.8vw, 26px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -.5px;
    text-wrap: balance
}

.hd-offers__slider {
    margin-top: 32px;
    overflow: hidden
}

.hd-offers__track {
    display: flex;
    gap: 24px;
    transition: transform .55s cubic-bezier(.22, .61, .36, 1)
}

.hd-offer {
    flex: 0 0 86%;
    min-width: 0;
    min-height: clamp(420px, 38vw, 560px);
    position: relative;
    display: flex;
    align-items: stretch;
    border-radius: 8px;
    overflow: hidden;
    background: var(--hd-dark);
    opacity: .45;
    cursor: pointer;
    transition: opacity .4s ease-out
}

.hd-offers__track>.hd-offer:only-child {
    flex-basis: 100%
}

.hd-offer.is-active {
    opacity: 1;
    cursor: default
}

.hd-offer__img,
.hd-offer>.hd-img-empty {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.hd-offer__panel {
    position: relative;
    z-index: 2;
    flex: 0 0 50%;
    min-width: min(100%, 400px);
    margin: clamp(16px, 2vw, 32px);
    padding: clamp(24px, 2.8vw, 44px);
    border-radius: 6px;
    background: radial-gradient(110% 120% at 0% 100%, rgba(204, 0, 0, .42) 0%, rgba(204, 0, 0, 0) 55%), rgba(18, 18, 20, .72);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 24px
}

.hd-offer__hd {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.hd-offer__k {
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    color: var(--hd-red-on-dark)
}

.hd-offer__t {
    font-size: clamp(24px, 2.1vw, 30px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -.75px;
    text-wrap: balance
}

.hd-offer__list {
    margin: 0;
    padding: 16px 0 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-top: 1px solid var(--hd-grey-116)
}

.hd-offer__list li {
    display: flex;
    gap: 14px;
    align-items: baseline;
    font-size: 20px;
    line-height: 28px;
    text-wrap: pretty
}

.hd-offer__list li::before {
    content: "";
    flex: none;
    width: 6px;
    height: 6px;
    background: var(--hd-red-on-dark);
    transform: translateY(-3px)
}

.hd-offers__ctrl {
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px
}

.hd-offers__count {
    font-size: 16px;
    line-height: 24px;
    font-weight: 700
}

.hd-offers__btns {
    display: flex;
    gap: 12px
}

.hd-offers__arrow {
    width: 48px;
    height: 48px;
    border-radius: 24px;
    border: 2px solid var(--hd-ink);
    background: transparent;
    color: var(--hd-ink);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background .15s ease-out, color .15s ease-out
}

.hd-offers__arrow:hover:not(:disabled) {
    background: var(--hd-ink);
    color: #fff
}

.hd-offers__arrow:disabled {
    opacity: .3;
    cursor: default
}

@media (max-width:767.98px) {
    .hd-offer {
        flex-basis: 90%;
        flex-direction: column
    }

    .hd-offer__panel {
        flex-basis: auto;
        min-width: 0;
        margin: 200px 12px 12px
    }
}

@media (prefers-reduced-motion:reduce) {

    .hd-offers__track,
    .hd-offer {
        transition: none
    }
}

/* Engagement Cards */
.hd-eng__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
    gap: 40px clamp(40px, 6vw, 96px);
    align-items: stretch
}

.hd-eng__intro {
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: center
}

.hd-eng__intro .hd-eyebrow {
    margin-bottom: 0
}

.hd-bg-dark .hd-eng__intro .hd-eyebrow {
    color: var(--hd-red-on-dark)
}

.hd-eng__cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 24px
}

.hd-eng__card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .24);
    color: #fff;
    text-decoration: none;
    transition: border-color .15s ease-out, background .15s ease-out, box-shadow .15s ease-out
}

a.hd-eng__card:hover {
    border-color: var(--hd-red);
    background: rgba(204, 0, 0, .16);
    box-shadow: inset 0 0 0 1px var(--hd-red);
    color: #fff;
    text-decoration: none
}

.hd-eng__t {
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    letter-spacing: -.4px
}

.hd-eng__p {
    font-size: 16px;
    line-height: 24px;
    color: rgb(220, 220, 220);
    text-wrap: pretty
}

.hd-eng__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px
}

.hd-eng__tags span {
    font-size: 14px;
    line-height: 20px;
    padding: 4px 12px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, .4)
}

.hd-eng__cta {
    margin-top: auto;
    padding-top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 700
}

.hd-bg-white .hd-eng__card,
.hd-bg-grey .hd-eng__card {
    background: #fff;
    border-color: var(--hd-grey-201);
    color: var(--hd-ink)
}

.hd-bg-white a.hd-eng__card:hover,
.hd-bg-grey a.hd-eng__card:hover {
    background: #fff;
    color: var(--hd-ink)
}

.hd-bg-white .hd-eng__p,
.hd-bg-grey .hd-eng__p {
    color: var(--hd-grey-77)
}

.hd-bg-white .hd-eng__tags span,
.hd-bg-grey .hd-eng__tags span {
    border-color: var(--hd-grey-201)
}

/* Numbered List */
.hd-nlist__list {
    margin: clamp(40px, 4vw, 56px) 0 0;
    padding: 0;
    list-style: none;
    border-top: 2px solid var(--hd-ink)
}

.hd-nlist__list li {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px clamp(24px, 4vw, 64px);
    padding: clamp(20px, 2.2vw, 28px) 0;
    border-bottom: 1px solid var(--hd-grey-201);
    transition: color .15s ease-out
}

.hd-nlist__list li:hover {
    color: var(--hd-red)
}

.hd-nlist__n {
    flex: none;
    width: 40px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    color: var(--hd-red)
}

.hd-nlist__t {
    flex: 1 1 320px;
    min-width: 0;
    font-size: clamp(22px, 2vw, 30px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -.6px;
    text-wrap: balance
}

.hd-nlist__p {
    flex: 1 1 360px;
    min-width: 0;
    font-size: 18px;
    line-height: 27px;
    color: var(--hd-grey-77);
    text-wrap: pretty
}

.hd-bg-dark .hd-nlist__list {
    border-top-color: #fff
}

.hd-bg-dark .hd-nlist__list li {
    border-color: rgba(255, 255, 255, .2)
}

.hd-bg-dark .hd-nlist__p {
    color: var(--hd-grey-201)
}

/* Sticky page tabs: follow the header when its top bar hides on scroll */
.hd-anchor-nav {
    transition: top .3s cubic-bezier(.4, 0, .2, 1)
}

@media (min-width:768px) {

    /* body:has(.hd-header__utility.is-hidden) .hd-anchor-nav{top:calc(var(--hd-sticky-top) - 30px)} */
    body:has(.hd-header__utility.is-hidden) .hd-anchor-nav {
        top: 68px !important;
    }

    body:has(.admin-bar .hd-header__utility.is-hidden) .hd-anchor-nav {
        top: 100px !important;
    }
}

@media (max-width:767.98px) {

    /* body:has(.hd-header__utility.is-hidden) .hd-anchor-nav{top:var(--hd-adminbar)} */
    body:has(.hd-header__utility.is-hidden) .hd-anchor-nav {
        top: 100px !important;
    }
}

/* ===============================METHOD Template END HERE=========================== */

/* CSS for Email Icon Before Contact us menu */

.hd-nav__item:last-child>.hd-nav__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hd-nav__item:last-child>.hd-nav__btn::before {
    content: "";
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='1.5'/%3E%3Cpath d='M3 6l9 7 9-7'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='1.5'/%3E%3Cpath d='M3 6l9 7 9-7'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* CSS for Email Icon Before Contact us menu */




/* =================Capability Links block START====================*/
/* Capability Links block */
.hd-caps__inner {
    max-width: 1240px;
    margin: 0 auto
}

.hd-caps__label {
    margin: 0 0 clamp(20px, 2.4vw, 32px);
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: var(--hd-grey-77)
}

.hd-caps__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    font-size: clamp(32px, 4.4vw, 60px);
    line-height: 1.2;
    font-weight: 400;
    letter-spacing: -.04em
}

.hd-caps__list li {
    display: inline-flex;
    align-items: baseline
}

/* Dot / arrow box: fixed size, so nothing moves on hover. The 7px square is drawn in its centre. */
.hd-caps__list li::after {
    content: "";
    flex: none;
    align-self: center;
    width: .55em;
    height: .55em;
    margin: 0 .15em;
    background: linear-gradient(var(--hd-ink), var(--hd-ink)) center / 7px 7px no-repeat
}

.hd-caps__item {
    color: black;
    text-decoration: none;
    transition: color .25s ease-out
}

.hd-caps__item.is-highlight {
    color: var(--hd-red)
}

/* Hover: the word turns black */
/* Hover: normal words turn dark grey */
.hd-caps__list a.hd-caps__item:hover,
.hd-caps__list a.hd-caps__item:focus,
.hd-caps__list a.hd-caps__item:active,
.hd-caps__list a.hd-caps__item:focus-visible {
    color: var(--hd-grey-77);
    text-decoration: none
}

/* Hover: highlighted (red) words turn a stronger red */
.hd-caps__list a.hd-caps__item.is-highlight:hover,
.hd-caps__list a.hd-caps__item.is-highlight:focus,
.hd-caps__list a.hd-caps__item.is-highlight:active,
.hd-caps__list a.hd-caps__item.is-highlight:focus-visible {
    color: var(--hd-red-bright)
}

/* Hover: the square after the word becomes a red arrow (same box size) */
.hd-caps__list li:has(a.hd-caps__item:hover)::after,
.hd-caps__list li:has(a.hd-caps__item:focus-visible)::after {
    background: var(--hd-red);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 12h19M14 5l7 7-7 7' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 12h19M14 5l7 7-7 7' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center / contain no-repeat
}

/* Dark background */
.hd-bg-dark .hd-caps__label {
    color: var(--hd-grey-201)
}

.hd-bg-dark .hd-caps__item {
    color: rgba(255, 255, 255, .55)
}

.hd-bg-dark .hd-caps__list li::after {
    background: linear-gradient(#fff, #fff) center / 7px 7px no-repeat
}

.hd-bg-dark .hd-caps__item.is-highlight {
    color: var(--hd-red-on-dark)
}

.hd-bg-dark a.hd-caps__item:hover {
    color: #fff
}

@media (prefers-reduced-motion:reduce) {
    .hd-caps__item {
        transition: none
    }
}

/* =================Capability Links block END====================*/


/* ===== Client Story blocks: Client Story Header, Overview, Key Benefits, Link Box ===== */
.hd-cs-hero {
    position: relative;
    height: clamp(220px, 34vw, 480px);
    overflow: hidden;
    background: var(--hd-grey-201)
}

.hd-cs-hero__img,
.hd-cs-hero>.hd-img-empty {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.hd-cs-head {
    padding: clamp(28px, 3vw, 40px) 0
}

.hd-cs-head__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px clamp(32px, 5vw, 80px)
}

.hd-cs-head__main {
    min-width: 0;
    max-width: 900px
}

.hd-cs-head__label {
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: var(--hd-grey-77);
    margin-bottom: 8px
}

.hd-cs-head__title {
    margin: 0;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -.5px;
    text-wrap: balance
}

.hd-cs-head__logo {
    flex: none;
    max-width: 220px
}

.hd-cs-head__logo img {
    display: block;
    max-height: 72px;
    width: auto;
    height: auto
}

@media (max-width:767.98px) {
    .hd-cs-head__row {
        flex-direction: column-reverse;
        align-items: flex-start
    }

    .hd-cs-head__logo img {
        max-height: 48px
    }
}

/* Client Story Overview */
.hd-cs-ov__title {
    margin: 0 0 24px;
    max-width: 1000px;
    font-size: clamp(20px, 1.8vw, 26px);
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: -.3px;
    text-wrap: balance
}

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

.hd-cs-card {
    display: flex;
    flex-direction: column;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--hd-grey-234);
    border-radius: 4px;
    min-width: 0
}

.hd-bg-white .hd-cs-card {
    background: var(--hd-grey-244)
}

.hd-cs-card--result,
.hd-cs-ov__grid>.hd-cs-card:only-child {
    grid-column: 1/-1
}

.hd-cs-card__icon {
    display: flex;
    width: 36px;
    height: 36px;
    margin-bottom: 12px;
    color: var(--hd-ink)
}

.hd-cs-card__icon img,
.hd-cs-card__icon svg {
    width: 36px;
    height: 36px;
    object-fit: contain
}

.hd-cs-card__title {
    margin: 0 0 12px;
    font-size: 20px;
    line-height: 28px;
    font-weight: 700
}

.hd-cs-card__text {
    font-size: 16px;
    line-height: 24px;
    color: var(--hd-grey-77)
}

.hd-cs-card__text p {
    margin: 0 0 16px
}

.hd-cs-card__text p:last-child {
    margin-bottom: 0
}

.hd-cs-card__list {
    margin: 0;
    padding-left: 20px;
    font-size: 16px;
    line-height: 24px;
    color: var(--hd-grey-77)
}

.hd-cs-card__list li {
    margin-bottom: 6px
}

.hd-cs-card__list strong {
    color: var(--hd-ink)
}

@media (max-width:767.98px) {
    .hd-cs-ov__grid {
        grid-template-columns: minmax(0, 1fr)
    }
}

/* Client Story Key Benefits */
.hd-cs-benefits.hd-bg-dark {
    background: #000
}

.hd-cs-benefits__title {
    margin: 0 0 24px;
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
    color: inherit
}

.hd-cs-benefits__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: 24px 48px;
    text-align: center
}

.hd-cs-benefits__list li {
    font-size: 18px;
    line-height: 24px;
    text-wrap: balance
}

/* Client Story Link Box */
.hd-cs-linkbox__box {
    max-width: 1000px;
    margin: 0 auto;
    padding: clamp(20px, 2.4vw, 32px);
    border: 1px solid var(--hd-grey-201);
    border-radius: 4px;
    background: #fff
}

.hd-bg-white .hd-cs-linkbox__box {
    background: var(--hd-grey-244);
    border-color: var(--hd-grey-234)
}

.hd-cs-linkbox__title {
    margin: 0 0 12px;
    font-size: 20px;
    line-height: 28px;
    font-weight: 700
}

.hd-cs-linkbox__text {
    margin: 0 0 12px;
    font-size: 16px;
    line-height: 24px;
    color: var(--hd-grey-77)
}

.hd-cs-linkbox .hd-link {
    font-size: 16px
}

/* What-we-do page submenu sticky start */
body.logged-in.admin-bar .hd-anchor-nav {
    top: 100px;
}
.hd-anchor-nav {
    top: 68px;
}
/* What-we-do page submenu sticky end */

/* Newroom listing page on left category, on right date start */
body.post-type-archive-news .hd-card__meta {
    justify-content: space-between;
}
/* Newroom listing page on left category, on right date end */

/* Header menu sticky on scroll start */
.hd-header.is-stuck .hd-header__main {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
/* Header menu sticky on scroll end */

.hd-prose a {
    text-decoration: none;
}

/* Insights grid: results line right under the title (no big gap); big number on one line */
.hd-card--image .hd-card__value{margin-top:0}
.hd-card--image .hd-card__value strong{white-space:nowrap}

.cookie_clear {
    cursor: pointer;
}

/* FAQ: plus (+) when closed, cross (×) when open */
.hd-accordion .accordion-button::after {
    width: 16px;
    height: 16px;
    flex: none;
    margin-left: auto;
    background-image: none;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1v14M1 8h14' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1v14M1 8h14' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
    transform: none;
    transition: transform .2s ease-out
}

.hd-accordion .accordion-button:not(.collapsed)::after {
    background-image: none;
    transform: rotate(45deg)
}


/* ==========================================================================
   Marketo form (Contact page, #contact-form) — grey filled fields, 2 columns,
   custom checkbox and pill Submit button with arrow circle.
   Scoped to #contact-form so no other form or page is affected.
   ========================================================================== */
#contact-form .mktoForm {
    width: 100% !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 16px !important;
    color: var(--hd-ink) !important
}

#contact-form .mktoForm * {
    font-family: inherit !important;
    box-sizing: border-box
}

/* Remove Marketo's float layout, offsets, gutters and fieldset chrome */
#contact-form .mktoForm fieldset {
    grid-column: 1 / -1;
    min-width: 0;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    border: 0
}

#contact-form .mktoForm legend,
#contact-form .mktoForm .mktoOffset,
#contact-form .mktoForm .mktoGutter,
#contact-form .mktoForm .mktoClear {
    display: none !important
}

#contact-form .mktoForm .mktoFormCol,
#contact-form .mktoForm .mktoFieldWrap {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important
}

#contact-form .mktoForm .mktoFieldWrap {
    position: relative
}

/* Two fields per row, single fields span the full width */
#contact-form .mktoForm .mktoFormRow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 18px;
    margin: 0 0 16px
}

#contact-form .mktoForm .mktoFormRow:has(> fieldset) {
    margin: 0
}

#contact-form .mktoForm .mktoFormRow:has(> input[type="hidden"]) {
    display: none
}

#contact-form .mktoForm .mktoFormRow:not(:has(> .mktoFieldDescriptor ~ .mktoFieldDescriptor)) > .mktoFieldDescriptor {
    grid-column: 1 / -1
}

/* Labels are replaced by placeholders (kept for screen readers) */
#contact-form .mktoForm .mktoFieldWrap > .mktoLabel {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap
}

/* Fields */
#contact-form .mktoForm input[type="text"],
#contact-form .mktoForm input[type="email"],
#contact-form .mktoForm input[type="tel"],
#contact-form .mktoForm input[type="url"],
#contact-form .mktoForm input[type="number"],
#contact-form .mktoForm select.mktoField,
#contact-form .mktoForm textarea.mktoField {
    width: 100% !important;
    height: 52px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background-color: var(--hd-grey-244) !important;
    box-shadow: none !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: var(--hd-ink) !important;
    transition: box-shadow .15s ease-out !important
}

#contact-form .mktoForm textarea.mktoField {
    height: 92px !important;
    min-height: 92px;
    padding: 14px 20px !important;
    resize: vertical
}

#contact-form .mktoForm select.mktoField {
    padding-right: 48px !important;
    cursor: pointer;
    -webkit-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' stroke='%230c0c0c' stroke-width='1.8' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 12px 8px !important
}

/* Country dropdown shows grey text until a country is chosen, like the placeholders */
#contact-form .mktoForm select.mktoField:has(option[value=""]:checked) {
    color: var(--hd-grey-77) !important
}

#contact-form .mktoForm ::placeholder {
    color: var(--hd-grey-77) !important;
    opacity: 1
}

#contact-form .mktoForm input:focus,
#contact-form .mktoForm select:focus,
#contact-form .mktoForm textarea:focus {
    outline: none !important;
    border: 0 !important;
    box-shadow: inset 0 0 0 1.5px var(--hd-ink) !important
}

#contact-form .mktoForm .mktoInvalid {
    box-shadow: inset 0 0 0 1.5px var(--hd-red) !important
}

/* Checkbox + consent text */
#contact-form .mktoForm .mktoCheckboxList {
    position: relative;
    float: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 12px 0 0 !important
}

#contact-form .mktoForm .mktoCheckboxList input[type="checkbox"] {
    position: absolute;
    left: 0;
    top: 1px;
    width: 20px !important;
    height: 20px;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1
}

#contact-form .mktoForm .mktoCheckboxList > label {
    position: relative;
    display: block !important;
    margin: 0 !important;
    padding: 0 0 0 34px !important;
    font-size: 14px !important;
    line-height: 20px !important;
    color: var(--hd-grey-77) !important;
    cursor: pointer
}

#contact-form .mktoForm .mktoCheckboxList > label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    width: 20px;
    height: 20px;
    border: 1.5px solid var(--hd-grey-77);
    border-radius: 2px;
    background: #fff;
    box-shadow: none
}

#contact-form .mktoForm .mktoCheckboxList > label::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 6px;
    width: 9px;
    height: 5px;
    border-left: 2px solid var(--hd-ink);
    border-bottom: 2px solid var(--hd-ink);
    transform: rotate(-45deg);
    opacity: 0
}

#contact-form .mktoForm .mktoCheckboxList input[type="checkbox"]:checked + label::after {
    opacity: 1
}

#contact-form .mktoForm .mktoCheckboxList input[type="checkbox"]:focus-visible + label::before {
    outline: 2px solid var(--hd-ink);
    outline-offset: 2px
}

#contact-form .mktoForm .mktoCheckboxList a {
    color: var(--hd-red) !important;
    font-size: 14px;
    text-decoration: none
}

#contact-form .mktoForm .mktoCheckboxList a:hover {
    text-decoration: underline
}

/* Submit: red pill with white arrow circle */
#contact-form .mktoForm .mktoButtonRow {
    width: auto !important;
    margin: 28px 0 0 !important;
    text-align: left !important
}

#contact-form .mktoForm .mktoButtonWrap {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important
}

#contact-form .mktoForm .mktoButtonWrap .mktoButton {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    float: none !important;
    height: 64px !important;
    min-width: 180px;
    margin: 0 !important;
    padding: 0 84px 0 30px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--hd-red) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #fff !important;
    cursor: pointer;
    transition: background-color .2s ease-out !important
}

#contact-form .mktoForm .mktoButtonWrap .mktoButton::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 6px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 12h17M13 5l7 7-7 7' stroke='%230c0c0c' stroke-width='2' fill='none'/%3E%3C/svg%3E") center / 22px no-repeat;
    transition: transform .2s ease-out
}

#contact-form .mktoForm .mktoButtonWrap .mktoButton:hover,
#contact-form .mktoForm .mktoButtonWrap .mktoButton:focus-visible {
    background: var(--hd-ink) !important;
    color: #fff !important
}

#contact-form .mktoForm .mktoButtonWrap .mktoButton:hover::after {
    transform: translateX(3px)
}

/* Error messages */
#contact-form .mktoForm .mktoError {
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    top: 100% !important;
    z-index: 5
}

#contact-form .mktoForm .mktoError .mktoErrorArrowWrap {
    display: none !important
}

#contact-form .mktoForm .mktoError .mktoErrorMsg {
    margin-top: 6px !important;
    padding: 6px 10px !important;
    max-width: none !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: var(--hd-red) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-size: 13px !important;
    line-height: 18px !important;
    color: #fff !important
}

/* Mobile: one field per row */
@media (max-width:575.98px) {
    #contact-form .mktoForm .mktoFormRow {
        grid-template-columns: minmax(0, 1fr)
    }

    #contact-form .mktoForm .mktoFormRow > .mktoFieldDescriptor {
        grid-column: 1 / -1
    }
}
/* Space between "Get in Touch" and the first fields */
#contact-form .mktoForm {
    margin-top: 28px !important;
    container-type: inline-size
}

/* Narrow form (desktop card and mobile): slightly smaller text so long placeholders fit,
   e.g. "Phone (include country code)" */
@container (max-width: 560px) {
    #contact-form .mktoForm input[type="text"],
    #contact-form .mktoForm input[type="email"],
    #contact-form .mktoForm input[type="tel"],
    #contact-form .mktoForm input[type="url"],
    #contact-form .mktoForm input[type="number"],
    #contact-form .mktoForm select.mktoField,
    #contact-form .mktoForm textarea.mktoField {
        padding-left: 14px !important;
        font-size: 14px !important
    }

    #contact-form .mktoForm input[type="text"],
    #contact-form .mktoForm input[type="email"],
    #contact-form .mktoForm input[type="tel"],
    #contact-form .mktoForm input[type="url"],
    #contact-form .mktoForm input[type="number"],
    #contact-form .mktoForm textarea.mktoField {
        padding-right: 14px !important
    }

    #contact-form .mktoForm select.mktoField {
        background-position: right 14px center !important
    }
}

/* Very small phones */
@container (max-width: 300px) {
    #contact-form .mktoForm input[type="text"],
    #contact-form .mktoForm input[type="email"],
    #contact-form .mktoForm input[type="tel"],
    #contact-form .mktoForm input[type="url"],
    #contact-form .mktoForm input[type="number"],
    #contact-form .mktoForm textarea.mktoField {
        padding-left: 12px !important;
        padding-right: 12px !important;
        font-size: 13px !important
    }

    #contact-form .mktoForm select.mktoField {
        padding-left: 12px !important;
        font-size: 13px !important;
        background-position: right 12px center !important
    }
}

@media (max-width: 575.98px) {
    #contact-form .mktoForm {
        margin-top: 24px !important
    }
}
/* Error message: small red text under the field (not a tooltip over it) */
#contact-form .mktoForm .mktoError {
    position: static !important;
    display: block;
    width: 100% !important;
    margin: 0 !important
}

#contact-form .mktoForm .mktoError .mktoErrorArrowWrap {
    display: none !important
}

#contact-form .mktoForm .mktoError .mktoErrorMsg {
    display: block !important;
    max-width: none !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    color: var(--hd-red) !important
}

/* Checkbox: red box with a centred white tick when checked */
#contact-form .mktoForm .mktoCheckboxList > label::before {
    transition: background-color .15s ease-out, border-color .15s ease-out
}

#contact-form .mktoForm .mktoCheckboxList > label::after {
    left: 10px !important;
    top: 11px !important;
    width: 10px !important;
    height: 6px !important;
    border-left: 2px solid #fff !important;
    border-bottom: 2px solid #fff !important;
    transform: translate(-50%, -65%) rotate(-45deg) !important
}

#contact-form .mktoForm .mktoCheckboxList input[type="checkbox"]:checked + label::before {
    background: var(--hd-red) !important;
    border-color: var(--hd-red) !important
}
/* ==========================Contact page marketo form end============================ */