:root{
  --bg: linear-gradient(to top, rgb(40, 0, 39), rgb(6, 38, 61));
  --text: white;
  --point-size: 56px; /* גדול = שונה חידוד */
  --radius: 12px; /* עיקול קופסה */
  --point-round: 8px; /* עיגול לנקודה */
}

#keyAdvantage {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: 'Heebo', sans-serif;
    width: 100%;
    padding: 50px;
    background: var(--bg);
    color: var(--text);
    position: relative;
    box-sizing: border-box;
    text-align: center;
}
#keyAdvantage::after{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%) rotate(45deg); /* הופך לרוטציה של diamond */
  bottom: calc(-1 * (var(--point-size) / 2));
  width: var(--point-size);
  height: var(--point-size);
  background: rgb(40, 0, 39);
  border-radius: var(--point-round); /* עיגול קצוות ה־diamond => פחות חד */
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  pointer-events: none;
}

#keyAdvantageWrapper {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 3 עמודות שוות */
  grid-template-rows: repeat(2, auto); 
  gap: 30px;  /* 2 שורות; גובה לפי התוכן */
}

@media (max-width: 1300px) {
    #keyAdvantageWrapper {
        grid-template-columns: repeat(1, 1fr);
    }
}

.advantageWrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 30px;
}

#advantageA, #advantageB, #advantageC, #advantageD {
    border-bottom: 1px solid rgb(98, 98, 98);
}

@media (max-width: 1300px) {
    #advantageE {
        border-bottom: 1px solid rgb(98, 98, 98);
    }
}

#keyAdvantage h2 {
    font-weight: 700;
    font-size: clamp(24px, 3vw, 30px);
}

#keyAdvantage h3 {
    font-size: clamp(24px, 3vw, 26px);
    color: rgb(0, 181, 209);
}

.icon-advantage {
    font-size: 30px;
}

#keyAdvantage p {
    font-size: clamp(20px, 3vw, 22px);
}

.arrow-d {
    font-size: 30px;
}

.bottom-line {
    font-weight: 700;
}