/* WRAPPER */
.qc-wrap{
  padding:0px;
  /* background:radial-gradient(circle at top,#0e1f16,#050705); */
  color:#dfffe9;
  font-family:Inter,system-ui,sans-serif
}
.qc-container{margin:0 auto;padding-left: 10px;padding-right: 10px;}

/* SECTIONS */
.qc-section{
  background: transparent;
  border-radius:12px;
  padding:0 0 20px;
  margin-bottom:100px;
  border:none;
}
.qc-title {
    font-size: 42px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    margin-bottom: 40px;
    font-family: 'Oswald';
    font-weight: 600;
}

/* METRICS */
.qc-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px
}
.qc-metric{
  background:transparent;
  border:none;
  border-radius:10px;
  padding:0px;
}
.qc-metric-label {
  font-family: 'Poppins';
  font-size: 18px;
  color: #fff;
  line-height: 28px;
}
.qc-metric-value{
  margin-top:8px;
  font-size:20px;
  font-weight:600;
  color:#2dff7a
}
.qc-metric-value input {
  height: 63px;
  padding: 20px;
  border: 1px solid #4ECB71;
  background: transparent;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  font-family: 'Poppins';
  width: 100%;
  background:#000401 ;
}

/* CHURN */
.qc-churn{
  display:flex;
  grid-template-columns:1.2fr 2fr;
  gap:20px
}
.qc-annual {
    /* background: linear-gradient(180deg,#2dff7a,#18a85a); */
    background: #4ECB71;
    color: #00210f;
    border-radius: 0;
    padding: 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 300px;
    width: 32.3%;
}
.qc-annual-value{
  font-weight:700;
  font-size: 42px;
  letter-spacing: 1px;
  line-height: 51.5px;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 15px;
  font-family: 'Oswald';
  
}
.qc-annual-label {
    font-size: 18px;
    font-weight: 400;
    font-family: 'Poppins';
    line-height: 28px;
    color: #000;
    opacity: 1;
}
.qc-churn-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:15px;
  width: 66%;
}
.qc-stat {
    background: #0b150f;
    border: 1px solid #4ECB71;
    border-radius: 0px;
    padding: 20px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.qc-stat-value {
    font-size: 18px;
    color: #fff;
    background: #4ECB711A;
    width: 100%;
    text-align: center;
    border-radius: 50px;
    font-family: 'Poppins';
    font-weight: 700;
    margin-bottom: 18px;
}
.qc-stat-label{
  font-size:18px;
  color:#A1A1A1;
  font-family: 'Poppins';
}

/* SCENARIOS */
.qc-scenarios{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px
}
.qc-scenario{
  background:transparent;
  border:none;
  border-radius:0px;
  overflow:hidden
}
.qc-scenario-head {
    background: #4ECB71;
    color: #000401;
    padding: 24px 40px 40px;
    text-align: center;
    min-height: 230px;
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
}
.qc-scenario-title{
  font-size:42px;
  font-weight:700;
  line-height:51.5px;
  text-transform: uppercase;
  font-family: 'oswald';
  margin-bottom: 15px;
}
.qc-scenario-title img{
    display: block;
    height: auto;
    vertical-align: middle;
    width: 40px;
    margin: 0 auto;
}

.qc-scenario-sub{
  font-size:18px;
  opacity:1;
  font-weight: 400;
  font-family: 'poppins';
  line-height: 28px;
}
.qc-scenario-body{padding:0px}
.qc-rate {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #7da98c;
    margin-bottom: 10px;
    padding: 20px;
    border: 1px solid #4ecb71;
    margin:20px 0;
    position: relative;
    background: #000401;
}
.qc-rate img {
    position: absolute;
    right: 0;
    left: 0;
    width: 40px;
    height: 40px;
    margin: 0 auto;
    top: 38%;
    z-index: 11;
}
.qc-rate span {
    background: #4ECB711A;
    width: 47%;
    padding: 20px 16px;
    border-radius: 10px;
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 18px;
    color: #A1A1A1;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.qc-rate span p {
    margin: 0;
    text-align: center;
    font-family: 'Poppins';
    font-weight: 700 !important;
    font-size: 18px !important;
    color:#fff;
    line-height: 28px !important;
}
.qc-box {
    background: #08100b;
    border: 1px solid #4ECB71;
    border-radius: 0;
    padding: 40px 20px;
    text-align: center;
    margin-bottom: 20px;
    color: #A1A1A1;
    font-size: 18px;
    font-weight: 400;
}
.qc-rate span.wp_newChurn {
    background: #4ecb71;
    color: #000;
    z-index: 9;
}
.qc-rate span.wp_newChurn p{color: #000;}
.qc-box strong {
    display: block;
    font-size: 14px;
    color: #000;
    background: #4ecb71;
    border-radius: 50px;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 700;
}
/* Hide number input arrows */

/* Chrome, Safari, Edge */
.qc-metrics input[type=number]::-webkit-outer-spin-button,
.qc-metrics input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.qc-metrics input[type=number] {
    -moz-appearance: textfield;
}
.ya_health_dynamiCard{display:none;}
.qc-active{display:block!important;}

/* RESPONSIVE */
@media(min-width:320px) and (max-width:767px){
.qc-title {font-size: 30px;text-align: left;}
.qc-metrics, .qc-scenarios{grid-template-columns: repeat(1, 1fr);}
.qc-metric-label {font-size: 16px;}
.qc-metric-value input {height: 53px;padding: 10px;}
.qc-section{margin-bottom: 60px;}
.qc-churn {flex-direction: column;}

.qc-annual{width: 100%;}
.qc-churn-grid {grid-template-columns: repeat(1,1fr);width: 100%;}
.qc-stat-label, .qc-rate span, .qc-box, .qc-scenario-sub, .qc-annual-label{font-size: 16px;}
.qc-scenario-title, .qc-annual-value{line-height: 41px;font-size: 28px;}
section#ya_churn_analysis {padding-top: 50px;}
.qc-scenario-head {padding: 24px 40px 30px;justify-content: center;}
.ya_emptySpace{height:auto !important;}
.ya_health_card-top h2 {font-size: 30px;}
p.ya_para_style {font-size: 18px !important;}
.sixth-section p {font-size: 40px !important;}
.ya_health_card-left {gap: 10px !important;}


}

@media(min-width:768px) and (max-width:960px){
.qc-title {font-size: 38px;text-align: left;}
.qc-metrics {gap: 20px;display: flex;flex-wrap: wrap;}
.qc-metric {width: 48.5%;}
.qc-metric-label {font-size: 16px;}
.qc-metric-value input {height: 50px;padding: 10px;}
.qc-section{margin-bottom: 60px;}
.qc-churn {flex-direction: row;}

.qc-annual{width: 50%;}
.qc-churn-grid {grid-template-columns: repeat(2,1fr);width: 50%;}
.qc-stat-label, .qc-rate span, .qc-box, .qc-scenario-sub, .qc-annual-label{font-size: 15px;}
.qc-scenario-title, .qc-annual-value {line-height: 41px;font-size: 30px;}
/* 
.qc-metrics, .qc-scenarios {grid-template-columns: 1fr 1fr;} */
.qc-scenarios {
    display: flex !important;
}
.qc-box {padding: 40px 12px;}
.ya_emptySpace{height:auto;}
.qc-stat{padding:20px 15px;}
section#ya_churn_analysis {padding-top: 50px;}
.ya_emptySpace {height: auto !important;}
.ya_animate_cta.animate-cta a.focus{font-size: 16px !important;}
.qc-scenario-head {padding: 24px 20px 30px;justify-content: center;}
.ya_health_card {width: unset !important;margin: 0 auto;padding: 30px;}
section#ya_calculator_section_02 {padding: 0 10px;}
.qc-rate span.wp_newChurn {padding: 0 10px;}


}


@media(max-width:900px){
  /* .qc-metrics,
  .qc-scenarios{grid-template-columns:1fr}
  .qc-churn{grid-template-columns:1fr} */
}