/* --- Glass --- */
    .glass {
      background: var(--glass-bg);
      backdrop-filter: var(--glass-blur);
      -webkit-backdrop-filter: var(--glass-blur);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-md);
      box-shadow: var(--glass-shadow);
    }

    .glass-interactive {
      transition:
        transform var(--duration) var(--ease-out),
        box-shadow var(--duration) var(--ease-out),
        background var(--duration) var(--ease);
    }

    @media (prefers-reduced-motion: no-preference) {
      .glass-interactive:hover {
        background: var(--glass-bg-hover);
        box-shadow: var(--glass-shadow-hover);
        transform: translateY(-2px);
      }
    }

    /* Solid primary CTA — clearer hierarchy than glass alone */
    .btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.8rem 1.85rem;
      font-family: var(--font-body);
      font-size: var(--text-sm);
      font-weight: 500;
      letter-spacing: 0.02em;
      color: var(--white);
      background: var(--accent);
      border: 1px solid transparent;
      border-radius: 100px;
      transition:
        background var(--duration) var(--ease-out),
        transform var(--duration) var(--ease-out),
        box-shadow var(--duration) var(--ease-out);
      box-shadow: 0 2px 12px rgba(61, 85, 76, 0.25);
    }

    .btn-primary:hover {
      background: var(--accent-hover);
      transform: translateY(-1px);
      box-shadow: 0 4px 18px rgba(61, 85, 76, 0.3);
    }

    .btn-primary:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 3px;
    }

    @media (prefers-reduced-motion: reduce) {
      .btn-primary:hover { transform: none; }
    }

    .btn-glass {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.75rem 1.75rem;
      font-family: var(--font-body);
      font-size: var(--text-sm);
      font-weight: 500;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--ink);
      background: var(--glass-bg);
      backdrop-filter: var(--glass-blur);
      -webkit-backdrop-filter: var(--glass-blur);
      border: 1px solid var(--glass-border);
      border-radius: 100px;
      transition: all var(--duration) var(--ease-out);
    }

    .btn-glass:hover {
      background: var(--glass-bg-hover);
      box-shadow: var(--glass-shadow-hover);
      transform: translateY(-2px);
    }

    .btn-glass:focus-visible {
      outline: 2px solid var(--ink);
      outline-offset: 3px;
    }

    @media (prefers-reduced-motion: reduce) {
      .glass-interactive:hover,
      .btn-glass:hover { transform: none; }
    }