/* TMK CTA — shared across every page. Direct translation of components/conversion/CTA.jsx.
   weight: primary | secondary. size: md (default) | sm. fullWidth via .tmk-cta--full.
   Structural law (Page Blueprints Ch.10; 10_SPEC Ch.51 Rule 2): at most one .tmk-cta--primary per view. */
.tmk-cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:13px 28px;border-radius:var(--radius-soft);font-family:var(--font-structure);font-size:var(--text-caption);font-weight:var(--weight-structure-bold);letter-spacing:var(--tracking-caps);text-transform:uppercase;text-decoration:none;white-space:nowrap;border:1.5px solid transparent;cursor:pointer;transition:background var(--motion-feedback) var(--ease-out),transform var(--motion-feedback) var(--ease-out)}
.tmk-cta--sm{padding:8px 16px;font-size:0.7rem}
.tmk-cta--full{width:100%}
.tmk-cta--primary{color:var(--color-action-on-primary);background:var(--color-action-primary)}
.tmk-cta--primary:hover{background:var(--color-action-primary-hover)}
.tmk-cta--primary:active{background:var(--color-action-primary-active);transform:scale(0.98)}
.tmk-cta--primary[disabled],.tmk-cta--primary.is-disabled{background:var(--color-action-primary-disabled);cursor:not-allowed}
.tmk-cta--secondary{color:var(--color-action-secondary);background:transparent;border-color:var(--color-action-secondary)}
.tmk-cta--secondary:hover{background:rgba(36,28,19,0.06)}
.tmk-cta--secondary:active{background:rgba(36,28,19,0.12);transform:scale(0.98)}
.tmk-cta--secondary.is-disabled{opacity:0.4;cursor:not-allowed}

/* Below tablet, primary conversion actions go full-width (Design Foundations Sec17 touch-target
   guidance). LOAD-BEARING BREAKPOINT — do not widen this back to 1023px.

   Audit 2026-07-29: this query was authored at max-width:1023px, i.e. the *desktop* breakpoint,
   while its own comment (and Section 3 of PROJECT_CONTEXT: mobile 0-599 / tablet 600-1023 /
   desktop 1024-1439 / wide 1440+) says "below tablet". Measured consequence at a 1023px viewport:
   the Homepage Hero CTA rendered 960px wide - a full-viewport-width slab, not a button. Corrected
   to the real "below tablet" bound (--bp-tablet 600px minus 1px). Tablet and up now use the
   intrinsic inline-flex width; instances that genuinely need full width still opt in explicitly
   via .tmk-cta--full, which is why that modifier exists. Touch-target compliance is unaffected:
   it is satisfied by the 13px/28px padding (>=44px hit area), never by the 100% width. */
@media (max-width: 599px) {
	.tmk-cta:not(.tmk-cta--sm) { width: 100%; }
}