/* Variante index_2D: mockup Photoshop Livello 1 (pranzo) e Livello 0 (cena). */
.home-index-2d .hd3b-lunch {
  background: #f2efe6;
}

.home-index-2d .hd3b-dinner {
  background: #0b100c;
}

.home-index-2d .hd3b-meal .hd3b-iconic-bg {
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  object-position: right top;
  opacity: 1;
}

/* Tre spazi distinti: testo, fotografia e illustrazione.
   Il 38% destro dei fondali contiene il disegno: scala sempre proporzionale. */
@media (min-width: 981px) {
  .home-index-2d .hd3b-meal {
    min-height: clamp(640px, 39vw, 900px);
    padding-block: clamp(64px, 5vw, 120px);
  }

  .home-index-2d .hd3b-meal .hd3b-iconic-grid {
    width: min(60vw, 1240px);
    margin-left: max(4vw, calc((100vw - 1800px) / 2));
    margin-right: 0;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: clamp(24px, 3vw, 64px);
  }

  .home-index-2d .hd3b-meal .hd3b-feature-media {
    width: 100%;
    min-width: 0;
    justify-self: start;
    transform: none;
  }

  .home-index-2d .hd3b-meal h2 {
    font-size: clamp(40px, 3.7vw, 80px);
  }

  .home-index-2d .hd3b-meal .hd3b-iconic-bg {
    inset: auto 0 0 auto;
    width: 90%;
    height: auto;
    object-fit: contain;
    transform: none;
    mask-image: linear-gradient(to right, transparent, #000 40%),
      linear-gradient(to bottom, transparent, #000 12%);
    mask-composite: intersect;
  }
}

/* Pannello piatto e stacco netto sono gia incorporati nei due fondali. */
.home-index-2d .hd3b-meal .hd3b-iconic-shade,
.home-index-2d .hd3b-meal .hd3b-iconic-wordmark {
  display: none;
}

@media (max-width: 980px) {
  .home-index-2d .hd3b-meal .hd3b-iconic-bg {
    display: none;
  }
}

/* Fondale pranzo esteso: altezza piena, senza dissolvenza superiore.
   Proporzioni originali; la fotografia può sovrapporsi alla volpe. */
@media (min-width: 981px) {
  .home-index-2d .hd3b-lunch .hd3b-iconic-bg {
    inset: 0 0 0 auto;
    width: auto;
    height: 100%;
    aspect-ratio: 1590 / 989;
    object-fit: contain;
    mask-image: linear-gradient(to right, transparent, #000 40%);
    mask-composite: add;
  }
}

/* Pranzo e cena condividono padding e tipografia delle regole .hd3b-meal. */
