/* ============================================================================
   LaterDrop — pages.css
   Страницы шаблонов напоминаний (remind/, en/remind/): хлебные крошки, карточка
   шаблона, каталог. Остальное берётся из base.css и landing.css.
   ========================================================================= */
.crumbs{ display:flex; flex-wrap:wrap; gap:6px; font-size:13px; color:var(--ink-3); margin-bottom:14px; }
.crumbs a{ color:var(--ink-2); text-decoration:none; }
.crumbs a:hover{ color:var(--brand); }

a.lang-btn{ text-decoration:none; display:inline-flex; align-items:center; }
a.lang-btn:not([href]){ cursor:default; }

.tpl-box{
  margin:22px 0 8px; padding:20px;
  background:var(--surface-2); border:1px solid var(--brand-line); border-radius:14px;
}
.tpl-head{ font-size:16px; margin:0 0 12px; }
.tpl-rows{ margin:0 0 16px; display:grid; gap:10px; }
.tpl-rows div{ display:grid; grid-template-columns:minmax(120px,170px) 1fr; gap:12px; font-size:14px; line-height:1.5; }
.tpl-rows dt{ color:var(--ink-3); }
.tpl-rows dd{ margin:0; color:var(--ink); }
.tpl-note{ margin:14px 0 0; font-size:12.5px; line-height:1.5; color:var(--ink-3); }

.tpl-list{ margin:0 0 6px; padding-left:20px; font-size:14.5px; line-height:1.65; color:var(--ink-2); }
.tpl-list li{ margin:4px 0; }
.tpl-related{ list-style:none; padding-left:0; }
.tpl-related a, .tpl-list a{ color:var(--brand); }

.tpl-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; margin-top:22px; }
.tpl-card{
  display:block; padding:16px 18px; text-decoration:none; color:inherit;
  background:var(--surface); border:1px solid var(--line); border-radius:12px;
  transition:border-color .15s, box-shadow .15s;
}
.tpl-card:hover{ border-color:var(--brand-line); box-shadow:var(--sh-1); }
.tpl-card h2{ font-size:15px; line-height:1.35; margin:0 0 6px; color:var(--ink); }
.tpl-card p{ margin:0; font-size:13px; line-height:1.5; color:var(--ink-2); }

@media (max-width:560px){
  .tpl-rows div{ grid-template-columns:1fr; gap:2px; }
}