@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap');

.ib-products-section{
  --ib-bg:#15171a;
  --ib-card:#20242a;
  --ib-line:#2c3138;
  --ib-amber:#c89a4c;
  --ib-amber-soft:rgba(200,154,76,0.14);
  --ib-text:#eceef0;
  --ib-text-1:#a6acb4;
  --ib-radius:10px;
  --ib-columns:3;

  box-sizing:border-box;
  font-family:'Vazirmatn', sans-serif;
  color:var(--ib-text);
  padding:56px 24px;
  background:
    radial-gradient(circle at 12% 8%, rgba(200,154,76,0.06), transparent 40%),
    var(--ib-bg);
}

.ib-products-section *{ box-sizing:border-box; }

.ib-products-section .ib-products-section__inner{
  max-width:1120px;
  margin:0 auto;
}

.ib-products-section .ib-products-grid{
  display:grid;
  grid-template-columns:repeat(var(--ib-columns), 1fr);
  gap:12px;
}

.ib-products-section .ib-product-card{
  position:relative;
  display:flex;
  flex-direction:row-reverse;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:var(--ib-card);
  border:1px solid var(--ib-line);
  border-radius:var(--ib-radius);
  padding:14px 16px;
  text-decoration:none;
  color:inherit;
  overflow:hidden;
  opacity:0;
  transform:translateY(14px);
  animation:ib-card-in 0.5s ease forwards;
  transition:border-color .25s ease, transform .25s ease, background .25s ease;
}

.ib-products-section .ib-product-card:hover,
.ib-products-section .ib-product-card:focus-visible{
  border-color:var(--ib-amber);
  background:#242833;
  transform:translateY(-3px);
}

.ib-products-section .ib-product-card:focus-visible{
  outline:2px solid var(--ib-amber);
  outline-offset:3px;
}

.ib-products-section .ib-product-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, var(--ib-amber-soft), transparent 55%);
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}

.ib-products-section .ib-product-card:hover::after{ opacity:1; }

.ib-products-section .ib-product-card__arrow{
  width:24px;
  height:24px;
  flex-shrink:0;
  border-radius:50%;
  border:1px solid var(--ib-line);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--ib-text-1);
  transition:all .25s ease;
}

.ib-products-section .ib-product-card__arrow svg{
  width:12px;
  height:12px;
  transform:rotate(135deg);
  transition:transform .25s ease;
}

.ib-products-section .ib-product-card:hover .ib-product-card__arrow{
  background:var(--ib-amber);
  border-color:var(--ib-amber);
  color:#1a1a1a;
}

.ib-products-section .ib-product-card:hover .ib-product-card__arrow svg{
  transform:rotate(180deg);
}

.ib-products-section .ib-product-card__name{
  font-size:15px;
  font-weight:600;
  line-height:1.5;
  margin:0;
  color:var(--ib-text);
}

@keyframes ib-card-in{
  to{ opacity:1; transform:translateY(0); }
}

@media (max-width: 900px){
  .ib-products-section .ib-products-grid{ grid-template-columns:repeat(2, 1fr); }
}

@media (max-width: 560px){
  .ib-products-section{ padding:40px 16px; }
}

@media (prefers-reduced-motion: reduce){
  .ib-products-section .ib-product-card{ animation:none; opacity:1; transform:none; }
  .ib-products-section .ib-product-card,
  .ib-products-section .ib-product-card__arrow,
  .ib-products-section .ib-product-card__arrow svg{ transition:none; }
}