/* Versione "foto dei marchi": stili aggiuntivi, caricati solo in questa versione. */

/* Apertura della home a tutta foto, con il logo animato nel medaglione */
.hero-foto { position: relative; color: #fff; background: #2a2420 var(--foto) 12% center / cover no-repeat; min-height: min(66vh, 640px); display: flex; align-items: center; overflow: hidden; overflow: clip; }
.hero-foto::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(28, 24, 21, .82) 0%, rgba(28, 24, 21, .55) 42%, rgba(28, 24, 21, 0) 75%); }
.hero-foto-in { position: relative; padding-block: 48px; }
.hero-foto h1 { max-width: 18ch; margin-bottom: 18px; text-shadow: 0 2px 18px rgba(0, 0, 0, .25); }
.hero-foto p { max-width: 46ch; font-size: 1.12rem; color: #f3ede5; }
.hero-foto .occhiello { color: #fff; }
.medaglione-hero { width: clamp(120px, 12vw, 180px); height: clamp(120px, 12vw, 180px); margin-bottom: 18px; }
.medaglione-hero .logo-anim { width: 80%; }
.hero-foto .credito { position: absolute; right: 16px; bottom: 12px; font-size: .75rem; color: rgba(255, 255, 255, .75); }
@media (max-width: 760px) {
  .hero-foto { background-position: 56% center; min-height: 0; }
  .hero-foto::before { background: linear-gradient(180deg, rgba(28, 24, 21, .35) 0%, rgba(28, 24, 21, .85) 70%); }
  .hero-foto-in { padding-block: 40px 56px; }
}

/* Schede dei marchi con foto */
.marchio-card .marchio-foto { display: block; margin: -28px -26px 18px; width: calc(100% + 52px); aspect-ratio: 4 / 3; object-fit: cover; }
.marchio-card:hover .marchio-foto { filter: saturate(1.08); }

/* Mosaico "L'Italia, a modo tuo" */
.mosaico { display: grid; grid-template-columns: 1.6fr 1fr 1fr; grid-auto-rows: 230px; gap: 12px; margin-top: 32px; }
.mosaico figure { position: relative; margin: 0; border-radius: var(--raggio); overflow: hidden; background: var(--segnaposto); }
.mosaico figure:first-child { grid-row: span 2; }
.mosaico img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.mosaico figure:hover img { transform: scale(1.04); }
.mosaico figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 16px 12px; background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .65)); color: #fff; display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; }
.mosaico figcaption strong { font: 700 1.35rem/1 var(--titoli); text-transform: uppercase; letter-spacing: .03em; }
.mosaico figcaption small { font-size: .78rem; opacity: .8; }
@media (max-width: 760px) {
  .mosaico { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
  .mosaico figure:first-child { grid-column: span 2; grid-row: span 1; }
}

/* Foto dei marchi nelle aperture di pagina: niente ritaglio speciale */
.hero-marchio-pagina .hero-marchio-foto.foto-marchio img { transform: none; object-position: center; }
.hero-marchio-pagina .hero-marchio-foto.foto-marchio { aspect-ratio: 4 / 3; }

/* Apertura col cane: foto indicata qui, col percorso relativo a questo file */
.hero-cane { background-image: url("foto/cane-scritta-dolomiti.jpg"); background-size: cover; background-repeat: no-repeat; background-position: 45% 75%; }