:root {
    /* 🌿 Brand Colors */
    --primary-green: #076442;         /* Main Dark Green */
    --secondary-green: #053725;       /* Deeper Dark Green */
    --light-green: #6abf69;           /* Approx. for border-light-green */
    
    /* 🌸 Neutral / Backgrounds */
    --light-cream: #f9f7e7;           /* Light Cream / Off-white */
    --light-beige: #f5f5dc;           /* Background beige (from bg-light-beige) */
    --beige: #fdfcf5;                 /* Used for text-beige */
    --white: #ffffff;                 /* Pure White */
  
    /* 🌗 Opacity Variants (converted Tailwind utilities) */
    --green-10: rgba(7, 100, 66, 0.1);   /* border-green/10 */
    --green-20: rgba(7, 100, 66, 0.2);   /* border-light-green/20 */
    --green-30: rgba(7, 100, 66, 0.3);   /* bg-green/30 */
  
    /* 🖼️ Gradients */
    --loader-gradient: radial-gradient(
      circle at bottom,
      var(--primary-green) 50%,
      var(--secondary-green) 90%
    );
  
    /* Optional extra aliases */
    --text-primary: var(--secondary-green);
    --text-light: var(--light-cream);
    --bg-primary: var(--primary-green);
    --bg-light: var(--light-beige);
  }
  


      /* Slide-down animation */
    .menu-closed {
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      transition: max-height 0.4s ease, opacity 0.3s ease;
    }
    .menu-open {
      max-height: 500px; /* enough for menu items */
      opacity: 1;
      transition: max-height 0.5s ease, opacity 0.4s ease;
    }