/* Стили ТОЛЬКО для страницы базы макетов */
.dielines .lead{max-width:80ch}
.dielines__intro{
  margin-top:12px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
}
.dielines__bullets{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.dielines__bullet{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.10);
  background:rgba(15,23,42,.03);
  font-size:13px;
  font-weight:800;
  color:rgba(15,23,42,.80);
}
.dielines__cta{display:flex;gap:10px;flex-wrap:wrap}
.dielines__note{
  margin-top:10px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.10);
  background:linear-gradient(180deg, rgba(15,23,42,.03), rgba(15,23,42,.01));
  color:rgba(15,23,42,.78);
  line-height:1.6;
}

/* Фильтры (оставляем id #filters как в твоём html/app.js) */
.dielines__panel{
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.dielines__h3{margin:0;font-size:14px;color:rgba(15,23,42,.78);font-weight:900}
#filters{display:flex;gap:8px;flex-wrap:wrap}
#filters button{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.16);
  background:#fff;
  cursor:pointer;
  font-weight:900;
  font-size:13px;
  color:rgba(15,23,42,.88);
}
#filters button:hover{background:rgba(15,23,42,.03)}
#filters button.active{
  background:#0B1220;
  border-color:#0B1220;
  color:#fff;
}

/* Сетка — твой app.js добавляет в #grid */
.grid{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:14px;
}
@media (max-width: 520px){
  .grid{grid-template-columns:1fr}
}

/* Мы не знаем точную разметку карточки из app.js,
   поэтому даём универсальные стили для разных вариантов */
#grid > *{
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 22px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.9) inset;
  min-width:0;
}
#grid img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  background:rgba(15,23,42,.02);
}
/* Отступы внутри карточек макетов */
.dielines__meta {
  padding: 14px 16px 16px; /* было мало — делаем воздух */
}

/* Заголовок макета */
.dielines__title {
  margin-bottom: 6px;
  line-height: 1.25;
}

/* Бейдж категории */
.dielines__badge {
  margin-top: 4px;
  display: inline-block;
  line-height: 1.2;
}
#grid h3,#grid h4{margin:12px 12px 6px;font-size:14px;line-height:1.35}
#grid p{margin:0 12px 12px;color:rgba(15,23,42,.72);font-size:13px;line-height:1.55}
#grid a{font-weight:900;color:#0B1220;text-decoration:none}
#grid a:hover{text-decoration:underline}

/* TG форма */
.dielines__calc{margin-top:14px}
.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width: 820px){ .formGrid{grid-template-columns:1fr} }
.formRow{margin-top:10px}
label{font-size:12px;color:rgba(15,23,42,.78);font-weight:800;display:flex;justify-content:space-between;gap:10px;margin-bottom:6px}
.req{color:rgba(220,38,38,.95);font-weight:950}
input, textarea{
  width:100%;
  font:inherit;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.16);
  background:#fff;
}
textarea{min-height:92px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{
  display:none;margin-top:10px;padding:12px;border-radius:14px;
  border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.03);
  color:rgba(15,23,42,.82);font-size:13px;line-height:1.45;
}
.notice.is-show{display:block}
.dielines__fineprint{margin-top:10px;font-size:12px;color:rgba(15,23,42,.65);line-height:1.55}