/* Pill button — tactile press effect */
.wp-block-button .wp-block-button__link {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    transition: transform 0.13s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.13s cubic-bezier(0.34, 1.56, 0.64, 1);
    -webkit-tap-highlight-color: transparent;

    
}
    
/* ─── HOVER: Button "Rises" and shadow grows ─── */
.wp-block-button .wp-block-button__link:hover {
    /* Lift the button up 2px */
    transform: translate(-2px, -2px);
    /* Increase shadow to 6px to make it look taller/more pressable */
    box-shadow: 6px 8px 0 0 color-mix(in srgb, var(--wp--preset--color--dark-violet) 80%, #000 20%);
}

.wp-block-button.is-style-secondary-button .wp-block-button__link:hover {
    /* Lift the button up 2px */
    transform: translate(-2px, -2px);
    /* Increase shadow to 6px to make it look taller/more pressable */
    box-shadow: 6px 8px 0 0 color-mix(in srgb, var(--wp--preset--color--tropical-teal) 80%, #000 20%);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 8px 0 0 var(--wp--preset--color--onyx);
}

.wp-block-button.is-style-outline-secondary .wp-block-button__link:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 8px 0 0 var(--wp--preset--color--white);
}


/* ─── ACTIVE: Button pushes down ─── */

.wp-block-button .wp-block-button__link:active {
    transform: translate(3px, 3px);
    box-shadow: 0 0.5px 0 0 color-mix(in srgb, var(--wp--preset--color--dark-violet) 80%, #000 20%);
}

.wp-block-button.is-style-secondary-button .wp-block-button__link:active {
    transform: translate(3px, 3px);
    box-shadow: 0 0.5px 0 0 color-mix(in srgb, var(--wp--preset--color--tropical-teal) 80%, #000 20%);
}

.wp-block-button.is-style-outline .wp-block-button__link:active {
    transform: translate(3px, 3px);
    box-shadow: 0 0.5px 0 0 color-mix(in srgb, var(--wp--preset--color--white) 90%, #000 10%);
}

.wp-block-button.is-style-outline-secondary .wp-block-button__link:active {
    transform: translate(3px, 3px);
    box-shadow: 0 0.5px 0 0 color-mix(in srgb, var(--wp--preset--color--white) 80%, #000 20%);
}
