/*
 * Global .cta-btn / .cta-banner-second button component.
 * Used site-wide (header.php, content-engagement-cta.php, most service,
 * case-study, and portfolio templates), so loaded unconditionally like
 * engagement-cta.css — see load_button_css() in functions.php.
 * The .engagement-form-submit .cta-btn context override (for the embedded
 * "Start Your Engagement" form's submit button) stayed in engagement-cta.css
 * since it's specific to that one usage.
 */
.cta-btn{position:relative;display:inline-flex;align-items:center;gap:14px;padding:clamp(10px,0.85vw,12px) 34px;border-radius:30px;background:#FF5B2E;color:#fff;font-size:16px;font-weight:600;text-decoration:none;overflow:hidden;border:1px solid transparent;transition:0.5s ease,box-shadow 0.5s ease-in-out;height:clamp(42px,3.5vw,50px);}
.cta-banner-second{border:1px solid #FF734C;background:#fff;color:var(--black);}
.cta-banner-second span.icon{background-color:#EAEAEA;}
.cta-banner-second:hover{border:1px solid #EAEAEA;box-shadow:0 0 0 6px #4D4D4D80;}
.cta-btn .text{position:relative;z-index:2;}
.cta-btn .icon{position:relative;z-index:2;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:0.3s ease;}
.cta-btn::before{content:'';position:absolute;width:24px;height:24px;border-radius:50%;right:30px;top:50%;transform:translateY(-50%);background:#FF6F47;transition:all 0.6s ease;z-index:1;}
.cta-banner-second:before{background:#EAEAEA;}
.cta-banner-second .icon img{filter:brightness(0) saturate(100%) invert(17%) sepia(0%) saturate(4590%) hue-rotate(336deg) brightness(97%) contrast(91%);}
.cta-btn:hover::before{width:140%;height:140%;right:-20%;border-radius:50px;}
.cta-btn:hover{box-shadow:0 0 0 6px #FF5B2E66;}
.cta-btn:hover .text{color:#fff;}
.cta-banner-second:hover .text{color:var(--black);}
.cta-btn:hover .icon{transform:translateX(6px);}
.cta-btn:focus{color:white;}
.cta-banner-second:focus{color:var(--black);}

@media(min-width:1025px) and (max-width:1300px){
  .cta-btn{padding:11px 48px;}
  .cta-btn::before{right:43px;}
}
@media(max-width:576px){
  body .cta-btn{display:flex;width:fit-content;margin-left:auto;margin-right:auto;padding:12px 33px;font-size:14px;}
  .cta-btn::before{right:29px;}
}