/* HUMAN AID PREMIUM HEADER: START */
.hat-premium-header{position:relative;z-index:50;background:#fff;font-family:"Hind Siliguri","Noto Sans Bengali",sans-serif}
.hat-premium-header svg{display:block;width:20px;height:20px;fill:currentColor}
.hat-topbar{background:linear-gradient(90deg,#06142d,#061c3b 54%,#071a35);color:#f4f8ff}
.hat-topbar-inner{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.hat-topbar-left,.hat-topbar-links,.hat-top-item{display:flex;align-items:center}
.hat-topbar-left{gap:16px}
.hat-top-item{gap:9px;font-size:14px;font-weight:500}
.hat-top-divider{width:1px;height:24px;background:rgba(255,255,255,.28)}
.hat-date-secondary{opacity:.92}
.hat-topbar-links{gap:0}
.hat-topbar-links a{display:flex;align-items:center;gap:8px;padding:0 18px;border-left:1px solid rgba(255,255,255,.18);font-size:14px;font-weight:600;white-space:nowrap}
.hat-topbar-links a:first-child{border-left:0}
.hat-topbar-links a:hover{color:#8fd8ff}

.hat-info-strip{border-bottom:1px solid #e3eaf1;background:#fbfdff}
.hat-info-strip-inner{min-height:58px;display:flex;align-items:center;justify-content:flex-end;gap:22px;color:#415066}
.hat-weather,.hat-market-item,.hat-prayer-item{display:flex;align-items:center;gap:9px;font-size:14px;white-space:nowrap}
.hat-weather-icon{font-size:26px;line-height:1}
.hat-info-muted{color:#728093}
.hat-info-divider{width:1px;height:31px;background:#d8e1ea}
.hat-market-item svg{color:#f3a300}
.hat-prayer-item svg{color:#0b5b91}

.hat-brand-zone{background:radial-gradient(circle at 24% 45%,rgba(21,112,205,.07),transparent 25%),linear-gradient(180deg,#fff,#f8fbfe)}
.hat-brand-zone-inner{min-height:168px;display:flex;align-items:center;gap:38px}
.hat-brand{display:flex;align-items:center;min-width:420px}
.hat-brand img{display:block;max-width:430px;max-height:125px;object-fit:contain}
.hat-brand-fallback{color:#0755b5;font-size:40px;font-weight:800}
.hat-brand small{display:block;color:#285b45}
.hat-search{margin-left:auto;display:flex;align-items:center;width:min(690px,100%);height:68px;overflow:hidden;border:1px solid #d8e2ec;border-radius:999px;background:#fff;box-shadow:0 16px 38px rgba(30,64,97,.1)}
.hat-search>svg{margin-left:26px;color:#7d8a99;width:25px;height:25px}
.hat-search input{flex:1;min-width:0;height:100%;padding:0 18px;border:0;outline:0;background:transparent;font-size:18px}
.hat-search button{display:flex;align-items:center;justify-content:center;gap:9px;align-self:stretch;min-width:145px;border:0;border-radius:999px 0 0 999px;background:linear-gradient(135deg,#0757bd,#063b79);color:#fff;font-size:19px;font-weight:700;cursor:pointer}
.hat-search button svg{width:23px;height:23px}
.hat-mobile-toggle{display:none;margin-left:auto;border:0;background:#073f80;border-radius:10px;padding:11px}
.hat-mobile-toggle span{display:block;width:24px;height:2px;margin:5px;background:#fff}

.hat-quick-panel{padding:0 0 18px;background:#fff}
.hat-quick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));overflow:hidden;border:1px solid #dde6ee;border-radius:15px;background:#fff;box-shadow:0 9px 26px rgba(26,61,92,.06)}
.hat-quick-grid>a{display:flex;align-items:center;gap:13px;min-height:86px;padding:15px 19px;border-left:1px solid #e6edf3}
.hat-quick-grid>a:first-child{border-left:0}
.hat-quick-grid>a:hover{background:#f5f9fd}
.hat-quick-icon{display:grid;place-items:center;width:42px;height:42px;color:#0b4f91;font-size:35px;font-weight:700}
.hat-quick-icon.hot{font-size:28px}.hat-quick-icon.star{color:#f4aa0b}.hat-quick-icon.shield{border-radius:12px;background:#0b56a3;color:#fff;font-size:24px}.hat-quick-icon.map{font-size:31px}.hat-quick-icon.aid{color:#d92727}
.hat-quick-grid strong,.hat-quick-grid small{display:block}
.hat-quick-grid strong{color:#183856;font-size:16px}
.hat-quick-grid small{margin-top:3px;color:#768393;font-size:12px}

.hat-main-nav{background:linear-gradient(90deg,#062b63,#062d6f 60%,#061d4c);color:#fff;box-shadow:0 4px 14px rgba(5,35,78,.15)}
.hat-nav-inner{display:flex;align-items:stretch;min-height:66px}
.hat-home-link,.hat-nav-item>a{display:flex;align-items:center;justify-content:center;gap:5px;min-height:66px;padding:0 18px;white-space:nowrap;font-size:15px;font-weight:600}
.hat-home-link{min-width:62px;background:rgba(255,255,255,.06)}
.hat-home-link svg{width:26px;height:26px}
.hat-nav-item{position:relative}
.hat-nav-item>a svg{width:17px;height:17px}
.hat-nav-item:hover>a,.hat-nav-item.is-active>a,.hat-home-link:hover{background:linear-gradient(135deg,#0870d2,#0753ad)}
.hat-submenu{position:absolute;top:100%;left:0;z-index:80;width:220px;padding:9px;border:1px solid #dce6ef;border-radius:0 0 12px 12px;background:#fff;box-shadow:0 18px 40px rgba(16,50,80,.16);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}
.hat-submenu a{display:block;padding:10px 12px;border-radius:7px;color:#17344e}
.hat-submenu a:hover{background:#eef6ff;color:#0755af}
.hat-nav-item:hover .hat-submenu{opacity:1;visibility:visible;transform:none}

.hat-breaking-wrap{padding:18px 0;background:#fff}
.hat-breaking{display:flex;align-items:center;min-height:58px;overflow:hidden;border-radius:14px;background:linear-gradient(90deg,#052e66,#063c7b 55%,#06285e);color:#fff;box-shadow:0 10px 26px rgba(6,46,102,.13)}
.hat-breaking>strong{display:flex;align-items:center;gap:8px;align-self:stretch;padding:0 20px;border-radius:12px;background:linear-gradient(135deg,#ff2b2b,#e10909);font-size:15px;white-space:nowrap}
.hat-breaking-viewport{flex:1;min-width:0;overflow:hidden}
.hat-breaking-track{display:flex;width:max-content;animation:hatTicker 36s linear infinite}
.hat-breaking-track.is-paused{animation-play-state:paused}
.hat-breaking-track a{position:relative;display:block;padding:0 32px;color:#fff;white-space:nowrap;font-size:14px}
.hat-breaking-track a:before{content:"•";position:absolute;left:8px;color:#fff}
.hat-breaking>button{display:grid;place-items:center;width:44px;height:44px;margin-right:8px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-weight:800;cursor:pointer}
@keyframes hatTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media(max-width:1180px){
.hat-brand{min-width:330px}.hat-brand img{max-width:330px}.hat-search{width:min(560px,100%)}
.hat-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.hat-quick-grid>a:nth-child(4){border-left:0}
.hat-nav-inner{overflow-x:auto;scrollbar-width:none}.hat-nav-inner::-webkit-scrollbar{display:none}
}
@media(max-width:820px){
.hat-topbar-inner{min-height:46px}.hat-date-secondary,.hat-topbar-links a:nth-child(2),.hat-topbar-links a:nth-child(3){display:none}
.hat-topbar-links a{padding:0 10px}
.hat-info-strip-inner{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}
.hat-brand-zone-inner{min-height:104px}.hat-brand{min-width:0}.hat-brand img{max-width:230px;max-height:78px}
.hat-search{display:none}.hat-mobile-toggle{display:block}
.hat-quick-panel{padding-bottom:12px}.hat-quick-grid{display:flex;overflow-x:auto;border-radius:0;box-shadow:none}
.hat-quick-grid>a{min-width:180px;min-height:72px}.hat-quick-grid small{display:none}
.hat-main-nav{display:none}.hat-main-nav.is-open{display:block}
.hat-nav-inner{display:block;padding:10px 0}.hat-home-link,.hat-nav-item>a{justify-content:flex-start;min-height:46px;padding:0 16px}
.hat-submenu{position:static;display:none;width:auto;border:0;border-radius:0;box-shadow:none;opacity:1;visibility:visible;transform:none}
.hat-nav-item:hover .hat-submenu{display:block}
.hat-breaking-wrap{padding:10px 0}.hat-breaking{min-height:48px;border-radius:9px}.hat-breaking>strong{padding:0 13px;font-size:13px}.hat-breaking-track a{font-size:13px}
}
@media(max-width:520px){
.hat-top-item{font-size:12px}.hat-topbar-links a{font-size:12px}.hat-topbar-links svg{display:none}
.hat-info-strip{display:none}.hat-brand img{max-width:205px}.hat-brand-zone-inner{min-height:92px}
.hat-quick-grid>a{min-width:155px;padding:11px 13px}.hat-quick-icon{width:34px;height:34px;font-size:27px}.hat-quick-grid strong{font-size:14px}
.hat-breaking>strong span{display:none}
}
/* HUMAN AID PREMIUM HEADER: END */

/* PREMIUM HEADER COMPACT OVERRIDE: START */

/*
 | Compact desktop header
 | Approximate total height:
 | topbar 42 + info 42 + branding 112 +
 | shortcuts 66 + nav 54 + ticker 52
 */

@media (min-width: 821px) {

    /* Keep header within normal desktop width */
    .hat-premium-header .container {
        width: min(1320px, calc(100% - 40px)) !important;
    }

    /* Top utility bar */
    .hat-topbar-inner {
        min-height: 42px !important;
    }

    .hat-top-item,
    .hat-topbar-links a {
        font-size: 13px !important;
    }

    .hat-topbar-links a {
        padding-inline: 14px !important;
    }

    .hat-topbar-left {
        gap: 13px !important;
    }

    .hat-top-divider {
        height: 20px !important;
    }

    /* Weather, market and clock */
    .hat-info-strip-inner {
        min-height: 42px !important;
        gap: 16px !important;
    }

    .hat-weather,
    .hat-market-item,
    .hat-prayer-item {
        gap: 7px !important;
        font-size: 13px !important;
    }

    .hat-weather-icon {
        font-size: 21px !important;
    }

    .hat-info-divider {
        height: 23px !important;
    }

    /* Main logo and search row */
    .hat-brand-zone-inner {
        min-height: 112px !important;
        gap: 28px !important;
    }

    .hat-brand {
        min-width: 285px !important;
        max-width: 350px !important;
    }

    .hat-brand img {
        width: auto !important;
        height: auto !important;
        max-width: 305px !important;
        max-height: 88px !important;
        object-fit: contain !important;
    }

    .hat-search {
        width: min(660px, 100%) !important;
        height: 56px !important;
        box-shadow: 0 10px 25px rgba(30,64,97,.08) !important;
    }

    .hat-search > svg {
        width: 21px !important;
        height: 21px !important;
        margin-left: 21px !important;
    }

    .hat-search input {
        padding-inline: 14px !important;
        font-size: 16px !important;
    }

    .hat-search button {
        min-width: 135px !important;
        font-size: 17px !important;
    }

    .hat-search button svg {
        width: 20px !important;
        height: 20px !important;
    }

    /* Quick access strip */
    .hat-quick-panel {
        padding-bottom: 10px !important;
    }

    .hat-quick-grid {
        border-radius: 12px !important;
    }

    .hat-quick-grid > a {
        min-height: 66px !important;
        gap: 9px !important;
        padding: 9px 13px !important;
    }

    .hat-quick-icon {
        width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
        font-size: 26px !important;
    }

    .hat-quick-icon.hot {
        font-size: 22px !important;
    }

    .hat-quick-icon.star {
        font-size: 27px !important;
    }

    .hat-quick-icon.shield {
        border-radius: 9px !important;
        font-size: 19px !important;
    }

    .hat-quick-icon.map {
        font-size: 24px !important;
    }

    .hat-quick-grid strong {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }

    .hat-quick-grid small {
        margin-top: 1px !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    /* Main category navigation */
    .hat-nav-inner {
        min-height: 54px !important;
    }

    .hat-home-link,
    .hat-nav-item > a {
        min-height: 54px !important;
        padding-inline: 14px !important;
        font-size: 14px !important;
    }

    .hat-home-link {
        min-width: 56px !important;
    }

    .hat-home-link svg {
        width: 21px !important;
        height: 21px !important;
    }

    /* Breaking ticker */
    .hat-breaking-wrap {
        padding-block: 10px !important;
    }

    .hat-breaking {
        min-height: 48px !important;
        border-radius: 10px !important;
    }

    .hat-breaking > strong {
        padding-inline: 16px !important;
        border-radius: 9px !important;
        font-size: 14px !important;
    }

    .hat-breaking-track a {
        padding-inline: 27px !important;
        font-size: 13px !important;
    }

    .hat-breaking > button {
        width: 36px !important;
        height: 36px !important;
        margin-right: 6px !important;
    }
}

/* Common laptop screens */
@media (min-width: 821px) and (max-width: 1366px) {

    .hat-premium-header .container {
        width: min(1240px, calc(100% - 28px)) !important;
    }

    .hat-brand-zone-inner {
        min-height: 100px !important;
    }

    .hat-brand {
        min-width: 235px !important;
        max-width: 280px !important;
    }

    .hat-brand img {
        max-width: 245px !important;
        max-height: 76px !important;
    }

    .hat-search {
        width: min(610px, 100%) !important;
        height: 52px !important;
    }

    .hat-search button {
        min-width: 122px !important;
    }

    .hat-quick-grid > a {
        min-height: 60px !important;
        padding: 8px 10px !important;
    }

    .hat-quick-grid small {
        display: none !important;
    }

    .hat-quick-grid strong {
        font-size: 13px !important;
    }

    .hat-home-link,
    .hat-nav-item > a {
        padding-inline: 11px !important;
        font-size: 13.5px !important;
    }
}

/* Very wide desktops should not stretch indefinitely */
@media (min-width: 1600px) {
    .hat-premium-header .container {
        width: min(1400px, calc(100% - 56px)) !important;
    }
}

/* PREMIUM HEADER COMPACT OVERRIDE: END */

/* DYNAMIC TOPBAR WEATHER CLOCK: START */

.hat-topbar-inner {
    min-height: 46px;
}

.hat-topbar-left {
    flex: 1;
    min-width: 0;
    gap: 12px;
}

.hat-top-weather {
    gap: 6px;
}

.hat-top-weather-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 24px;
    height: 24px;

    font-size: 20px;
    line-height: 1;
}

.hat-top-weather strong,
.hat-top-clock strong {
    font-weight: 700;
}

.hat-top-weather-text {
    color: rgba(255,255,255,.78);
}

.hat-top-clock {
    gap: 7px;
}

.hat-top-clock svg {
    width: 17px !important;
    height: 17px !important;
}

.hat-info-strip {
    display: none !important;
}

.hat-brand-zone-inner {
    min-height: 100px !important;
}

@media (max-width: 1180px) {
    .hat-top-weather-text {
        display: none;
    }

    .hat-date-secondary {
        display: none;
    }
}

@media (max-width: 820px) {
    .hat-topbar-left {
        gap: 8px;
    }

    .hat-top-divider {
        display: none;
    }

    .hat-topbar-left .hat-top-item:first-child {
        flex: 1;
    }

    .hat-top-weather {
        display: flex;
    }

    .hat-top-clock span:not([data-clock]) {
        display: none;
    }

    .hat-topbar-links a {
        padding-inline: 8px !important;
    }
}

@media (max-width: 620px) {
    .hat-topbar-inner {
        min-height: 43px;
    }

    .hat-topbar-left .hat-top-item:first-child svg {
        display: none !important;
    }

    .hat-topbar-left .hat-top-item:first-child {
        font-size: 11px !important;
    }

    .hat-top-weather {
        font-size: 11px !important;
    }

    .hat-top-weather-icon {
        width: 18px;
        height: 18px;
        font-size: 16px;
    }

    .hat-top-clock {
        font-size: 11px !important;
    }

    .hat-topbar-links {
        display: none;
    }
}

/* DYNAMIC TOPBAR WEATHER CLOCK: END */

/* HEADER BANGLA CLEANUP: START */

/* Shortcut row has been removed from Blade; this prevents stale cache display. */
.hat-quick-panel {
    display: none !important;
}

/* Never show the old English date. */
.hat-date-secondary,
[data-current-date-en] {
    display: none !important;
}

.hat-topbar-left {
    gap: 11px !important;
}

.hat-top-clock strong {
    white-space: nowrap;
}

.hat-brand-zone-inner {
    min-height: 96px !important;
}

@media (max-width: 820px) {
    .hat-brand-zone-inner {
        min-height: 84px !important;
    }
}

/* HEADER BANGLA CLEANUP: END */

/* FIXED DATABASE MENU HIERARCHY: START */

.hat-nav-inner {
    display: flex !important;
    align-items: stretch;
    min-height: 54px !important;

    overflow-x: auto;
    overflow-y: visible;

    scrollbar-width: none;
    overscroll-behavior-x: contain;
}

.hat-nav-inner::-webkit-scrollbar {
    display: none;
}

.hat-home-link,
.hat-nav-item {
    flex: 0 0 auto;
}

.hat-home-link,
.hat-nav-item > a {
    min-height: 54px !important;
}

.hat-nav-item > a {
    display: flex;
    align-items: center;
    gap: 5px;

    padding-inline: 14px !important;

    color: #fff;
    font-size: 14px !important;
    font-weight: 600;
    white-space: nowrap;
}

.hat-nav-item > a > svg {
    width: 16px !important;
    height: 16px !important;
    transition: transform .2s ease;
}

.hat-nav-item:hover > a > svg {
    transform: rotate(180deg);
}

.hat-nav-item {
    position: relative;
}

/*
 | Dropdown remains attached to its real database parent.
 */
.hat-nav-item .hat-submenu {
    position: fixed;
    z-index: 999;

    display: grid;
    min-width: 220px;
    max-width: 280px;
    padding: 9px;

    border: 1px solid #dce6ef;
    border-radius: 0 0 12px 12px;

    background: #fff;
    box-shadow: 0 18px 40px rgba(16,50,80,.18);

    opacity: 0;
    visibility: hidden;
    transform: translateY(7px);
    pointer-events: none;

    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s ease;
}

.hat-nav-item:hover .hat-submenu,
.hat-nav-item:focus-within .hat-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.hat-nav-item .hat-submenu a {
    display: block;
    padding: 10px 12px;

    border-radius: 7px;

    color: #17344e;
    font-size: 14px;
    font-weight: 500;
    white-space: normal;
}

.hat-nav-item .hat-submenu a:hover,
.hat-nav-item .hat-submenu a.is-active {
    color: #0755af;
    background: #eef6ff;
}

/* Permanent More parent remains at the end of DB menu order. */
.hat-more-category {
    margin-left: 0;
}

/* Laptop */
@media (min-width: 821px) and (max-width: 1366px) {
    .hat-nav-item > a {
        padding-inline: 11px !important;
        font-size: 13.5px !important;
    }
}

/* Mobile menu */
@media (max-width: 820px) {
    .hat-nav-inner {
        display: block !important;
        overflow: visible;
        padding-block: 9px;
    }

    .hat-home-link,
    .hat-nav-item > a {
        justify-content: flex-start;
        width: 100%;
        min-height: 46px !important;
        padding-inline: 16px !important;
    }

    .hat-nav-item .hat-submenu {
        position: static;

        display: none;
        min-width: 0;
        max-width: none;
        width: 100%;
        padding: 4px 12px 8px 28px;

        border: 0;
        border-radius: 0;

        box-shadow: none;

        opacity: 1;
        visibility: visible;
        transform: none;
        pointer-events: auto;
    }

    .hat-nav-item:hover .hat-submenu,
    .hat-nav-item:focus-within .hat-submenu {
        display: grid;
    }
}

/* FIXED DATABASE MENU HIERARCHY: END */

/* PRESENTATION ONLY MORE MENU: START */

.hat-more-category {
    position: relative;
    flex: 0 0 auto;
}

.hat-more-category-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    min-height: 54px;
    padding: 0 14px;

    border: 0;
    background: transparent;
    color: #fff;

    font: inherit;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.hat-more-category-button svg {
    width: 16px !important;
    height: 16px !important;
    transition: transform .2s ease;
}

.hat-more-category:hover .hat-more-category-button,
.hat-more-category:focus-within .hat-more-category-button,
.hat-more-category.is-active .hat-more-category-button {
    background: linear-gradient(135deg, #0870d2, #0753ad);
}

.hat-more-category:hover .hat-more-category-button svg,
.hat-more-category:focus-within .hat-more-category-button svg {
    transform: rotate(180deg);
}

.hat-more-category .hat-submenu {
    right: 0;
    left: auto;
}

@media (max-width: 820px) {
    .hat-more-category-button {
        justify-content: flex-start;
        width: 100%;
        min-height: 46px;
        padding-inline: 16px;
    }
}

/* PRESENTATION ONLY MORE MENU: END */

/* RESPONSIVE FRONTEND MORE MENU: START */

.hat-main-nav {
    overflow: visible;
}

.hat-nav-inner {
    display: flex !important;
    align-items: stretch;

    width: 100%;
    max-width: none !important;
    min-height: 54px !important;
    padding: 0 !important;

    overflow: visible !important;
}

.hat-home-link {
    flex: 0 0 108px;
    min-width: 108px;
    min-height: 54px !important;
}

.hat-nav-primary {
    display: flex;
    align-items: stretch;

    flex: 1 1 auto;
    min-width: 0;

    overflow: hidden;
}

.hat-nav-primary > .hat-nav-item {
    flex: 0 0 auto;
}

.hat-nav-primary > .hat-nav-item[hidden] {
    display: none !important;
}

.hat-nav-primary > .hat-nav-item > a {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 54px !important;
    padding: 0 14px !important;

    color: #fff;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.hat-more-category {
    position: relative;
    flex: 0 0 auto;
    margin-left: 0 !important;
}

.hat-more-category[hidden] {
    display: none !important;
}

.hat-more-category-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    min-width: 82px;
    min-height: 54px;
    padding: 0 14px;

    border: 0;
    background: transparent;
    color: #fff;

    font: inherit;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.hat-more-category-button:hover,
.hat-more-category.is-open .hat-more-category-button,
.hat-more-category:focus-within .hat-more-category-button {
    background: rgba(255,255,255,.10);
}

.hat-more-category-button svg {
    width: 16px !important;
    height: 16px !important;
    transition: transform .2s ease;
}

.hat-more-category.is-open .hat-more-category-button svg,
.hat-more-category:focus-within .hat-more-category-button svg {
    transform: rotate(180deg);
}

.hat-responsive-more-menu {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    z-index: 9999;

    display: grid;
    width: 230px;
    min-width: 230px;
    max-height: min(70vh, 520px);
    padding: 8px;
    overflow-y: auto;

    border: 1px solid #dbe5ef;
    border-radius: 0 0 12px 12px;

    background: #fff;
    box-shadow: 0 18px 42px rgba(10,45,80,.20);

    opacity: 0;
    visibility: hidden;
    transform: translateY(7px);
    pointer-events: none;

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}

.hat-more-category:hover .hat-responsive-more-menu,
.hat-more-category:focus-within .hat-responsive-more-menu,
.hat-more-category.is-open .hat-responsive-more-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.hat-responsive-more-menu a {
    display: block;
    padding: 10px 12px;

    border-radius: 7px;

    color: #17344e;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.hat-responsive-more-menu a:hover,
.hat-responsive-more-menu a.is-active {
    color: #0755af;
    background: #eef6ff;
}

@media (min-width: 821px) and (max-width: 1500px) {
    .hat-home-link {
        flex-basis: 74px;
        min-width: 74px;
    }

    .hat-nav-primary > .hat-nav-item > a {
        padding-inline: 12px !important;
        font-size: 13.5px !important;
    }

    .hat-more-category-button {
        min-width: 76px;
        padding-inline: 11px;
        font-size: 13.5px;
    }
}

/*
 | Mobile uses the regular collapsible navigation.
 | Responsive overflow is desktop/tablet only.
 */
@media (max-width: 820px) {
    .hat-nav-inner {
        display: block !important;
        padding-block: 8px !important;
    }

    .hat-home-link {
        width: 100%;
        min-width: 0;
        min-height: 46px !important;
    }

    .hat-nav-primary {
        display: block;
        overflow: visible;
    }

    .hat-nav-primary > .hat-nav-item {
        display: block !important;
    }

    .hat-nav-primary > .hat-nav-item > a {
        justify-content: flex-start;
        width: 100%;
        min-height: 46px !important;
        padding-inline: 16px !important;
    }

    .hat-more-category {
        display: none !important;
    }
}

/* RESPONSIVE FRONTEND MORE MENU: END */

/* HEADER FOOTER LOGO SIZE FIX: START */

/* =========================
   DESKTOP HEADER LOGO
   ========================= */

.hat-brand {
    display: flex !important;
    align-items: center !important;
    min-width: 245px !important;
    max-width: 330px !important;
}

.hat-brand img {
    display: block !important;

    width: auto !important;
    height: auto !important;

    max-width: 285px !important;
    max-height: 78px !important;

    object-fit: contain !important;
}

/* Reduce the total logo/search row height */
.hat-brand-zone-inner {
    min-height: 98px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

/* =========================
   DESKTOP FOOTER LOGO
   ========================= */

.hat-footer-logo,
.footer-logo,
.site-footer-logo,
.footer-brand img,
.footer-brand-logo,
.footer-logo-link img,
.hat-footer-brand img,
.site-footer .brand-logo,
.site-footer .logo img,
footer .footer-logo img {
    display: block !important;

    width: auto !important;
    height: auto !important;

    max-width: 190px !important;
    max-height: 70px !important;

    object-fit: contain !important;
}

/*
 | Remove oversized logo wrapper dimensions.
 */
.footer-brand,
.footer-logo-wrap,
.footer-logo-link,
.hat-footer-brand,
.site-footer .brand,
.site-footer .logo {
    min-width: 0 !important;
    min-height: 0 !important;
}

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

@media (max-width: 991px) {

    .hat-brand {
        min-width: 205px !important;
        max-width: 255px !important;
    }

    .hat-brand img {
        max-width: 225px !important;
        max-height: 66px !important;
    }

    .hat-brand-zone-inner {
        min-height: 86px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    .hat-footer-logo,
    .footer-logo,
    .site-footer-logo,
    .footer-brand img,
    .footer-brand-logo,
    .footer-logo-link img,
    .hat-footer-brand img,
    .site-footer .brand-logo,
    .site-footer .logo img,
    footer .footer-logo img {
        max-width: 160px !important;
        max-height: 60px !important;
    }
}

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

@media (max-width: 820px) {

    .hat-brand-zone-inner {
        display: flex !important;
        align-items: center !important;

        min-height: 76px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    .hat-brand {
        flex: 0 0 auto !important;

        min-width: 0 !important;
        max-width: 185px !important;
    }

    .hat-brand img {
        width: auto !important;
        height: auto !important;

        max-width: 175px !important;
        max-height: 54px !important;
    }

    .hat-footer-logo,
    .footer-logo,
    .site-footer-logo,
    .footer-brand img,
    .footer-brand-logo,
    .footer-logo-link img,
    .hat-footer-brand img,
    .site-footer .brand-logo,
    .site-footer .logo img,
    footer .footer-logo img {
        width: auto !important;
        height: auto !important;

        max-width: 135px !important;
        max-height: 50px !important;

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

    .footer-brand,
    .footer-logo-wrap,
    .footer-logo-link,
    .hat-footer-brand,
    .site-footer .brand,
    .site-footer .logo {
        justify-content: center !important;
        text-align: center !important;
    }
}

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

@media (max-width: 480px) {

    .hat-brand-zone-inner {
        min-height: 68px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
    }

    .hat-brand {
        max-width: 155px !important;
    }

    .hat-brand img {
        max-width: 150px !important;
        max-height: 46px !important;
    }

    .hat-footer-logo,
    .footer-logo,
    .site-footer-logo,
    .footer-brand img,
    .footer-brand-logo,
    .footer-logo-link img,
    .hat-footer-brand img,
    .site-footer .brand-logo,
    .site-footer .logo img,
    footer .footer-logo img {
        max-width: 115px !important;
        max-height: 44px !important;
    }
}

/* HEADER FOOTER LOGO SIZE FIX: END */

/* HEADER SUBMENU RESTORE: START */

.hat-nav-item {
    position: relative;
}

.hat-nav-item > a {
    display: flex;
    align-items: center;
    gap: 5px;
}

.hat-nav-arrow {
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 15px !important;
    transition: transform .18s ease;
}

.hat-nav-item.has-children:hover > a .hat-nav-arrow,
.hat-nav-item.has-children:focus-within > a .hat-nav-arrow {
    transform: rotate(180deg);
}

/* First-level child menu */
.hat-nav-item > .hat-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10000;

    display: grid;
    min-width: 220px;
    max-width: 290px;
    padding: 8px;

    border: 1px solid #dbe5ef;
    border-radius: 0 0 12px 12px;

    background: #fff;
    box-shadow: 0 18px 42px rgba(12, 43, 77, .18);

    opacity: 0;
    visibility: hidden;
    transform: translateY(7px);
    pointer-events: none;

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}

.hat-nav-item.has-children:hover > .hat-submenu,
.hat-nav-item.has-children:focus-within > .hat-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.hat-nav-item > .hat-submenu > a {
    display: block;
    width: 100%;
    padding: 10px 12px;

    border-radius: 7px;

    color: #17344e;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    white-space: normal;
    text-decoration: none;
}

.hat-nav-item > .hat-submenu > a:hover,
.hat-nav-item > .hat-submenu > a.is-active {
    color: #0755af;
    background: #edf6ff;
}

/* Overflow More dropdown items */
.hat-responsive-more-menu > .hat-overflow-menu-item {
    display: block !important;
    width: 100%;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item
> a {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    min-height: 0 !important;
    padding: 10px 12px !important;

    border-radius: 7px;

    color: #17344e !important;
    background: transparent !important;

    font-size: 14px !important;
    font-weight: 600;
    white-space: normal;
}

/* Nested submenu inside More */
.hat-responsive-more-menu
> .hat-overflow-menu-item
> .hat-submenu {
    position: static;

    display: none;
    min-width: 0;
    max-width: none;
    width: 100%;
    padding: 3px 0 4px 14px;

    border: 0;
    border-radius: 0;

    background: transparent;
    box-shadow: none;

    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children:hover
> .hat-submenu,
.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children:focus-within
> .hat-submenu {
    display: grid;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item
> .hat-submenu
> a {
    padding: 8px 10px;
    font-size: 13px;
}

/* Mobile */
@media (max-width: 820px) {
    .hat-nav-item > .hat-submenu {
        position: static;

        display: none;
        min-width: 0;
        max-width: none;
        width: 100%;
        padding: 3px 12px 8px 28px;

        border: 0;
        border-radius: 0;

        background: rgba(255,255,255,.05);
        box-shadow: none;

        opacity: 1;
        visibility: visible;
        transform: none;
        pointer-events: auto;
    }

    .hat-nav-item.has-children:hover > .hat-submenu,
    .hat-nav-item.has-children:focus-within > .hat-submenu {
        display: grid;
    }

    .hat-nav-item > .hat-submenu > a {
        color: rgba(255,255,255,.90);
        background: transparent;
    }

    .hat-nav-item > .hat-submenu > a:hover,
    .hat-nav-item > .hat-submenu > a.is-active {
        color: #fff;
        background: rgba(255,255,255,.10);
    }
}

/* HEADER SUBMENU RESTORE: END */

/* SUBMENU VISIBILITY FINAL FIX: START */

/*
 | The submenu must escape the visible menu row.
 | Width fitting is handled in JavaScript, not by overflow clipping.
 */
.hat-main-nav {
    position: relative !important;
    overflow: visible !important;
    z-index: 1200 !important;
}

.hat-nav-inner {
    position: relative !important;
    overflow: visible !important;
}

.hat-nav-primary {
    display: flex !important;
    align-items: stretch !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;

    overflow: visible !important;
}

.hat-nav-primary > .hat-nav-item {
    position: relative !important;
    flex: 0 0 auto !important;
}

.hat-nav-primary > .hat-nav-item[hidden] {
    display: none !important;
}

/* Parent arrow */
.hat-nav-item.has-children > a {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.hat-nav-arrow {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    flex: 0 0 15px !important;
}

/* Desktop parent submenu */
@media (min-width: 821px) {

    .hat-nav-primary
    > .hat-nav-item.has-children
    > .hat-submenu {
        position: absolute !important;
        top: calc(100% - 1px) !important;
        left: 0 !important;
        right: auto !important;
        z-index: 99999 !important;

        display: grid !important;
        min-width: 230px !important;
        max-width: 300px !important;
        padding: 8px !important;

        border: 1px solid #d9e5ef !important;
        border-top: 3px solid #0870d2 !important;
        border-radius: 0 0 12px 12px !important;

        background: #fff !important;
        box-shadow: 0 18px 44px rgba(8, 37, 70, .22) !important;

        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(8px) !important;
        pointer-events: none !important;

        transition:
            opacity .16s ease,
            visibility .16s ease,
            transform .16s ease !important;
    }

    .hat-nav-primary
    > .hat-nav-item.has-children:hover
    > .hat-submenu,

    .hat-nav-primary
    > .hat-nav-item.has-children:focus-within
    > .hat-submenu,

    .hat-nav-primary
    > .hat-nav-item.has-children.is-submenu-open
    > .hat-submenu {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
    }

    .hat-nav-primary
    > .hat-nav-item.has-children:hover
    > a
    .hat-nav-arrow,

    .hat-nav-primary
    > .hat-nav-item.has-children:focus-within
    > a
    .hat-nav-arrow {
        transform: rotate(180deg) !important;
    }
}

/* Submenu links */
.hat-nav-item > .hat-submenu > a {
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 10px 12px !important;

    border-radius: 7px !important;

    color: #17344e !important;
    background: transparent !important;

    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    white-space: normal !important;
    text-decoration: none !important;
}

.hat-nav-item > .hat-submenu > a:hover,
.hat-nav-item > .hat-submenu > a.is-active {
    color: #0757b1 !important;
    background: #edf6ff !important;
}

/* More container must also allow its nested content */
.hat-more-category {
    position: relative !important;
    overflow: visible !important;
    z-index: 1250 !important;
}

.hat-responsive-more-menu {
    overflow-x: visible !important;
}

/* Each cloned parent inside More */
.hat-responsive-more-menu
> .hat-overflow-menu-item {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item
> a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-height: 0 !important;
    padding: 10px 12px !important;

    color: #17344e !important;
    background: transparent !important;
    border-radius: 7px !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    white-space: normal !important;
}

/*
 | Child list of an overflowed parent.
 | It expands underneath that parent inside More.
 */
.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children
> .hat-submenu {
    position: static !important;

    display: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    padding: 4px 0 5px 14px !important;

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

    background: transparent !important;
    box-shadow: none !important;

    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children:hover
> .hat-submenu,

.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children:focus-within
> .hat-submenu,

.hat-responsive-more-menu
> .hat-overflow-menu-item.has-children.is-submenu-open
> .hat-submenu {
    display: grid !important;
}

.hat-responsive-more-menu
> .hat-overflow-menu-item
> .hat-submenu
> a {
    display: block !important;
    padding: 8px 10px !important;

    border-radius: 6px !important;

    color: #38536a !important;
    background: transparent !important;

    font-size: 13px !important;
    font-weight: 500 !important;
}

/* Mobile submenu */
@media (max-width: 820px) {

    .hat-nav-primary {
        overflow: visible !important;
    }

    .hat-nav-primary
    > .hat-nav-item.has-children
    > .hat-submenu {
        position: static !important;

        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        padding: 4px 12px 8px 28px !important;

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

        background: rgba(255,255,255,.06) !important;
        box-shadow: none !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    .hat-nav-primary
    > .hat-nav-item.has-children.is-submenu-open
    > .hat-submenu,

    .hat-nav-primary
    > .hat-nav-item.has-children:focus-within
    > .hat-submenu {
        display: grid !important;
    }

    .hat-nav-primary
    > .hat-nav-item
    > .hat-submenu
    > a {
        color: rgba(255,255,255,.92) !important;
    }
}

/* SUBMENU VISIBILITY FINAL FIX: END */

/* FINAL MOBILE NAVIGATION FIX: START */

@media (max-width: 820px) {

    /*
     | Navigation remains fully closed until the hamburger
     | adds .is-open to .hat-main-nav.
     */
    .hat-premium-header .hat-main-nav {
        display: none !important;
        width: 100% !important;

        overflow: hidden !important;

        background: #082f70 !important;
    }

    .hat-premium-header .hat-main-nav.is-open {
        display: block !important;
        overflow: visible !important;
    }

    /*
     | Mobile menu is a single vertical column.
     */
    .hat-premium-header .hat-nav-inner {
        display: block !important;

        width: 100% !important;
        min-height: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }

    /*
     | Home is not a separate oversized horizontal strip.
     */
    .hat-premium-header .hat-home-link {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        min-height: 48px !important;
        padding: 0 18px !important;

        border-bottom: 1px solid rgba(255,255,255,.10) !important;

        background: #123f7d !important;
    }

    .hat-premium-header .hat-home-link svg {
        width: 22px !important;
        height: 22px !important;
    }

    /*
     | Every root category occupies one row.
     */
    .hat-premium-header .hat-nav-primary {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;

        overflow: visible !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item {
        position: relative !important;

        display: block !important;

        width: 100% !important;
        min-width: 0 !important;

        border-bottom: 1px solid rgba(255,255,255,.09) !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item[hidden] {
        display: block !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item
    > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;

        padding: 0 18px !important;

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

        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item
    > a:hover,

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item.is-active
    > a {
        background: rgba(255,255,255,.09) !important;
    }

    .hat-premium-header .hat-nav-arrow {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;

        margin-left: auto !important;

        cursor: pointer !important;
    }

    /*
     | A child menu opens only after an explicit mobile tap.
     | Hover/focus rules must not leave it permanently visible.
     */
    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item.has-children
    > .hat-submenu {
        position: static !important;

        display: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 5px 10px 9px 28px !important;

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

        background: rgba(0,0,0,.13) !important;
        box-shadow: none !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item.has-children.is-submenu-open
    > .hat-submenu {
        display: grid !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item.has-children.is-submenu-open
    > a
    .hat-nav-arrow {
        transform: rotate(180deg) !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item
    > .hat-submenu
    > a {
        display: block !important;

        width: 100% !important;
        min-height: 42px !important;

        padding: 10px 12px !important;

        border-radius: 6px !important;

        color: rgba(255,255,255,.90) !important;
        background: transparent !important;

        font-size: 14px !important;
        line-height: 1.35 !important;
        text-align: left !important;
    }

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item
    > .hat-submenu
    > a:hover,

    .hat-premium-header
    .hat-nav-primary
    > .hat-nav-item
    > .hat-submenu
    > a.is-active {
        color: #fff !important;
        background: rgba(255,255,255,.10) !important;
    }

    /*
     | Desktop overflow "More" is unnecessary on mobile because
     | every root category is shown in the vertical menu.
     */
    .hat-premium-header .hat-more-category,
    .hat-premium-header [data-responsive-more] {
        display: none !important;
    }
}

/* FINAL MOBILE NAVIGATION FIX: END */