/* Cream dedicated pages: /menu /about /contact */

.cream-page {
  background: var(--cream);
  min-height: 100vh;
  color: #111;
}

.cream-page .page {
  position: relative;
  min-height: 100vh;
  padding: 96px var(--pad-x) 56px;
  display: flex;
  flex-direction: column;
}

/* Cream menu tiles: solid cream family (not frosted mountain) */
.cream-page .sauce-grid .tile {
  background: #faf8f4;
  border: 1px solid rgba(17,17,17,0.06);
  backdrop-filter: none;
}
@media (hover: hover) {
  .cream-page .sauce-grid .tile:hover {
  background: #fffdf9;
  border-color: rgba(17,17,17,0.18);
  box-shadow: 0 6px 18px rgba(17,17,17,0.05);
}
}
.cream-page .tile:nth-child(1) .tile-art { background: #e8e2d6; }
.cream-page .tile:nth-child(2) .tile-art { background: #e4ddd0; }
.cream-page .tile:nth-child(3) .tile-art { background: #ddd6c8; }
.cream-page .tile:nth-child(4) .tile-art { background: #e6e0d4; }
.cream-page .tile:nth-child(5) .tile-art { background: #e2dbcf; }
.cream-page .tile-art {
  height: 265px;
  background: #e8e2d6;
}
.cream-page .section-header {
  border-bottom-color: rgba(17,17,17,0.10);
}

/* About cream */
.about-cream .layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 44px;
  align-items: start;
}
.about-cream .section-header { justify-content: center; }
.about-cream .section-title { text-align: center; width: 100%; }
.photo-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.photo-stack .hero-frame {
  background: #ebe6dc;
  border: 1px solid rgba(17,17,17,0.05);
  min-height: 360px;
}
.photo-stack .hero-frame img { min-height: 360px; }
.secondary-strip {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.secondary-strip .shot {
  border-radius: 3px;
  overflow: hidden;
  background: #ebe6dc;
  border: 1px solid rgba(17,17,17,0.05);
  aspect-ratio: 4 / 3;
}
.secondary-strip .shot img {
  width: 100%; height: 100%;
  object-fit: cover;
}

/* Contact cream */
.contact-cream .contact-list {
  background: transparent;
  backdrop-filter: none;
  border: none;
  border-top: 1px solid rgba(17,17,17,0.10);
  border-radius: 0;
}
.contact-cream .contact-item {
  border-bottom: 1px solid rgba(17,17,17,0.10);
  padding: 36px 28px;
}
.contact-cream .contact-item:nth-child(even) {
  border-left: 1px solid rgba(17,17,17,0.08);
}

@media (max-width: 720px) {
  .cream-page .page { padding: 72px 16px 40px; }
  .cream-page .tile-art { height: 110px; width: 96px; }
  .about-cream .layout { grid-template-columns: 1fr; }
  .photo-stack .hero-frame,
  .photo-stack .hero-frame img { min-height: 240px; }
  .contact-cream .contact-item:nth-child(even) { border-left: none; }
}
