/*
  Entopy Case Summary
  Clean responsive Elementor widget.
*/

.entopy-case-summary{
  --case-colour: #1d3557;
  --case-divider: rgba(29, 53, 87, 0.18);
  --case-text-soft: rgba(29, 53, 87, 0.85);
  --case-text-muted: rgba(29, 53, 87, 0.7);

  --section-padding-top: 100px;
  --section-padding-right: 0px;
  --section-padding-bottom: 40px;
  --section-padding-left: 0px;

  --grid-label-width: 240px;
  --grid-gap: 28px;

  --headline-x-offset: 0px;
  --headline-y-offset: 0px;
  --brief-x-offset: 0px;
  --brief-y-offset: 0px;
  --outcomes-x-offset: 0px;
  --outcomes-y-offset: 0px;

  width: 100%;
  padding:
    var(--section-padding-top)
    var(--section-padding-right)
    var(--section-padding-bottom)
    var(--section-padding-left);
  box-sizing: border-box;
  font-family: Montserrat, Arial, sans-serif;
  color: var(--case-colour);
}

.entopy-case-summary *,
.entopy-case-summary *::before,
.entopy-case-summary *::after{
  box-sizing: border-box;
}

.entopy-case-summary-headline-offset{
  transform: translate(var(--headline-x-offset), var(--headline-y-offset));
}

.entopy-case-summary-headline{
  margin: 0;
  max-width: 1320px;
  font-size: clamp(42px, 5vw, 60px);
  line-height: 1.02;
  letter-spacing: -0.045em;
  font-weight: 600;
}

.entopy-case-summary-divider{
  height: 1px;
  background: var(--case-divider);
  margin: 28px 0 18px;
}

.entopy-case-summary-grid{
  display: grid;
  grid-template-columns: var(--grid-label-width) repeat(3, minmax(0, 1fr));
  gap: var(--grid-gap);
}

.entopy-case-summary-brief-grid{
  transform: translate(var(--brief-x-offset), var(--brief-y-offset));
}

.entopy-case-summary-outcomes-grid{
  transform: translate(var(--outcomes-x-offset), var(--outcomes-y-offset));
}

.entopy-case-summary-bottom{
  align-items: start;
}

.entopy-case-summary-label{
  padding-top: 4px;
  font-size: clamp(12px, 0.9vw, 14px);
  line-height: 1.4;
  font-weight: 500;
  color: var(--case-text-muted);
}

.entopy-case-summary-col h3{
  margin: 0 0 10px;
  font-size: clamp(15px, 1vw, 16px);
  line-height: 1.2;
  font-weight: 700;
}

.entopy-case-summary-col p{
  margin: 0 0 14px;
  max-width: 380px;
  font-size: clamp(14px, 1.1vw, 15px);
  line-height: 1.45;
  font-weight: 400;
  color: var(--case-text-soft);
}

.entopy-case-summary-col p:last-child{
  margin-bottom: 0;
}

.entopy-case-summary-metric{
  display: flex;
  flex-direction: column;
}

.entopy-case-summary-number{
  font-size: clamp(40px, 4.8vw, 60px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 0.95;
}

.entopy-case-summary-sub{
  margin-top: 8px;
  max-width: 380px;
  font-size: clamp(14px, 1.1vw, 15px);
  line-height: 1.45;
  font-weight: 400;
  color: var(--case-text-soft);
}

.entopy-case-summary-outcome{
  max-width: 520px;
  font-size: clamp(30px, 3vw, 40px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.04em;
}

.entopy-case-summary-reveal{
  opacity: 0;
  will-change: transform, opacity;
}

.entopy-case-summary-reveal-up{
  transform: translateY(18px);
}

.entopy-case-summary-reveal-line{
  transform: scaleX(0);
  transform-origin: left center;
}

.entopy-case-summary.is-visible .entopy-case-summary-reveal-up{
  animation: entopyCaseSummaryFadeUp 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.entopy-case-summary.is-visible .entopy-case-summary-reveal-line{
  animation: entopyCaseSummaryLineIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.entopy-case-summary.is-visible .entopy-delay-1{
  animation-delay: 0.08s;
}

.entopy-case-summary.is-visible .entopy-delay-2{
  animation-delay: 0.18s;
}

.entopy-case-summary.is-visible .entopy-delay-3{
  animation-delay: 0.30s;
}

.entopy-case-summary.is-visible .entopy-delay-4{
  animation-delay: 0.42s;
}

.entopy-case-summary-no-reveal .entopy-case-summary-reveal,
.entopy-case-summary-editor-no-reveal .entopy-case-summary-reveal,
.elementor-editor-active .entopy-case-summary-reveal,
.elementor-editor-preview .entopy-case-summary-reveal{
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

@keyframes entopyCaseSummaryFadeUp{
  from{
    opacity: 0;
    transform: translateY(18px);
  }

  to{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes entopyCaseSummaryLineIn{
  from{
    opacity: 0;
    transform: scaleX(0);
  }

  to{
    opacity: 1;
    transform: scaleX(1);
  }
}

/* Fluid desktop/tablet range */
@media (max-width: 1400px) and (min-width: 768px){
  .entopy-case-summary{
    --section-padding-top: clamp(80px, 7vw, 100px);
    --section-padding-bottom: clamp(36px, 3vw, 40px);
    --grid-label-width: clamp(180px, 17vw, 240px);
    --grid-gap: clamp(22px, 2vw, 28px);
  }

  .entopy-case-summary-headline{
    font-size: clamp(36px, 4.7vw, 60px);
  }

  .entopy-case-summary-number{
    font-size: clamp(44px, 4.8vw, 60px);
  }

  .entopy-case-summary-outcome{
    font-size: clamp(28px, 3.2vw, 40px);
  }
}

/* Mobile */
@media (max-width: 767px){
  .entopy-case-summary{
    --section-padding-top: 48px;
    --section-padding-right: 0px;
    --section-padding-bottom: 32px;
    --section-padding-left: 0px;
    --grid-gap: 18px;
  }

  .entopy-case-summary-headline{
    font-size: clamp(32px, 10vw, 42px);
    line-height: 1.05;
    letter-spacing: -0.04em;
  }

  .entopy-case-summary-divider{
    margin: 24px 0 18px;
  }

  .entopy-case-summary-grid{
    grid-template-columns: 1fr;
    gap: var(--grid-gap);
  }

  .entopy-case-summary-label{
    padding-top: 0;
    font-size: 13px;
  }

  .entopy-case-summary-col h3{
    font-size: 15px;
  }

  .entopy-case-summary-col p,
  .entopy-case-summary-sub{
    max-width: none;
    font-size: 15px;
  }

  .entopy-case-summary-number{
    font-size: 50px;
  }

  .entopy-case-summary-outcome{
    font-size: 32px;
  }

  .entopy-case-summary-reveal-up{
    transform: translateY(14px);
  }
}

@media (prefers-reduced-motion: reduce){
  .entopy-case-summary-reveal{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}