/* Home page additions. Everything else comes from layout.css and components.css. */

/* Hero: flagship Summary extract in a workbook window */
.hero-ctas { margin-top: 1.75rem; }
.hero-lite { margin-top: .5rem; }
.hero-lite a { display: inline-flex; align-items: center; min-height: var(--target); }
.hero-figure { margin: 0; min-width: 0; }
.hero-table { overflow-x: auto; }
.hero-figure .sheet-tab { display: inline-flex; align-items: center; cursor: default; }
.hero-figure .sheet-tab:hover { background: transparent; color: var(--ink-soft); }
.hero-figure .sheet-tab.is-active:hover { background: var(--white); color: var(--ink); }
.hero-figure figcaption { display: grid; gap: .35rem; margin-top: 1rem; }
.hero-figure-note { margin: 0; }
.hero-figure-note .target { margin-left: .25rem; }
.hero-figure .cell { white-space: nowrap; }
/* Two-column hero on mid widths: the figure is narrow, so drop the cost column as phones do */
@media (min-width: 961px) and (max-width: 1240px) {
  .hero-figure .col-cost { display: none; }
}

/* Phones: keep price (in the Buy label), Buy and the guarantee on the first screen */
@media (max-width: 560px) {
  .hero { padding-top: 1.75rem; }
  .hero .eyebrow { margin-bottom: .8rem; }
  .hero h1 { margin-bottom: .45em; }
  .hero .lead { font-size: 1rem; margin-bottom: 0; }
  .hero-ctas { margin-top: 1.25rem; gap: .6rem; }
  .hero-ctas .btn { flex: 1 1 100%; }
  .hero .guarantee { margin-top: .8rem; }
}

/* Templates-by-decision teaser */
.home-catalog-lead { margin-bottom: 1.75rem; }
.decision-list { margin-bottom: 1rem; }
.decision-list .decision-product { margin-top: .35rem; font-size: .95rem; }
.decision-list .decision-product a { display: inline-flex; align-items: center; min-height: var(--target); font-weight: 600; }

/* FAQ */
.faq-more { margin: 1.25rem 0 0; }

/* Testing band: stack the test card under the rules until there is room for both */
@media (max-width: 1200px) {
  .page-home .testing-grid { grid-template-columns: minmax(0, 1fr); }
  .page-home .test-card { max-width: 32rem; }
}

/* Demo section: one real sheet in its window */
.home-shot { margin-top: 0; }
.home-shot figcaption strong { color: var(--ink); }

/* Video section (the explainer, once content.json has "video"); the player itself is styled in components.css */
.home-video { max-width: 60rem; }
.home-video-more { margin: 1rem 0 0; }