/* Varied editorial silhouettes, with two photographs used as section backgrounds. */
.essence .editorial-image img {border-radius:4px;clip-path:polygon(0 0,86% 0,100% 13%,100% 100%,14% 100%,0 87%)}
.essence .tiny-photo img {border-radius:3px;clip-path:polygon(12% 0,100% 0,88% 100%,0 100%)}
.flavours .flavour .flavour-image {border-radius:3px;clip-path:polygon(0 0,87% 0,100% 14%,100% 100%,0 100%)}
.flavours .flavour:nth-child(2) .flavour-image {border-radius:3px;clip-path:polygon(12% 0,100% 0,88% 100%,0 100%)}
.flavours .flavour:nth-child(3) .flavour-image {border-radius:28% 3px 3px 3px;clip-path:none}
.gallery .gallery-card .gallery-image {border-radius:3px;clip-path:polygon(0 0,86% 0,100% 12%,100% 100%,0 100%)}
.gallery .gallery-card:nth-child(4n+2) .gallery-image {border-radius:24% 3px 24% 3px;clip-path:none}
.gallery .gallery-card:nth-child(4n+3) .gallery-image {border-radius:3px;clip-path:polygon(9% 0,100% 0,91% 100%,0 100%)}
.gallery .gallery-card:nth-child(4n+4) .gallery-image {border-radius:3px;clip-path:polygon(0 0,100% 0,100% 87%,86% 100%,0 100%)}
.gallery .gallery-card.cutout .gallery-image {border-radius:3px;clip-path:none;background:transparent;border-bottom:1px solid #a4874555}
.section-backdrop {position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.section-backdrop img {width:100%;height:100%;object-fit:cover;object-position:center 55%;border-radius:0;transform:none}
.section-backdrop::after {content:'';position:absolute;inset:0}
main > .section.suggestion {display:block;min-height:640px;padding-top:100px;padding-bottom:100px;position:relative}
.suggestion .section-backdrop::after {background:linear-gradient(90deg,rgba(7,23,17,.16),rgba(7,23,17,.45) 35%,rgba(7,23,17,.93) 62%,rgba(7,23,17,.96))}
.suggestion .suggestion-copy {position:relative;z-index:1;width:44%;max-width:520px;margin-left:auto;padding-left:0;text-shadow:0 2px 12px #07171166}
.suggestion .suggestion-copy > p:not(.eyebrow) {max-width:440px;color:#fff4df}
main > .section.pinchos {display:block;min-height:660px;padding-top:100px;padding-bottom:100px;position:relative}
.pinchos .section-backdrop img {object-position:center 45%}
.pinchos .section-backdrop::after {background:linear-gradient(90deg,rgba(7,23,17,.96),rgba(7,23,17,.91) 38%,rgba(7,23,17,.5) 65%,rgba(7,23,17,.16))}
.pinchos .pinchos-copy {position:relative;z-index:1;max-width:540px;width:48%;text-shadow:0 2px 12px #07171166}
.pinchos .pinchos-copy > p:not(.eyebrow):not(.pinchos-intro) {color:#fff4df}
.pinchos .pinchos-ticket {position:relative;left:auto;bottom:auto;display:inline-block;margin-top:32px;padding:18px 24px;transform:rotate(-3deg);text-shadow:none}
.suggestion > .menu-art,.pinchos > .menu-art {z-index:1;opacity:.15}
@media(max-width:760px) {
  main > .section.suggestion,main > .section.pinchos {min-height:0;padding:65px 24px}
  .suggestion .suggestion-copy,.pinchos .pinchos-copy {width:100%;max-width:510px;margin:0;padding:0}
  .suggestion .section-backdrop::after {background:linear-gradient(180deg,rgba(7,23,17,.8),rgba(7,23,17,.88))}
  .pinchos .section-backdrop::after {background:linear-gradient(180deg,rgba(7,23,17,.88),rgba(7,23,17,.8))}
  .suggestion .section-backdrop img {object-position:45% center}
  .pinchos .section-backdrop img {object-position:60% center}
  .pinchos .pinchos-ticket {margin-top:28px}
}

.section-backdrop.visible img {animation:backdrop-arrive 1.6s ease-out both}
@keyframes backdrop-arrive {from{opacity:.35}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.section-backdrop.visible img{animation:none}}
