/* Amazon secondary links (soil cards and guide pages) */
.shop-alt {
  display: block;
  margin: 0.5rem auto 0;
  text-align: center;
  font-size: 0.875rem;
  color: #4a6b2f;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.shop-alt:hover,
.shop-alt:focus-visible { color: #2f4a1c; }

.amazon-pick {
  margin: 0.75rem 0 1.25rem;
  font-size: 0.95rem;
}
.amazon-pick a {
  color: #4a6b2f;
  font-weight: 600;
  text-underline-offset: 2px;
}
.amazon-pick a:hover,
.amazon-pick a:focus-visible { color: #2f4a1c; }

/* No-price Amazon card: <li class="amazon-pick"> inside an existing .shop-grid.
   Scoped to .shop-grid > .amazon-pick so the guide-page <p class="amazon-pick">
   line above keeps its current look. Card has no price line on purpose. */
.shop-grid > .amazon-pick {
  display: flex; flex-direction: column; min-width: 0; height: 100%;
  margin: 0; padding: 0 0 1rem; font-size: 1rem;
  background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
  transition: transform 0.18s, box-shadow 0.18s;
}
.shop-grid > .amazon-pick:hover,
.shop-grid > .amazon-pick:focus-within { transform: translateY(-4px); box-shadow: var(--lift); }
.shop-grid > .amazon-pick img {
  display: block; width: 100%; height: auto; aspect-ratio: 1 / 1;
  object-fit: contain; padding: 0.75rem; background: #fff;
  border-bottom: 1px solid var(--line);
}
.shop-grid > .amazon-pick .pick-brand {
  margin: 0.8rem 1rem 0.15rem;
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  line-height: 1.3; color: var(--cedar);
}
.shop-grid > .amazon-pick h2,
.shop-grid > .amazon-pick h3 {
  margin: 0 1rem 0.3rem; padding: 0; border: 0;
  font-family: var(--sans); font-weight: 700; font-size: 1.05rem; line-height: 1.3; letter-spacing: 0;
  color: var(--ink);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
  overflow: hidden; min-height: 2.6em;
}
.shop-grid > .amazon-pick .pick-reason {
  margin: 0 1rem 0.9rem;
  font-size: 0.92rem; line-height: 1.4; color: var(--muted);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
  overflow: hidden; min-height: 2.8em;
}
.shop-grid > .amazon-pick .pick-btn {
  display: block; margin: auto 1rem 0;
  padding: 0.8rem 1rem; border-radius: 6px;
  background: var(--cedar); color: #fff;
  font-family: var(--sans); font-weight: 700; font-size: 1.02rem; line-height: 1.2;
  text-align: center; text-decoration: none;
  transition: background-color 0.15s;
}
.shop-grid > .amazon-pick .pick-btn:hover,
.shop-grid > .amazon-pick .pick-btn:focus-visible { background: #8e4826; color: #fff; }

/* ---- v2: Amazon picks sections on category pages ---- */
/* Affiliate line just above an Amazon picks grid. */
.aff-line { margin: -0.35rem 0 1rem; font-size: 0.95rem; color: var(--muted); }
.aff-line a { color: var(--moss); font-weight: 600; }
.page-band + .aff-line { margin-top: 0; }
.tools-main .section-head { margin-top: 0.4rem; }

/* Small "Amazon" chip next to the brand label. */
.shop-grid > .amazon-pick .pick-chip {
  display: inline-block; margin-left: 0.35rem; padding: 0.05rem 0.45rem; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--line); color: var(--muted);
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; vertical-align: 0.05em;
}
/* Exact names and full reason lines: allow 3 lines for names, no clamp on the reason.
   Grid rows stretch, and the pinned button keeps every button on one baseline. */
.shop-grid > .amazon-pick h2,
.shop-grid > .amazon-pick h3 { -webkit-line-clamp: 3; line-clamp: 3; min-height: 3.9em; }
.shop-grid > .amazon-pick .pick-reason { display: block; -webkit-line-clamp: none; line-clamp: none; overflow: visible; min-height: 0; }

/* Text-only card: no maker photo we could confirm, so a tinted panel with the
   brand name, the same square size as the photo frame. */
.shop-grid > .amazon-pick .pick-text-panel {
  display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1 / 1;
  background: #efe7d8; border-bottom: 1px solid var(--line); padding: 1rem;
}
.shop-grid > .amazon-pick .pick-text-panel span {
  font-family: var(--serif); font-weight: 650; font-size: clamp(1.6rem, 2.6vw, 2.2rem);
  letter-spacing: -0.02em; color: var(--moss); text-align: center; line-height: 1.1;
}
/* Very wide photo (rain wand): whole and centred in the square frame. */
.shop-grid > .amazon-pick img.pick-wide { object-fit: contain; object-position: center; padding: 1.25rem; }
/* Text-only panel: optional one-word product line under the brand. */
.shop-grid > .amazon-pick .pick-text-panel { flex-direction: column; gap: 0.35rem; }
.shop-grid > .amazon-pick .pick-text-panel small {
  font-family: var(--sans); font-size: 0.95rem; font-weight: 600; line-height: 1.2;
  color: var(--muted); text-align: center;
}