/* FOM Technologies – custom off-canvas mobile menu
 * Loaded by inc/mobile-menu.php. Only active <= 980px (mobile + tablet).
 * Desktop (>980px) is untouched – Max Mega Menu still powers the nav. */

:root{ --fom-red:#9F1D22; }

/* Trigger hidden by default; shown only on mobile/tablet */
.fom-cmm-trigger{ display:none; }

@media (max-width:980px){
	/* Silence the two conflicting menu systems */
	#mega-menu-wrap-primary-menu,
	#top-menu-nav,
	#et_mobile_nav_menu{ display:none !important; }

	/* Our single trigger, placed in the header by JS */
	.fom-cmm-trigger{
		display:flex; flex-direction:column; justify-content:center;
		gap:5px; width:30px; height:30px; padding:0; margin:0 0 0 auto;
		background:transparent; border:0; cursor:pointer; -webkit-appearance:none;
		position:relative; z-index:100; /* sit above Divi's absolutely-positioned .logo_container so taps register */
	}
	.fom-cmm-trigger span{ display:block; height:2px; width:26px; background:#1b2531; border-radius:2px; transition:transform .2s ease,opacity .2s ease; }
}

/* Panel */
.fom-cmm{
	position:fixed; inset:0 0 0 auto; width:100%; max-width:480px; height:100%;
	background:#1b2531; color:#fff; z-index:100050;
	display:flex; flex-direction:column;
	transform:translateX(100%); transition:transform .28s ease;
	-webkit-font-smoothing:antialiased;
}
.fom-cmm.is-open{ transform:translateX(0); }
.fom-cmm[hidden]{ display:flex !important; } /* keep it in flow so it can animate */

.fom-cmm-overlay{
	position:fixed; inset:0; background:rgba(8,12,17,.55); z-index:100040;
	opacity:0; transition:opacity .28s ease; pointer-events:none;
}
.fom-cmm-overlay.is-open{ opacity:1; pointer-events:auto; }
.fom-cmm-overlay[hidden]{ display:block !important; }

body.fom-cmm-lock{ overflow:hidden; }

/* Keep the panel clear of the WordPress admin bar for logged-in editors */
body.admin-bar .fom-cmm{ top:32px; }
@media screen and (max-width:782px){ body.admin-bar .fom-cmm{ top:46px; } }

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion:reduce){
	.fom-cmm, .fom-cmm-overlay{ transition:none !important; }
}

/* Top bar: logo + close */
.fom-cmm__top{
	display:flex; align-items:center; justify-content:space-between;
	padding:22px 24px 18px; flex:0 0 auto;
}
.fom-cmm__brand{ display:inline-flex; }
.fom-cmm__brand img{ height:38px; width:auto; display:block; }
.fom-cmm__close{
	background:transparent; border:0; color:#fff; cursor:pointer;
	padding:4px; margin:-4px -4px -4px 0; line-height:0;
}

/* Scroll area */
.fom-cmm__scroll{ flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:0 24px 32px; }

/* Primary items */
.fom-cmm__group{ border-bottom:1px solid rgba(255,255,255,.08); }
.fom-cmm__item{ display:flex; align-items:center; }
.fom-cmm__link{
	flex:1 1 auto; color:#fff; text-decoration:none;
	font-size:18px; font-weight:500; line-height:1.3; padding:17px 0;
}
.fom-cmm__link:hover{ color:#fff; opacity:.85; }
.fom-cmm__toggle{
	flex:0 0 auto; background:transparent; border:0; color:#fff; cursor:pointer;
	padding:10px; margin-right:-10px; line-height:0;
	transition:transform .22s ease;
}
.fom-cmm__group.is-open > .fom-cmm__item .fom-cmm__toggle{ transform:rotate(180deg); }

/* Sub menu (accordion) */
.fom-cmm__sub{
	display:grid; grid-template-rows:0fr; transition:grid-template-rows .26s ease;
}
.fom-cmm__group.is-open > .fom-cmm__sub{ grid-template-rows:1fr; }
.fom-cmm__sub > ul{
	overflow:hidden; list-style:none; margin:0; padding:0;
	background:rgba(255,255,255,.04); border-radius:10px;
}
.fom-cmm__group.is-open > .fom-cmm__sub > ul{ margin:2px 0 14px; }
.fom-cmm__sub li{ margin:0; }
.fom-cmm__sub a{
	display:block; color:#c7ced7; text-decoration:none;
	font-size:15px; line-height:1.35; padding:12px 18px;
}
.fom-cmm__sub a:hover{ color:#fff; }

/* Secondary group */
.fom-cmm__secondary{ display:flex; flex-direction:column; margin-top:18px; padding-top:6px; }
.fom-cmm__secondary a{
	color:#e4e8ec; text-decoration:none; font-size:16px; line-height:1.3; padding:12px 0;
}
.fom-cmm__secondary a:hover{ color:#fff; }

/* Footer */
.fom-cmm__footer{ color:#7d8794; font-size:13px; line-height:1.6; padding:22px 0 0; }

@media (min-width:981px){
	.fom-cmm, .fom-cmm-overlay, .fom-cmm-trigger{ display:none !important; }
}