/* CareeGrow Custom Styles
  -------------------------------------------------- */
  :root {
    --caree-green: #38b46e;
    --caree-green-dark: #2f945a;
    --caree-light-bg: #d8f5e6;
  }
  
  /* Tailwind utility helpers (custom tokens as classes) */
  .bg-caree-green {
    background-color: var(--caree-green)
  }
  .hover\:bg-caree-green-dark:hover {
    background-color: var(--caree-green-dark)
  }
  .text-caree-green {
    color: var(--caree-green)
  }
  .border-caree-green {
    border-color: var(--caree-green)
  }
  .bg-hero-light {
    background-color: var(--caree-light-bg)
  }
  
  /* Global */
  html {
    scroll-behavior: smooth
  }
  body {
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif
  }
  .page-content {
    display: none
  }
  .is-active-page {
    display: block
  }
  
  /* Custom scrollbar */
  ::-webkit-scrollbar {
    width: 8px
  }
  ::-webkit-scrollbar-track {
    background: var(--caree-light-bg);
    border-radius: 10px
  }
  ::-webkit-scrollbar-thumb {
    background: var(--caree-green);
    border-radius: 10px
  }
  ::-webkit-scrollbar-thumb:hover {
    background: var(--caree-green-dark)
  }
  
  /* FAQ accordion */
  .accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease, padding .3s ease;
    padding: 0 1.25rem; /* 0 px-5 */
  }
  .accordion-item input[type="checkbox"]:checked ~ .accordion-content {
    max-height: 500px;
    padding: 0 1.25rem 1.25rem; /* 0 px-5 pb-5 */
  }
  .accordion-item input[type="checkbox"]:checked ~ .accordion-header svg {
    transform: rotate(180deg)
  }
  
  /* Simple reveal animations (for JS IntersectionObserver) */
  .reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .6s ease, transform .6s ease
  }
  .reveal.is-visible {
    opacity: 1;
    transform: translateY(0)
  }
  
  /* Header shadow on scroll */
  .header-scrolled {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .06)
  }
  
  /* Animated Hamburger Menu */
  #mobileMenu {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, opacity 0.3s ease-in-out;
  }
  #mobileMenu.is-open {
    max-height: 500px; /* Adjust as needed */
    opacity: 1;
  }
  
  /* Buttons micro-interactions */
  .btn-bounce:hover {
    transform: translateY(-1px)
  }
  .btn-bounce:active {
    transform: translateY(0)
  }
  
  /* Small utility for outline focus */
  a:focus-visible,
  button:focus-visible {
    outline: 2px solid var(--caree-green);
    outline-offset: 2px
  }
  
  /* Active Nav Link Styling */
  .nav-link.nav-link-active {
    color: #38b46e; /* caree-green */
    font-weight: 700;
  }
  
  /* Button Bounce Animation */
  @keyframes bounce-subtle {
    0%,
    100% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.01);
    }
  }
  .btn-bounce {
    animation: bounce-subtle 2s infinite ease-in-out;
  }