/* Own-version template and household pages (src/templates/own.njk, src/household/own.njk, src/templates/hub.njk). Tokens only. */
.tpl-layout .sign-intro .lead { max-width: 720px; margin: 0; }
.tpl-variant { background: var(--white); border: var(--bd-structural); }
.tpl-variant__title { margin: 0; padding: var(--s4) var(--s6); font-family: var(--font-head); font-weight: 800; font-size: 34px; line-height: 1; text-transform: uppercase; border-bottom: var(--bd-structural); }
.tpl-files { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.tpl-file { display: flex; flex-direction: column; }
.tpl-file + .tpl-file { border-left: var(--bd-structural); }
.tpl-file__fig { margin: 0; background: var(--paper); padding: var(--s6); display: flex; justify-content: center; border-bottom: var(--bd-card); }
.tpl-file__fig img { width: 100%; max-width: 360px; height: auto; background: var(--white); border: 2px solid var(--ink); }
.tpl-file__body { padding: var(--s5) var(--s6) var(--s6); display: flex; flex-direction: column; gap: var(--s3); }
.tpl-file__label { margin: 0; font-family: var(--font-head); font-weight: 800; font-size: 26px; line-height: 1; text-transform: uppercase; }
.tpl-file__body .small { margin: 0; }
.tpl-file__btns { display: flex; flex-direction: column; gap: var(--s3); }
.tpl-file__btns .btn { width: 100%; }
.tpl-file__btns .btn--primary { min-height: 60px; font-size: 24px; }
.tpl-file__size { font-family: var(--font-body); font-weight: 500; font-size: 14px; text-transform: none; letter-spacing: 0; margin-left: 6px; }
.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.steps li { display: flex; background: var(--white); border: var(--bd-card); }
.steps__n { flex: none; width: 64px; display: flex; align-items: center; justify-content: center; background: var(--ink); color: var(--white); font-family: var(--font-head); font-weight: 800; font-size: 36px; }
.steps__t { padding: 14px 20px; align-self: center; }
.tpl-hub-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
@media (max-width: 599px) {
  .tpl-variant__title { padding: var(--s3) var(--s4); font-size: 28px; }
  .tpl-file + .tpl-file { border-left: 0; border-top: var(--bd-structural); }
  .tpl-file__fig { padding: var(--s4); }
  .tpl-file__body { padding: var(--s4); }
  .steps__n { width: 48px; font-size: 28px; }
}