/* =========================================================
   SAZ BOILERS - VISUAL REFRESH
   Styling-only update. Existing text, links, images and HTML
   content are intentionally preserved.
========================================================= */
:root {
    --saz-navy: #102b4e;
    --saz-blue: #1b5688;
    --saz-red: #ef6b67;
    --saz-text: #344256;
    --saz-muted: #68778a;
    --saz-line: #e3e9f0;
    --saz-soft: #f4f6f9;
    --saz-shadow: 0 8px 28px rgba(16, 43, 78, .08);
}

html { scroll-behavior: smooth; }
body {
    color: var(--saz-text);
    background: #fff;
    -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; }
a { transition: color .25s ease, background-color .25s ease, box-shadow .25s ease, transform .25s ease; }

/* Header / top strip */
.header_top {
    background: linear-gradient(110deg, var(--saz-navy), var(--saz-blue));
}
.headertop_nav { padding: 10px 0; }
.headertop_nav li { text-shadow: none; }
.headertop_nav li a { text-decoration: none; }
.header_bottom { box-shadow: 0 4px 18px rgba(16,43,78,.07); position: relative; z-index: 100; }
.logo { padding: 14px 0; }
.logo img { height: auto; max-width: 100%; }
.navigation { margin-top: 0; }
ul.nav { margin-top: 0; }
.nav > li { background-image: none; }
.nav > li > a {
    padding: 35px 16px;
    background-image: none;
    border-top: 3px solid transparent;
    color: var(--saz-navy);
    font-size: 15px;
    font-weight: 600;
}
.nav > li:hover > a,
.nav > li > a:focus {
    color: #fff;
    border-top-color: var(--saz-red);
    background: var(--saz-navy);
}
.nav > li > ul {
    margin-top: 0;
    top: 100%;
    min-width: 220px;
    border: 1px solid var(--saz-line);
    border-top: 3px solid var(--saz-red);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 14px 30px rgba(16,43,78,.15);
    overflow: visible;
}
.nav li > ul li a {
    padding: 10px 13px;
    color: var(--saz-text);
    font-size: 14px;
    line-height: 1.45;
}
.nav > li > ul li:hover,
.nav ul li:hover > a { background: var(--saz-navy); color: #fff; }
.nav > li > ul li ul { border: 1px solid var(--saz-line); box-shadow: var(--saz-shadow); }

/* General page spacing and headings */
.main { overflow: hidden; }
.reservation_top { padding-top: 28px; padding-bottom: 28px; }
.main_title {
    margin: 15px 0 12px;
    color: var(--saz-navy);
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
}
.divider {
    width: 64px;
    height: 4px;
    margin: 0 auto 28px;
    background: var(--saz-red);
    border-radius: 10px;
}
.txt111 { color: var(--saz-muted); line-height: 1.7; }
.whitesmallhead2 {
    display: inline-block;
    margin: 8px 0 12px;
    color: var(--saz-navy);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
}
.grid-text { color: var(--saz-navy); font-size: 20px; font-weight: 700; }

/* About and text-heavy pages */
.about {
    padding: 28px 30px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 12px;
    box-shadow: var(--saz-shadow);
    text-align: left;
}
.about .mask-2 {
    margin: 0 0 22px;
    padding: 16px 20px;
    color: var(--saz-navy);
    background: var(--saz-soft);
    border-left: 4px solid var(--saz-red);
    border-radius: 0 8px 8px 0;
    font-size: 18px;
    line-height: 1.6;
    text-transform: none;
}
.about p {
    margin: 0 0 20px;
    color: var(--saz-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}
.about .whitesmallhead2 { font-size: 18px; margin: 10px 0 4px; }
#general-info { padding: 0; margin: 12px 0 0; list-style: none; }
#general-info li { padding: 9px 12px; margin-bottom: 7px; background: var(--saz-soft); border-radius: 6px; }
#general-info li i { color: var(--saz-red); margin-right: 9px; }
.staff { padding: 36px 0; background: var(--saz-soft); }
.staff p { color: var(--saz-text); line-height: 1.8; }
.staff_grid { margin-bottom: 22px; }
.staff_grid img { width: 100%; border-radius: 9px; box-shadow: var(--saz-shadow); }
.staff_grid .mask-2 { padding: 12px; background: var(--saz-navy); border-radius: 0 0 8px 8px; }
.staff_grid .mask-2 a { color: #fff; text-decoration: none; }

/* Product tiles: override old extreme zoom animation */
.grids { padding-top: 24px; padding-bottom: 18px; margin-left: -10px; margin-right: -10px; }
.grids > [class*="col-"] { padding-left: 10px; padding-right: 10px; margin-bottom: 22px; }
.view.view-tenth {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 11px;
    box-shadow: 0 5px 20px rgba(16,43,78,.07);
    transition: transform .3s ease, box-shadow .3s ease;
}
.view.view-tenth:hover { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(16,43,78,.14); }
.view-tenth .inner_content, .view-tenth .product_image { overflow: hidden; }
.view-tenth .product_image { position: relative; background: #f0f3f7; }
.view-tenth .product_image > img {
    display: block;
    width: 100%;
    height: 245px;
    object-fit: contain;
    padding: 10px;
    transform: none !important;
    opacity: 1 !important;
    transition: transform .45s ease;
}
.view-tenth:hover .product_image > img { transform: scale(1.045) !important; opacity: 1 !important; }
.view-tenth .mask {
    inset: 0;
    padding: 22px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, rgba(16,43,78,.95), rgba(27,86,136,.94));
    opacity: 0;
    transition: opacity .3s ease;
}
.view-tenth:hover .mask { opacity: 1; }
.view-tenth .mask-1 {
    margin: 0 0 12px;
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(255,255,255,.35);
    color: #fff;
    font-size: 18px;
    line-height: 1.5;
    text-align: center;
    transform: none;
    opacity: 0;
}
.view-tenth .mask-2 {
    padding: 0;
    color: #edf4fb;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
    transform: none;
    opacity: 0;
}
.view-tenth:hover .mask-1,
.view-tenth:hover .mask-2 { transform: none; opacity: 1; }
.view-tenth .info { margin-top: 14px; color: #fff; font-size: 26px; }
.label-product { position: absolute; top: 14px; left: 0; z-index: 3; pointer-events: none; }
.label-product > span {
    position: static;
    padding: 9px 13px;
    color: #fff;
    background: var(--saz-red);
    border-radius: 0 5px 5px 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .3px;
}
.product_container {
    margin-top: 0;
    padding: 22px 18px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 11px;
    box-shadow: 0 5px 20px rgba(16,43,78,.06);
}
.product_container .mask-2 { margin: 0 0 15px; font-size: 17px; line-height: 1.5; }
.product_container .mask-2 a { color: var(--saz-navy); text-decoration: none; }
.product_container .mask-2 a:hover { color: var(--saz-red); }
.underheader-line { width: 60px; border-color: var(--saz-red); margin-bottom: 18px; }
.underheader-line1 h1 { color: var(--saz-text); font-size: 15px; line-height: 1.65; }
.underheader-line1 li { padding: 3px 0; }
.underheader-line1 li a { color: var(--saz-text); text-decoration: none; }
.underheader-line1 li a:hover { color: var(--saz-red); }

/* Product detail content, specification tables and images */
.main .container img.img-responsive { border-radius: 7px; }
.main table { max-width: 100%; }
.customers { width: 100%; border-collapse: collapse; border: 1px solid var(--saz-line); }
.customers td, #customers th { padding: 12px 14px; border: 1px solid var(--saz-line); }
.customers tr:nth-child(even) { background: #f5f7fa; }
.customers tr:hover { background: #eef3f8; }
.customers th { background: var(--saz-navy); color: #fff; }

/* Buttons and enquiry forms */
.btn.btn-primary, a.btn.btn-primary {
    padding: 11px 23px;
    color: #fff;
    background: var(--saz-red);
    border: 1px solid var(--saz-red);
    border-radius: 5px;
    font-weight: 700;
    box-shadow: 0 5px 14px rgba(239,107,103,.18);
    text-decoration: none;
}
.btn.btn-primary:hover, a.btn.btn-primary:hover {
    color: #fff;
    background: var(--saz-navy);
    border-color: var(--saz-navy);
    transform: translateY(-2px);
}
.contact-form input[type="text"], .contact-form textarea,
.comments-area input[type="text"], .comments-area textarea {
    width: 100%;
    max-width: 100%;
    padding: 12px 14px;
    color: var(--saz-text);
    background: #fff;
    border: 1px solid #dbe2eb;
    border-radius: 6px;
    box-shadow: none;
}
.contact-form input:focus, .contact-form textarea:focus,
.comments-area input:focus, .comments-area textarea:focus {
    border-color: var(--saz-blue);
    outline: none;
    box-shadow: 0 0 0 3px rgba(27,86,136,.1);
}

/* Footer */
.footer { background: #0d223d; color: #d5dfeb; }
.footer_top { padding-top: 38px; padding-bottom: 28px; }
.footer .grid-text { margin-bottom: 16px; color: #fff; font-size: 19px; }
.footer .grid-text::after {
    content: "";
    display: block;
    width: 42px;
    height: 3px;
    margin-top: 9px;
    background: var(--saz-red);
    border-radius: 4px;
}
.footer p, .footer .company_address p { color: #c5d0df; font-size: 13px; line-height: 1.9; }
.footer a { color: #e8eef6; text-decoration: none; }
.footer a:hover { color: #ff9994; }
.footer-list ul { padding-left: 0; list-style: none; }
.footer_bottom { padding-top: 18px; padding-bottom: 18px; border-top: 1px solid rgba(255,255,255,.12); }
.copy_right { color: #b8c6d8; }

/* Image and content transitions */
.staff_grid, .history_grid, .post1, .category_widget { transition: box-shadow .25s ease, transform .25s ease; }

/* Tablet */
@media (max-width: 991px) {
    .nav > li > a { padding: 25px 10px; font-size: 14px; }
    .logo { float: none; }
    .navigation { float: none; }
    .view-tenth .product_image > img { height: 220px; }
    .about { padding: 22px; }
}

/* Mobile */
@media (max-width: 767px) {
    .header_bottom { padding-bottom: 8px; }
    .logo { padding: 12px 0; }
    .nav > li > a { padding: 12px 15px; }
    .reservation_top { padding-top: 18px; padding-bottom: 18px; }
    .main_title { font-size: 27px; }
    .about { padding: 18px 15px; }
    .about .mask-2 { font-size: 16px; padding: 13px 14px; }
    .about p { font-size: 14px; line-height: 1.8; }
    .grids { padding-top: 16px; }
    .view-tenth .product_image > img { height: 230px; }
    .view-tenth .mask { padding: 14px; }
    .view-tenth .mask-1 { font-size: 16px; }
    .view-tenth .mask-2 { font-size: 12px; }
    .footer_top { padding-top: 28px; }
    .footer_grid { margin-bottom: 25px; }
}

@media (max-width: 480px) {
    .main_title { font-size: 24px; }
    .whitesmallhead2 { font-size: 19px; }
    .view-tenth .product_image > img { height: 210px; }
    .btn.btn-primary, a.btn.btn-primary { padding: 10px 18px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* =========================================================
   SAZ BOILERS - FOLLOW-UP FIXES
   Styling only: content, links, images and page structure
   remain unchanged.
========================================================= */

/* Keep dropdown menus above banners and page content */
.header {
    position: relative;
    z-index: 10000;
}
.header_top,
.header_bottom {
    position: relative;
    z-index: 10000;
    overflow: visible !important;
}
.header_bottom .container,
.header_bottom .navigation,
.header_bottom .navigation > div,
.header_bottom ul.nav {
    overflow: visible !important;
}
.header_bottom .navigation {
    position: relative;
    z-index: 10020;
}
.header_bottom ul.nav {
    position: relative;
    z-index: 10020;
}
.header_bottom .nav > li {
    position: relative;
    z-index: 10021;
}
.header_bottom .nav > li > ul {
    top: 100% !important;
    margin-top: 0 !important;
    z-index: 10030 !important;
    max-height: min(72vh, 620px);
    overflow-y: auto !important;
    overflow-x: visible !important;
}
.header_bottom .nav > li > ul li ul {
    top: 0 !important;
    left: 100% !important;
    margin-left: 0 !important;
    z-index: 10040 !important;
    max-height: min(72vh, 620px);
    overflow-y: auto !important;
}
.header_bottom .nav li > ul li a {
    white-space: normal;
    min-height: 36px;
}
.header_bottom .nav li:hover > ul,
.header_bottom .nav li:focus-within > ul {
    visibility: visible;
}
.reservation_banner,
.main,
.reservation_top {
    position: relative;
    z-index: 1;
}

/* Product detail area: balanced spacing and cleaner image presentation */
.main .post1 {
    margin: 0 0 28px;
    padding: 22px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 12px;
    box-shadow: 0 7px 24px rgba(16, 43, 78, .055);
    overflow: auto;
}
.main .post1 > .mask-2 {
    display: block;
    margin: 0 0 18px;
    padding: 13px 16px;
    color: var(--saz-navy);
    background: var(--saz-soft);
    border-left: 4px solid var(--saz-red);
    border-radius: 0 7px 7px 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.55;
}
.main .post1 > img.img-responsive,
.main .post1 > div > img.img-responsive {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 460px;
    margin: 14px auto 22px;
    object-fit: contain;
    border-radius: 8px;
}
.main .post1 p {
    color: var(--saz-text);
    font-size: 15px;
    line-height: 1.85;
    margin: 16px 0;
}
.main .post1 strong {
    color: var(--saz-navy);
}
.main .post1 .whitesmallhead1 {
    display: inline-block;
    margin: 14px 0 8px;
    color: var(--saz-navy);
    font-weight: 700;
    line-height: 1.7;
}

/* Consistent, visible enquiry buttons on product pages */
.main nav.cl-effect-7 {
    display: block;
    margin: 18px 0 12px;
    text-align: left;
}
.main nav.cl-effect-7 a,
.main .post1 nav.cl-effect-7 a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 11px 20px;
    color: #fff !important;
    background: var(--saz-red);
    border: 1px solid var(--saz-red);
    border-radius: 5px;
    box-shadow: 0 5px 14px rgba(239, 107, 103, .2);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: .35px;
    transition: background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.main nav.cl-effect-7 a::after {
    content: "\f061";
    font-family: FontAwesome;
    font-size: 12px;
    margin-left: 3px;
}
.main nav.cl-effect-7 a:hover,
.main nav.cl-effect-7 a:focus {
    color: #fff !important;
    background: var(--saz-navy);
    border-color: var(--saz-navy);
    box-shadow: 0 8px 18px rgba(16, 43, 78, .18);
    transform: translateY(-2px);
}

/* Product category sidebar (used on product detail pages) */
.boiler-sidebar {
    position: relative;
    margin-bottom: 28px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(16, 43, 78, .07);
}
.boiler-sidebar-heading {
    background: var(--saz-navy);
    border-bottom: 4px solid var(--saz-red);
}
.boiler-sidebar-heading h2 {
    color: #fff;
    font-size: 19px;
    line-height: 1.5;
}
.boiler-category-list {
    max-height: 740px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #c8d2df #f4f6f9;
}
.boiler-category-list li a {
    overflow-wrap: anywhere;
}

/* Profile / About Us page */
.main .about {
    margin-bottom: 28px;
    padding: 28px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 12px;
    box-shadow: var(--saz-shadow);
}
.main .about .mask-2 {
    color: var(--saz-navy);
    background: #f3f6fa;
    border-left: 4px solid var(--saz-red);
    border-radius: 0 8px 8px 0;
}
.main .staff {
    margin-top: 28px;
    padding: 34px 0;
    background: #f4f6f9;
    border-top: 1px solid var(--saz-line);
    border-bottom: 1px solid var(--saz-line);
}
.main .staff_grid {
    padding: 12px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(16, 43, 78, .06);
    overflow: hidden;
}
.main .staff_grid img {
    display: block;
    width: 100%;
    border-radius: 7px;
}
.main .staff_grid .mask-2 {
    margin-top: 10px;
    background: var(--saz-navy);
    border-radius: 6px;
}

/* Contact / Worldwide Locations page */
.main .contact_left,
.main .contact_right {
    margin-bottom: 24px;
    padding: 22px;
    background: #fff;
    border: 1px solid var(--saz-line);
    border-radius: 12px;
    box-shadow: var(--saz-shadow);
    overflow: hidden;
}
.main .contact_left .mask-2,
.main .contact_right .mask-2 {
    display: block;
    margin: -22px -22px 20px;
    padding: 16px 20px;
    color: #fff;
    background: var(--saz-navy);
    border-bottom: 4px solid var(--saz-red);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}
.main .contact_left iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 350px;
    border: 0 !important;
    border-radius: 7px;
}
.main .contact_right .contact-text,
.main .contact_right .contact1 {
    color: var(--saz-text);
    font-size: 14px;
    line-height: 1.9;
    overflow-wrap: anywhere;
}
.main .contact_right img {
    max-width: 100%;
    height: auto;
}
.main .contact_right a {
    color: var(--saz-blue);
    font-weight: 600;
}
.main .contact_right a:hover {
    color: var(--saz-red);
}

/* Responsive refinements */
@media (max-width: 991px) {
    .header_bottom .nav > li > ul li ul {
        left: 100% !important;
    }
    .main .post1 {
        padding: 18px;
    }
    .main .contact_left,
    .main .contact_right {
        padding: 18px;
    }
    .main .contact_left .mask-2,
    .main .contact_right .mask-2 {
        margin: -18px -18px 18px;
    }
}

@media (max-width: 767px) {
    .header,
    .header_top,
    .header_bottom {
        z-index: 10000;
    }
    .header_bottom .navigation,
    .header_bottom ul.nav {
        z-index: 10020;
    }
    .header_bottom .nav > li > ul,
    .header_bottom .nav > li > ul li ul {
        position: static !important;
        display: none;
        width: 100%;
        max-height: none;
        margin: 0 !important;
        box-shadow: none;
        border-radius: 0;
        overflow: visible !important;
    }
    .header_bottom .nav > li:hover > ul,
    .header_bottom .nav > li:focus-within > ul,
    .header_bottom .nav > li > ul li:hover > ul,
    .header_bottom .nav > li > ul li:focus-within > ul {
        display: block;
        visibility: visible;
        opacity: 1;
    }
    .main .post1 {
        padding: 15px;
        margin-bottom: 20px;
    }
    .main .post1 > img.img-responsive,
    .main .post1 > div > img.img-responsive {
        max-height: 360px;
    }
    .main .about {
        padding: 18px 15px;
    }
    .main .contact_left,
    .main .contact_right {
        padding: 15px;
    }
    .main .contact_left .mask-2,
    .main .contact_right .mask-2 {
        margin: -15px -15px 16px;
    }
    .main .contact_left iframe {
        min-height: 280px;
    }
}


/* =========================================================
   SAZ BOILERS - FINAL NAVIGATION + WHY US POLISH
   Keeps existing links, text and images intact.
========================================================= */

/* Header stacking: keep the navigation above hero/banner/content */
.header,
.header_top,
.header_bottom {
    position: relative !important;
    z-index: 5000 !important;
    overflow: visible !important;
}
.header_bottom {
    background: #fff;
    box-shadow: 0 5px 22px rgba(16, 43, 78, .09);
}
.header_bottom > .container,
.header_bottom .container,
.header_bottom .navigation,
.header_bottom .navigation > div,
.header_bottom ul.nav {
    overflow: visible !important;
}
.header_bottom .header_bottom,
.header_bottom .navigation {
    position: relative !important;
    z-index: 5010 !important;
}
.header_bottom ul.nav {
    position: relative !important;
    z-index: 5020 !important;
    display: flex;
    align-items: stretch;
}
.header_bottom .nav > li {
    position: relative !important;
    z-index: 5030 !important;
}
.header_bottom .nav > li > a {
    display: flex;
    align-items: center;
    min-height: 76px;
    padding: 20px 20px;
    border-top: 4px solid transparent;
    background-image: none !important;
    color: #142d4d;
    font-weight: 700;
    line-height: 1.25;
    transition: color .2s ease, background .2s ease, border-color .2s ease;
}
.header_bottom .nav > li:hover > a,
.header_bottom .nav > li:focus-within > a {
    color: #ff480f !important;
    background: #f7f9fc !important;
    border-top-color: #ff480f;
}

/* Desktop dropdown: no forced tiny scrollbox and no horizontal scrollbar */
.header_bottom .nav > li > ul,
.header_bottom .nav > li:hover > ul,
.header_bottom .nav > li:focus-within > ul {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    display: block;
    width: 265px !important;
    min-width: 265px !important;
    max-width: 310px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 5px 0 !important;
    overflow: visible !important;
    list-style: none;
    background: #fff !important;
    border: 1px solid #e3e9f0;
    border-top: 3px solid #ff480f;
    box-shadow: 0 16px 35px rgba(12, 32, 58, .18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    z-index: 5100 !important;
}
.header_bottom .nav > li:hover > ul,
.header_bottom .nav > li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
.header_bottom .nav > li > ul li {
    position: relative !important;
    display: block !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
}
.header_bottom .nav li > ul li a {
    display: block !important;
    width: 100%;
    min-height: 36px;
    padding: 9px 14px !important;
    color: #233b58 !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    box-sizing: border-box;
}
.header_bottom .nav li > ul li:last-child > a {
    border-bottom: 0 !important;
}
.header_bottom .nav li > ul li:hover > a,
.header_bottom .nav li > ul li:focus-within > a {
    color: #fff !important;
    background: #173f68 !important;
}

/* Nested product submenu opens to the right, without inheriting parent scroll */
.header_bottom .nav > li > ul li ul,
.header_bottom .nav > li > ul li:hover > ul,
.header_bottom .nav > li > ul li:focus-within > ul {
    position: absolute !important;
    top: -3px !important;
    left: 100% !important;
    display: block;
    width: 265px !important;
    min-width: 265px !important;
    max-width: 300px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 6px 0 !important;
    overflow: visible !important;
    background: #fff !important;
    border: 1px solid #e3e9f0 !important;
    border-top: 3px solid #ed625d !important;
    box-shadow: 0 16px 35px rgba(12, 32, 58, .18) !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    z-index: 5200 !important;
}
.header_bottom .nav > li > ul li:hover > ul,
.header_bottom .nav > li > ul li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
}

/* Why Us card on the Profile / About Us page */
.why-us-card {
    width: 100%;
    margin: 24px 0 8px;
    padding: 26px 24px;
    background: #fff;
    border: 1px solid #e3e9f0;
    border-top: 4px solid #ed6965;
    border-radius: 10px;
    box-shadow: 0 8px 28px rgba(16, 43, 78, .07);
    box-sizing: border-box;
}
.why-us-card *,
.why-us-card *::before,
.why-us-card *::after { box-sizing: border-box; }
.why-us-heading { margin-bottom: 20px; }
.why-us-subtitle {
    display: block;
    margin-bottom: 7px;
    color: #ed6965;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.why-us-card .grid-text {
    margin: 0;
    color: #142d4d;
    font-size: 27px;
    line-height: 1.3;
    font-weight: 700;
}
.why-us-line {
    display: block;
    width: 48px;
    height: 3px;
    margin-top: 12px;
    background: #ed6965;
    border-radius: 5px;
}
.why-us-card #general-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.why-us-card #general-info li {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    min-height: 64px;
    margin: 0;
    padding: 12px;
    background: #f5f7fa;
    border: 1px solid #e9edf2;
    border-radius: 8px;
    transition: background .22s ease, border-color .22s ease, transform .22s ease;
}
.why-us-card #general-info li:hover {
    background: #fff;
    border-color: #f1b0ad;
    transform: translateY(-2px);
}
.why-us-card .why-us-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    color: #ed6965;
    background: #fff;
    border: 1px solid #f7d5d3;
    border-radius: 8px;
    font-size: 18px;
}
.why-us-card .why-us-text {
    flex: 1;
    min-width: 0;
    color: #35445a;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}
.why-us-card .why-us-arrow {
    flex: 0 0 auto;
    color: #a7b0bd;
    font-size: 16px;
}

/* Responsive navigation and Why Us card */
@media (max-width: 800px) {
    .header_bottom .navigation {
        float: none !important;
        width: 100%;
        margin: 0 !important;
        z-index: 6000 !important;
    }
    .header_bottom label.mobile_menu {
        display: block;
        position: relative;
        margin: 0;
        padding: 13px 16px;
        color: #fff;
        background: #102b4e;
        border: 0;
        cursor: pointer;
        font-weight: 700;
    }
    .header_bottom label.mobile_menu:after {
        top: 7px !important;
        right: 16px !important;
        content: "☰" !important;
        font-size: 23px !important;
    }
    .header_bottom ul.nav {
        display: none;
        position: relative !important;
        width: 100%;
        max-height: 72vh;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        margin: 0 !important;
        padding: 6px 0 !important;
        background: #fff;
        box-shadow: 0 12px 25px rgba(0,0,0,.12);
    }
    #mobile_menu:checked + ul.nav { display: block !important; }
    .header_bottom .nav > li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
        border-bottom: 1px solid #edf0f4;
    }
    .header_bottom .nav > li > a {
        display: block !important;
        min-height: 0;
        padding: 13px 16px !important;
        color: #142d4d !important;
        background: #fff !important;
        border: 0 !important;
        font-size: 15px !important;
    }
    .header_bottom .nav > li:hover > a,
    .header_bottom .nav > li:focus-within > a { background: #f4f6f9 !important; }
    .header_bottom .nav > li > ul,
    .header_bottom .nav > li:hover > ul,
    .header_bottom .nav > li:focus-within > ul,
    .header_bottom .nav > li > ul li ul,
    .header_bottom .nav > li > ul li:hover > ul,
    .header_bottom .nav > li > ul li:focus-within > ul {
        position: static !important;
        display: none;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-top: 1px solid #e7ebf1 !important;
        box-shadow: none !important;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }
    .header_bottom .nav li.mobile-submenu-open > ul { display: block !important; }
    .header_bottom .nav li > ul li a {
        padding: 11px 16px 11px 30px !important;
        font-size: 14px !important;
        background: #f7f9fc !important;
        color: #233b58 !important;
    }
    .header_bottom .nav li > ul li ul li a { padding-left: 45px !important; }
    .why-us-card { padding: 22px 18px; }
}
@media (max-width: 480px) {
    .why-us-card #general-info { grid-template-columns: 1fr; }
    .why-us-card .grid-text { font-size: 24px; }
}