/* Komponen asas: butang, kad kaca, input, nav/footer sementara. */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: var(--tap); min-width: var(--tap); padding: .6rem 1.4rem; border-radius: 999px; font: 600 1rem var(--font-body); text-decoration: none; cursor: pointer; border: 1px solid var(--border); transition: transform .15s; }
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--grad); color: #fff; border-color: transparent; }
.btn--ghost { background: var(--surface); color: var(--ink); }

.glass-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: var(--shadow); padding: 1.25rem; backdrop-filter: blur(10px); }

.field { display: grid; gap: .35rem; margin-bottom: 1rem; }
.field label { font-weight: 600; font-size: .9rem; }
.field input { min-height: var(--tap); padding: .5rem .9rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-strong); color: var(--ink); font: inherit; }
.field input[aria-invalid="true"] { border-color: var(--red); }
.field__err { margin: 0; color: var(--red); font-size: .875rem; }


.lang-toggle { display: flex; gap: .25rem; }
.lang-toggle a { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); min-height: var(--tap); border-radius: 999px; color: var(--ink); font: 600 .9rem var(--font-mono); text-decoration: none; }
.lang-toggle a[aria-current="true"] { background: var(--ink); color: #fff; }
.field select { min-height: var(--tap); padding: .5rem .9rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-strong); color: var(--ink); font: inherit; }
.field input[type="search"] { min-height: var(--tap); padding: .5rem .9rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-strong); color: var(--ink); font: inherit; }
.site-footer { padding: 2rem 1rem; color: var(--ink-2); text-align: center; }