/* The original product markup declares this animation but its published CSS
   omitted the definition. Keep the intended image fade without changing layout. */
@keyframes product-fade-in { from { opacity: 0; } to { opacity: 1; } }
.animate-fade-in { animation: product-fade-in 600ms ease-out both; }
/* A padding ratio reserves space even when a mobile browser has not decoded
   the absolutely positioned hero photo yet. */
.pismo-hero-media {
  position: relative;
  aspect-ratio: auto;
  height: 0;
  padding-top: 75%;
}
/* Improve readability inside the original card footprint. */
.pismo-seasonal-feature .pismo-hero-media img {
  object-fit: cover;
  transform: none;
}
.pismo-seasonal-feature > div {
  gap: 0.5rem;
  padding: 1.25rem;
}
.pismo-seasonal-feature > div > span:first-child {
  font-size: 0.8125rem;
  letter-spacing: 0.18em;
  color: #575149;
  font-weight: 600;
}
.pismo-seasonal-feature h2 {
  font-size: 3rem;
  line-height: 1;
  font-weight: 500;
}
.pismo-seasonal-feature p {
  font-size: 1rem;
  line-height: 1.45;
  max-width: none;
  color: #575149;
}
.pismo-seasonal-feature > div > div {
  font-size: 0.9375rem;
  letter-spacing: 0.1em;
  color: #403a33;
}
.pismo-seasonal-feature > div > span:last-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.625rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #403a33;
  text-decoration: underline;
  text-underline-offset: 0.35em;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.1em;
  transition: color 200ms ease;
}
.pismo-seasonal-feature:hover > div > span:last-child,
.pismo-seasonal-feature:focus-visible > div > span:last-child {
  background: transparent;
  color: #24211d;
}
.pismo-seasonal-feature:focus-visible {
  outline: 3px solid #575149;
  outline-offset: 4px;
}
@media (max-width: 767px) {
  .pismo-seasonal-feature > div { padding: 2rem; gap: 0.75rem; }
  .pismo-seasonal-feature h2 { font-size: 2.25rem; }
  .pismo-seasonal-feature > div > span:last-child { width: 100%; }
}
@media (min-width: 768px) {
  .pismo-hero-media {
    height: auto;
    padding-top: 0;
    min-height: 22rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .animate-fade-in { animation-duration: 1ms; }
}
/* Keep the inquiry form in the first screen, with clear labels and compact copy. */
.inquiry-page { max-width: 1080px; margin: 0 auto; padding: 48px 24px 64px; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 64px; align-items: start; }
.inquiry-intro h1 { font-family: 'Cormorant Garamond', serif; font-size: clamp(36px,4vw,56px); font-weight: 500; line-height: 1.05; margin: 0 0 20px; }
.inquiry-intro p { font-size: 18px; line-height: 1.5; margin-bottom: 18px; color: #575149; }
.inquiry-intro .inquiry-response { font-size: 16px; }
.inquiry-intro a { font-size: 16px; text-decoration: underline; text-underline-offset: 4px; }
.inquiry-form { display: grid; gap: 18px; padding: 24px; border: 1px solid #ded8cf; border-radius: 8px; background: #f5f2ec; }
.inquiry-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.inquiry-field { min-width: 0; }
.inquiry-field label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 6px; color: #403a33; }
.inquiry-field input,.inquiry-field textarea { width: 100%; min-width: 0; font: inherit; font-size: 16px; border: 1px solid #c9c1b5; border-radius: 4px; padding: 10px 12px; background: #fffdfa; color: #24211d; }
.inquiry-field input { height: 44px; }
.inquiry-field textarea { min-height: 88px; resize: vertical; }
.inquiry-field input:focus,.inquiry-field textarea:focus { outline: 2px solid #575149; outline-offset: 2px; }
.inquiry-form button { min-height: 46px; padding: 10px 20px; background: #24211d; color: #fff; border-radius: 4px; font-size: 16px; font-weight: 500; }
.inquiry-form button:hover { background: #484137; }
.inquiry-form button:disabled { opacity: .6; cursor: wait; }
@media(max-width:767px) {
 .inquiry-page { grid-template-columns: 1fr; gap: 20px; padding: 24px 20px 40px; }
 .inquiry-intro h1 { margin-bottom: 10px; }
 .inquiry-intro p { font-size: 16px; margin-bottom: 8px; }
 .inquiry-intro a { display: none; }
 .inquiry-form { padding: 16px; gap: 14px; }
 .inquiry-fields { gap: 12px; }
}
.inquiry-intro .inquiry-wholesale {
  font-size: clamp(24px, 2.3vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  color: #24211d;
  margin: 0 0 18px;
}
@media (max-width: 767px) {
  .inquiry-intro .inquiry-wholesale { font-size: 24px; margin-bottom: 10px; }
}