/* ============================================
   SEASONAL: Christmas minis 2026, remove after Dec 13
   Pending styles for the Christmas minis blocks on index.html,
   tampa/index.html and appleton/index.html. Kept out of styles.css
   so the whole thing comes out in January: delete this file, its
   <link> in those three pages, and each <!-- SEASONAL --> block.

   Layout reuses .seasonal-feature from styles.css (photo beside text,
   stacked under 860px with a 3 / 2 photo box). All three photos used
   are 3 / 2 landscape, so at phone widths the whole photo shows.
   ============================================ */

.xmas-minis {
  padding: 3.5rem 0;
  scroll-margin-top: var(--nav-height);
}

.xmas-minis .seasonal-feature-body .accent-label {
  margin-bottom: 0;
}

.xmas-minis .seasonal-feature-body h2 {
  margin: 0.4rem 0 0.75rem;
}

.xmas-minis-lede {
  font-size: 0.95rem;
  line-height: 1.7;
  margin-bottom: 1rem;
}

/* Homepage: one line per market */
.xmas-markets {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 0;
}

.xmas-markets li {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--warm-gray);
  padding: 0.65rem 0;
  border-top: 1px solid rgba(201, 169, 110, 0.35);
}

.xmas-markets li:last-child {
  border-bottom: 1px solid rgba(201, 169, 110, 0.35);
}

.xmas-markets strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--dark);
}

.xmas-markets .xmas-price {
  display: block;
  color: var(--accent-text);
  font-weight: 600;
}

.xmas-minis-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.xmas-minis-more {
  display: inline-block;
  margin-top: 1rem;
  font-size: 0.85rem;
  color: var(--accent-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 860px) {
  /* Box is 3 / 2 like the photo, so centre it and nothing is cut. */
  .xmas-minis .seasonal-feature-photo img {
    object-position: center;
  }
}

@media (max-width: 480px) {
  .xmas-minis {
    padding: 2.5rem 0;
  }
  .xmas-minis .seasonal-feature-body {
    padding: 1.75rem 1.25rem;
  }
  .xmas-minis-actions .btn {
    flex: 1 1 100%;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}