.delivery-calendar { position: absolute; top: 100%; left: 0; z-index: 90; width: min(340px, 100%); padding: 14px; box-sizing: border-box; border: 1px solid #a8936a; background: #fffdf8; box-shadow: 0 12px 30px #2e221933; color: #2e2219; }
.delivery-calendar[hidden] { display: none; }
.delivery-calendar-head { display: flex; align-items: center; gap: 5px; }
.delivery-calendar-head strong { flex: 1; text-align: center; font: 600 17px 'EB Garamond',serif; }
.delivery-calendar button { min-width: 30px; min-height: 34px; border: 1px solid #cbb99b; background: #f0ebe1; color: #2e2219; cursor: pointer; }
.delivery-calendar button:disabled { opacity: .3; cursor: not-allowed; border-color: transparent; background: transparent; }
.delivery-calendar button:focus-visible { outline: 2px solid #846638; outline-offset: 1px; }
.delivery-calendar button[aria-pressed="true"], .delivery-calendar button:not(:disabled):hover { background: #2e2219; color: #fff; }
.delivery-calendar p { font: italic 15px 'EB Garamond',serif; margin: 12px 0; }
.delivery-calendar-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 4px; text-align: center; }
.delivery-calendar-days span { font: 12px/30px Inter,sans-serif; }
#of2-date[readonly] { cursor: pointer; }

.delivery-note { margin: 8px 0 0; font: italic 17px/1.5 'EB Garamond',serif; color: #635139; }

/* Give the middle featured loaf a gold top-choice treatment. */
#menu .menu-grid { isolation: isolate; }
#menu .menu-grid > .menu-card:nth-child(2) {
  z-index: 2;
  transform: translateY(-14px) scale(1.035);
  outline: 2px solid #c6a15a;
  outline-offset: -2px;
  box-shadow: 0 22px 38px rgba(40, 26, 12, .28), 0 4px 12px rgba(40, 26, 12, .16);
  transition: transform .3s ease, box-shadow .3s ease;
}
#menu .menu-grid > .menu-card:nth-child(2):hover {
  transform: translateY(-19px) scale(1.045);
  box-shadow: 0 28px 44px rgba(40, 26, 12, .32), 0 6px 14px rgba(40, 26, 12, .18);
}
#menu .menu-grid > .menu-card:nth-child(2)::after {
  content: '\2605  TOP CHOICE';
  position: absolute;
  z-index: 3;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  padding: 10px 18px;
  background: linear-gradient(120deg, #edd59e, #caa45c);
  border: 1px solid #f5e3ba;
  box-shadow: 0 4px 12px #291a1233;
  color: #392610;
  font: 600 12px/1.4 'EB Garamond', serif;
  letter-spacing: .16em;
  white-space: nowrap;
  pointer-events: none;
}
#menu .menu-grid > .menu-card:nth-child(2) .menu-card-name {
  color: #f3d598;
  text-shadow: 0 2px 5px #22150966;
}
@media (max-width: 900px) {
  #menu .menu-grid > .menu-card:nth-child(2),
  #menu .menu-grid > .menu-card:nth-child(2):hover {
    transform: none;
    margin-block: 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #menu .menu-grid > .menu-card:nth-child(2) { transition: none; }
  #menu .menu-grid > .menu-card:nth-child(2):hover { transform: translateY(-14px) scale(1.035); }
}

.of2-card-img[role="button"] { cursor: pointer; }
.of2-card-img[role="button"]:focus-visible { outline: 2px solid #846638; outline-offset: -4px; }
.bread-details {
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  box-sizing: border-box;
  width: min(440px, 100vw);
  height: 100dvh;
  max-width: 100vw;
  max-height: 100dvh;
  padding: 68px 32px 36px;
  border: 0;
  background: #f0ebe1;
  color: #2e2219;
  overflow-y: auto;
  box-shadow: -12px 0 40px #0003;
}
.bread-details[open] { animation: bread-details-in .24s ease-out; }
.bread-details::backdrop { background: rgba(20, 13, 8, .48); }
.bread-details-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 44px;
  height: 44px;
  border: 1px solid #a8936a;
  background: transparent;
  color: #2e2219;
  font: 30px/1 serif;
  cursor: pointer;
}
.bread-details-close:hover { background: #e4dbcc; }
.bread-details-close:focus-visible { outline: 2px solid #846638; outline-offset: 3px; }
.bread-details-eyebrow { font: 12px/1.5 'EB Garamond',serif; letter-spacing: .18em; text-transform: uppercase; color: #806c49; margin: 0 0 22px; }
.bread-details-photo { height: 260px; background: #e5ddcf; display: grid; place-items: center; margin-bottom: 28px; }
.bread-details-photo img { width: 100%; height: 260px; object-fit: contain; }
.bread-details h2 { font: 500 32px/1.2 'Playfair Display',serif; margin: 0 0 18px; overflow-wrap: anywhere; }
.bread-details-description { font: italic 20px/1.65 'EB Garamond',serif; margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
@keyframes bread-details-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) { .bread-details[open] { animation: none; } }

/* Keep the hero's existing order link as its single centered action. */
.hero-actions .panel-btn-l { display: none !important; }
.hero-actions { justify-content: center; }
.hero-actions .panel-btn-r {
  padding: 16px 34px;
  font-size: 1rem;
  justify-content: center;
}

/* Keep every flavor visible without changing card hover or selection behavior. */
.flavors-row {
  flex-wrap: wrap;
  overflow: visible;
  scroll-snap-type: none;
}

/* Reuse the landing page skillet; only the shared flavor-detail CTA is styled. */
#flavors .flavor-detail .btn-primary {
  position: relative !important;
  display: block !important;
  width: 240px !important;
  height: 160px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 0 18px 16px 58px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font: italic 400 17px/1.4 'EB Garamond', serif !important;
  letter-spacing: 0 !important;
  text-transform: none;
  text-align: center !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 4px #000;
  cursor: pointer;
  isolation: isolate;
  filter: drop-shadow(0 5px 5px rgba(32, 22, 15, .2));
  transition: transform .2s ease, filter .2s ease;
}

#flavors .flavor-detail .btn-primary::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url('/assets/iron-skillet-flour.png') center / contain no-repeat;
  /* Trim the original image's backdrop along the pan and handle silhouette. */
  clip-path: polygon(16% 88%, 19% 82%, 31% 68%, 33% 65%, 31% 56%, 30% 46%, 32% 31%, 36% 21%, 42% 15%, 51% 10%, 61% 9%, 67% 10%, 73% 8%, 79% 11%, 83% 16%, 83% 20%, 87% 30%, 88% 43%, 88% 55%, 85% 67%, 79% 75%, 69% 80%, 59% 82%, 49% 79%, 40% 74%, 36% 75%, 25% 93%, 22% 97%, 18% 97%, 16% 94%);
  filter: brightness(.42);
}

#flavors .flavor-detail .btn-primary::after { content: none !important; }
#flavors .flavor-detail .btn-primary:hover {
  transform: translateY(-3px);
  filter: drop-shadow(0 8px 7px rgba(32, 22, 15, .3));
}
#flavors .flavor-detail .btn-primary:focus-visible {
  outline: 2px solid #846638;
  outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
  #flavors .flavor-detail .btn-primary { transition: none; }
  #flavors .flavor-detail .btn-primary:hover { transform: none; }
}
.order-contact a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}