/* Shared customer flow; vendor templates retain their photos and typography. */
body.themed .landing-nav {
  color: var(--storefront-text, #111827);
  background: var(--storefront-background, #fff);
}
body.themed .landing-nav a,
body.themed .landing-nav-links a {
  color: var(--storefront-text, #111827);
  opacity: 1;
}
body.themed .landing-nav-links a { font-size: 0.875rem; }
body.themed .landing-hero[data-hero="split"] {
  min-height: 320px;
  padding: 0;
}
body.themed .landing-hero[data-hero="split"] .hero-photo { min-height: 320px; }
body.themed .landing-hero[data-hero="split"] .hero-content {
  padding: 2rem;
  border: 0;
  max-width: none;
}
body.themed .landing-hero[data-hero="classic"] { min-height: 320px; }
body.themed .landing-hero .hero-cta {
  align-self: flex-start;
  min-height: 44px;
  padding: 0.85rem 1.5rem;
  width: auto;
}
body.themed #items-section {
  max-width: 1120px;
  margin: 0 auto;
  padding: 2.5rem 1.5rem;
  color: var(--storefront-text, #111827);
  scroll-margin-top: 80px;
}
body.themed #items-section .landing-items-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 1rem;
}
body.themed #items-section h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--storefront-text, #111827);
  opacity: 1;
  letter-spacing: 0;
  text-transform: none;
}
body.themed #items-section .item-count,
body.themed #items-section .landing-cat-btn,
body.themed #items-section .landing-browse-toggle {
  color: var(--storefront-text, #111827);
  opacity: 1;
  font-size: 0.875rem;
}
body.themed #items-section .landing-browse-toggle {
  margin-left: auto;
  padding: 0.5rem 0;
  min-height: 44px;
  border: 0;
  background: transparent;
  text-transform: none;
  text-decoration: underline;
  text-underline-offset: 4px;
  letter-spacing: 0;
}
body.themed #items-section .landing-category-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.25rem 0;
}
body.themed #items-section .landing-cat-btn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  text-transform: none;
  letter-spacing: 0;
}
body.themed #items-section .landing-cat-btn.active {
  font-weight: 700;
  border-bottom: 2px solid currentColor;
}
body.themed #items-section .landing-items-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 1.5rem;
}
body.themed #items-section .landing-item-card {
  color: var(--storefront-card-text, #111827);
  background: var(--storefront-card-background, #fff);
}
body.themed #items-section .landing-item-card-body { padding: 1.25rem; min-width: 0; }
body.themed #items-section .landing-item-card-img {
  width: 100%;
  height: 280px;
  object-fit: contain;
  background: var(--storefront-card-background, #fff);
}
body.themed #items-section .landing-item-card-name {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.4;
  text-transform: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
body.themed #items-section .landing-item-card-price,
body.themed #items-section .landing-item-card-desc,
body.themed #items-section .landing-item-card-category,
body.themed #items-section .landing-item-card .landing-item-card-meta-row,
body.themed #items-section .landing-item-card .landing-item-chip,
body.themed #items-section .landing-item-card .landing-item-card-vendor {
  color: var(--storefront-card-text, #111827);
  opacity: 1;
}
body.themed #items-section .landing-item-card-price { font-size: 1rem; }
body.themed #items-section .landing-item-card-desc { font-size: 0.9rem; line-height: 1.5; }
body.themed #items-section .landing-add-cart-btn {
  min-height: 44px;
  color: var(--storefront-button-text, #fff);
  background: var(--storefront-primary, #285943);
  opacity: 1;
  font-size: 0.9rem;
  font-weight: 600;
}
body.themed #items-section .landing-add-cart-btn:hover { filter: brightness(0.9); }
body.themed .landing-about h2,
body.themed .landing-about-text,
body.themed .landing-contact-info,
body.themed .landing-contact-info a,
body.themed .landing-social-links a,
body.themed .story-timeline-content h2,
body.themed .story-timeline-content p,
body.themed .landing-faq h2,
body.themed .faq-question,
body.themed .faq-answer,
body.themed .specialties-section h2,
body.themed .specialty-chip {
  color: var(--storefront-text, #111827);
  opacity: 1;
}
body.themed .landing-about-text,
body.themed .story-timeline-content p { max-width: 65ch; font-size: 1rem; line-height: 1.7; }
body.themed .landing-contact-info { font-size: 1rem; }
body.themed .landing-contact-info a { display: inline-block; padding: 0.65rem 0; }
body.themed :is(a, button, input, select):focus-visible {
  outline: 3px solid var(--storefront-text, #111827);
  outline-offset: 4px;
}
body.themed .lb-title { text-transform: none; letter-spacing: 0; line-height: 1.3; }
@media (max-width: 780px) {
  body.themed .landing-hero[data-hero="split"] .hero-photo { min-height: 180px; }
  body.themed .landing-hero[data-hero="split"] .hero-content { padding: 1.5rem; }
}
@media (max-width: 600px) {
  body.themed #items-section { padding: 1.5rem 1rem; }
  body.themed #items-section .landing-items-grid { grid-template-columns: 1fr; }
  body.themed #items-section .landing-browse-toggle { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.themed #vendor-content * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

body.themed #hero-section .hero-cta {
  background: var(--storefront-primary, #285943);
  color: var(--storefront-button-text, #fff);
}
body.themed #hero-section .hero-location {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  color: var(--hero-text, var(--storefront-text, #111827));
}
@media (min-width: 781px) {
  body.themed .lb-info { flex-basis: 50%; max-width: 600px; }
}
/* Closed drawers and forms must not remain in the keyboard tab order. */
body.themed .landing-cart-sidebar:not(.open),
body.themed .landing-modal-overlay:not(.open) { visibility: hidden; }
body.themed .landing-cart-sidebar.open,
body.themed .landing-modal-overlay.open { visibility: visible; }

/* Keep supporting content on the catalog's desktop alignment, with readable
   text columns instead of a narrow strip floating in a wide empty page. */
body.themed :is(#about-section, #story-section, #specialties-section, #faq-section, #related-section) {
  box-sizing: border-box;
  max-width: 1120px;
  width: 100%;
  margin: 0 auto;
  padding: 2.5rem 1.5rem;
  border-left: 0;
  scroll-margin-top: 80px;
}
body.themed :is(#about-section, #faq-section) {
  grid-template-columns: minmax(180px, 1fr) minmax(0, 3fr);
  gap: 2rem;
  border-top: 1px solid var(--landing-border, #ddd);
}
body.themed :is(#about-section, #faq-section)[style*="display: block"] { display: grid !important; }
body.themed :is(#about-section, #faq-section) > h2 {
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.35;
  text-transform: none;
  letter-spacing: 0;
  border: 0;
}
body.themed #about-section .landing-about-layout { width: 100%; margin: 0; }
body.themed #about-section .landing-about-text { margin: 1rem 0; }
body.themed #about-section .landing-contact-info { display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; }
body.themed #about-section .landing-contact-info > div { margin: 0; }
body.themed #story-container {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
}
body.themed #story-container .story-timeline-item { margin: 0; padding: 0; }
body.themed #story-container .story-timeline-marker { display: none; }
body.themed #story-container .story-timeline-content { margin: 0; padding: 0; }
body.themed #story-container h2 { margin: 0 0 0.75rem; font-size: 1.4rem; }
body.themed #faq-container .faq-question { font-size: 1rem; font-weight: 600; line-height: 1.5; }
body.themed #faq-container .faq-answer { font-size: 1rem; line-height: 1.7; }
body.themed #related-section .landing-inner { max-width: none; padding: 0; }
@media (max-width: 780px) {
  body.themed :is(#about-section, #faq-section) { grid-template-columns: 1fr; gap: 1.25rem; }
  body.themed #story-container { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  body.themed :is(#about-section, #story-section, #specialties-section, #faq-section, #related-section) { padding: 1.5rem 1rem; }
}