/*********************************************
 * CTA Button
**********************************************/
.twc-cta-buttons {
    --size-btn:60px; --size-icon:24px;
    position:fixed; bottom:20px; right:20px; z-index:45;
    transition:var(--twc-transition);
}
.twc-cta-buttons ul {list-style:none; margin:0;}
.twc-cta-buttons ul li {padding:0;}
.twc-cta-buttons ul li:not(:last-child) {margin-bottom:15px;}
.twc-cta-buttons ul li a {
    display:block; position:relative;
    background:var(--twc-color-secondary); border-radius:50%;
    color:var(--twc-color-white); text-decoration:none; font-weight:300;
}

/* Icon */
.twc-cta-button__icon {
    font-size:var(--size-icon); line-height:1; position:relative; z-index:2;
    width:var(--size-btn); height:var(--size-btn); border-radius:50%;
    background:var(--twc-color-secondary); color:var(--twc-color-white)
}

/* Text */
.twc-cta-button__text {
    position:absolute; top:0; right:0; height:100%; pointer-events:none;
    display:flex; border-radius:var(--size-btn); overflow:hidden;
}
.twc-cta-button__text-inner {
    height:100%; transform:translateX(100%);
    background:var(--twc-color-secondary); border-radius:var(--size-btn);
    padding:0 calc(var(--size-btn) + 10px) 0 30px; white-space:nowrap;
    line-height:var(--size-btn); font-family:var(--twc-font-primary); color:var(--twc-color-white);
    transition:var(--twc-transition-slow);
}

/* Text:hover */
@media (hover:hover) {
    .twc-cta-buttons a:hover .twc-cta-button__text {pointer-events:auto;}
    .twc-cta-buttons a:hover .twc-cta-button__text-inner {transform:translateX(0);}
}
@media (hover:none) {
    .twc-cta-button__text {display:none;}
}

/* hide cta when open mobile menu */
html.menu-open .twc-cta-buttons {opacity:0; pointer-events:none;}


/*********************************************
 * CTA Button Responsive
**********************************************/
@media only screen and (max-width:1024px) {
    .twc-cta-buttons {
        --size-btn:50px; --size-icon:20px;
    }
}