/* Home1 — scoped additions for the Home1Page layout, now live at #home.
   pages/Home.jsx is kept on disk, unrouted, reachable at #home-classic. */

.home1 .hero-knowledge-flow {
  width: min(100%, 500px);
  justify-self: center;
  aspect-ratio: 1;
}

.home1 .hero-knowledge-flow video,
.home1 .hero-knowledge-flow img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 980px) {
  .home1 .hero-knowledge-flow {
    width: min(100%, 410px);
    margin: 0 auto;
  }
}

.home1-product-shot {
  margin: 0;
  border: 0;
  border-radius: 24px 24px 0 0; overflow: hidden; background: var(--canvas);
  aspect-ratio: 16 / 9;
}
.home1-product-shot img {
  display: block; width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
}

.home1-quote {
  margin-top: 24px; padding: 22px 24px; border-radius: 16px;
  background: var(--myloft-deep, #002E6E); color: #fff;
}
.home1-quote-mark {
  font-family: var(--font-display); font-size: 34px; line-height: 1;
  color: var(--myloft-sky, #00BAF2); margin-bottom: 4px;
}
.home1-quote blockquote {
  margin: 0; font-family: var(--font-display); font-size: 17px; font-weight: 500; line-height: 1.4;
}
.home1-quote-attrib {
  margin-top: 12px; font-size: 12px; font-style: italic; color: rgba(255,255,255,0.65);
}

body[data-mode="dark"] .home1-product-shot { background: #0F1B33; }

/* Home1 trims the workflow strip from 7 steps to 4 — override the fixed
   7-column grid from site.css so the row doesn't reserve empty slots. */
.home1 .workflow { grid-template-columns: repeat(4, 1fr); }