/* Gallery tiles, Amend 5 (A5-48): second photograph on hover, Add to cart,
   Add to favourites, pre order flag. Loaded only on a page showing [gf_gallery]. */

.gft-gallery .gft-gal-tile { display: flex; flex-direction: column; padding: 0; cursor: default; background: #fff; }
.gft-gallery .gft-gal-tile[hidden] { display: none !important; }
.gft-gallery .gft-gal-tile img { transform: none; }

.gft-gallery button.gft-gal-open { position: relative; min-height: 0; height: auto; display: block; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: #FAF6EF; color: inherit; font: inherit; text-align: left; cursor: pointer; overflow: hidden; box-shadow: none; }
.gft-gallery button.gft-gal-open:focus-visible { outline: 2px solid #C6A44E; outline-offset: -2px; }
.gft-gal-imgs { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; }
/* the whole picture, never cut (5 October 2026): a wide or tall one sits inside the square on white */
.gft-gallery .gft-gal-imgs { background: #fff; }
.gft-gallery .gft-gal-imgs img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; transition: opacity .45s ease, transform .6s ease; }
.gft-gallery .gft-gal-img2 { opacity: 0; }
.gft-gallery .gft-gal-open:hover .gft-gal-imgs img { transform: scale(1.04); }

@media (hover: hover) {
	.gft-gallery .gft-gal-tile.has-second .gft-gal-open:hover .gft-gal-img2,
	.gft-gallery .gft-gal-tile.has-second .gft-gal-open:focus-visible .gft-gal-img2 { opacity: 1; }
	.gft-gallery .gft-gal-tile.has-second .gft-gal-open:hover .gft-gal-img1,
	.gft-gallery .gft-gal-tile.has-second .gft-gal-open:focus-visible .gft-gal-img1 { opacity: 0; }
}

/* a phone has no hover, so the two photographs take turns on their own */
@media (hover: none) {
	.gft-gallery .gft-gal-tile.has-second .gft-gal-img2 { animation: gftGalSwap 9s ease-in-out infinite; }
	.gft-gallery .gft-gal-tile.has-second:nth-child(3n+2) .gft-gal-img2 { animation-delay: -3s; }
	.gft-gallery .gft-gal-tile.has-second:nth-child(3n+3) .gft-gal-img2 { animation-delay: -6s; }
}
@keyframes gftGalSwap { 0%, 42% { opacity: 0; } 50%, 92% { opacity: 1; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.gft-gallery .gft-gal-tile.has-second .gft-gal-img2 { animation: none; }
}

.gft-gallery .gft-gal-open:hover .gft-gal-over,
.gft-gallery .gft-gal-open:focus-visible .gft-gal-over { opacity: 1; }
.gft-gallery .gft-gal-over { z-index: 2; }

.gft-gal-flag { position: absolute; top: 8px; left: 8px; z-index: 3; padding: 4px 8px; background: #8A6A1F; color: #fff; font-size: 10.5px; font-weight: 600; letter-spacing: .08em; line-height: 1.3; text-transform: uppercase; }

.gft-gal-actions { display: flex; align-items: stretch; gap: 6px; padding: 8px; border-top: 1px solid #EDE3CE; background: #fff; }
.gft-gallery .gft-gal-actions .gft-gal-cart { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 0; min-height: 38px; margin: 0; padding: 8px 10px; border: 1px solid #1A1A1A; border-radius: 0; background: #1A1A1A; color: #fff; font-size: 11.5px; font-weight: 600; letter-spacing: .08em; line-height: 1.2; text-align: center; text-transform: uppercase; text-decoration: none; box-shadow: none; cursor: pointer; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.gft-gallery .gft-gal-actions .gft-gal-cart:hover,
.gft-gallery .gft-gal-actions .gft-gal-cart:focus-visible { background: #C6A44E; border-color: #C6A44E; color: #fff; }
.gft-gallery .gft-gal-actions .gft-gal-cart-pre { background: #8A6A1F; border-color: #8A6A1F; }
.gft-gallery .gft-gal-actions .gft-gal-cart-ask { background: #fff; border-color: #C6A44E; color: #8A6A1F; }
.gft-gallery .gft-gal-actions .gft-gal-cart.loading { opacity: .6; pointer-events: none; }
.gft-gallery .gft-gal-actions .gft-gal-cart.added::after { content: ""; display: inline-block; width: 5px; height: 9px; margin-left: 8px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); }
.gft-gallery .gft-gal-actions .gft-gal-cart::before { display: none; }
.gft-gallery .gft-gal-actions .added_to_cart { display: none !important; }

.gft-gallery .gft-gal-wish { flex: none; margin: 0; }
.gft-gallery .gft-gal-wish a { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 100%; min-height: 38px; border: 1px solid #D8D0C0; background: #fff; color: #8A6A1F; text-decoration: none; }
.gft-gallery .gft-gal-wish a::before, .gft-gallery .gft-gal-wish a::after { display: none; }
.gft-gallery .gft-gal-wish a:hover, .gft-gallery .gft-gal-wish a:focus-visible { border-color: #C6A44E; }
.gft-gallery .gft-gal-wish .wd-action-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gft-gal-heart path { fill: none; stroke: currentColor; stroke-width: 1.8; }
.gft-gallery .gft-gal-wish a.added .gft-gal-heart path { fill: #B3261E; stroke: #B3261E; }
.gft-gallery .gft-gal-wish a.loading { opacity: .5; }

.gft-gal-toast { position: fixed; left: 50%; bottom: 26px; z-index: 100002; max-width: min(92vw, 520px); padding: 14px 20px; transform: translateX(-50%); background: #1A1A1A; color: #fff; font-size: 14px; line-height: 1.5; box-shadow: 0 12px 30px rgba(26,26,26,.3); transition: opacity .5s ease; }
.gft-gal-toast strong { color: #E3C877; }
.gft-gal-toast.is-fading { opacity: 0; pointer-events: none; }

@media (max-width: 768px) {
	.gft-gal-actions { gap: 5px; padding: 6px; }
	.gft-gallery .gft-gal-actions .gft-gal-cart { min-height: 36px; padding: 7px 6px; font-size: 10.5px; letter-spacing: .05em; }
	.gft-gallery .gft-gal-wish a { width: 36px; min-height: 36px; }
	.gft-gal-flag { top: 6px; left: 6px; font-size: 9.5px; padding: 3px 6px; }
}

/* "16.4g NOT 16.4 g": the theme puts button text in capitals, which turned the
   weight into "16.4G GROSS". The code and weight line keeps its own case. */
.gft-gallery .gft-gal-meta { text-transform: none; letter-spacing: .02em; }

/* 4 Oct: the whole catalogue on the wall, loaded as the visitor scrolls */
.gft-gal-more { text-align: center; margin: 26px 0 6px; }
.gft-gal-more .gft-gal-count { margin: 0 0 12px; font-size: 14px; color: #5A554B; }
.gft-gal-more .gft-gal-loadmore { min-width: 180px; }
.gft-gal-more .gft-gal-loadmore[hidden] { display: none; }
.gft-gallery.is-loading .gft-gal-more .gft-gal-count::after { content: " \00B7 loading more"; }

/* ------------------------------------------------ films (4 October 2026) */
.gft-gallery .gft-gal-imgs video.gft-gal-vid { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; background: #1A1A1A; pointer-events: none; }
.gft-gallery button.gft-gal-play:not(.gft-gal-open) { position: absolute; top: 10px; right: 10px; z-index: 4; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-width: 0; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 50%; background: rgba(26, 26, 26, .74); box-shadow: 0 2px 8px rgba(0, 0, 0, .25); cursor: pointer; transition: background .2s ease, transform .2s ease; }
.gft-gallery button.gft-gal-play:not(.gft-gal-open):hover,
.gft-gallery button.gft-gal-play:not(.gft-gal-open):focus-visible { background: #C6A44E; transform: scale(1.06); }
.gft-gallery button.gft-gal-play:focus-visible { outline: 2px solid #C6A44E; outline-offset: 2px; }
.gft-gal-playmark { display: block; width: 0; height: 0; margin-left: 4px; border-style: solid; border-width: 8px 0 8px 13px; border-color: transparent transparent transparent #fff; }
.gft-gal-playmark-mid { position: absolute; top: 50%; left: 50%; z-index: 3; width: 64px; height: 64px; margin: -32px 0 0 -32px; border: 0; border-radius: 50%; background: rgba(26, 26, 26, .74); transition: background .2s ease; }
.gft-gal-playmark-mid::after { content: ""; position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -6px; border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent #fff; }
.gft-gallery .gft-gal-open.gft-gal-play:hover .gft-gal-playmark-mid { background: #C6A44E; }
.gft-galv { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 56px 16px 24px; background: rgba(0, 0, 0, .88); }
.gft-galv[hidden] { display: none; }
.gft-galv-in { position: relative; max-width: 100%; }
.gft-galv-v { display: block; max-width: min(960px, 100%); max-height: 78vh; margin: 0 auto; background: #000; }
button.gft-galv-x { position: absolute; top: -46px; right: 0; width: 40px; height: 40px; min-height: 0; margin: 0; padding: 0; border: 1px solid rgba(255, 255, 255, .5); border-radius: 50%; background: transparent; box-shadow: none; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
button.gft-galv-x:hover, button.gft-galv-x:focus-visible { background: #C6A44E; border-color: #C6A44E; color: #fff; }
.gft-galv-t { margin: 12px 0 0; color: #fff; font-size: 14px; text-align: center; }
html.gft-galv-on { overflow: hidden; }

/* the strip of the wall on the home page: whole rows at every width */
@media (min-width: 769px) and (max-width: 1024px) { .gf-home-gallery .gft-gal-grid .gft-gal-tile:nth-child(n+7) { display: none; } }
