/* Landing page promo sections CSS, restored from commit 2b31097 for the
   standalone preview build. Not part of the main app bundle. */
.promo-split { background: var(--cream-soft); padding: 5rem 2rem; border-bottom: 1px solid var(--rule); }
.promo-split--reverse { background: var(--paper); }
.promo-split-inner {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center;
}
.promo-split--reverse .promo-split-inner { grid-template-columns: 1fr 1fr; }
.promo-split--reverse .promo-text { order: 2; }
.promo-split--reverse .promo-card { order: 1; }
.promo-heading {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 34px; color: var(--ink); line-height: 1.2; margin-bottom: 1rem;
}
.promo-body { font-size: 16px; color: var(--muted); line-height: 1.7; margin-bottom: 1.75rem; }

.promo-centered { background: var(--cream); padding: 5rem 2rem; border-bottom: 1px solid var(--rule); }
.promo-centered-inner { max-width: 1100px; margin: 0 auto; text-align: center; }
.promo-centered .promo-heading { font-size: 40px; margin: 0 auto 0.5rem; }
.promo-centered-sub { font-size: 16px; color: var(--muted); margin-bottom: 3rem; max-width: 700px; margin-left: auto; margin-right: auto; }
.promo-centered .promo-card { text-align: left; margin-bottom: 2.5rem; }

.promo-card {
  background: var(--paper); border: 1px solid var(--rule); border-radius: 16px;
  padding: 10px; box-shadow: 0 16px 48px rgba(31,26,23,0.16);
}
.promo-card img { width: 100%; display: block; border-radius: 10px; }

.promo-highlights {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 2.5rem; margin-top: 2.5rem; padding-top: 2.5rem; border-top: 1px solid var(--rule);
}
.promo-highlight { display: flex; align-items: center; gap: 0.75rem; text-align: left; max-width: 220px; }
.promo-highlight-icon {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%;
  border: 1.5px solid var(--wine); color: var(--wine);
  display: flex; align-items: center; justify-content: center;
}
.promo-highlight-label { font-size: 14px; font-weight: 700; color: var(--ink); line-height: 1.3; }

.promo-tagline {
  text-align: center; font-size: 15px; font-style: italic; font-weight: 700;
  color: var(--wine); margin-top: 2.5rem;
}

@media (max-width: 960px) {
  .promo-split-inner { grid-template-columns: 1fr; }
  .promo-split--reverse .promo-text, .promo-split--reverse .promo-card { order: initial; }
  .promo-heading { font-size: 26px; }
  .promo-centered .promo-heading { font-size: 30px; }
}