@layer components{.btn{letter-spacing:-.005em;transition:background .3s var(--ease), color .3s var(--ease), box-shadow .3s var(--ease);border-radius:999px;align-items:center;gap:10px;padding:18px 28px;font-size:14.5px;font-weight:700;display:inline-flex}.btn:hover .btn__diamond{transform:rotate(135deg)}.btn__diamond{opacity:.9;width:7px;height:7px;transition:transform .35s var(--ease), opacity .25s;background:currentColor;border-radius:2px;flex-shrink:0;margin-left:4px;display:inline-block;transform:rotate(45deg)}.btn--primary{background:var(--primary);color:var(--ink);box-shadow:var(--shadow-glow)}.btn--primary:hover{background:linear-gradient(180deg, var(--primary) 0%, #f5b01a 100%);box-shadow:0 22px 50px -16px #ffc53173}.btn--ghost{color:var(--ink);background:0 0;padding:18px 4px}.btn--ghost .btn__line{background:var(--ink-5);width:32px;height:1px;transition:width .35s var(--ease), background .25s;margin-left:6px;display:inline-block}.btn--ghost:hover .btn__line{background:var(--ink);width:48px}.btn--lg{padding:22px 34px;font-size:16px}.header__cta{background:var(--ink);color:var(--surface);transition:background .3s var(--ease);border-radius:999px;align-items:center;gap:10px;padding:11px 20px;font-size:13.5px;font-weight:600;display:inline-flex}.header__cta:hover{background:color-mix(in srgb, var(--ink) 88%, white)}}