/* Zariya components v1.0: OPTIONAL starter patterns for NEW sites only.
   Existing sites do not link this file. Requires tokens.css. */
.z-btn { background: var(--brand-primary); color: var(--brand-primary-contrast); border: 0; border-radius: var(--radius); padding: var(--space-3) var(--space-5); font: 500 var(--text-base)/1 var(--brand-font-body); cursor: pointer; transition: background var(--brand-dur) var(--brand-ease); }
.z-btn:hover { background: var(--brand-primary-hover); }
.z-btn:active { background: var(--brand-primary-active); }
.z-btn:disabled { opacity: var(--disabled-opacity); cursor: not-allowed; }
.z-link { color: var(--brand-link); transition: color var(--brand-dur) var(--brand-ease); }
.z-link:hover { color: var(--brand-link-hover); }
.z-card { background: var(--brand-surface); border: var(--border-w) solid var(--brand-line); padding: var(--space-5); }
.z-row:hover { background: var(--brand-surface-hover); }
.z-scrim { background: rgb(var(--brand-bg-rgb) / var(--image-scrim-alpha)); }
.z-label { font: 500 var(--text-xs)/1 var(--brand-font-label); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--brand-text-muted); }
.z-page { background: var(--brand-bg); color: var(--brand-text); font: var(--text-base)/var(--leading-normal) var(--brand-font-body); margin: 0; }
.z-header-fade { background: rgb(var(--brand-bg-rgb) / calc(var(--scroll, 0) * var(--scroll-scrim-alpha))); transition: background var(--brand-dur) var(--brand-ease); } /* set --scroll (0 to 1) from a tiny scroll script */
.z-wrap { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter); }