/* Layouts for the photo gallery, accommodation and wine catalogue. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.inner-page main { padding-top: 8rem; }
.inner-page h1 { font-size: clamp(3rem, 6vw, 6rem); margin-bottom: 1.5rem; }
.inner-page .footer-main { grid-template-columns: 1.2fr .8fr 1fr; }
.inner-page a:focus-visible, .inner-page button:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.placeholder-photo { display: block; width: 100%; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: var(--radius); background: var(--paper-deep); overflow: hidden; cursor: zoom-in; }
.placeholder-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.placeholder-photo:hover img { transform: scale(1.025); }
/* Exactly two staggered columns at every viewport width. */
.photo-wall { --photo-stagger: clamp(12px, 2.5vw, 40px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(.5rem, 1.5vw, 1.5rem); padding-bottom: calc(3rem + var(--photo-stagger)); }
.photo-wall .placeholder-photo { aspect-ratio: 12 / 11; }
.photo-wall .placeholder-photo:nth-child(even) { transform: translateY(var(--photo-stagger)); }
.photo-footer { padding: 1.5rem; text-align: center; font-family: var(--serif); font-size: 1.1rem; }
.stay { padding-bottom: var(--section); }
.stay-heading { display: flex; justify-content: space-between; align-items: center; gap: 2rem; margin-bottom: 2.5rem; }
.stay-heading h1 { font-size: clamp(2.8rem, 4.5vw, 4.8rem); line-height: 1.05; }
.stay-address { margin: 0; color: var(--muted); font-size: .9rem; }
.stay-heading > .button { flex-shrink: 0; }
.stay-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(240px, 1fr); gap: 1.2rem; align-items: start; }
.stay-mosaic { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: .6rem; aspect-ratio: 2 / 1; }
.stay-mosaic .placeholder-photo { border-radius: .65rem; min-height: 0; }
.stay-main-photo { grid-row: span 2; }
.stay-thumbnails { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .6rem; margin-top: .6rem; }
.stay-thumbnails .placeholder-photo { aspect-ratio: 4 / 3; border-radius: .5rem; }
.stay-summary { padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.35); }
.stay-summary h2 { font-size: 2.1rem; line-height: 1.1; }
.stay-summary > p:not(.eyebrow) { margin-top: 1.2rem; color: var(--muted); font-size: .86rem; }
.stay-summary .button { width: 100%; margin-top: .6rem; }
.stay-summary-address { margin-top: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.stay-summary-address span { color: var(--red); font-size: .65rem; text-transform: uppercase; letter-spacing: .12em; }
.stay-summary-address p { margin: .5rem 0 0; font-size: .85rem; }
.stay-details { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: clamp(2rem, 7vw, 7rem); margin-top: 3.5rem; padding-top: 3rem; border-top: 1px solid var(--line); }
.stay-details h2 { font-size: clamp(2.2rem, 3.5vw, 3.8rem); line-height: 1.05; }
.stay-details p:not(.eyebrow) { max-width: 42rem; margin: 1.5rem 0 0; color: var(--muted); font-size: .95rem; }
.stay-location address { margin-top: 1.5rem; font-style: normal; color: var(--muted); }
.wine-section { padding-bottom: var(--section); }
.wine-heading { text-align: center; padding-block: 2rem 4rem; }
.wine-heading > p:last-child { color: var(--muted); font-size: .9rem; }
.wine-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 3rem); row-gap: clamp(3rem, 6vw, 6rem); }
.wine-card { display: grid; grid-template-columns: minmax(65px, .65fr) minmax(0, 1.35fr); align-items: center; gap: clamp(1rem, 2vw, 2rem); }
.wine-card > img { width: 100%; height: auto; aspect-ratio: 6 / 17; object-fit: contain; background: var(--paper-deep); }
.wine-number { color: var(--red); font-size: .64rem; letter-spacing: .15em; margin-bottom: .85rem; }
.wine-copy h3 { font-family: var(--serif); font-weight: 500; font-size: clamp(1.7rem, 2.5vw, 2.8rem); line-height: 1.08; margin-bottom: 1.2rem; }
.wine-copy > p:not(.wine-number) { color: var(--muted); font-size: .78rem; line-height: 1.7; }
.wine-copy > p:last-child { margin-bottom: 0; font-style: italic; }
@media (max-width: 1100px) {
  .stay-layout { grid-template-columns: minmax(0, 2.5fr) minmax(230px, 1fr); }
  .wine-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .inner-page main { padding-top: 7rem; }
  .inner-page .footer-main { grid-template-columns: 1fr 1fr; }
  .stay-heading { gap: 1rem; }
  .stay-layout { grid-template-columns: minmax(0, 1fr); }
  .stay-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 2rem; }
  .stay-summary > .eyebrow, .stay-summary > h2 { grid-column: 1 / -1; }
  .stay-summary .button { align-self: center; }
  .stay-summary-address { grid-column: 1 / -1; margin-top: 1rem; }
  .stay-details { gap: 2rem; }
}
@media (max-width: 620px) {
  .inner-page main { padding-top: 6.3rem; }
  .photo-wall .placeholder-photo { border-radius: .6rem; }
  .stay-heading { display: block; margin-bottom: 1.5rem; }
  .stay-heading .button { margin-top: 1.5rem; }
  .stay-mosaic, .stay-thumbnails { gap: .3rem; }
  .stay-thumbnails { margin-top: .3rem; }
  .stay-summary { display: block; padding: 1.3rem; }
  .stay-details { grid-template-columns: minmax(0, 1fr); }
  .wine-heading { text-align: left; padding-block: 1rem 2.5rem; }
  .wine-grid { grid-template-columns: minmax(0, 1fr); row-gap: 2.5rem; }
  .wine-card { grid-template-columns: minmax(65px, .6fr) minmax(0, 1.4fr); gap: 1.5rem; }
  .wine-copy h3 { font-family: var(--serif); font-weight: 500; font-size: 2rem; }
  .inner-page .footer-main { grid-template-columns: 1fr; }
}
.wine-cover { width: 100%; height: clamp(15rem, 34vw, 32rem); object-fit: cover; border-radius: var(--radius); margin: 0 0 clamp(3rem, 7vw, 6rem); }

/* Storia: apertura editoriale, capitoli e ritratto della squadra. */
.story-opening { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; padding-block: 2rem 4rem; }
.story-heading h1 { font-size: clamp(3rem, 5.4vw, 6rem); line-height: 1.08; }
.story-heading > p:last-child { max-width: 26rem; color: var(--muted); }
.story-portrait { position: relative; padding-bottom: 1.5rem; }
.story-portrait img { width: 100%; height: auto; border-radius: var(--radius); }
.story-seal { position: absolute; bottom: 0; left: -1.5rem; display: grid; padding: 1.5rem 2rem; background: var(--red); color: var(--paper); border-radius: var(--radius); font: 4rem/1 var(--serif); }
.story-seal small { margin-top: .6rem; font: .65rem/1.5 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.story-chapter { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 7vw, 7rem); padding-block: clamp(3rem, 6vw, 6rem); border-top: 1px solid var(--line); }
.story-chapter h2, .staff-heading h2, .story-invitation h2 { font-size: clamp(2.5rem, 4.5vw, 5rem); line-height: 1.08; }
.story-prose p, .staff-copy p { line-height: 1.9; color: var(--muted); }
.story-prose p:last-child, .staff-copy p:last-child { margin-bottom: 0; }
.story-wide img { width: 100%; height: auto; aspect-ratio: 2; object-fit: cover; border-radius: var(--radius); }
.story-staff { background: var(--ink); color: var(--paper); padding-block: var(--section); }
.staff-heading { margin-bottom: 3rem; }
.staff-heading h2 { color: var(--paper); }
.staff-heading em { color: var(--gold); }
.staff-heading > p:last-child { margin-top: 1.5rem; color: rgba(255,255,255,.7); }
.staff-layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.staff-photo img, .staff-details img { width: 100%; height: auto; border-radius: var(--radius); }
.staff-copy h3 { color: var(--paper); font-size: clamp(2rem, 3vw, 3rem); margin-bottom: 1.5rem; }
.staff-copy p { color: rgba(255,255,255,.7); }
.staff-details { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(.75rem, 2vw, 2rem); margin-top: 3rem; }
.story-invitation { text-align: center; padding-block: var(--section); }
.story-invitation > p:not(.eyebrow) { color: var(--muted); margin-block: 1.5rem 2rem; }
@media (max-width: 820px) {
 .story-opening, .story-chapter, .staff-layout { grid-template-columns: minmax(0, 1fr); }
 .story-opening { padding-top: 1rem; }
 .story-portrait { padding-left: 1rem; }
 .story-portrait img { max-height: 36rem; object-fit: cover; }
 .story-seal { left: 0; }
 .story-heading h1 { font-size: clamp(2.7rem, 8vw, 4.5rem); }
 .story-wide img { aspect-ratio: 4 / 3; }
}
.story-pizza { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-bottom: var(--section); }
.story-pizza img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius); }
.story-pizza h2 { font-size: clamp(2.5rem, 4vw, 4.5rem); }
.story-pizza p:not(.eyebrow) { color: var(--muted); margin-block: 1.5rem; }
.wine-card > img { height: 23rem; aspect-ratio: auto; background: transparent; object-fit: contain; }
.wine-card { grid-template-columns: minmax(65px,.7fr) minmax(0,1.3fr); }
.wine-number { overflow-wrap: anywhere; }
.wine-copy > p:last-child { font-style: normal; }
.wine-copy .wine-appellation { font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; color: var(--red); }
.wine-photo-pending { min-height: 15rem; display: grid; place-items: center; border: 1px solid var(--line); border-radius: var(--radius); color: var(--muted); text-align: center; font-size: .7rem; }
.wine-heading > p:last-child { max-width: 40rem; margin-inline: auto; }
@media(max-width:820px) { .story-pizza { grid-template-columns: minmax(0,1fr); } }
@media(max-width:620px) { .wine-card > img { height: 18rem; } .wine-copy h3 { font-family: var(--serif); font-weight: 500; font-size: 1.7rem; } }

/* Cuisine and wood-fired pizza photo chapters. */
.story-food { padding: clamp(3rem, 6vw, 6rem) 0; background: #191815; color: var(--paper); }
.story-food-pizza { background: var(--ink-soft); }
.story-food .story-chapter { padding-top: 0; border: 0; }
.story-food .story-prose p, .story-food-heading > p:not(.eyebrow) { color: #cbc6bc; }
.story-food-heading { max-width: 58rem; margin-bottom: 2.8rem; }
.story-food-heading h2 { font-size: clamp(2.4rem, 4.5vw, 5rem); line-height: 1.1; }
.story-food-heading > p:not(.eyebrow) { max-width: 44rem; line-height: 1.8; margin-block: 1.5rem; }
.story-food .dish-track img { flex: 0 0 calc((100% - clamp(.7rem, 2vw, 1.8rem) * 3) / 4); width: calc((100% - clamp(.7rem, 2vw, 1.8rem) * 3) / 4); aspect-ratio: 1; }
.story-food h2 em { color: var(--gold); }
.story-food .photo-controls button { color: var(--paper); background: transparent; }
.story-food .photo-controls button[aria-pressed="true"] { color: var(--gold); }
.story-food .photo-controls .photo-pause { color: var(--paper); background: transparent; }
@media (max-width: 1100px) {
 .story-food .dish-track img { flex-basis: calc((100% - clamp(.7rem, 2vw, 1.8rem)) / 2); width: calc((100% - clamp(.7rem, 2vw, 1.8rem)) / 2); }
}

.gallery-page { background: var(--ink-soft); color: var(--paper); }

.wine-category { padding-block: clamp(2.5rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.wine-category > h2 { text-align: center; color: var(--muted); font-size: clamp(2rem, 4vw, 3.8rem); margin: 0 0 clamp(2.5rem, 6vw, 5rem); }
.wine-card > img { mix-blend-mode: multiply; }