@font-face {
    font-family: 'Inter 18pt';
    src: url('../../fonts/case-study/retail/Inter18pt-Regular.woff2') format('woff2'),
        url('../../fonts/case-study/retail/Inter18pt-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    src: url('../../fonts/case-study/retail/PlusJakartaSans-Bold.woff2') format('woff2'),
        url('../../fonts/case-study/retail/PlusJakartaSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

body {font-family: 'Inter 18pt'; color: #595959;letter-spacing:0;}
h1,h2, h3, h4, h5, h6 {font-family: 'Plus Jakarta Sans'; font-weight: bold; color: #313131;}
h2 {font-size: 2rem !important;}
h4 {font-size: 1.25rem !important;}
h3 {font-size: 1.5rem !important;}
.dark-gray {color: #313131 !important;}
.btn-primary {background: linear-gradient(90deg, rgba(42, 79, 38, 1) 0%, rgba(112, 115, 43, 1) 100%); background-size: 200% 100%; background-position: left center; transition: background-position 0.5s ease; border: none !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0.05rem; gap: 0.5rem;}
.fs-md {font-size: 1.25rem !important;}
.fs-sm {letter-spacing:1px;}
.bg-light {background: #f6f6f6 !important;}

.bg-light-gradient {background: #F6F6F6; background: linear-gradient(0deg, rgba(246, 246, 246, 1) 0%, rgba(255, 255, 255, 1) 100%);}
.hero-before-img {top: 1rem; max-width: 20%;}
.sec-heading::before {background: url('../../images/new-case-study/retail-field-operations/title-before.svg'); height: 30px; width: 22px; content: ""; left: -20px; top: -8px; background-repeat: no-repeat; background-size: contain;position: absolute;}
h1 span.sec-heading::before {height: 45px; width: 32px; left: -28px; top: -15px;}
.title-after {right: -5px; top: -14px;}
.hero-content-assets {right: 40%; top: -2rem; width: 22px;}
.workflows-bg {left: -16vw;}
.bg-light-blue {background: #F4F6FF;}
.bg-light-green {background: #F2FBF9;}
.bg-light-red {background: #FEF3F5;}
.bg-light-purpal {background: #F5EDFC;}
.text-gray {color: #D6D6D6 !important;}

.toolkit-img {left: -2vw;}
.dd-bg{left: -6rem; bottom: -2rem;}
.shape-bg-right {right: -16vw; top: -14rem; transform: rotate(180deg);}

.accordion-button {font-size: 1.25rem; }
.accordion-button, .accordion-item:first-of-type>.accordion-header .accordion-button, .accordion-item:first-of-type, .accordion-item:last-of-type>.accordion-header .accordion-button.collapsed , .accordion-item:last-of-type{border-radius: 0.8rem;}
.accordion-button:not(.collapsed) {background: #ffffff; box-shadow: none; color: #313131;}
.accordion-button:focus {box-shadow: none;}
.accordion-item {border-radius: 0.8rem;border: none;}
.accordion-button::after {content: ""; display: inline-block; width: 2.813rem; height: 2.813rem; background-color: #F6F6F6; background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.49998 13.3926V1.60744M7.49998 1.60744L1.60742 7.5M7.49998 1.60744L13.3925 7.5' stroke='%23595959' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; border-radius: 50%; transition: transform 0.3s ease, background-image 0.3s ease; transform: rotate(180deg); background-size: auto;}
.accordion-button:not(.collapsed)::after {transform: rotate(0deg);background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.49998 13.3926V1.60744M7.49998 1.60744L1.60742 7.5M7.49998 1.60744L13.3925 7.5' stroke='%23FFBB35' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}

.retail-execution {background: url('../../images/new-case-study/retail-field-operations/how-bg.svg') no-repeat center; background-size: contain; height: 100%; width: 100%;}
.retail-exe-step {font-size: 6.25rem; top: -4.5rem; font-family: 'Plus Jakarta Sans'; text-shadow:-1px -1px 0 #D3D3D3, 1px -1px 0 #D3D3D3, -1px  1px 0 #D3D3D3, 1px  1px 0 #D3D3D3;}
.technologies-sec {background: #313131;}
.tech-bg-left {transform: rotate(270deg);height: 200%; top: -16rem !important; opacity: 0.06;}
.tech-bg-right {right: -5rem;}
.tech-title {border-color: #777777 !important;}
.tech-title::after {content: ""; background: #FFBB35; height: 4px; width: 100px; bottom: 0; position: absolute; left: 50%;transform: translateX(-50%);}
.final-content {width: 50%; top: 50%; transform: translateY(-50%);}
.final-content-bg {left: -18vw;}
.faq-img {left: -4rem;}
.faq-sec .accordion-button::after {background-color: #ffffff;}
.bg-white.collapsed {background: #f6f6f6 !important;}

/* =Responsive Css
========================================================================================*/
@media only screen and (max-width: 1199px) {	
    h1 {font-size: 2rem !important;}
    h2 {font-size: 1.7rem !important;}
    .dd-bg {left: -10rem;}
    .final-content {width: 70%;}
}
@media only screen and (max-width: 991px) { 
    .tech-bg-right {right: -8rem;}    
    .final-content {width: 100%;position: relative !important;transform: translateY(0);}
    .faq-img {left: 0;}
}
@media only screen and (max-width: 767px) {
    h1 {font-size: 1.5rem !important;}
    h1 span.sec-heading::before {height: 35px;width: 23px;left: -18px;top: -13px;}
    .title-after img {width: 1.5rem;}
    h2 {font-size: 1.2rem !important;}
    h4 {font-size: 1rem !important;}
    .accordion-button {font-size: 1rem;}
    .talk-icon, .call-icon {height: 80px;width: 80px;}
    .call-icon {right: 0;}
    .talk-icon {left: 0;}
    .cta-img::before {max-width: 21.25rem;right: 50%; transform: translateX(50%);}
}
