/* WRKN component styles. Every declaration reads a token; the base rules are lifted
   verbatim from the source kit's components/bundle.css. State rules (hover/active/
   focus/disabled) are the documented additions — see readme.md > Intentional additions. */

/* ---- Button ---- */
.wrkn-btn{font-family:var(--font-heading);font-weight:var(--weight-bold);font-size:16px;letter-spacing:0.01em;text-transform:uppercase;line-height:1;padding:var(--space-4) var(--space-6);border-radius:var(--radius-none);border:1px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2);transition:var(--transition-interactive)}
.wrkn-btn--primary{background:var(--red);color:var(--on-accent)}
.wrkn-btn--outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.wrkn-btn--primary:hover{opacity:var(--hover-opacity)}
.wrkn-btn--primary:active{opacity:var(--press-opacity)}
.wrkn-btn--outline:hover{background:var(--ink);color:var(--surface)}
.wrkn-btn--outline:active{opacity:var(--press-opacity)}
.wrkn-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.wrkn-btn[disabled]{opacity:var(--disabled-opacity);cursor:not-allowed}
.wrkn-btn--sm{font-size:13px;padding:var(--space-3) var(--space-4)}
.wrkn-btn--block{width:100%;justify-content:center}

/* ---- Tag ---- */
.wrkn-tag{font-family:var(--font-mono);font-size:13px;letter-spacing:0.02em;padding:var(--space-2) var(--space-4);border-radius:var(--radius-none);border:1px solid var(--ink);color:var(--ink);background:transparent;display:inline-block}
.wrkn-tag--fill-red{background:var(--red);color:var(--on-accent);border-color:var(--red)}
.wrkn-tag--fill-lime{background:var(--lime);color:var(--on-lime);border-color:var(--lime)}

/* ---- Eyebrow ---- */
/* white-space:pre-line lets a stamp carry its own line breaks ("WRKN STUDIO\nPORTO ALEGRE"). */
.wrkn-eyebrow{font-family:var(--font-mono);font-size:13px;line-height:1.4;letter-spacing:0.02em;color:var(--ink);margin:0;white-space:pre-line}
.wrkn-eyebrow--accent{color:var(--red)}
.wrkn-eyebrow--right{text-align:right}

/* ---- Card ---- */
.wrkn-card{border:1px solid var(--red);background:var(--surface);padding:var(--space-6);border-radius:var(--radius-none);max-width:360px}
.wrkn-card__title{font-family:var(--font-heading);font-weight:var(--weight-bold);font-size:20px;color:var(--red);margin:0 0 var(--space-4)}
.wrkn-card__body{font-family:var(--font-body);font-size:15px;line-height:1.6;color:var(--red);margin:0}
.wrkn-card__body + .wrkn-card__body{margin-top:var(--space-3)}

/* ---- Cover ---- */
.wrkn-cover{position:relative;overflow:hidden;background:var(--surface)}
.wrkn-cover__svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.wrkn-cover__text{position:absolute;left:var(--space-8);bottom:var(--space-6);width:46%}
.wrkn-cover__name{font-family:var(--font-display);font-weight:var(--weight-display);font-size:140px;line-height:0.95;letter-spacing:-0.01em;color:var(--ink);margin:0}
.wrkn-cover__logo{display:block;height:120px;width:auto}
.wrkn-cover__tagline{font-family:var(--font-mono);font-size:14px;letter-spacing:0.01em;color:var(--ink);margin:var(--space-4) 0 0}
.wrkn-cover__stamp{position:absolute;right:var(--space-8);top:var(--space-6);text-align:right;white-space:pre-line}

/* ---- document defaults consumers inherit ---- */
a{color:var(--red);text-decoration:underline;text-underline-offset:2px;transition:var(--transition-interactive)}
a:hover{color:var(--ink)}
[data-theme="dark"] a{color:var(--ink)}
[data-theme="dark"] a:hover{opacity:var(--hover-opacity)}