/* ===================================================================== */
/*  BENEFITS BLOCK (final: 4 → 2 колонки)                                */
/* ===================================================================== */

.benefits{
  padding:2.5rem 0;
  font-family:inherit;
}

/* ---------- Desktop: 4 колонки -------------------------------------- */
.benefits-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:2rem;
  width:100%;
  max-width:var(--container-max,1280px);
  margin:0 auto;
  padding:0 var(--container-pad,1rem);
}

/* ---------- Всё ≤ 1023 px (планшет + телефоны): 2 колонки ----------- */
@media (max-width:1023px){
  .benefits-grid{
    grid-template-columns:repeat(2,minmax(150px,1fr)); /* можно 140‑160 px */
    max-width:100%;    /* не шире экрана */
    margin-left:auto;  /* центрирование */
    margin-right:auto;
  }
}

/* ---------- Карточка ------------------------------------------------- */
.benefit-card{
  display:flex;
  align-items:flex-start;        /* заголовки ровно по линии */
  gap:1.25rem;
  text-align:left;
}

/* иконка */
.benefit-icon{
  width:3rem;
  height:3rem;
  flex-shrink:0;
}

/* текст */
.benefit-content h3{
  margin:0 0 .3rem;
  font-size:clamp(1rem,1.2vw,1.15rem);
  font-weight:600;
  color:#000;
}
.benefit-content p{
  margin:0;
  font-size:clamp(.9rem,1vw,.95rem);
  line-height:1.4;
  color:#000;
}

/* ---------- Очень узкие телефоны (<480px): чуть компактнее ---------- */
@media (max-width:479px){
  .benefit-icon{
    width:2.5rem;
    height:2.5rem;
  }
  .benefit-card{gap:.75rem;}
  .benefit-content h3{
    font-size:clamp(.95rem,4vw,1rem);
  }
  .benefit-content p{
    font-size:clamp(.85rem,3.6vw,.9rem);
  }
}
.visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}