/* ============================================================
   Intensity Hoops — Mega Menu
   Header layout  → header.css
   Offcanvas menu → offcanvas.css
   Top bar        → topbar.css
   ============================================================ */


/* ── Menu wrapper flex utilities ─────────────────────────── */

.flex-auto {
    flex: auto;
}

#sp-menu.menu-with-social .sp-megamenu-wrapper {
    flex: auto;
    justify-content: space-between;
    display: flex;
    align-items: center;
}

#sp-menu > .sp-column {
    height: 100%;
}

#sp-menu1 > .sp-column {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

#sp-logo > .sp-column {
    display: flex;
    justify-content: center;
    align-items: center;
}

#sp-menu2 > .sp-column {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

@media (max-width: 991.98px) {
    #sp-menu > .sp-column {
        text-align: right;
    }

    #sp-logo > .sp-column {
        justify-content: start;
    }

    #sp-menu2 > .sp-column {
        justify-content: flex-end;
    }
}

#sp-menu .social-wrap {
    position: relative;
    padding-left: 60px;
}

#sp-menu .social-wrap:after {
    content: "";
    margin-top: 10px;
    margin-bottom: 10px;
    position: absolute;
    width: 2px;
    height: calc(var(--header_height) - 20px);
    left: 30px;
    background-color: rgba(80, 80, 80, .2);
}

#sp-menu ul.social-icons > li:not(:last-child) {
    margin-right: 20px;
}

#sp-menu ul.social-icons a {
    color: #9c9c9c;
}

#sp-menu ul.social-icons a:hover,
#sp-menu ul.social-icons a:focus {
    color: var(--brand-primary, #1272ba);
}

#sp-menu .social-wrap.no-border ul.social-icons {
    border-left: none;
    padding-left: 0px;
}

#sp-menu.menu-center .sp-megamenu-wrapper {
    justify-content: center;
}

.menu-flex .sp-megamenu-wrapper {
    display: flex;
    justify-content: flex-end;
}

#menu-right .sp-module:first-child {
    border-right: 2px solid rgba(80, 80, 80, .2);
    padding-right: 30px;
}


/* ── Mega menu parent ────────────────────────────────────── */

.sp-megamenu-parent {
    list-style: none;
    padding: 0;
    margin: 0px;
    z-index: 99;
    display: block;
    float: right;
    position: relative;
}

.sp-megamenu-parent a {
    text-shadow: 1px 1px 1px #000;
}

.sp-megamenu-parent .sp-menu-item > a img,
.sp-megamenu-parent .sp-menu-item > span img {
    display: inline-block;
}

.sp-megamenu-parent > li {
    display: inline-block;
    position: relative;
    padding: 0;
}

.sp-megamenu-parent > li.menu-justify {
    position: static;
}

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span {
    display: inline-block;
    padding: 0 15px;
    line-height: 80px;
    font-size: 21px;
    margin: 0;
    font-family: var(--font-menu, "Bebas Neue", sans-serif);
    color: var(--menu-text, #ffffff);
}

#sp-nav2 .sp-megamenu-parent > li > a {
    font-family: var(--font-menu, "Bebas Neue", sans-serif);
}

#sp-header.header-sticky .sp-megamenu-parent > li > a,
#sp-header.header-sticky .sp-megamenu-parent > li > span {
    height: 60px;
    line-height: 60px;
}

.sp-megamenu-parent > li.active > a {
    font-weight: 500;
    color: var(--brand-primary-light, #2e8fd4);
}

.sp-megamenu-parent > li:hover > a,
.sp-megamenu-parent > li.active:hover > a {
    color: var(--brand-primary-light, #2e8fd4);
}

.sp-megamenu-parent > li .sp-menu-badge {
    height: 20px;
    line-height: 20px;
    padding: 0 5px;
    font-size: 10px;
    letter-spacing: 1px;
    display: inline-block;
    text-transform: uppercase;
    background: var(--brand-primary, #1272ba);
    color: var(--white, #ffffff);
    border-radius: 3px;
}

.sp-megamenu-parent .sp-module {
    padding: 10px;
}

.sp-megamenu-parent .sp-mega-group {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sp-megamenu-parent .sp-mega-group > li > a {
    display: block;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--text-muted, #a0a0a0);
}

.sp-megamenu-parent .sp-mega-group .sp-mega-group-child {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sp-megamenu-parent .sp-dropdown {
    margin: 0;
    position: absolute;
    z-index: 10;
    display: none;
}

.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .2);
    padding: 20px;
    border-radius: 7px;
    margin: -10px -10px 0 0;
    border: 1px solid var(--brand-primary, #1272ba);
    background: var(--menu-dropdown-bg, #1c1c1c);
}

.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner > .row:not(:first-child) {
    margin-top: 20px;
}

.sp-megamenu-parent .sp-dropdown .sp-dropdown-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sp-megamenu-parent .sp-dropdown.sp-dropdown-main {
    top: 100%;
}

.sp-megamenu-parent .sp-dropdown.sp-dropdown-sub {
    top: 0;
}

.sp-megamenu-parent .sp-dropdown.sp-dropdown-sub .sp-dropdown-inner {
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item {
    display: block;
    padding: 0;
    position: relative;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item span:not(.sp-menu-badge) {
    font-size: 14px;
    line-height: 1;
    display: inline-block;
    padding: 8px 0;
    cursor: pointer;
    color: var(--text-body, #e0e0e0);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
    color: var(--brand-primary-light, #2e8fd4);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a.sp-group-title,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item span:not(.sp-menu-badge).sp-group-title {
    text-transform: uppercase;
    font-weight: bold;
}

.sp-megamenu-parent .sp-dropdown .sp-module {
    padding: 0;
}

.sp-megamenu-parent .sp-dropdown .sp-module .sp-module-title {
    font-size: 14px;
    margin: 0 0 15px;
    text-transform: uppercase;
    font-weight: bold;
}

.sp-megamenu-parent .sp-dropdown .sp-module .latestnews {
    margin: 0;
}

.sp-megamenu-parent .sp-dropdown .sp-module .latestnews > li:not(:last-child) {
    margin: 0 0 15px;
}

.sp-megamenu-parent .sp-dropdown .sp-module .latestnews > li a {
    font-size: 14px;
}

.sp-megamenu-parent .sp-dropdown .sp-module .latestnews > li a span {
    opacity: .8;
}

.sp-megamenu-parent .sp-dropdown-mega > .row {
    margin-top: 30px;
}

.sp-megamenu-parent .sp-dropdown-mega > .row:first-child {
    margin-top: 0;
}

.sp-megamenu-parent .sp-dropdown-mega .sp-module {
    margin-left: 0px !important;
}

.sp-megamenu-parent .sp-has-child:hover > .sp-dropdown {
    display: block;
}

.sp-megamenu-parent.menu-animation-fade .sp-has-child:hover > .sp-dropdown {
    animation: spFadeIn 600ms;
}

.sp-megamenu-parent.menu-animation-fade-up .sp-has-child:hover > .sp-dropdown {
    animation: spFadeInUp 400ms ease-in;
}

.sp-megamenu-parent.menu-animation-fade-down .sp-has-child:hover > .sp-dropdown {
    animation: spFadeInDown 400ms ease-in;
}

.sp-megamenu-parent.menu-animation-zoom .sp-has-child:hover > .sp-dropdown {
    animation: spZoomIn 300ms;
}

.sp-megamenu-parent.menu-animation-rotate .sp-has-child:hover > .sp-dropdown {
    animation: spRotateIn 300ms;
}

.sp-megamenu-parent.menu-animation-pulse .sp-has-child:hover > .sp-dropdown {
    animation: spPulse 300ms;
}


/* ── LTR mega menu ───────────────────────────────────────── */

body.ltr .sp-megamenu-parent > li.sp-has-child > a:after,
body.ltr .sp-megamenu-parent > li.sp-has-child > span:after {
    font-family: "Font Awesome 6 Free";
    content: "";
    float: right;
    margin-left: 7px;
    font-size: 15px;
    font-weight: 900;
}

body.ltr .sp-megamenu-parent > li .sp-menu-badge.sp-menu-badge-right {
    margin-left: 8px;
    margin-top: -1px;
}

body.ltr .sp-megamenu-parent > li .sp-menu-badge.sp-menu-badge-left {
    margin-right: 5px;
}

body.ltr .sp-megamenu-parent .sp-dropdown .sp-dropdown-items .sp-has-child > a:after {
    font-family: "Font Awesome 6 Free";
    content: "";
    float: right;
    margin-left: 7px;
    font-weight: 900;
}

body.ltr .sp-megamenu-parent .sp-dropdown.sp-menu-center {
    margin-left: 45px;
}

body.ltr .sp-megamenu-parent .sp-dropdown.sp-dropdown-main.sp-menu-right {
    left: 0;
}

body.ltr .sp-megamenu-parent .sp-dropdown.sp-dropdown-main.sp-menu-full {
    left: auto;
    right: 0;
}

body.ltr .sp-megamenu-parent .sp-dropdown.sp-dropdown-main.sp-menu-left {
    right: 0;
}

body.ltr .sp-megamenu-parent .sp-dropdown.sp-dropdown-sub {
    left: 100%;
}


/* ── Full-width dropdown container widths ────────────────── */

@media (min-width: 576px) {
    .sp-menu-full.container { width: 540px; }
}

@media (min-width: 768px) {
    .sp-menu-full.container { width: 720px; }
}

@media (min-width: 992px) {
    .sp-menu-full.container { width: 960px; }
}

@media (min-width: 1200px) {
    .sp-menu-full.container { width: 1140px; }
}

@media (min-width: 1400px) {
    .sp-menu-full.container { width: 1320px; }
}


/* ── Animations ──────────────────────────────────────────── */

@keyframes spFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes spFadeInUp {
    0%   { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes spFadeInDown {
    0%   { opacity: 0; transform: translateY(-20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes spZoomIn {
    0%   { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
    100% { opacity: 1; }
}

@keyframes spRotateIn {
    from { transform-origin: center; transform: rotate3d(0, 0, 1, -45deg); opacity: 0; }
    to   { transform-origin: center; transform: none; opacity: 1; }
}

@keyframes spPulse {
    from { opacity: 0; transform: scale3d(1, 1, 1); }
    50%  { opacity: .5; transform: scale3d(1.05, 1.05, 1.05); }
    to   { opacity: 1; transform: scale3d(1, 1, 1); }
}


/* ── Responsive ──────────────────────────────────────────── */

@media (max-width: 1199px) {
    .sp-megamenu-parent > li > a,
    .sp-megamenu-parent > li span {
        padding: 0 10px;
    }
}

@media (max-width: 991px) {
    :root {
        --header_height: $header_height_sm;
    }

    .sp-megamenu-parent > li > a,
    .sp-megamenu-parent > li > span {
        line-height: 60px;
    }

    #sp-menu .social-wrap {
        padding-left: 15px;
    }
}

@media (max-width: 767px) {
    #sp-menu .social-wrap {
        padding-left: 10px;
    }

    #sp-menu .social-wrap:after {
        display: none;
    }
}

@media (max-width: 575px) {
    :root {
        --header_height: $header_height_xs;
    }

    .sp-megamenu-parent > li > a,
    .sp-megamenu-parent > li > span {
        line-height: 50px;
    }

    #sp-menu ul.social-icons > li:not(:last-child) {
        margin-right: 10px;
    }
}