/* FrolliAMOci — I nostri menu (v1.36) — Lomazzi Federico (c) 2026 */
.mns { display: flex; flex-direction: column; gap: var(--space-4); max-width: 1080px; margin: 0 auto; }
.mns-head { display: grid; gap: 4px; }
.mns-head__kicker { font-size: var(--fs-xs); font-weight: var(--fw-heavy); letter-spacing: .1em; text-transform: uppercase; color: var(--color-accent-strong); }
.mns-head__title { font-size: clamp(2rem, 1.3rem + 3.6vw, 3.4rem); font-weight: var(--fw-heavy); line-height: .98; letter-spacing: -.02em; }
.mns-head__sub { color: var(--color-text-muted); font-weight: var(--fw-bold); }
.mns-grid { display: grid; gap: var(--space-4); margin: 0; padding: 0; list-style: none; }
.mns-card { display: grid; overflow: hidden; border-radius: var(--radius-xl); background: var(--color-surface); box-shadow: var(--shadow-card); color: inherit; text-decoration: none;
    transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) ease; }
.mns-card:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.mns-card__media { position: relative; display: block; aspect-ratio: 16 / 9; background: var(--tint-caramel); }
.mns-card__img { width: 100%; height: 100%; object-fit: cover; }
.mns-card__price { position: absolute; left: 12px; bottom: 12px; padding: 6px 14px; border-radius: var(--radius-pill); background: var(--color-accent); color: #fff; font-weight: var(--fw-heavy); font-size: var(--fs-lg); }
.mns-card__body { display: grid; gap: 4px; padding: var(--space-4); }
.mns-card__name { font-size: var(--fs-xl); font-weight: var(--fw-heavy); line-height: 1.1; }
.mns-card__inc { color: var(--color-text-muted); font-size: var(--fs-sm); }
.mns-card__go { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: var(--fw-heavy); color: var(--color-primary); }
.mns-empty { display: grid; justify-items: center; gap: var(--space-3); padding: var(--space-7); border-radius: var(--radius-xl); background: var(--color-surface); text-align: center; }
@media (hover: hover) { .mns-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-raised); } }
@media (min-width: 768px) {
    .mns-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mns-grid > li:first-child { grid-column: span 2; grid-row: span 2; }
    .mns-card--big { height: 100%; grid-template-rows: 1fr auto; }
    .mns-card--big .mns-card__media { aspect-ratio: auto; min-height: 280px; }
    .mns-card--big .mns-card__name { font-size: var(--fs-2xl); }
}
