/* Axentiq — design-system component CSS for the static site.
   These rules are normally injected at runtime by the DS JS bundle; the static
   build has no bundle, so the same CSS is shipped here verbatim. */

/* Button */
.ax-btn{
  --_h: 40px; --_px: 18px; --_fs: 14px; --_gap: 8px;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--_gap);
  height:var(--_h); padding-inline:var(--_px);
  font-family:var(--font-sans); font-size:var(--_fs); font-weight:var(--fw-semibold);
  line-height:1; letter-spacing:-0.01em; white-space:nowrap;
  border-radius:var(--radius-md); border:1px solid transparent; cursor:pointer;
  transition:var(--transition-colors), transform var(--dur-fast) var(--ease-standard);
  user-select:none; text-decoration:none; position:relative;
}
.ax-btn:focus-visible{ outline:none; box-shadow:var(--focus-ring); }
.ax-btn:active{ transform:scale(var(--press-scale)); }
.ax-btn[disabled], .ax-btn[aria-disabled="true"]{ opacity:var(--opacity-disabled); pointer-events:none; }
.ax-btn--sm{ --_h:32px; --_px:12px; --_fs:13px; --_gap:6px; border-radius:var(--radius-sm); }
.ax-btn--lg{ --_h:48px; --_px:24px; --_fs:16px; --_gap:10px; }
.ax-btn--full{ width:100%; }
.ax-btn--primary{ background:var(--brand); color:var(--brand-on); box-shadow:var(--shadow-brand); }
.ax-btn--primary:hover{ background:var(--brand-hover); }
.ax-btn--primary:active{ background:var(--brand-active); }
.ax-btn--secondary{ background:var(--surface); color:var(--text-strong); border-color:var(--border-strong); box-shadow:var(--shadow-xs); }
.ax-btn--secondary:hover{ background:var(--surface-hover); border-color:var(--ink-400); }
.ax-btn--ghost{ background:transparent; color:var(--text-body); }
.ax-btn--ghost:hover{ background:var(--surface-hover); color:var(--text-strong); }
.ax-btn__icon{ display:inline-flex; }
.ax-btn__label{ display:inline-flex; }

/* Tag */
.ax-tag{
  display:inline-flex; align-items:center; gap:7px;
  height:30px; padding-inline:13px;
  font-family:var(--font-sans); font-size:13px; font-weight:var(--fw-medium);
  line-height:1; white-space:nowrap; color:var(--text-body);
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-pill);
  transition:var(--transition-colors); cursor:default; text-decoration:none;
}
.ax-tag--interactive{ cursor:pointer; }
.ax-tag--interactive:hover{ border-color:var(--brand); color:var(--brand); background:var(--brand-subtle); }
.ax-tag:focus-visible{ outline:none; box-shadow:var(--focus-ring); }

/* ServiceCard */
.ax-service{
  display:flex; flex-direction:column; gap:14px; padding:var(--pad-card);
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); font-family:var(--font-sans); text-decoration:none; color:inherit;
  position:relative; transition:var(--transition-colors), transform var(--dur-base) var(--ease-standard);
}
a.ax-service{ cursor:pointer; }
a.ax-service:hover{ transform:translateY(var(--lift-y)); box-shadow:var(--shadow-lg); border-color:var(--border-strong); }
a.ax-service:focus-visible{ outline:none; box-shadow:var(--focus-ring); }
.ax-service__top{ display:flex; align-items:center; justify-content:space-between; }
.ax-service__icon{
  width:44px; height:44px; border-radius:var(--radius-md); flex:none;
  display:flex; align-items:center; justify-content:center;
  background:var(--brand-subtle); color:var(--brand);
}
.ax-service__num{ font-family:var(--font-mono); font-size:var(--text-xs); color:var(--text-subtle); letter-spacing:.05em; }
.ax-service__title{ font-family:var(--font-display); font-size:var(--text-lg); font-weight:var(--fw-semibold); letter-spacing:var(--ls-snug); color:var(--text-strong); line-height:1.2; }
.ax-service__desc{ font-size:var(--text-sm); line-height:var(--lh-relaxed); color:var(--text-muted); margin:0; }
.ax-service__link{ margin-top:auto; display:inline-flex; align-items:center; gap:6px; font-size:var(--text-sm); font-weight:var(--fw-semibold); color:var(--brand); }
.ax-service__link svg{ transition:transform var(--dur-base) var(--ease-standard); }
a.ax-service:hover .ax-service__link svg{ transform:translateX(3px); }

/* Form fields */
.ax-field{ display:flex; flex-direction:column; gap:6px; font-family:var(--font-sans); }
.ax-field__label{ font-size:var(--text-sm); font-weight:var(--fw-semibold); color:var(--text-strong); display:flex; gap:5px; align-items:center; }
.ax-field__req{ color:var(--error); }
.ax-field__opt{ color:var(--text-subtle); font-weight:var(--fw-regular); font-size:var(--text-xs); }
.ax-field__hint{ font-size:var(--text-xs); color:var(--text-muted); }
.ax-field__error{ font-size:var(--text-xs); color:var(--error); font-weight:var(--fw-medium); }
.ax-input-wrap{ position:relative; display:flex; align-items:center; }
.ax-input{
  width:100%; height:40px; padding:0 12px;
  font-family:var(--font-sans); font-size:var(--text-sm); color:var(--text-strong);
  background:var(--field-bg); border:1px solid var(--field-border); border-radius:var(--radius-md);
  transition:var(--transition-colors); box-sizing:border-box;
}
.ax-input::placeholder{ color:var(--field-placeholder); }
.ax-input:hover{ border-color:var(--field-border-hover); }
.ax-input:focus{ outline:none; border-color:var(--border-focus); box-shadow:var(--focus-ring); }
.ax-input--lg{ height:48px; font-size:15px; }
.ax-input--has-left{ padding-left:38px; }
.ax-input__aff{ position:absolute; display:flex; align-items:center; justify-content:center; color:var(--text-subtle); pointer-events:none; }
.ax-input__aff--left{ left:12px; }
.ax-textarea{
  width:100%; min-height:96px; padding:10px 12px; resize:vertical;
  font-family:var(--font-sans); font-size:var(--text-sm); line-height:var(--lh-normal); color:var(--text-strong);
  background:var(--field-bg); border:1px solid var(--field-border); border-radius:var(--radius-md);
  transition:var(--transition-colors); box-sizing:border-box;
}
.ax-textarea::placeholder{ color:var(--field-placeholder); }
.ax-textarea:hover{ border-color:var(--field-border-hover); }
.ax-textarea:focus{ outline:none; border-color:var(--border-focus); box-shadow:var(--focus-ring); }
.ax-select-wrap{ position:relative; display:flex; align-items:center; }
.ax-select{
  width:100%; height:40px; padding:0 38px 0 12px;
  font-family:var(--font-sans); font-size:var(--text-sm); color:var(--text-strong);
  background:var(--field-bg); border:1px solid var(--field-border); border-radius:var(--radius-md);
  transition:var(--transition-colors); box-sizing:border-box; cursor:pointer;
  appearance:none; -webkit-appearance:none;
}
.ax-select:hover{ border-color:var(--field-border-hover); }
.ax-select:focus{ outline:none; border-color:var(--border-focus); box-shadow:var(--focus-ring); }
.ax-select--placeholder{ color:var(--field-placeholder); }
.ax-select__chev{ position:absolute; right:12px; color:var(--text-muted); pointer-events:none; display:flex; }
