/* Home-only layout; shared type, colors, frames and focus styles come from site.css. */
.page.home { padding-block-start: var(--space-5); }
.home-intro p { margin-block-start: var(--space-3); max-width: 76ch; }
.home > .home-tools { margin-block-start: var(--space-5); }
.home-tools { display: grid; gap: var(--space-6); }
.home-tool { min-width: 0; }
.home-tool h2 { font-size: var(--text-h3); }
.home-tool__copy .status { margin-block-start: var(--space-2); }
.home-tool__copy .body-text { margin-block-start: var(--space-3); }
.home-preview { position: relative; margin-block-start: var(--space-4); }
.home-rate-frame, .home-document-frame {
  height: 440px;
  overflow: hidden;
}
.home-rate-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
}
.home-document-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
/* One ordinary link also covers the real screen; its sibling iframe is inert. */
.home-preview__link { display: inline-block; margin-block-start: var(--space-3); }
.home-preview__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.home-preview__link:focus-visible::after {
  outline: 2px solid var(--color-accent);
  outline-offset: 4px;
}
.home-tool .notice { margin-block-start: var(--space-3); }
.home > .home-directory { margin-block-start: var(--space-6); }
.home-directory h2, .home-company h2 { margin-block-end: var(--space-4); }
.home-directory .tool-list__row { grid-template-columns: minmax(0, 1fr) auto; }
.home-directory .tool-list__row > :last-child { grid-column: auto; }
.home-directory .status { text-align: right; }
.home-company > #contact { display: block; }
.home-company p + p { margin-block-start: var(--space-2); }
.home-company p[data-i18n="home.contactDescription"] { margin-block-start: var(--space-4); }

@media (min-width: 1024px) {
  .home-tools { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: var(--space-5); }
  .home-tool { display: grid; grid-template-rows: subgrid; grid-row: span 3; gap: 0; }
}
@media (max-width: 479px) {
  .home-directory .tool-list__row { grid-template-columns: minmax(0, 1fr); }
  .home-directory .status { text-align: left; }
}
