/* Opt-in section presentation leaves the existing templates unchanged. */
.reference-site .ref-dishes { justify-content: flex-start; justify-content: safe var(--ref-photos-alignment,flex-start); }
.reference-site .ref-photo-cards { grid-template-columns: repeat(var(--ref-card-columns,2),minmax(0,1fr)); }
.ref-photo-card { min-width: 0; display: grid; }
.reference-site .ref-photo-card-link { color: inherit; text-decoration: none; }
.reference-site .ref-photo-card-link:hover { text-decoration: none; }
.ref-photo-card-link:focus-visible { outline: 3px solid var(--ref-primary); outline-offset: 4px; }
.ref-photo-frame { --ref-photo-focus: var(--ref-photo-focus-desktop,50% 50%); }
.ref-photo-frame>img { object-position: var(--ref-photo-focus); }
.reference-site .ref-category .ref-dish-image.ref-photo-frame { width:100%; margin-inline:0; }
.reference-site .ref-category .ref-dish-image>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ref-section-copy { min-width: 0; overflow-wrap: anywhere; }
.reference-site :is(.ref-section-copy,.ref-overlay-copy).ref-text-aligned { text-align: var(--ref-copy-align); }
.reference-site .ref-section-copy.ref-text-aligned>.ref-section-heading { justify-content: var(--ref-copy-justify); text-align: inherit; }
.reference-site .ref-section-copy.ref-text-aligned .ref-intro,
.reference-site .ref-hero .ref-hero-content.ref-text-aligned>:is(h1,p) { text-align: var(--ref-copy-align); margin-inline: var(--ref-copy-margin-start) var(--ref-copy-margin-end); }
.ref-section-body { min-width: 0; }
.ref-section-copy .ref-section-body p { font-size: inherit; }
.ref-overlay-copy>.ref-section-copy:not(:last-child) { margin-bottom: 16px; }
.ref-photo-background { min-height: 380px; }
.ref-background-copy { max-width: min(760px,calc(100% - 40px)); margin: 20px; padding: 24px; color: var(--ref-text); background: var(--ref-bg); border-radius: var(--ref-radius); }

@media(min-width:1024px) {
    .reference-site .ref-dishes--justified>.ref-dish { flex-grow: var(--ref-photo-grow-desktop,270); min-width: 0; }
    .reference-site .ref-dishes--justified>.ref-dish .ref-dish-image { width: 100%; margin-inline: 0; }
    .reference-site .ref-dishes--justified .ref-dish--overlay:not(.ref-photo-size-desktop) .ref-dish-image { height: auto; aspect-ratio: 1; }
}

@media(min-width:701px) {
    .reference-site .ref-photo-cards .ref-text-link-desktop .ref-overlay-link { font-size: var(--ref-copy-link-desktop); }
    .reference-site .ref-text-title-desktop .ref-section-title { font-size: var(--ref-copy-title-desktop); }
    .reference-site .ref-text-body-desktop .ref-section-body { font-size: var(--ref-copy-body-desktop); }
    .ref-photo-size-desktop { --ref-photo-ratio: var(--ref-photo-ratio-desktop); --ref-photo-width: var(--ref-photo-width-desktop,100%); }
    .reference-site .ref-photo-size-desktop:not(.ref-dish) { position: relative; width: min(100%,var(--ref-photo-width)); aspect-ratio: var(--ref-photo-ratio); height: auto; min-height: 0; max-height: none; margin-inline: auto; }
    .reference-site .ref-photo-size-desktop:not(.ref-dish)>img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
    .reference-site .ref-dish.ref-photo-size-desktop { flex-basis: min(100%,var(--ref-photo-width-desktop,270px)); max-width: 100%; }
    .reference-site .ref-photo-overlay.ref-photo-size-desktop { min-height: min-content; }
    .reference-site .ref-photo-cards:has(.ref-photo-size-desktop) { align-items: start; }
    .reference-site .ref-dish--overlay.ref-photo-size-desktop .ref-dish-figure { min-height: 0; }
    .reference-site .ref-gallery:has(>.ref-photo-size-desktop) { grid-auto-rows: auto; align-items: start; }
}
@media(min-width:701px) and (max-width:1023px) {
    .reference-site .ref-photo-cards { grid-template-columns: repeat(var(--ref-card-columns-tablet,2),minmax(0,1fr)); }
}
@media(max-width:700px) {
    .reference-site .ref-photo-cards .ref-text-link-mobile .ref-overlay-link { font-size: var(--ref-copy-link-mobile); }
    .reference-site .ref-photo-cards { grid-template-columns: 1fr; }
    .ref-photo-frame { --ref-photo-focus: var(--ref-photo-focus-mobile,var(--ref-photo-focus-desktop,50% 50%)); }
    .reference-site .ref-text-title-mobile .ref-section-title { font-size: var(--ref-copy-title-mobile); }
    .reference-site .ref-text-body-mobile .ref-section-body { font-size: var(--ref-copy-body-mobile); }
    .ref-photo-size-mobile { --ref-photo-ratio: var(--ref-photo-ratio-mobile); --ref-photo-width: var(--ref-photo-width-mobile,100%); }
    .reference-site .ref-photo-size-mobile:not(.ref-dish) { position: relative; width: min(100%,var(--ref-photo-width)); aspect-ratio: var(--ref-photo-ratio); height: auto; min-height: 0; max-height: none; margin-inline: auto; }
    .reference-site .ref-photo-size-mobile:not(.ref-dish)>img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
    .reference-site .ref-dish.ref-photo-size-mobile { flex-basis: min(100%,var(--ref-photo-width-mobile,270px)); max-width: 100%; }
    .reference-site .ref-photo-overlay.ref-photo-size-mobile { min-height: min-content; }
    .reference-site .ref-photo-cards:has(.ref-photo-size-mobile) { align-items: start; }
    .reference-site .ref-dish--overlay.ref-photo-size-mobile .ref-dish-figure { min-height: 0; }
    .reference-site .ref-gallery:has(>.ref-photo-size-mobile) { grid-auto-rows: auto; align-items: start; }
}
@media(max-width:700px) {
    .reference-site .ref-photo-cards .ref-overlay-copy { padding: 14px; }
    .ref-photo-cards .ref-overlay-copy>.ref-section-copy:not(:last-child) { margin-bottom: 8px; }
    .reference-site .ref-photo-cards .ref-section-title { margin-block: 0 8px; }
    .reference-site .ref-photo-cards .ref-section-body p { margin-block: 0 8px; }
    .reference-site .ref-photo-cards .ref-overlay-link { padding-block: 4px; }
    .reference-site .ref-photo-cards .ref-section-copy :last-child { margin-bottom: 0; }
}