.mosaic{
  display:grid;
  grid-template-columns: 1fr 1.6fr 1.2fr;
  grid-template-rows: 210px 210px;
  gap:22px;
  margin-bottom:28px;

  grid-template-areas:
    "text1 big img1"
    "text2 big mint";
}

/* базовая плитка */
.mosaic__tile{
  border-radius:18px;
  overflow:hidden;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:.3s ease;
}

/* текстовые карточки */
.mosaic__tile--soft{
  background:#f3f5fa;
  padding:32px;
  justify-content:flex-start;
}
.mosaic__tile--text-1{ grid-area: text1; }
.mosaic__tile--text-2{
  grid-area: text2;
  background:#fff4e6;
}

/* mint */
.mosaic__tile--mint{
  grid-area:mint;
  background:#e6f8ec;
  padding:32px;
}

/* большие картинки */
.mosaic__tile--big{ grid-area:big; }
.mosaic__tile--img{
  background-image:var(--bg);
  background-size:cover;
  background-position:center;
}
.mosaic__tile--img-1{ grid-area: img1; }

/* затемнение поверх фото */
.mosaic__tile--img::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,.05), rgba(0,0,0,.25));
}

/* hover */
.mosaic__tile:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.12);
}

/* текст */
.mosaic__text{
  position:relative;
  z-index:2;
  font-size:19px;
  font-weight:800;
  line-height:1.15;
  text-transform:uppercase;
  color:#14238c;
}
.mosaic__text--center{
  text-align:center;
  width:100%;
  color:#1dbf62;
}

.shopbar{
  background:#f2f3f7;
  border-radius:18px;
  padding:22px 28px;
  display:grid;
  grid-template-columns: 1.2fr 1.8fr auto;
  gap:20px;
  align-items:center;
}

/* заголовок */
.shopbar__title{
  font-size:20px;
  font-weight:800;
  line-height:1.2;
  text-transform:uppercase;
  color:#666;
}

/* селект */
.shopbar__select{
  background:#fff;
  border-radius:12px;
  height:56px;
  display:flex;
  align-items:center;
  padding:0 18px;
  gap:14px;
  border:1px solid rgba(0,0,0,.15);
}

.shopbar__input{
  border:0;
  outline:none;
  width:100%;
  font-size:15px;
  color:#444;
  background:transparent;
}

/* кнопка */
.btnPrimary{
  height:56px;
  padding:0 28px;
  border-radius:12px;
  background:#14238c;
  color:#fff;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.6px;
  display:flex;
  align-items:center;
  gap:14px;
  cursor:pointer;
  box-shadow:0 10px 26px rgba(20,35,140,.25);
  transition:.25s ease;
}

.btnPrimary:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 36px rgba(20,35,140,.35);
}