
/* ===========================================================
   Outcomes - "What You Can Expect After Working Together"
   Header, then three alternating rows of copy and photo,
   separated by hairlines. Tag pills close each row.
   Tree: ksecout > kouttop | koutrows (kor1..3 > korNc | korNi)
   =========================================================== */

/* the small dot label, shared with the testimonial block */
.kout-label { position: relative; padding-left: 16px; }
.kout-label .elementor-heading-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: .46em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #E0312B;
}
.kout-title { margin-top: 16px !important; max-width: 18ch; }
.kout-para { max-width: 44ch; }
.kout-para p { margin: 0; }


/* ---------- the rows ---------- */
.elementor-element-koutrows { margin-top: 64px !important; }
.elementor-element-koutrows > .e-con { border-top: 1px solid rgba(30, 26, 22, .14); }

.kout-rt .elementor-heading-title {
  color: #1E1A16 !important;
  font-family: Archivo, sans-serif;
  font-weight: 700;
  font-size: 27px;
  line-height: 1.2;
  letter-spacing: -.5px;
}
.kout-rt .kout-n { color: #A79A8D; font-weight: 500; margin-right: 8px; }

.kout-rd {
  color: #6B6055;
  font-family: Inter, sans-serif;
  font-size: 15px;
  line-height: 1.68;
  max-width: 44ch;
}
.kout-rd p { margin: 0; }

/* tag pills */
.kout-tags .elementor-icon-list-items {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.kout-tags .elementor-icon-list-icon { display: none !important; }
.kout-tags .elementor-icon-list-item {
  margin: 0 !important;
  border: 1px solid rgba(30, 26, 22, .2);
  border-radius: 100px;
  padding: 9px 17px !important;
  transition: border-color .35s ease, background .35s ease;
}
.kout-tags .elementor-icon-list-item:hover {
  border-color: rgba(224, 49, 43, .5);
  background: rgba(224, 49, 43, .05);
}
.kout-tags .elementor-icon-list-text {
  color: #4A443E !important;
  font-family: Inter, sans-serif;
  font-size: 13.5px;
  padding: 0 !important;
}

/* photos */
.kout-pic img {
  width: 100% !important;
  height: 300px !important;
  object-fit: cover;
  border-radius: 14px;
  display: block;
}

@media (max-width: 767px) {
  .kout-title { max-width: none; }
  .kout-rt .elementor-heading-title { font-size: 22px; }
  .kout-pic img { height: 200px !important; }
  .elementor-element-koutrows { margin-top: 44px !important; }
}

/* ===========================================================
   Testimonials - "Trusted By Leaders"
   =========================================================== */
.ktst-nav { width: auto !important; cursor: pointer; }
.ktst-nav .elementor-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #1E1A16 !important;
  border: 1px solid rgba(30, 26, 22, .28) !important;
  background: transparent;
  transition: background .35s ease, color .35s ease, border-color .35s ease, transform .35s cubic-bezier(.16, 1, .3, 1);
}
.ktst-nav .elementor-icon svg { width: 15px; height: 15px; fill: currentColor !important; }
.ktst-nav:hover .elementor-icon {
  background: #E0312B;
  color: #FFFFFF !important;
  border-color: #E0312B !important;
  transform: translateY(-2px);
}
.ktst-nav.is-disabled { opacity: .3; pointer-events: none; }

.elementor-element-ktstvp {
  margin-top: 46px !important;
  overflow: hidden !important;
}
.elementor-element-ktsttrack { flex-wrap: nowrap !important; will-change: transform; }
.elementor-element-ktsttrack > .e-con {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: none !important;
}

.ktst-pic img {
  width: 100% !important;
  height: 100% !important;
  min-height: 330px !important;
  object-fit: cover;
  border-radius: 18px;
  display: block;
}
.elementor-element-ktsttrack > .e-con > .e-con:first-child { align-self: stretch; }

.elementor-element-ktsttrack > .e-con > .e-con:last-child {
  background: #EFEAE2;
  border-radius: 18px;
  justify-content: center !important;
}
.ktst-q .elementor-heading-title {color: #1E1A16 !important;}
.ktst-n { margin-top: 34px !important; }
.ktst-n .elementor-heading-title {color: #1E1A16 !important;}
.ktst-r { margin-top: 4px !important; }
.ktst-r .elementor-heading-title {color: #8A8078 !important;}

@media (max-width: 767px) {
  
  .ktst-pic img { min-height: 240px; }
}

/* ===========================================================
   PASS 2 refinements
   =========================================================== */

/* ---------- shared panel watermark ---------- */
.kpanel-wm {
  position: absolute !important;
  left: 40px;
  bottom: -12px;
  width: auto !important;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}
.kpanel-wm .elementor-heading-title {
  font-family: Archivo, sans-serif;
  font-weight: 800;
  font-size: 15vw;
  line-height: .78;
  letter-spacing: -.05em;
  text-transform: uppercase;
  color: transparent !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, .02) 68%, rgba(255, 255, 255, 0) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  white-space: nowrap;
}
.elementor-element-kevpanel > .elementor-element:not(.kpanel-wm),
.elementor-element-kqpanel > .elementor-element:not(.kpanel-wm) { z-index: 1; }

@media (max-width: 767px) {
  .kpanel-wm { left: 18px; bottom: -6px; }
  .kpanel-wm .elementor-heading-title { font-size: 26vw; }
}

/* ---------- Choose your path: the two audiences lead the card ---------- */
.kevb-tag {
  display: inline-block !important;
  width: auto !important;
  align-self: flex-start;
}
.kevb-tag .elementor-heading-title {
  display: inline-block;
  color: #FFFFFF !important;
  font-size: 12.5px;
  letter-spacing: 2px;
  padding: 8px 16px;
  border-radius: 100px;
  background: #E0312B;
  box-shadow: 0 10px 24px -12px rgba(224, 49, 43, .9);
}
.kevb-t { margin-top: 22px !important; }

/* ---------- Meet Karina: the panel needed its corners back ---------- */
.elementor-element-kqpanel {
  border-radius: 28px !important;
  overflow: hidden !important;
}
@media (max-width: 767px) {
  .elementor-element-kqpanel { border-radius: 20px !important; }
}

/* ===========================================================
   Testimonials, second pass
   The quote now leads with a real quote mark, the panel is white
   against the bone canvas, and the portrait overlaps it slightly.
   =========================================================== */
.elementor-element-ktsttrack > .e-con { align-items: center !important; gap: 0 !important; }

.elementor-element-ktsttrack > .e-con > .e-con:first-child {
  position: relative;
  z-index: 1;
}
.ktst-pic img {
  min-height: 420px !important;
  border-radius: 20px !important;
  box-shadow: 0 34px 68px -34px rgba(30, 26, 22, .6);
}

.elementor-element-ktsttrack > .e-con > .e-con:last-child {
  position: relative;
  margin-left: -34px !important;
  padding-left: 76px !important;
  background: linear-gradient(168deg, #FFFFFF 0%, #F8F5F0 100%) !important;
  border: 1px solid rgba(30, 26, 22, .1);
  border-radius: 20px !important;
  box-shadow: 0 30px 60px -38px rgba(30, 26, 22, .5);
}

/* the opening quote mark, set large and low contrast */
.elementor-element-ktsttrack > .e-con > .e-con:last-child::after {
  content: "\201C";
  position: absolute;
  top: 6px;
  right: 34px;
  font-weight: 700;
  font-size: 130px;
  line-height: 1;
  color: rgba(224, 49, 43, .13);
  pointer-events: none;
}



/* a short red rule separates the quote from who said it */
.ktst-n { margin-top: 30px !important; padding-top: 26px !important; position: relative; }
.ktst-n::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 2px;
  background: #E0312B;
}

@media (max-width: 1024px) {
  .elementor-element-ktsttrack > .e-con > .e-con:last-child {
    margin-left: -26px !important;
    padding-left: 60px !important;
  }
  
}
@media (max-width: 767px) {
  .elementor-element-ktsttrack > .e-con { align-items: stretch !important; }
  .elementor-element-ktsttrack > .e-con > .e-con:last-child {
    margin-left: 0 !important;
    margin-top: -28px !important;
    padding-left: 26px !important;
  }
  .elementor-element-ktsttrack > .e-con > .e-con:last-child::after { font-size: 90px; right: 20px; }
  .ktst-pic img { min-height: 300px !important; }
  
}

/* ===========================================================
   PASS 3 refinements
   =========================================================== */

/* ---------- watermarks: centred, and pushed further back ---------- */
.kpanel-wm {
  left: 50% !important;
  right: auto !important;
  bottom: -18px !important;
  transform: translateX(-50%);
}
.kpanel-wm .elementor-heading-title {
  font-size: 17vw;
  background: linear-gradient(180deg, rgba(255, 255, 255, .075) 0%, rgba(255, 255, 255, .015) 62%, rgba(255, 255, 255, 0) 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
@media (max-width: 767px) {
  .kpanel-wm { bottom: -8px !important; }
  .kpanel-wm .elementor-heading-title { font-size: 30vw; }
}

/* the cards were translucent, so the watermark read straight through them */
.elementor-element-kevboxes > .e-con {
  background: linear-gradient(168deg, rgba(28, 20, 24, .82) 0%, rgba(18, 13, 16, .72) 100%) !important;
  backdrop-filter: blur(6px);
}
.elementor-element-kevboxes > .e-con:hover {
  background: linear-gradient(168deg, rgba(38, 26, 30, .86) 0%, rgba(24, 17, 20, .78) 100%) !important;
}

/* ===========================================================
   Testimonials, third pass
   A red plate sits behind the portrait, the quote carries more
   weight, and the position in the set is now visible.
   =========================================================== */

.elementor-element-ktstvp { overflow: hidden !important; }
.elementor-element-ktsttrack > .e-con { overflow: visible !important; padding: 0 0 26px 26px !important; }

/* red plate behind the portrait */
.elementor-element-ktsttrack > .e-con > .e-con:first-child::before {
  content: "" !important;
  position: absolute;
  left: -26px;
  bottom: -26px;
  width: 58%;
  height: 54%;
  border-radius: 20px;
  background: #E0312B;
  z-index: -1;
}
.elementor-element-ktsttrack > .e-con > .e-con:first-child { z-index: 1 !important; }

.ktst-pic img { min-height: 460px !important; }

/* the quote panel carries the weight now */
.elementor-element-ktsttrack > .e-con > .e-con:last-child {
  padding-top: 58px !important;
  padding-bottom: 54px !important;
  padding-right: 58px !important;
}

.elementor-element-ktsttrack > .e-con > .e-con:last-child::after {
  font-size: 150px;
  top: 2px;
  right: 40px;
  color: rgba(224, 49, 43, .11);
}

/* position in the set, next to the arrows */
.ktst-count { width: auto !important; margin-right: 8px !important; }
.ktst-count .elementor-heading-title {
  color: #8A8078 !important;
  font-family: Archivo, sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1.6px;
}
.ktst-count .elementor-heading-title b { color: #1E1A16; }

@media (max-width: 1024px) {
  
  .ktst-pic img { min-height: 400px !important; }
}
@media (max-width: 767px) {
  .elementor-element-ktsttrack > .e-con > .e-con:first-child::before {
    left: -20px;
    bottom: auto;
    top: -12px;
    width: 55%;
    height: 44%;
  }
  .ktst-pic img { min-height: 300px !important; }
  
  .elementor-element-ktsttrack > .e-con > .e-con:last-child {
    padding-top: 34px !important;
    padding-right: 26px !important;
  }
}
