/* =========================================================
   MANMACHINE WORKS — GLOBAL BUTTON SYSTEM
   Subtle lift, arrow slide and directional sweep.
========================================================= */

.mm-btn {
    --btn-height: 48px;
    --btn-padding-x: 22px;
    --btn-font-size: 13px;
    --btn-icon-size: 48px;

    position: relative;
    z-index: 0;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: var(--btn-height);
    padding: 0 var(--btn-padding-x);
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 2px;
    font-family: var(--font-heading) !important;
    font-size: var(--btn-font-size);
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        transform .25s ease,
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease,
        box-shadow .25s ease;
}

.mm-btn:has(> .mm-btn__label) {
    align-items: stretch;
    gap: 0;
    padding: 0;
}

.mm-btn__label {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: var(--btn-height);
    padding: 0 var(--btn-padding-x);
}

.mm-btn__icon {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--btn-icon-size);
    min-width: var(--btn-icon-size);
    border-left: 1px solid currentColor;
    font-size: 15px;
    transition: transform .25s ease, background-color .25s ease;
}

.mm-btn--primary,
.mm-btn:not([class*='mm-btn--']):not(.ghost) {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--dark-color);
}

.mm-btn--primary::before,
.mm-btn:not([class*='mm-btn--']):not(.ghost)::before,
.mm-btn--outline-dark::before,
.mm-btn.ghost::before,
.mm-btn--outline-gold::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: '';
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}

.mm-btn--primary::before,
.mm-btn:not([class*='mm-btn--']):not(.ghost)::before {
    background: var(--primary-hover);
    transform: translateX(-101%);
}

.mm-btn--primary:hover,
.mm-btn:not([class*='mm-btn--']):not(.ghost):hover {
    color: var(--dark-color);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(7, 10, 16, .16);
}

.mm-btn--primary:hover::before,
.mm-btn:not([class*='mm-btn--']):not(.ghost):hover::before {
    transform: translateX(0);
}

.mm-btn--primary > .mm-btn__icon,
.mm-btn:not([class*='mm-btn--']):not(.ghost) > .mm-btn__icon {
    background: var(--dark-color);
    border-left-color: var(--primary-color);
    color: var(--primary-color);
}

.mm-btn--primary:hover > .mm-btn__icon,
.mm-btn:not([class*='mm-btn--']):not(.ghost):hover > .mm-btn__icon {
    background: var(--dark-secondary);
}

.mm-btn--outline-dark,
.mm-btn.ghost {
    background: transparent;
    border-color: rgba(255, 255, 255, .55);
    color: var(--white);
}

.mm-btn--outline-dark::before,
.mm-btn.ghost::before {
    background: var(--white);
    transform: translateY(101%);
}

.mm-btn--outline-dark:hover,
.mm-btn.ghost:hover {
    background: transparent;
    border-color: var(--white);
    color: var(--dark-color);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .2);
}

.mm-btn--outline-dark:hover::before,
.mm-btn.ghost:hover::before {
    transform: translateY(0);
}

.mm-btn--outline-gold {
    background: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.mm-btn--outline-gold::before {
    background: var(--primary-color);
    transform: scaleX(0);
    transform-origin: left center;
}

.mm-btn--outline-gold:hover {
    color: var(--dark-color);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(7, 10, 16, .12);
}

.mm-btn--outline-gold:hover::before {
    transform: scaleX(1);
}

.mm-btn--dark {
    background: var(--dark-color);
    border-color: var(--dark-color);
    color: var(--white);
}

.mm-btn--dark:hover {
    background: var(--dark-card);
    color: var(--primary-color);
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(7, 10, 16, .2);
}

.mm-btn i,
.mm-btn svg {
    transition: transform .25s ease, color .25s ease;
}

.mm-btn:hover .fa-arrow-right,
.mm-btn:hover .mm-btn__icon i,
.mm-btn:hover .mm-btn__icon svg {
    transform: translateX(4px);
}

.mm-btn:hover .fa-phone-alt,
.mm-btn:hover .fa-phone {
    animation: mm-phone-ring .45s ease;
}

@keyframes mm-phone-ring {
    0%, 100% { transform: rotate(0); }
    25% { transform: rotate(-12deg); }
    50% { transform: rotate(12deg); }
    75% { transform: rotate(-6deg); }
}

.mm-btn:active {
    transform: translateY(0) scale(.98);
}

.mm-btn:focus-visible {
    outline: 3px solid rgba(237, 197, 64, .35);
    outline-offset: 4px;
}

.mm-btn--xs { --btn-height: 34px; --btn-padding-x: 12px; --btn-font-size: 10px; --btn-icon-size: 34px; }
.mm-btn--sm { --btn-height: 40px; --btn-padding-x: 16px; --btn-font-size: 11px; --btn-icon-size: 40px; }
.mm-btn--md { --btn-height: 48px; --btn-padding-x: 22px; --btn-font-size: 13px; --btn-icon-size: 48px; }
.mm-btn--lg { --btn-height: 54px; --btn-padding-x: 27px; --btn-font-size: 14px; --btn-icon-size: 54px; }
.mm-btn--xl { --btn-height: 60px; --btn-padding-x: 32px; --btn-font-size: 15px; --btn-icon-size: 60px; }

.mm-btn--block {
    display: flex;
    width: 100%;
}

.mm-btn--block .mm-btn__label {
    flex: 1;
}

.mm-btn-group,
.mm-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.mm-btn:disabled,
.mm-btn.is-disabled {
    opacity: .55;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

/* Motion compatibility for the site's established CTA components. */
.btn-primary,
.th-btn,
.dl-primary-btn,
.dl-secondary-btn,
.mm-overview__primary,
.mm-overview__secondary {
    transition:
        transform .25s ease,
        background-color .25s ease,
        background-size .35s cubic-bezier(.4, 0, .2, 1),
        border-color .25s ease,
        color .25s ease,
        box-shadow .25s ease !important;
}

.btn-primary,
.dl-primary-btn,
.mm-overview__actions .mm-overview__primary {
    background-color: var(--primary-color);
    background-image: linear-gradient(var(--primary-hover), var(--primary-hover));
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 0 100%;
}

.mm-overview__actions .mm-btn {
    --btn-padding-x: 16px;
    --btn-font-size: 11px;

    min-height: var(--btn-height);
    padding: 0;
    font-size: var(--btn-font-size);
    font-weight: 800;
}

.mm-overview__actions .mm-btn__label {
    min-height: var(--btn-height);
    padding: 0 var(--btn-padding-x);
}

.mm-overview__actions .mm-btn:hover {
    outline: none;
}

.mm-overview__actions .mm-btn:focus-visible {
    outline: 3px solid rgba(237, 197, 64, .4);
    outline-offset: 3px;
}

.mm-overview__actions .mm-overview__secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .45) !important;
    color: var(--white);
}

.mm-overview__actions .mm-overview__secondary::before {
    background: var(--white);
}

.mm-overview__actions .mm-overview__secondary .fa-phone-alt,
.mm-overview__actions .mm-overview__secondary .fa-phone {
    color: var(--primary-color);
}

.mm-overview__actions .mm-overview__secondary:hover,
.mm-overview__actions .mm-overview__secondary:focus-visible {
    background: transparent;
    border-color: var(--white) !important;
    color: var(--dark-color);
}

.mm-overview__actions .mm-overview__secondary:hover .fa-phone-alt,
.mm-overview__actions .mm-overview__secondary:hover .fa-phone,
.mm-overview__actions .mm-overview__secondary:focus-visible .fa-phone-alt,
.mm-overview__actions .mm-overview__secondary:focus-visible .fa-phone {
    color: var(--dark-color);
}

/* Founder CTA uses the same compact split-button layout. */
.founder .founder-content .founder-cta.mm-btn {
    min-width: 0;
    min-height: var(--btn-height);
    gap: 0;
    padding: 0;
    border: 1px solid var(--primary-color);
    border-radius: 2px;
    background: var(--primary-color);
    color: var(--dark-color) !important;
    text-align: center;
}

.founder .founder-content .founder-cta.mm-btn .founder-cta__copy {
    min-height: var(--btn-height);
    padding: 0 20px;
}

.founder .founder-content .founder-cta.mm-btn .founder-cta__copy strong {
    font-size: 12px;
    letter-spacing: 0;
    text-transform: none;
}

.founder .founder-content .founder-cta.mm-btn .founder-cta__icon {
    flex: 0 0 var(--btn-icon-size);
    width: var(--btn-icon-size);
    height: auto;
    min-height: var(--btn-height);
    border: 0;
    border-left: 1px solid var(--primary-color);
    border-radius: 0;
    background: var(--dark-color);
    color: var(--primary-color);
}

.founder .founder-content .founder-cta.mm-btn:hover,
.founder .founder-content .founder-cta.mm-btn:focus-visible {
    border-color: var(--primary-color);
    background: var(--primary-color);
    color: var(--dark-color) !important;
}

.founder .founder-content .founder-cta.mm-btn:hover .founder-cta__icon,
.founder .founder-content .founder-cta.mm-btn:focus-visible .founder-cta__icon {
    background: var(--dark-secondary);
    color: var(--primary-color);
}

/* Post-training CTA pair: split primary plus a compact outlined map action. */
.dl-excellence-actions .dl-excellence-btn.mm-btn {
    min-height: var(--btn-height);
    gap: 0;
    padding: 0;
    border-radius: 2px;
    font-size: var(--btn-font-size);
    letter-spacing: .02em;
    text-transform: uppercase;
}

.dl-excellence-actions .dl-excellence-btn.mm-btn .mm-btn__label {
    min-height: var(--btn-height);
}

.dl-excellence-actions .dl-excellence-btn.mm-btn i {
    display: inline-block;
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.dl-excellence-actions .dl-excellence-btn.mm-btn--outline-dark {
    background: transparent;
    box-shadow: none;
}

.dl-excellence-actions .dl-excellence-btn.mm-btn--outline-dark .mm-btn__label > i {
    color: var(--primary-color);
    transform: none;
}

.dl-excellence-actions .dl-excellence-btn.mm-btn--outline-dark:hover .mm-btn__label > i,
.dl-excellence-actions .dl-excellence-btn.mm-btn--outline-dark:focus-visible .mm-btn__label > i {
    color: var(--dark-color);
    transform: none;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.dl-primary-btn:hover,
.dl-primary-btn:focus-visible,
.mm-overview__actions .mm-overview__primary:hover,
.mm-overview__actions .mm-overview__primary:focus-visible {
    background-color: var(--primary-color);
    background-image: linear-gradient(var(--primary-hover), var(--primary-hover));
    background-size: 100% 100%;
    color: var(--dark-color);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(7, 10, 16, .16);
}

.th-btn:hover,
.dl-secondary-btn:hover,
.mm-overview__actions .mm-overview__secondary:hover {
    transform: translateY(-3px);
}

.th-btn:hover .fa-arrow-right,
.th-btn:hover .fa-arrow-up-right,
.dl-primary-btn:hover svg,
.mm-overview__actions a:hover .fa-arrow-right,
.btn-primary:hover .fa-arrow-right {
    transform: translateX(4px);
}

.th-btn i,
.th-btn svg,
.dl-primary-btn svg,
.mm-overview__actions a i,
.btn-primary i,
.btn-primary svg {
    transition: transform .25s ease, color .25s ease;
}

@media (max-width: 767px) {
    .mm-btn--lg,
    .mm-btn--xl {
        --btn-height: 48px;
        --btn-padding-x: 18px;
        --btn-font-size: 12px;
        --btn-icon-size: 48px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mm-btn,
    .mm-btn::before,
    .mm-btn__icon,
    .mm-btn i,
    .mm-btn svg,
    .btn-primary,
    .th-btn,
    .dl-primary-btn,
    .dl-secondary-btn,
    .mm-overview__primary,
    .mm-overview__secondary {
        transition: none !important;
        animation: none !important;
    }

    .mm-btn:hover,
    .btn-primary:hover,
    .th-btn:hover,
    .dl-primary-btn:hover,
    .dl-secondary-btn:hover,
    .mm-overview__primary:hover,
    .mm-overview__secondary:hover {
        transform: none;
    }
}