/* Custom CSS Variables & Styling based on "Healthy Lifestyle" */
:root {
  --sendi-bg-main: #f8fafc;
  --sendi-surface: #ffffff;
  --sendi-primary: #0f766e; /* Fresh Teal Color */
  --sendi-primary-hover: #115e59;
  --sendi-accent: #f59e0b; /* Amber/Warm Contrast */
  --sendi-ink-dark: #0f172a; /* Slate 900 for high readability */
  --sendi-ink-muted: #475569; /* Slate 600 for text content */
  --sendi-bg-gradient: linear-gradient(135deg, rgba(240, 253, 250, 0.95), rgba(204, 251, 241, 0.9));
  
  --font-display: 'Montserrat', sans-serif;
  --font-body: 'Inter', sans-serif;
  
  --sendi-border-radius: 16px; /* Soft layout border-radius style */
  --sendi-shadow: 0 10px 15px -3px rgba(15, 118, 110, 0.05), 0 4px 6px -4px rgba(15, 118, 110, 0.05); /* Raised shadow style */
}

/* Page Bounds Wrapper alternative for container */
.sendi-bounds {
  max-width: 1200px;
  width: 100%;
}

/* Custom CSS-Only Scroll Progress Bar */
.sendi-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 4px;
  background: var(--sendi-primary);
  width: 0%;
  z-index: 101;
  animation: progress-grow linear;
  animation-timeline: scroll();
}
@keyframes progress-grow {
  to { width: 100%; }
}

/* Responsive Header Mobile Toggle Navigation styling */
.sendi-header-bar {
  background: var(--sendi-surface);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  position: sticky;
  top: 0;
  z-index: 100;
}

@media (max-width: 768px) {
  .sendi-navigation {
    position: fixed;
    top: 70px;
    left: -100%;
    width: 100%;
    height: calc(100vh - 70px);
    background: var(--sendi-surface);
    transition: left 0.3s cubic-bezier(0.77,0.2,0.05,1.0);
    z-index: 80;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
    padding: 2rem;
  }
  #sendi-menu-toggle:checked ~ .sendi-navigation {
    left: 0;
  }
}

/* Scroll-driven Animations (CSS Only) */
@keyframes slide-up-view {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@supports (animation-timeline: view()) {
  .sendi-reveal {
    animation: slide-up-view both;
    animation-timeline: view();
    animation-range: entry 10% cover 35%;
  }
}

/* Hover lift effect for elements matching standard interactive cards */
#sendi-features div[style*="background: var(--sendi-surface)"]:hover {
  transform: translateY(-6px);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 20px 25px -5px rgba(15, 118, 110, 0.1), 0 10px 10px -5px rgba(15, 118, 110, 0.04) !important;
}

#sendi-features div[style*="background: var(--sendi-surface)"] {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}