/* CraveCart production hardening — loaded after page styles */

:root
{
--cc-green:#198754;
--cc-green-dark:#11643e;
--cc-ink:#173321;
--cc-surface:#fff;
--cc-border:rgba(20,83,45,.12)
}

*,*::before,*::after
{
box-sizing:border-box
}

html
{
scroll-behavior:smooth;
-webkit-text-size-adjust:100%
}

body{
margin:0;
overflow-x:hidden;
font-family:Arial,Helvetica,sans-serif;
color:var(--cc-ink)
}

img,svg,video
{
max-width:100%;
height:auto
}

a,button,input,select,textarea
{
-webkit-tap-highlight-color:transparent
}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.hamburger:focus-visible
{
outline:3px solid rgba(25,135,84,.35);
outline-offset:3px
}

.header{
position:sticky!important;
top:0!important;
z-index:10000!important;
background:rgba(255,255,255,.97)!important;
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
border-bottom:1px solid var(--cc-border);
box-shadow:0 5px 20px rgba(0,0,0,.05)
}

.navbar{
width:100%!important;
max-width:1320px!important;
min-height:72px;
margin:auto!important;
padding:8px 20px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:20px;
}

.logo
{
display:flex;
align-items:center;
flex:0 0 auto;
z-index:1000
}

.logo img
{
display:block!important;
width:auto!important;
height:58px!important;
max-width:150px!important;
object-fit:contain
}

#menu-toggle
{
position:relative!important;
opacity:0!important;
pointer-events:none!important
}
.nav-links
{
list-style:none!important;
margin:0!important;
padding:0!important;
display:flex!important;
align-items:center!important;
gap:8px!important
}
.nav-links li
{
list-style:none!important;
margin:0!important
}

.nav-links a
{
display:flex!important;
align-items:center!important;
gap:8px!important;
padding:11px 14px!important;
border-radius:10px!important;
text-decoration:none!important;
color:#14532d!important;
font-weight:700!important;
line-height:1.2!important;
white-space:nowrap;
transition:.2s ease
}

.nav-links a:hover
{background:#f0fdf4!important;
color:var(--cc-green)!important
}

.nav-links a::after
{
display:none!important
	}
.nav-links a i
{display:inline-flex!important;
align-items:center;
justify-content:center;
width:18px;
color:var(--cc-green)
}

.nav-links .nav-cta
{
margin-left:4px!important;
padding:11px 18px!important;
border-radius:999px!important;
background:var(--cc-green)!important;
color:#fff!important
}

.nav-links .nav-cta i
{
	color:#fff!important
}

.nav-links .nav-cta:hover
{
	background:var(--cc-green-dark)!important;color:#fff!important
}

.mobile-logo
{display:none!important}

.hamburger
{display:none;
position:relative;
z-index:10006;
width:44px;
height:44px;
border-radius:12px;
align-items:center;
justify-content:center;
flex-direction:column;
gap:5px;
background:#f2f7f4;
cursor:pointer}

.hamburger span{
display:block;
width:23px;height:2px;
border-radius:3px;
background:#173321;
transition:transform .25s ease,opacity .25s ease,background .25s ease
}

.overlay{
position:fixed;
inset:0;
z-index:10001;
background:rgba(0,0,0,.48);
opacity:0;visibility:hidden;
pointer-events:none;
transition:opacity .25s ease,visibility .25s ease
}

#backToTop{
position:fixed;
right:20px;bottom:max(20px,env(safe-area-inset-bottom));
z-index:9990;
width:46px;
height:46px;
border:0;
border-radius:50%;
background:var(--cc-green);
color:#fff;
font-size:20px;
cursor:pointer;
box-shadow:0 8px 24px rgba(0,0,0,.2);
opacity:0;
visibility:hidden;transform:translateY(10px);transition:.25s ease
}

#backToTop.show{opacity:1;
visibility:visible;
transform:none
}

@media(max-width:900px){
	
 .navbar
 {min-height:66px!important;
 padding:5px 14px!important
 }
 
 .logo img{height:54px!important}
 
 .hamburger{display:flex!important}
 
 .nav-links
 {
 position:fixed!important;
 top:0!important;right:0!important;
 width:min(86vw,350px)!important;
 height:100vh!important;
 height:100dvh!important;
 padding:max(78px,calc(env(safe-area-inset-top) + 68px)) 18px max(24px,env(safe-area-inset-bottom))!important;
 display:flex!important;flex-direction:column!important;align-items:stretch!important;
 justify-content:flex-start!important;gap:5px!important;background:#fff!important;
 z-index:10003!important;overflow-y:auto!important;overflow-x:hidden!important;
 overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
 box-shadow:-16px 0 40px rgba(0,0,0,.18);
 transform:translateX(105%)!important;
 transition:transform .3s ease!important
 }
 
 #menu-toggle:checked~.nav-links{transform:translateX(0)!important}
 
 #menu-toggle:checked~.overlay{
 opacity:1;
 visibility:visible;pointer-events:auto}
 
 #menu-toggle:checked+.hamburger{position:fixed!important;
 top:max(12px,env(safe-area-inset-top));
 right:16px;z-index:10007;background:var(--cc-green);
 box-shadow:0 8px 25px rgba(0,0,0,.18)
 }
 
 #menu-toggle:checked+.hamburger span{background:#fff}
 #menu-toggle:checked+.hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 #menu-toggle:checked+.hamburger span:nth-child(2){opacity:0}
 #menu-toggle:checked+.hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 
 .mobile-logo
 {display:flex!important;
 justify-content:flex-start!important;
 padding:0 54px 12px 2px!important;
 margin:0 0 8px!important;
 border-bottom:1px solid #e9efeb!important}
 
 .mobile-logo img{
 margin-left: auto;
 margin-right: auto;
 margin-top:5px;
 width:auto!important;
 height:50%!important;
 object-fit:contain}
 
 .nav-links li
 {width:100%!important
 }
 
 .nav-links a
 {width:100%!important;
 min-height:48px;
 padding:11px 12px!important;
 font-size:15px!important;
 color:#244332!important;
 background:transparent!important
 }
 
 .nav-links a i
 {width:34px!important;
 height:34px!important;
 flex:0 0 34px!important;
 border-radius:9px;
 background:#edf8f2;
 color:var(--cc-green)!important
 }
 
 .nav-links .nav-cta
 {margin:8px 0 0!important;
 justify-content:center!important;
 color:#fff!important
 }
 
 .nav-links .nav-cta i
 {color:#fff!important;
 background:rgba(255,255,255,.16)!important
 }
 
}
@media(max-width:950px) and (orientation:landscape)
{
	.navbar{
		min-height:58px!important
		}
		.logo img{
			height:48px!important
			}
			.nav-links{
				width:min(58vw,420px)!important;
				padding:max(58px,calc(env(safe-area-inset-top) + 50px)) 14px max(12px,env(safe-area-inset-bottom))!important;
				gap:1px!important
				}
				.mobile-logo{
					display:visible!important;
					}
					.nav-links a
					{
						min-height:40px!important;
						padding:6px 10px!important;
						font-size:14px!important
						}
						.nav-links a i{
							width:28px!important;
							height:28px!important;
							flex-basis:28px!important;
							font-size:12px!important}
							#menu-toggle:checked+.hamburger
							{top:max(8px,env(safe-area-inset-top));
							right:12px;width:40px;height:40px}
							}
@media(max-height:420px) and (orientation:landscape)
{
	.nav-links
	{
		padding-top:max(52px,calc(env(safe-area-inset-top) + 46px))!important
		}
	.nav-links a
	{
		min-height:36px!important;padding:4px 9px!important}
		.nav-links .nav-cta{
			margin-top:3px!important
			}
			}
@media(prefers-reduced-motion:reduce)
{*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
