/* Existing styles preserved */
.menu-item {
text-align: center !important;
}

@media (max-width: 1600px) {
nav.bootsnav.brand-center .navbar-collapse {
text-align: right !important;
}
}

@media (min-width: 1025px) {
nav.navbar .navbar-brand img.logo,
nav.navbar .navbar-brand,
nav.bootsnav .container {
height: 75px !important;
}
body.ozy-alternate-menu nav.navbar .navbar-brand img.logo {
margin-top: -75px !important;
}
.navbar-nav>li {
max-width: 180px;
}
}

@media (min-width: 1025px) {
nav.bootsnav.brand-center .navbar-collapse {
position: relative !important;
transform: translateY(-30px) !important;
}
.dropdown-menu {
transform: translateY(-57px) !important;
}
}

li.search {
display: none !important;
}

.textwidget {
font-size: 20px;
}

.vc_gitem-zone {
max-height: 250px;
background-size: 250px auto;
background-repeat: no-repeat;
}

.ozy-border-box > h2 {
font-family: ‘Lovers Quarrel’ !important;
font-weight: 500 !important;
font-size: 100px !important;
}

.fs-35 h4 {
font-size: 35px !important;
}

/* ========================================
FIX: Remove margin-top that causes menu jump
======================================== */

/* THIS WAS THE CULPRIT – Remove or override it */
#navbar-menu:has(li.on) {
margin-top: 0 !important; /* Changed from 5px to 0 */
}

/* Also prevent any margin changes on hover states */
#navbar-menu,
.navbar-collapse {
margin-top: 0 !important;
transition: none !important;
}

/* ========================================
CLEAN & PROFESSIONAL MENU STYLES
======================================== */

/* Stable menu items – no transforms or movements */
.navbar-nav > li {
position: relative;
}

.navbar-nav > li > a {
position: relative;
transition: color 0.25s ease;
display: block;
}

/* Remove any transforms on spans that might cause movement */
.navbar-nav > li > a span {
display: inline-block;
transform: none !important;
transition: color 0.25s ease;
}

/* Simple underline effect */
.navbar-nav > li > a::after {
content: ”;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 2px;
background: #1a1a1a;
transition: width 0.3s ease;
}

.navbar-nav > li:hover > a::after {
width: 60%;
}

.navbar-nav > li:hover > a {
color: #1a1a1a;
}

/* Clean professional dropdown */
.dropdown-menu {
background: #ffffff;
border: none;
border-top: 2px solid #1a1a1a;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
padding: 8px 0;
opacity: 0;
visibility: hidden;
transition: opacity 0.25s ease, visibility 0.25s ease;
transform: translateY(-57px) !important;
min-width: 200px;
margin: 0 !important;
}

.dropdown:hover .dropdown-menu,
.menu-item-has-children:hover .dropdown-menu {
opacity: 1;
visibility: visible;
}

/* Dropdown items */
.dropdown-menu li {
position: relative;
margin: 0;
padding: 0;
}

.dropdown-menu li a {
padding: 12px 24px;
display: block;
color: #666;
transition: all 0.25s ease;
font-size: 14px;
border-left: 3px solid transparent;
}

.dropdown-menu li:hover a {
background: #f8f8f8;
color: #1a1a1a;
border-left-color: #1a1a1a;
padding-left: 28px;
}

/* Ensure no layout shifts */
* {
box-sizing: border-box;
}

/* Professional spacing */
@media (min-width: 1025px) {
.navbar-nav > li {
margin: 0 8px;
}

.navbar-nav > li > a {
padding: 12px 16px;
}
}

/* ========================================
MOBILE RESPONSIVE FIXES
======================================== */

@media (max-width: 1024px) {

/* Reset transforms and positioning for mobile */
nav.bootsnav.brand-center .navbar-collapse {
transform: none !important;
position: static !important;
}

/* Stack menu items vertically */
.navbar-nav {
display: block !important;
width: 100%;
margin: 0;
}

.navbar-nav > li {
display: block;
width: 100%;
max-width: 100% !important;
margin: 0;
text-align: left !important;
float: none !important;
}

.navbar-nav > li > a {
padding: 15px 20px;
display: block;
width: 100%;
border-bottom: 1px solid #f0f0f0;
}

/* Mobile dropdown positioning – FIX FOR OVERLAPPING SUBMENUS */
.dropdown-menu {
position: static !important;
transform: none !important;
float: none !important;
width: 100%;
box-shadow: none;
border: none;
border-left: 3px solid #1a1a1a;
background: #f8f8f8;
margin: 0 !important;
padding: 0;
display: none; /* Hidden by default */
clear: both;
}

/* Show dropdown when parent has ‘open’ class or is hovered */
.menu-item-has-children.open > .dropdown-menu,
.dropdown.open > .dropdown-menu,
.menu-item-has-children:hover > .dropdown-menu,
.dropdown:hover > .dropdown-menu {
display: block !important;
opacity: 1;
visibility: visible;
}

.dropdown-menu.depth_0 {
display: none;
}

.dropdown-menu.depth_0.show,
.dropdown-menu.depth_0.in {
display: block !important;
}

.dropdown-menu li {
width: 100%;
float: none !important;
}

.dropdown-menu li a {
padding: 12px 20px 12px 35px;
font-size: 13px;
}

/* Mobile menu toggle button */
.navbar-toggle {
display: block;
margin-right: 15px;
float: right;
}

/* Collapsed menu container */
.navbar-collapse {
border-top: 1px solid #e7e7e7;
max-height: none !important;
overflow-y: auto;
clear: both;
width: 100%;
}

.navbar-collapse.collapse {
display: none !important;
height: auto !important;
}

.navbar-collapse.collapse.in {
display: block !important;
overflow-y: visible !important;
}

/* Remove underline effect on mobile */
.navbar-nav > li > a::after {
display: none;
}

/* Mobile active/hover state */
.navbar-nav > li:hover > a,
.navbar-nav > li.active > a {
background: #f8f8f8;
color: #1a1a1a;
}

/* Ensure navbar header is properly positioned */
.navbar-header {
float: left;
width: auto;
}

/* Brand/logo positioning on mobile */
.navbar-brand {
float: left !important;
}

/* Clear floats */
.navbar-collapse::after,
.navbar-header::after {
content: “”;
display: table;
clear: both;
}
}