/* assets/css/pages/about/vision-mission.css */

.kiwi-aboutVM{
  padding: 80px 0;
}

.kiwi-aboutVM__grid{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 22px;
  align-items: flex-start;
}

.kiwi-aboutVM__item{
  flex: 1 1 calc(50% - 11px);
  text-align: start;
  max-width: 560px;
}

.kiwi-aboutVM__iconCard{
  --fill-x: 6px;
  --fill-y: 0px;

  --stk-x: 0px;
  --stk-y: 6px;

  --stk-x-h: -1px;
  --stk-y-h: 8px;

  position: relative;
  isolation: isolate;

  width: 76px;
  height: 76px;

  display: grid;
  place-items: center;

  background: transparent;
  border: 0;
}

.kiwi-aboutVM__iconCard::after,
.kiwi-aboutVM__iconCard::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px 0 18px 18px;
  transition: transform var(--t) var(--ease);
}

.kiwi-aboutVM__iconCard::after{
  background: var(--kiwi-ink);
  transform: translate3d(var(--fill-x), var(--fill-y), 0);
  z-index: -1;
}

.kiwi-aboutVM__iconCard::before{
  border: 1px solid var(--kiwi-gold);
  transform: translate3d(var(--stk-x), var(--stk-y), 0);
  z-index: -2;
}

.kiwi-aboutVM__iconCard:hover::before{
  transform: translate3d(var(--stk-x-h), var(--stk-y-h), 0);
}

.kiwi-aboutVM__icon{
  transform: translate3d(var(--fill-x), var(--fill-y), 0);
  font-size: 28px;
  line-height: 1;
  color: var(--kiwi-gold);
}

.kiwi-aboutVM__title{
  margin: 14px 0 8px;
  font-weight: 900;
  font-size: clamp(18px, 1.6vw, 22px);
  color: var(--kiwi-ink);
  line-height: 1.2;
}

.kiwi-aboutVM__text{
  margin: 0;
  font-weight: 600;
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.95;
  color: var(--kiwi-text-strong);
  max-width: 62ch;
}

/* ===== RTL/LTR Direction Fix ===== */
html[dir="rtl"] .kiwi-aboutVM__grid{
  flex-direction: row-reverse;
}

/* ===== LTR Fixes (English) ===== */
html[dir="ltr"] .kiwi-aboutVM__iconCard::after,
html[dir="ltr"] .kiwi-aboutVM__iconCard::before{
  border-radius: 0 18px 18px 18px;
}

@media (max-width: 980px){
  .kiwi-aboutVM{
    padding: 46px 0;
  }

  .kiwi-aboutVM__item{
    flex: 1 1 100%;
    max-width: none;
  }
}