.site-header .mark{left:10px !important}

/* Ensure nav items are vertically centered */
.nav{align-items:center}

/* Hide injected nav close button on larger viewports; shown only in mobile rules below */
.nav-close{display:none !important}

/* Pill-style active menu item */
.nav a.active{
	background:var(--green);
	color:var(--navy);
	padding:8px 14px;
	border-radius:999px;
	box-shadow:0 8px 20px rgba(49,184,74,.14);
	display:inline-flex;
	align-items:center;
	transform:translateZ(0);
	transition:transform .16s ease,box-shadow .16s ease,background .16s ease;
}
.nav a.active:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(49,184,74,.18)}

/* Homepage capability cards with image-led treatments */
.feature-card{
	padding:0;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	min-height:100%;
	background:linear-gradient(180deg, #ffffff 0%, #f7f9fb 100%);
	border:1px solid rgba(7,29,58,.08);
	border-radius:18px;
	box-shadow:0 16px 36px rgba(7,29,58,.08);
	transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
	position:relative;
}
.feature-card:hover{
	transform:translateY(-8px);
	box-shadow:0 26px 55px rgba(7,29,58,.14);
	border-color:rgba(49,184,74,.3);
}
.feature-card__image{
	height:155px;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	position:relative;
	border-bottom:1px solid rgba(7,29,58,.08);
	border-radius:18px 18px 0 0;
}
.feature-card__image:before,
.feature-card__image:after{
	content:none;
}
.feature-card__image--repair{
	background-image:linear-gradient(135deg, rgba(49,184,74,.18), rgba(7,29,58,.44)), url('../repairs/installation.jpeg');
}
.feature-card__image--services{
	background-image:linear-gradient(135deg, rgba(49,184,74,.14), rgba(7,29,58,.42)), url('../sales/WhatsApp Image 2026-08-15 at 04.13.40.jpeg');
}
.feature-card__image--installations{
	background-image:linear-gradient(135deg, rgba(49,184,74,.18), rgba(7,29,58,.38)), url('../repairs/WhatsApp Image 2026-08-15 at 04.18.34.jpeg');
}
.feature-card__image--spares{
	background-image:linear-gradient(135deg, rgba(49,184,74,.14), rgba(7,29,58,.46)), url('../1004.jpeg');
}
.feature-card__body{
	padding:24px 20px 26px;
	position:relative;
}
.feature-card__body:before{
	content:"";
	position:absolute;
	left:20px;
	top:-10px;
	width:56px;
	height:4px;
	border-radius:999px;
	background:linear-gradient(90deg, #31b84a, #6bcf8b);
}
.feature-card__body h3{
	margin:0 0 12px;
	font-size:21px;
	line-height:1.2;
	letter-spacing:-.02em;
	color:#071d3a;
}
.feature-card__body p{
	margin:0;
	color:#5d6c7e;
	font-size:14px;
	line-height:1.7;
}

.site-notice{
	position:fixed;
	left:50%;
	top:18px;
	transform:translate(-50%, -12px);
	background:rgba(7,29,58,.96);
	color:#fff;
	border:1px solid rgba(49,184,74,.55);
	border-radius:12px;
	padding:12px 18px;
	font-size:13px;
	font-weight:700;
	line-height:1.5;
	letter-spacing:.01em;
	box-shadow:0 18px 40px rgba(7,29,58,.2);
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
	z-index:100000;
	max-width:min(90vw, 420px);
	text-align:center;
}
.site-notice.visible{
	opacity:1;
	visibility:visible;
	transform:translate(-50%, 0);
}

/* Floating WhatsApp button (global) */
.wa-float{
	position:fixed;
	right:20px;
	bottom:15%;
	width:60px;
	height:60px;
	border-radius:50%;
	background:#25D366;
	color:#fff;
	display:grid;
	place-items:center;
	box-shadow:0 10px 30px rgba(2,46,22,.18);
	z-index:12000;
	cursor:pointer;
	transition:transform .18s ease,box-shadow .18s ease;
	animation:waFloat 3.8s ease-in-out infinite;
}
.wa-float:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 18px 36px rgba(2,46,22,.22)}
.wa-float svg{width:28px;height:28px;display:block}
@keyframes waFloat{0%{transform:translateY(0)}50%{transform:translateY(-8px)}100%{transform:translateY(0)}}
@media (max-width:700px){
	.site-topbar{
		background:#0d1f3d;
		border-bottom:1px solid rgba(255,255,255,.08);
		font-size:10px;
	}
	.site-topbar-inner{
		padding:8px 14px;
		justify-content:center;
		gap:8px;
	}
	.site-topbar-contact,
	.site-topbar-links{
		width:100%;
		justify-content:center;
		margin-left:0;
	}
	.site-topbar-item,
	.site-topbar-links a,
	.site-topbar-contact a{
		white-space:nowrap;
	}
	.site-topbar-brand{
		display:none;
	}
	.site-topbar-icon{
		width:11px;
		height:11px;
	}
	.wa-float{

	}

	.site-header{
		min-height:95px;
		z-index:30;
	}
	.site-header .mark{width:192px;height:192px;top:8px;margin-top:0}
	.site-header .mark img{
		width:100%;
		height:100%;
		object-fit:contain;
	    margin-top: -59px !important;
	}
	.menu-toggle{
		display:flex !important;
		align-items:center;
		justify-content:center;
		width:46px;
		height:46px;
		border:1px solid rgba(255,255,255,.2);
		border-radius:50%;
		background:rgba(255,255,255,.06);
		cursor:pointer;
		position:relative;
		z-index:35;
	}
	.nav{
		display:none;
		position:fixed;
		top:0;
		left:0;
		bottom:0;
		width:min(82vw,320px);
		height:100vh;
		padding:20px 22px 24px;
		background:var(--navy);
		flex-direction:column;
		align-items:flex-start;
		gap:16px;
		box-shadow:14px 0 42px rgba(7,29,58,.28);
		transform:translateX(-105%);
		opacity:0;
		visibility:hidden;
		pointer-events:none;
		transition:transform .22s ease, opacity .22s ease, visibility .22s ease;
		z-index:40;
		border-right:1px solid rgba(255,255,255,.08);
		isolation:isolate;
	}
	.nav.open{
		display:flex;
		transform:translateX(0);
		opacity:1;
		visibility:visible;
		pointer-events:auto;
	}
	.nav-backdrop{
		position:fixed;
		inset:0;
		background:rgba(7,29,58,.55);
		opacity:0;
		visibility:hidden;
		pointer-events:none;
		transition:opacity .2s ease, visibility .2s ease;
		z-index:20;
	}
	.nav-backdrop.visible{
		opacity:1;
		visibility:visible;
		pointer-events:auto;
	}
	.nav-logo{
		display:flex;
		align-items:center;
		justify-content:center;
		width:160px;
		height:160px;
		padding:0;
		margin:0 auto 12px;
		border-bottom:0;
	}
	.nav-logo img{
		display:block;
		width:150px;
		height:150px;
		object-fit:contain;
	}
	.nav a{
		width:100%;
		padding:10px 0;
		border-bottom:1px solid rgba(255,255,255,.12);
		font-size:14px;
	}
	.nav a.active{
		padding:10px 14px;
		width:auto;
		margin-top:4px;
	}
	.nav.open .nav-close{
		display:flex !important;
		align-items:center;
		justify-content:center;
		position:absolute;
		top:18px;
		right:18px;
		width:36px;
		height:36px;
		border:1px solid rgba(255,255,255,.2);
		border-radius:50%;
		background:transparent;
		color:#fff;
		font-size:18px;
		cursor:pointer;
	}
}