/* Menu - final consistency pass. Loaded ONLY by menu.php, after menu.css, typography.css and page-consistency.css.
   Preserved on purpose: category artwork, card composition (container-query units), product data, search, filters, open/close.
   Changed: (1) content edges match the shared page shell, (2) one restrained interaction on the six cards (single diagonal sheen,
   arrow nudge, tiny lift; no looping light), (3) calmer resting glow, (4) price chips less bubble-like. */

/* ---- (1) the cards, search and catalog share the introduction's container edges ---- */
.page-menu .container { width: var(--pc-wrap); }
.page-menu { padding-top: 0; }

/* the slogan sign is part of the introduction row now, not an absolutely positioned poster element */
.pc-hero .pm-sign {
  position: relative;
  left: auto;
  top: auto;
  width: clamp(250px, 19vw, 320px);
  margin: 0 4px 0 0;
  flex: 0 0 auto;
  transform: rotate(-4deg);
  transform-origin: right bottom;
}

.pc-hero .pm-sign__text { font-size: clamp(30px, 2.1vw, 38px); }

@media (max-width: 700px) {
  .pc-hero .pm-sign { display: none; }
}

/* ---- (2) six category cards: one shared hover / keyboard-focus language ---- */
.pm-card::after {
  content: "";
  position: absolute;
  inset: 8cqw 0 0 0;
  z-index: 1;
  border-radius: 6cqw;
  pointer-events: none;
  background: linear-gradient(104deg, transparent 38%, rgba(255, 255, 255, 0.06) 45%, rgba(255, 150, 160, 0.2) 50%, rgba(255, 255, 255, 0.05) 55%, transparent 62%) no-repeat;
  background-size: 280% 100%;
  background-position: 135% 0;
  opacity: 0;
}

@keyframes pm-sheen {
  0% { opacity: 1; background-position: 135% 0; }
  100% { opacity: 1; background-position: -35% 0; }
}

@media (hover: hover) {
  .pm-card:hover::after { animation: pm-sheen 700ms cubic-bezier(0.45, 0.05, 0.25, 1) 1 both; }
}
.page-menu .pm-card:focus-visible::after { animation: pm-sheen 700ms cubic-bezier(0.45, 0.05, 0.25, 1) 1 both; }

/* keyboard focus must be as clear as hover: stable bright edge (the legacy rule removed the outline and relied on the ring alone) */
.page-menu .pm-card:focus-visible .pm-card__glass::after { filter: drop-shadow(0 0 1.2cqw rgba(255, 70, 85, 0.9)); }
.page-menu .pm-card:focus-visible { transform: translateY(-0.7cqw); }

.pm-card__go svg { transition: transform 0.3s var(--pm-ease); }
.pm-card:hover .pm-card__go svg,
.page-menu .pm-card:focus-visible .pm-card__go svg { transform: translateX(3px); }

/* ---- (3) calmer resting state; the open/selected card keeps a stable brighter edge (no pulsing: the one-shot icon flash stays) ---- */
.pm-card__glass::before { box-shadow: 0 1.6cqw 4cqw rgba(0, 0, 0, 0.55), 0 0 3cqw rgba(255, 16, 37, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 0 6cqw rgba(0, 0, 0, 0.45); }
.pm-card__glass::after { filter: drop-shadow(0 0 0.6cqw rgba(255, 16, 37, 0.4)); }
.pm-card.is-on .pm-card__ring { opacity: 0.7; }
.pm-card.is-on .pm-card__glass::after { filter: drop-shadow(0 0 1cqw rgba(255, 40, 55, 0.85)); }

/* ---- card typography: one title size, one description size for all six ---- */
.pm-card em { font-size: 3.45cqw; line-height: 1.32; }

/* ---- (4) catalog: restrained price chip (700 max, no heavy bloom), same row geometry everywhere ---- */
.pm-price { box-shadow: inset 0 0 8px rgba(255, 16, 37, 0.06); background: rgba(255, 16, 37, 0.06); }
.pm-price b { text-shadow: 0 0 8px rgba(255, 16, 37, 0.35); }
.pm-prod:hover .pm-price { box-shadow: inset 0 0 10px rgba(255, 16, 37, 0.1), 0 0 10px rgba(255, 16, 37, 0.18); }
.pm-prod:focus-within { background: linear-gradient(90deg, rgba(255, 16, 37, 0.08), rgba(255, 16, 37, 0) 85%); }

@media (prefers-reduced-motion: reduce) {
  .pm-card::after { animation: none; opacity: 0; }
  .pm-card:hover, .page-menu .pm-card:focus-visible { transform: none; }
  .pm-card:hover .pm-card__art { transform: none; }
  .pm-card:hover .pm-card__go svg, .page-menu .pm-card:focus-visible .pm-card__go svg { transform: none; }
}

/* ---- spacing: no dead bands between the introduction, the cards, the search field, the open product panel and the footer ---- */
.page-menu { padding-bottom: 22px; min-height: 0; }
.page-menu .pc-hero { padding-bottom: clamp(8px, 1.1vw, 14px); }
.page-menu .pm-cards { padding-top: 10px; padding-bottom: 6px; }
.page-menu .pm-find { padding-top: 22px; padding-bottom: 8px; }
.page-menu .pm-open { padding-top: 2px; }
@media (max-width: 860px) {
  .page-menu .pm-cards { padding-top: 6px; }
  .page-menu .pm-find { padding-top: 8px; padding-bottom: 2px; }
}

/* Champagne & Sparkling Wine: the longer section name wraps to two centred lines; description and arrow move down to make room */
.pm-card.pm-card--champagne strong { white-space: normal; text-wrap: balance; font-size: 3.9cqw; line-height: 1.04; top: 25.6cqw; }
.pm-card.pm-card--champagne em { top: 38.4cqw; font-size: 3.1cqw; }
.pm-card.pm-card--champagne .pm-card__go { top: 50.2cqw; }
