/*=============================
        02. Header
    ===============================*/
    .custom-container {
        max-width: 1860px;
    }
    .transparent-header {
        position: absolute;
        left: 0;
        top: 0px;
        width: 100%;
        z-index: 9;
        height: auto;
    }
    #header-fixed-height.active-height {
        display: block;
        height: 95px;
    }
    /* header-top */
    .header-top-wrap {
        background: var(--sjm-secondary-color);
        padding: 6px 35px;
    }
    .header-top-menu .list-wrap {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
    }
    .header-top-menu .list-wrap li a {
        color: var(--sjm-white);
        font-family: var(--sjm-heading-font-family);
        font-size: 13px;
        font-weight: 700;
        line-height: normal;
        text-transform: capitalize;
    }
    .header-top-menu .list-wrap li a:hover {
        color: var(--sjm-primary-color);
    }
    .header-top-social {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .header-top-social .title {
        margin-bottom: 0;
        color: var(--sjm-white);
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 1.3px;
        text-transform: uppercase;
        margin-right: 6px;
        line-height: 1;
    }
    .header-top-social .list-wrap {
        display: flex;
        align-items: center;
        gap: 14px;
    }
    .header-top-social .list-wrap li a {
        font-size: 14px;
        color: var(--sjm-white);
    }
    .header-top-social .list-wrap li a:hover {
        color: var(--sjm-primary-color);
    }

    /* menu */
    .menu-area {
        /* border-bottom: 1px solid var(--sjm-gray); */
        border-bottom: none;
    }
    .menu-nav {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .logo img {
        max-height: 70px;
    }
    .header-left-side {
        display: flex;
        height: 100%;
    }
    .offcanvas-toggle {
        border-right: 1px solid var(--sjm-gray);
        width: 100px;
    }
    .offcanvas-toggle a {
        padding: 30px 30px 30px 35px;
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        gap: 6px;
        height: 100%;
    }
    .offcanvas-toggle a span {
        width: 33px;
        height: 2px;
        border-radius: 2px;
        background: var(--sjm-primary-color);
        transition: .3s linear;
    }
    .navbar-wrap {
        display: flex;
    }
    .navbar-wrap ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 0 0;
        margin: 0 0 0 185px;
    }
    .navbar-wrap ul li {
        list-style: none;
        display: block;
        position: relative;
    }
    .navbar-wrap ul li a {
        font-size: 14px;
        font-weight: 700;
        text-transform: capitalize;
        color: var(--sjm-white);
        padding: 40px 17px;
        display: flex;
        align-items: center;
        line-height: 1;
        position: relative;
        z-index: 1;
        font-family: var(--sjm-heading-font-family);
        gap: 5px;
    }

    .navbar-wrap > ul > li.menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 6px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'><path d='M480-371.69 267.69-584 296-612.31l184 184 184-184L692.31-584 480-371.69Z'/></svg>") no-repeat center;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'><path d='M480-371.69 267.69-584 296-612.31l184 184 184-184L692.31-584 480-371.69Z'/></svg>") no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    }


    .navbar-wrap > ul > li.menu-item-has-children.active > a::after,
    .navbar-wrap > ul > li.menu-item-has-children:hover > a::after {
        color: var(--sjm-primary-color);
    }
    .navbar-wrap > ul > li.active > a,
    .navbar-wrap > ul > li:hover > a {
        color: var(--sjm-primary-color);
    }
    .main-menu .navigation li.menu-item-has-children .dropdown-btn {
        display: none;
    }
    .header-right-side {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding-right: 35px;
    }
    .header-search-wrap form {
        position: relative;
        width: 340px;
    }
    .header-search-wrap form input {
        width: 100%;
        border: 1px solid var(--sjm-gray);
        background: transparent;
        border-radius: 30px;
        font-size: 14px;
        font-weight: 400;
        color: var(--sjm-secondary-color);
        padding: 12px 45px 12px 20px;
        line-height: 1;
        height: 45px;
    }
    .header-search-wrap form input::placeholder {
        font-size: 14px;
        font-weight: 400;
        color: var(--sjm-body-font-color);
    }
    .header-search-wrap form button {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        padding: 0;
        font-size: 20px;
        line-height: 0;
        color: var(--sjm-secondary-color);
    }
    .header-search-wrap form button:hover {
        color: var(--sjm-primary-color);
    }
    .header-action > ul {
        display: flex;
        align-items: center;
        margin-left: 25px;
    }
    .header-action > ul li {
        position: relative;
        margin-left: 25px;
        line-height: 0;
    }
    .header-action ul li:first-child {
        margin-left: 0;
    }
    .header-action ul li a {
        color: var(--sjm-paragraph-color);
        font-size: 24px;
        line-height: 0;
        position: relative;
        font-weight: 700;
    }
    .header-action ul li a:hover {
        color: var(--sjm-primary-color);
    }
    .header-action ul li a span {
        position: absolute;
        width: 18px;
        height: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--sjm-primary-color);
        color: var(--sjm-white);
        font-size: 11px;
        font-weight: 600;
        border-radius: 50%;
        right: -10px;
        top: -4px;
    }
    .header-cart {
        display: flex;
        align-items: center;
        gap: 15px;
    }
    .header-cart strong {
        font-size: 14px;
        font-weight: 600;
        color: var(--sjm-secondary-color);
    }
    .header-action .header-sine-in a {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        color: var(--sjm-secondary-color);
    }
    .header-action .header-sine-in {
        margin-left: 20px;
    }
    .header-action .header-sine-in a i {
        color: var(--sjm-body-font-color);
        font-size: 24px;
    }
    .header-action .header-sine-in a:hover i {
        color: var(--sjm-primary-color);
        transition: all 0.3s ease-out 0s;
    }
    .header-action .header-btn .btn {
        color: var(--sjm-white);
        font-size: 14px;
        padding: 13px 22px;
    }
    .navbar-wrap ul li .sub-menu {
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        min-width: 230px;
        border: 1px solid #f5f5f5;
        background: var(--sjm-white);
        margin: 0 0;
        transform: scale(1, 0);
        transform-origin: 0 0;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        -webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
        -moz-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
        box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
        border-radius: 0 0 5px 5px;
        padding: 18px 0;
        display: block;
        visibility: hidden;
        opacity: 0;
        z-index: 50;
    }
    .navbar-wrap ul li .sub-menu .sub-menu {
        right: auto;
        left: 100%;
        top: 0;
    }
    .navbar-wrap ul li .sub-menu li {
        margin-left: 0;
        text-align: left;
        display: block;
    }
    .navbar-wrap ul li .sub-menu li a {
        padding: 9px 15px 9px 25px;
        line-height: 1.3;
        font-weight: 700;
        color: var(--sjm-heading-font-color);
        text-transform: capitalize;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        justify-content: space-between;
    }
    .navbar-wrap ul li .sub-menu > li.active > a,
    .navbar-wrap ul li .sub-menu li a:hover {
        color: var(--sjm-primary-color);
    }
    .navbar-wrap ul li .sub-menu > li > a::before,
    .navbar-wrap ul li .sub-menu li a::before {
        content: "";
        position: absolute;
        width: 3px;
        height: 0px;
        top: 0;
        bottom: 0;
        margin: auto 0;
        left: 15px;
        background: var(--sjm-primary-color);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
    }
    .navbar-wrap ul li .sub-menu > li.active > a::before,
    .navbar-wrap ul li .sub-menu li a:hover::before {
        height: 11px;
        opacity: 1;
        visibility: visible;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    .navbar-wrap ul li .sub-menu > li.menu-item-has-children > a::after {
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        color: var(--sjm-icon-color);
        font-size: 14px;
        line-height: 0;
        transition: all 0.3s ease-out 0s;
    }
    .navbar-wrap ul li .sub-menu > li.menu-item-has-children.active > a::after,
    .navbar-wrap ul li .sub-menu > li.menu-item-has-children > a:hover::after {
        color: var(--sjm-primary-color);
    }
    .navbar-wrap ul li:hover > .sub-menu {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }
    .sticky-menu {
        position: fixed;
        left: 0;
        margin: auto;
        top: 0;
        width: 100%;
        z-index: 99;
        -webkit-animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
        animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
        -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
        box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
        border-radius: 0;
    }

    .menu-area.sticky-menu {
        border-bottom: none;
    }

    /* Hide header when scrolling down */
    .menu-area.sticky-menu.header-hidden {
        transform: translateY(-100%) !important;
        box-shadow: none !important;
        -webkit-animation: none !important;
        animation: none !important;
    }

    /* header-two */
    .header-style-two {
        background: #12253E;
    }
    .header-logo-area {
        padding: 25px 0;
    }
    .hl-left-side {
        display: flex;
        align-items: center;
        gap: 30px;
    }
    .hl-left-side .offcanvas-toggle {
        border-right: none;
        width: auto;
    }
    .offcanvas-toggle .menu-tigger-two {
        padding: 0;
    }
    .offcanvas-toggle .menu-tigger-two span {
        background: var(--sjm-white);
    }
    .hl-right-side {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 20px;
    }
    .hl-right-side .header-search-wrap form {
        width: 425px;
    }
    .hl-right-side .header-search-wrap form input {
        border: 1px solid #3A506B;
        color: var(--sjm-white);
    }
    .hl-right-side .header-search-wrap form input::placeholder {
        color: #8199B7;
    }
    .hl-right-side .header-search-wrap form button {
        color: var(--sjm-white);
    }
    .header-social .list-wrap {
        display: flex;
        align-items: center;
        gap: 15px;
    }
    .header-social .list-wrap li a {
        color: var(--sjm-gray-three);
    }
    .header-social .list-wrap li a:hover {
        color: var(--sjm-primary-color);
    }
    .menu-area.menu-style-two {
        border-bottom: none;
        background: var(--sjm-secondary-color);
    }
    .menu-style-two .navbar-wrap ul {
        margin: 0;
    }
    .menu-style-two .navbar-wrap > ul > li {
        margin-right: 40px;
    }
    .menu-style-two .navbar-wrap ul li:last-child {
        margin-right: 0;
    }
    .menu-style-two .navbar-wrap ul li a {
        padding: 23px 0;
        color: var(--sjm-white);
    }
    .menu-style-two .navbar-wrap ul > li.active > a,
    .menu-style-two .navbar-wrap ul > li > a:hover {
        color: var(--sjm-primary-color);
    }
    .menu-style-two .header-action > ul {
        justify-content: flex-end;
    }
    .menu-style-two .header-action ul li a {
        color: #90A8C5;
    }
    .menu-style-two .header-action ul li a:hover {
        color: var(--sjm-primary-color);
    }
    .menu-style-two .header-action .header-sine-in a {
        color: var(--sjm-white);
    }
    .menu-style-two .header-action .header-sine-in a i {
        color: #90A8C5;
    }
    .menu-style-two .header-action .header-sine-in a:hover i {
        color: var(--sjm-primary-color);
    }
    .menu-style-two .header-cart strong {
        color: var(--sjm-white);
    }


    /* header-three */
    .header-top-wrap-two {
        background: var(--sjm-secondary-color);
        padding: 16px 0;
    }
    .header-top-left .offcanvas-toggle {
        /* border-right: none; */
        width: auto;
        padding-right: 20px;
    }
    .header-top-left {
        display: flex;
        align-items: center;
        gap: 25px;
    }
    .header-top-right .header-search-wrap form {
        width: 240px;
        margin-left: auto;
    }
    .header-search-wrap-two form input {
        border: none;
        background: transparent;
        border-radius: 0;
        color: var(--sjm-white);
        padding: 0 45px 0 0;
        height: auto;
    }
    .header-search-wrap-two form input::placeholder {
        color: #8199B7;
    }
    .header-search-wrap-two form button {
        right: 0;
        color: var(--sjm-white);
    }
    .menu-style-three .navbar-wrap ul {
        margin: 0 auto;
    }

    /* header-four */
    .header-top-wrap-three {
        background: var(--sjm-secondary-color);
        padding: 11px 0;
    }
    .header-top-left-two .list-wrap {
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .header-top-left-two .list-wrap li a {
        color: var(--sjm-white);
        font-weight: 14px;
        font-weight: 600;
    }
    .header-top-left-two .list-wrap li a:hover {
        color: var(--sjm-primary-color);
    }
    .header-top-right-two {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 28px;
    }
    .offcanvas-toggle.offcanvas-toggle-two {
        border-right: none;
        width: auto;
    }
    .header-top-right-two .header-top-social .list-wrap li a {
        font-size: 16px;
    }
    .header-logo-area-two {
        padding: 35px 0 0;
    }
    .header-search-wrap.header-search-wrap-three {
        display: flex;
        align-items: center;
    }
    .header-search-wrap.header-search-wrap-three form {
        width: 200px;
    }
    .header-search-wrap.header-search-wrap-three form input {
        width: 100%;
        border: none;
        background: transparent;
        border-radius: 0;
        font-size: 14px;
        font-weight: 400;
        color: var(--sjm-secondary-color);
        padding: 0 45px 0 0;
        line-height: 1.6;
        height: auto;
    }
    .header-search-wrap.header-search-wrap-three form button {
        right: 0px;
        font-size: 24px;
        color: var(--sjm-icon-color);
    }
    .header-search-wrap.header-search-wrap-three form button:hover {
        color: var(--sjm-secondary-color);
    }
    .header-action.header-action-two .list-wrap {
        justify-content: flex-end;
    }
    .menu-style-four .menu-nav {
        justify-content: center;
    }
    .menu-style-four .navbar-wrap ul {
        margin: 0 auto;
    }
    .menu-style-four .navbar-wrap ul li a {
        font-size: 16px;
        padding: 37px 20px;
    }
    .menu-area.menu-style-four {
        border-bottom: none;
    }

    /* header-five */
    .header-logo-area-three {
        background: #12253E;
        padding: 35px 0;
    }
    .hl-left-side-three {
        display: flex;
        align-items: center;
        gap: 25px;
    }
    .hl-left-side-three .header-search {
        line-height: 0;
    }
    .hl-left-side-three .header-search a {
        color: var(--sjm-white);
        font-size: 20px;
    }
    .hl-left-side-three .header-search a:hover {
        color: var(--sjm-primary-color);
    }
    .header-logo-area-three .header-top-social .list-wrap {
        gap: 18px;
    }
    .header-logo-area-three .header-top-social .list-wrap li a {
        font-size: 16px;
        color: var(--sjm-white);
    }
    .header-logo-area-three .header-top-social .list-wrap li a:hover {
        color: var(--sjm-primary-color);
    }
    .menu-style-five .navbar-wrap ul li a {
        padding: 28px 0;
    }

    /* header-six */
    .header-top-wrap-four {
        background: var(--sjm-secondary-color);
        padding: 5px 0;
    }
    .header-top-left-four {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .trending-box {
        display: flex;
        align-items: center;
        gap: 7px;
        padding: 4px 30px 4px 5px;
        position: relative;
        z-index: 1;
    }
    .trending-box .shape {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }
    .trending-box .shape svg {
        overflow: visible;
        width: 100%;
        height: 100%;
    }
    .trending-box .icon {
        width: 28px;
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--sjm-primary-color);
    }
    .trending-box span {
        font-size: 13px;
        font-weight: 600;
        color: var(--sjm-white);
    }
    .ta-trending-slider {
        height: 40px;
        margin: 0;
    }
    .ta-trending-slider .swiper-slide {
        display: flex;
        align-items: center;
    }
    .trending-content a {
        color: #C7D2E0;
        font-size: 14px;
    }
    .trending-content a:hover {
        color: var(--sjm-white);
    }
    .header-logo-area-four {
        padding: 35px 0;
        border-bottom: 1px solid var(--sjm-gray);
    }
    .hl-left-side-four .date {
        display: flex;
        align-items: center;
        font-size: 14px;
        font-weight: 500;
        color: var(--sjm-body-font-color);
        gap: 6px;
        font-family: var(--sjm-heading-font-family);
    }
    .hl-left-side-four .date i {
        line-height: 0;
        color: #6D757F;
    }
    .hl-right-side-four {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 20px;
    }
    .hl-right-side-four .sign-in a {
        display: flex;
        align-items: center;
        font-size: 15px;
        font-weight: 600;
        font-family: var(--sjm-heading-font-family);
        color: var(--sjm-body-font-color);
        gap: 8px;
    }
    .hl-right-side-four .sign-in a i {
        line-height: 0;
        font-size: 22px;
    }
    .hl-right-side-four .sign-in a:hover {
        color: var(--sjm-primary-color);
    }
    .subscribe-btn .btn {
        padding: 15px 27px;
        text-transform: uppercase;
    }
    .menu-area.menu-style-six {
        border-bottom: none;
        box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.10);
    }
    .menu-style-six .navbar-wrap ul li a {
        padding: 28px 20px;
    }
    .menu-style-six .navbar-wrap ul {
        margin: 0 auto;
    }
    .menu-style-six .offcanvas-toggle {
        border-right: 1px solid var(--sjm-gray);
        border-left: 1px solid var(--sjm-gray);
        width: 70px;
    }
    .menu-style-six .offcanvas-toggle a {
        padding: 15px 5px 15px 5px;
    }
    .menu-style-six .offcanvas-toggle a span {
        background: var(--sjm-body-font-color);
    }
    .menu-style-six .menu-nav {
        align-items: normal;
    }



    /* === Emergencias (header) === */
    .emergency-call{
    display:none;
    align-items:center;
    gap:12px;
    text-decoration:none;
    color:#fff;
    transition:opacity .2s ease;
    }
    @media (min-width:1024px){
    .emergency-call{ display:flex; }
    }

    .emergency-call:hover{ opacity:.9; }
    .emergency-call:focus-visible{
    outline:2px solid #fff;
    outline-offset:3px;
    border-radius:6px;
    }

    .emergency-call__icon{
    width:24px; height:24px;
    color: var(--sjm-primary-color);
    flex-shrink:0;
    }

    .emergency-call__text{ line-height:1.05; }

    .emergency-call__number{
    color:var(--sjm-primary-color);
    font-weight:800;
    letter-spacing:.02em;
    font-size:0.8rem;
    }

    .emergency-call__label{
    color:#fff;
    font-weight:400;
    font-size:13px;
    letter-spacing: 2px;
    }