/* components.css - buttons, cards, forms, badges */
.btn { display:inline-flex; align-items:center; gap:.55rem; padding:.8rem 1.5rem; border-radius:var(--btn-radius);
  font-family:var(--font-display); font-weight:var(--btn-weight,600); font-size:.95rem; white-space:nowrap;
  transition:transform var(--transition), background var(--transition), box-shadow var(--transition), color var(--transition);
  letter-spacing:var(--btn-spacing,0); text-transform:var(--btn-transform,none); }
.btn:active { transform:translateY(1px); }
.btn--primary { background:var(--accent); color:var(--on-accent); box-shadow:var(--btn-shadow,none); border:var(--btn-border,1px solid transparent); }
.btn--primary:hover { background:var(--accent-hover,var(--amber)); color:var(--on-accent-hover,var(--on-accent)); box-shadow:var(--btn-shadow-hover,none); }
.btn--ghost { color:var(--text); border:1px solid var(--border); }
.btn--ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn--lg { padding:1rem 1.9rem; font-size:1.05rem; }

.card { background:var(--card-bg); border:var(--card-border); border-radius:var(--radius); padding:clamp(1.5rem,3vw,2rem);
  transition:transform var(--transition), border-color var(--transition), box-shadow var(--transition); position:relative; overflow:hidden; }
.card:hover { transform:var(--card-hover-transform,translateY(-6px)); border-color:var(--card-hover-border,var(--accent)); box-shadow:var(--shadow); }
.card h3 { margin-bottom:.6rem; }
.card p { font-size:.96rem; }
.card__icon { width:52px; height:52px; border-radius:var(--icon-radius,14px); margin-bottom:1.2rem; display:grid; place-items:center;
  background:var(--icon-bg); border:var(--icon-border); }
.card__icon svg { width:26px; height:26px; stroke:var(--icon-stroke,var(--accent)); fill:none; }

.pill { display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .9rem; border-radius:var(--btn-radius);
  background:var(--pill-bg); border:var(--pill-border); color:var(--pill-color,var(--accent)); font-size:.8rem; font-weight:600;
  font-family:var(--font-display); letter-spacing:.04em; text-transform:var(--pill-transform,none); }

.field { margin-bottom:1.2rem; }
.field label { display:block; font-size:.85rem; font-weight:600; margin-bottom:.45rem; color:var(--text); }
.field input,.field textarea,.field select { width:100%; padding:.85rem 1rem; background:var(--input-bg); border:1px solid var(--border);
  border-radius:var(--radius-sm); color:var(--text); font:inherit; transition:border-color var(--transition), box-shadow var(--transition); }
.field input:focus,.field textarea:focus,.field select:focus { outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%, transparent); }
.field textarea { resize:vertical; min-height:130px; }
.form__note { font-size:.85rem; }
.form__success { display:none; padding:1rem 1.2rem; border-radius:var(--radius-sm);
  background:color-mix(in srgb,var(--accent) 14%, transparent); border:1px solid var(--accent); color:var(--text); }
.form__success.show { display:block; }
.error-text { color:var(--danger); font-size:.8rem; margin-top:.35rem; min-height:1rem; }