/* ======================================================
   GRID
====================================================== */

.grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(160px,1fr));
  gap:16px;
}

.grid--premium{
  grid-template-columns:repeat(3,1fr);
  align-items:start;
}

/* ======================================================
   CARD BASE
====================================================== */

.card{
  background:#fff;

  padding:16px;

  border-radius:20px;

  box-shadow:0 12px 25px rgba(0,0,0,.1);

  transition:transform .35s ease, filter .35s ease;
  transform-origin:center;
}

/* ======================================================
   CARD PREMIUM
====================================================== */

.home .card--premium{

  background:linear-gradient(160deg,#ffffff,#fdf2f2);

  border:1px solid rgba(122,11,18,.25);

  border-radius:22px;

  padding:5px;

  height:180px;

}

.home .card--premium h3{
  font-size:14px;
  margin-bottom:6px;
}

.home .card--premium p{
  font-size:11px;
  line-height:1.3;
}

.home .card__benefits{
  font-size:5px;
  line-height:1.5;
}

/* ======================================================
   IMAGEN CARD
====================================================== */

.home .card--premium .card__image{
  height:80px;
  overflow:hidden;
  border-radius:16px;
}

.home .card--premium .card__image img{

  width:100%;
  height:100%;

  object-fit:cover;

  border-radius:16px;

  transition:transform .4s ease, filter .4s ease;
}

.home .card--premium:hover .card__image img{

  transform:scale(1.12);

  filter:saturate(1.05);
}

/* ======================================================
   CONTROL ESCRITORIO
====================================================== */

@media (min-width:1025px){

.home .grid--premium{
  gap:30px;
}

.home .card--premium{

  width:80%;
  height:320px;

  padding:10px;

  border-radius:26px;

  background:#fff;

  box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.home .card--premium .card__image{
  height:200px;
}

.home .card--premium h3{
  font-size:18px;
}

.home .card--premium p{
  font-size:14px;
}

.home .card__benefits{
  font-size:10px;
}

}

/* ======================================================
   CONTROL MOVIL
====================================================== */

@media (max-width:768px){

.grid:not(.grid--premium){
  grid-template-columns:1fr;
}

.home .grid--premium{
  gap:10px;
}

.home .card--premium{
  height:170px;
  padding:6px;
  border-radius:20px;
}

.home .card--premium .card__image{
  height:70px;
}

.home .card--premium h3{
  font-size:13px;
}

.home .card--premium p{
  font-size:10px;
}

.home .card__benefits{
  font-size:6px;
}

}