/* Explicit component classes only; never loaded by existing pages. */
.tisse-ui .surface-card { border: 1px solid rgba(195,125,87,.18); border-radius: var(--radius-newsletter); background: var(--surface-cream); box-shadow: var(--surface-paper-depth); }
.tisse-ui .text-link { color: var(--cta-primary); text-decoration: underline; text-underline-offset: 4px; }
.tisse-ui .text-link:focus-visible, .tisse-ui .tisse-brand:focus-visible { outline: 2px solid var(--cta-primary); outline-offset: 4px; }

.tisse-ui .btn,
.tisse-ui .btn--standard {
  --btn-font: var(--cta-standard-font); --btn-height: var(--cta-standard-height);
  --btn-pad-y: var(--cta-standard-pad-y); --btn-pad-x: var(--cta-standard-pad-x); --btn-weight: var(--cta-font-weight);
}
.tisse-ui .btn--header {
  --btn-font: var(--cta-header-font); --btn-height: var(--cta-header-height);
  --btn-pad-y: var(--cta-header-pad-y); --btn-pad-x: var(--cta-header-pad-x);
}
.tisse-ui .btn--hero {
  --btn-font: var(--cta-hero-font); --btn-height: var(--cta-hero-height);
  --btn-pad-y: var(--cta-hero-pad-y); --btn-pad-x: var(--cta-hero-pad-x);
}
.tisse-ui .btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  padding: var(--btn-pad-y) var(--btn-pad-x);
  border-radius: 999px;

  font-weight: var(--btn-weight);
  font-size: var(--btn-font);
  line-height: 1.25;
  min-height: var(--btn-height);
  text-decoration: none;
  color:#3a2f2a;

  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color: transparent;

  background: rgba(255,250,241,.92); 
  border: 1px solid rgba(217,177,143,.42);

  box-shadow:
    0 10px 26px rgba(28,18,14,.10),
    inset 0 1px 0 rgba(255,255,255,.75);

  transition:
    transform 200ms var(--ease),
    box-shadow 200ms var(--ease),
    background 200ms var(--ease),
    border-color 200ms var(--ease);
}
.tisse-ui .btn:hover {
  transform: translateY(-1px);
  box-shadow:
    0 14px 34px rgba(28,18,14,.12),
    inset 0 1px 0 rgba(255,255,255,.82);
}
.tisse-ui .btn:active {
  transform: translateY(0);
  box-shadow:
    0 8px 18px rgba(28,18,14,.10),
    inset 0 1px 0 rgba(255,255,255,.60);
}
.tisse-ui .btn:focus { outline:none; }
.tisse-ui .btn:focus-visible {
  outline: 2px solid var(--cta-primary);
  outline-offset: 4px;
  box-shadow:
    0 0 0 4px rgba(255,250,241,.92),
    0 0 0 7px var(--cta-light),
    0 14px 34px rgba(28,18,14,.12);
}
.tisse-ui .btn.primary {
  color: var(--cta-on-primary);
  border-color: var(--cta-primary);
  background: var(--cta-primary);
  box-shadow:
    0 12px 30px rgba(var(--cta-primary-rgb),.20),
    inset 0 1px 0 rgba(255,250,241,.18);
}
.tisse-ui .btn.primary:hover {
  box-shadow:
    0 16px 40px rgba(var(--cta-primary-rgb),.24),
    inset 0 1px 0 rgba(255,250,241,.22);
}
.tisse-ui .btn.primary:active {
  box-shadow:
    0 10px 24px rgba(var(--cta-primary-rgb),.20),
    inset 0 1px 0 rgba(255,250,241,.14);
}
.tisse-ui .btn.ghost {
  color: var(--ink);
  background: var(--beige);
  border-color: var(--cta-light);
}
.tisse-ui .btn.ghost:hover { background: var(--cta-light); border-color: var(--cta-primary); }

@media (prefers-reduced-motion: reduce) { .tisse-ui .btn { transition: none; } .tisse-ui .btn:hover { transform: none; } }