/* Home page specific enhancements. Builds on base.css without duplicating utilities. */

.hero {
  background: linear-gradient(180deg, var(--color-primary-subtle) 0%, var(--color-surface) 100%);
}

.section-alt {
  background-color: var(--color-surface-secondary);
}

.eyebrow {
  display: inline-block;
}

/* Search bar layout */
.search {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

/* Card links inherit .card but should look interactive */
.card[href] {
  text-decoration: none;
  color: inherit;
}
.card[href]:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

/* Minor spacing tweaks for details */
details.card summary {
  cursor: pointer;
}
details.card[open] {
  box-shadow: var(--shadow-md);
}

/* Image wrapper ratio hint on small screens */
@media (max-width: 768px) {
  .img-wrapper img {
    width: 100%;
    height: auto;
  }
}