﻿.why-sec{
  background:#B89226;
  padding:70px 20px;
}

/* CONTAINER */
.container{
  max-width:1200px;
  margin:auto;
}

/* HEADING */
.why-head{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  margin-bottom:50px;
}

.why-head span{
  flex:1;
  height:1px;
  background:#e5e5e5;
  max-width:120px;
}

.why-head h2{
  font-size:20px;
  letter-spacing:2px;
  color:#fff;
}

/* GRID */
.why-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:20px;
}

/* CARD */
.why-card{
  background:#fff;
  padding:25px 18px;
  border-radius:12px;
  text-align:center;

  border:1px solid #eee;
  transition:0.3s ease;
}

/* HOVER */
.why-card:hover{
  transform:translateY(-5px);
  box-shadow:0 10px 30px rgba(0,0,0,0.06);
}

/* ICON */
.why-card .icon svg{
  width:32px;
  height:32px;
  stroke:#c9a74d;
  fill:none;
  stroke-width:1.5;
  margin-bottom:15px;
}

/* TITLE */
.why-card h4{
  font-size:13px;
  font-weight:600;
  margin-bottom:8px;
  color:#1c1c1c;
}

/* TEXT */
.why-card p{
  font-size:12px;
  color:#777;
  line-height:1.6;
}


@media(max-width:768px){

  .why-grid{
    grid-template-columns:1fr 1fr; /* 2 column */
    gap:15px;
  }

  .why-card{
    padding:18px 14px;
    text-align:left;
  }

  .why-card h4{
    font-size:12px;
  }

  .why-card p{
    font-size:11px;
  }


}