:root {
    --mint: #74BA40;
    --mint-light: #e8f5d8;
    --timber: #1C312C;
    --black: #1D1D1B;
    --white: #FFFFFF;
    --gray: #f5f7f4;
    --muted: #6b7c68;
  }
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body { font-family: 'Poppins', sans-serif; background: var(--white); color: var(--black); overflow-x: hidden; }

  /* NAV */
  nav {
    position: sticky; top: 0; z-index: 100;
    background: rgba(255,255,255,0.94); backdrop-filter: blur(14px);
    border-bottom: 1px solid #e4ebe1;
    padding: 0 6vw; height: 64px;
    display: flex; align-items: center; justify-content: space-between;
  }
  .nav-logo svg { height: 32px; width: auto; }
  .nav-logo .cls-1 { fill: #74BA40; }
  .nav-logo .cls-2 { fill: #1D1D1B; }
  .nav-links { display: flex; gap: 20px; list-style: none; }
  .nav-links a { text-decoration: none; color: var(--black); font-size: 13px; font-weight: 500; transition: color .2s; }
  .nav-links a:hover { color: var(--mint); }
  .nav-cta { background: var(--mint); color: var(--white); padding: 9px 20px; border-radius: 100px; font-size: 13px; font-weight: 600; text-decoration: none; transition: background .2s; }
  .nav-cta:hover { background: #5fa32e; }

  /* STORE BUTTONS */
  .store-btn {
    display: flex; align-items: center; gap: 10px;
    background: var(--black); color: var(--white);
    border-radius: 14px; padding: 12px 20px;
    text-decoration: none; transition: all .2s;
    border: 1.5px solid rgba(255,255,255,.05);
  }
  .store-btn:hover { background: #2a2a28; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.15); }
  .store-btn svg { flex-shrink: 0; }
  .store-btn-small { font-size: 9px; color: rgba(255,255,255,.55); font-weight: 400; letter-spacing: .3px; text-transform: uppercase; }
  .store-btn-name { font-size: 15px; font-weight: 700; margin-top: 1px; }
