/* Page-specific styles — Bar (generic landing page) @ Le Braz. Everything
   this page uses (header/nav, hero, trust strip, concept grid, gallery,
   CTA banner, footer, rating block, testimonials, price list, feature card
   grid) is generic and lives in /shared/css/layout.css and
   /shared/css/base.css. The only page-specific need: the "À découvrir"
   cross-link section has 2 cards, not the usual 3, so it gets its own
   column count instead of stretching to a 3-column grid with a gap. */

#a-decouvrir .feature-grid {
  grid-template-columns: repeat(2, 1fr);
  max-width: 44rem;
  margin-inline: auto;
}

@media (max-width: 720px) {
  #a-decouvrir .feature-grid { grid-template-columns: 1fr; }
}

/* The shared hero-float-card (shared/css/layout.css) is sized for a
   photo/logo avatar; on this page's hero it reads oversized next to the
   background image, so scale it down here rather than in the shared rule
   (other pages may still want the default size). */
.hero .hero-float-card {
  gap: var(--space-3);
  padding: var(--space-2) var(--space-4) var(--space-2) var(--space-2);
}

.hero .hero-float-card .hero-float-icon {
  width: 2.5rem;
  height: 2.5rem;
}
.hero .hero-float-card .hero-float-icon svg {
  width: 18px;
  height: 18px;
}

.hero .hero-float-card .value {
  font-size: var(--text-xs);
}
.hero .hero-float-card .label {
  font-size: var(--text-2xs);
  max-width: 8rem;
}

/* ---------- Carte preview → /menu/ ---------- */
.menu-preview-card {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out);
}
.menu-preview-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: rgb(218 149 2 / 0.4);
}
.menu-preview-hint {
  display: block;
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px dashed var(--color-border);
  text-align: center;
  font-weight: var(--fw-bold);
  color: var(--color-brand-light);
}

.menu-cta-row { margin-top: var(--space-6); text-align: center; }