:root {
  --nutri-bg: #0b0f19;
  --nutri-card-bg: rgba(20, 28, 47, 0.65);
  --nutri-accent: #10b981;
  --nutri-accent-glow: rgba(16, 185, 129, 0.4);
  --nutri-gold: #f59e0b;
  --nutri-text: #f3f4f6;
  --nutri-text-muted: #9ca3af;
  --font-display: 'Oswald', sans-serif;
  --font-body: 'Lato', sans-serif;
}

/* Custom Base Styles */
body {
  background-color: var(--nutri-bg);
  background-image: 
    radial-gradient(rgba(16, 185, 129, 0.06) 1px, transparent 1px), 
    radial-gradient(rgba(11, 15, 25, 0.9) 1px, var(--nutri-bg) 1px);
  background-size: 32px 32px;
  background-position: 0 0, 16px 16px;
  color: var(--nutri-text);
  font-family: var(--font-body);
  overflow-x: hidden;
  scroll-behavior: smooth;
}

/* Scroll-driven animations */
@keyframes progress-grow { 
  to { width: 100%; } 
}

.scroll-progress { 
  height: 3px; 
  width: 0; 
  background: var(--nutri-accent); 
  position: fixed; 
  top: 0; 
  left: 0; 
  z-index: 101; 
  animation: progress-grow linear; 
  animation-timeline: scroll(); 
}

@keyframes slide-up { 
  from { opacity: 0; transform: translateY(40px); } 
  to { opacity: 1; transform: none; } 
}

.reveal { 
  animation: slide-up 0.6s linear both; 
  animation-timeline: view(); 
  animation-range: entry 0% entry 40%; 
}

/* Glassmorphism Cards styling */
.glass-shield-item {
  background: var(--nutri-card-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.glass-shield-item:hover {
  transform: translateY(-6px);
  border-color: rgba(16, 185, 129, 0.4);
  box-shadow: 0 12px 36px 0 rgba(16, 185, 129, 0.15);
}

/* Horizontal Quote Card hovering */
.quote-holder {
  transition: transform 0.3s ease, border-color 0.3s ease;
}

.quote-holder:hover {
  transform: translateX(4px);
  border-color: var(--nutri-gold) !important;
}

/* Custom interactive triggers */
.hover-glow {
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.hover-glow:hover {
  color: var(--nutri-accent) !important;
  text-shadow: 0 0 8px var(--nutri-accent-glow);
}

/* Mobile responsive hamburger check logic */
#nutri-burger-toggle:checked ~ .nutri-navigation {
  display: block !important;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #0b0f19;
  padding: 2rem;
  z-index: 99;
  border-bottom: 2px solid var(--nutri-accent);
}

#nutri-burger-toggle:checked ~ #nutri-burger-btn span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

#nutri-burger-toggle:checked ~ #nutri-burger-btn span:nth-child(2) {
  opacity: 0;
}

#nutri-burger-toggle:checked ~ #nutri-burger-btn span:nth-child(3) {
  transform: rotate(-45deg) translate(7px, -7px);
}

/* Custom interactive focus states */
input:focus, textarea:focus {
  border-color: var(--nutri-accent) !important;
  outline: none;
  box-shadow: 0 0 8px rgba(16, 185, 129, 0.2);
}