/* Unrote - the home page (/): the hero with the "Is it worth doing with AI?" field and the morning report, the
   rows (kinds of work, perimeter, numbers, cases, pricing, integrations, founders, FAQ) and the dark call band.
   After base.css and components.css; the check panel the field opens is styled by check.css. */
.pg b {
  font-weight: 600;
}

/* hero: the field that opens the check panel, the morning report */
.hero {
  padding: 64px 0 0;
}
.hero-lead {
  margin-top: 20px;
}
.hero-stage {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}
.ask-label {
  display: block;
  font-weight: 600;
  margin-bottom: 8px;
}
.ask-hint {
  margin: 0 0 14px;
  font-size: 15px;
}
.ask-input {
  width: 100%;
  border: 0;
  border-bottom: 2px solid #181715;
  font: 400 17px/1.3 'Inter Tight',sans-serif;
  padding: 10px 0;
  background: transparent;
  color: #181715;
  box-sizing: border-box;
}
.ask-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.ask-note {
  font-size: 14px;
}
.ask-or {
  margin: 14px 0 4px;
  font-size: 14px;
}
.ask-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 18px;
}
.sheet-bar {
  display: flex;
  justify-content: space-between;
  color: #63625c;
}
.sheet-head {
  margin-bottom: 10px;
}
.sheet-foot {
  margin-top: 10px;
}
.sheet .sheet-last {
  border-bottom: 1px solid #dcdcd6;
}
.hero-note {
  margin-top: 14px;
  font-size: 14px;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

/* the rows */
.home-rows {
  margin-top: 72px;
}
.kinds, .founders {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.kind-before {
  margin-top: 6px;
}
.kind-after {
  margin-top: 8px;
}
.kind-tag {
  font-weight: 600;
}
.kind-after .kind-tag {
  color: #2456d6;
}
.perimeter-list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 16px;
}
.perimeter-list li {
  display: flex;
  gap: 12px;
}
.bullet {
  flex: 0 0 10px;
  height: 10px;
  background: #2456d6;
  margin-top: 8px;
}
.schema {
  display: grid;
  grid-template-columns: 1fr 56px 1fr 56px 1fr;
  align-items: center;
}
.schema-model {
  background: #2456d6;
  color: #ffffff;
}
.schema-model-note {
  color: #d6e0ff;
}
.honest {
  margin-top: 16px;
}
.stats {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 20px;
}
.stat-num {
  font-size: 40px;
  font-weight: 600;
  letter-spacing: -.02em;
}
.stat-accent {
  color: #2456d6;
}
.cases-all {
  margin-top: 20px;
}
.case-list {
  display: flex;
  flex-direction: column;
}
.case-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid #c8c8c2;
  text-decoration: none;
  font-size: 16px;
}
.case-status {
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 600;
  color: #55544f;
}
.case-status.in-prod {
  color: #2456d6;
}
.price-wrap {
  overflow-x: auto;
}
.price-table {
  min-width: 560px;
  font-size: 16px;
}
.price-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.integrations {
  font-size: 22px;
  line-height: 1.4;
  max-width: 34ch;
}
.founder-role {
  margin: 4px 0 10px;
}
.founder-link {
  display: inline-block;
  margin-top: 10px;
}
.faq-last {
  border-bottom: 1px solid #c8c8c2;
}

/* the dark band: free test and call */
.call {
  margin-top: 72px;
  padding: 72px 0;
}
.call-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
}
.call-text {
  margin-top: 12px;
  max-width: 44ch;
}
.call-cta {
  margin-top: 20px;
}
.call-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-top: 20px;
}
/* motion: the hero report prints its lines one by one once, the run marker blinks while it does; packets run from
   the mail to the model and only one in three goes on to people; the numbers count up (shared/pages/home.js) */
.sheet-run {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  background: #2456d6;
}
.sheet.live .row, .sheet.live .sheet-foot {
  animation: print 260ms cubic-bezier(.23,1,.32,1) both;
}
.sheet.live .row:nth-child(2) { animation-delay: 300ms; }
.sheet.live .row:nth-child(3) { animation-delay: 650ms; }
.sheet.live .row:nth-child(4) { animation-delay: 1000ms; }
.sheet.live .row:nth-child(5) { animation-delay: 1350ms; }
.sheet.live .row:nth-child(6) { animation-delay: 1700ms; }
.sheet.live .row:nth-child(7) { animation-delay: 2050ms; }
.sheet.live .sheet-foot { animation-delay: 2500ms; }
.sheet.live .sheet-run {
  animation: run 350ms ease-in-out 8 alternate;
}
@keyframes print {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}
@keyframes run {
  to {
    opacity: .2;
  }
}
.schema-link {
  position: relative;
  height: 12px;
  overflow: hidden;
  background: none;
}
.schema-link::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 4.5px;
  height: 3px;
  background: #2456d6;
}
.schema-link i {
  position: absolute;
  top: 2px;
  left: -8px;
  width: 8px;
  height: 8px;
  background: #181715;
  animation: packet 2400ms linear infinite;
}
.schema-link i:nth-child(2) { animation-delay: 800ms; }
.schema-link i:nth-child(3) { animation-delay: 1600ms; }
.schema-out i {
  animation-duration: 7200ms;
  animation-delay: 1200ms;
}
@keyframes packet {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(72px);
  }
}
@media (prefers-reduced-motion:reduce) {
  .sheet.live .row, .sheet.live .sheet-foot, .sheet.live .sheet-run, .schema-link i {
    animation: none;
  }
  .schema-link i {
    display: none;
  }
}
@media (max-width:760px) {
  .schema-link i {
    display: none;
  }
}
/* the figure of a number while it counts up (shared/pages/home.js): drawn from data-n, no text of the page */
.stat-count::before {
  content: attr(data-n);
}