/* Shooters Tequila theme. Paper page, one torn black ink band from the hero to the footer, a lift of light that
   carries the bottle down it. Anton + Archivo. Colours and fonts also live in theme.json. */

:root {
	--sh-night: #090909;
	--sh-coal: #141414;
	--sh-coal-2: #1b1a19;
	--sh-bone: #f2eee6;
	--sh-paper: #f2eee6;
	--sh-paper-2: #e9e3d8;
	--sh-ink: #090909;
	--sh-text: #2b2925;
	--sh-muted: #6b655c;
	--sh-rule: #cfc8bb;
	--sh-smoke: #a39f97;
	--sh-gold: #d4ab4e;
	--sh-gold-deep: #9c7623;
	--sh-gold-ink: #775a17;
	--sh-line: #2a2826;
	--sh-coffee: #b0773f;
	--sh-chilli: #e2483d;
	--sh-lemon: #e8cf3a;
	--sh-coffee-ink: #8d5a27;
	--sh-chilli-ink: #b8261d;
	--sh-lemon-ink: #7f6b08;
	--sh-display: var(--wp--preset--font-family--anton, Anton, Impact, sans-serif);
	--sh-body: var(--wp--preset--font-family--archivo, Archivo, Arial, sans-serif);
	--sh-gutter: clamp(16px, 4vw, 56px);
	--sh-torn-top: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath fill='%23090909' d='M0 60 L0 33.1 L6 37.5 L12 36.0 L18 34.6 L24 37.4 L30 33.9 L36 33.3 L42 36.3 L48 37.5 L54 35.1 L60 22.6 L66 31.9 L72 33.8 L78 36.2 L84 39.7 L90 39.8 L96 41.1 L102 39.7 L108 44.5 L114 42.7 L120 39.2 L126 37.0 L132 37.3 L138 35.1 L144 31.8 L150 33.7 L156 31.9 L162 24.6 L168 27.4 L174 22.4 L180 27.2 L186 22.1 L192 22.4 L198 27.1 L204 26.2 L210 24.4 L216 24.2 L222 23.9 L228 23.9 L234 27.5 L240 22.2 L246 20.2 L252 22.7 L258 16.9 L264 16.7 L270 19.6 L276 16.9 L282 16.3 L288 18.5 L294 21.1 L300 26.7 L306 26.7 L312 26.6 L318 33.0 L324 30.7 L330 34.9 L336 32.5 L342 36.9 L348 34.0 L354 31.4 L360 32.1 L366 31.7 L372 33.5 L378 31.0 L384 30.8 L390 34.6 L396 36.1 L402 39.3 L408 35.5 L414 39.5 L420 39.2 L426 42.5 L432 41.6 L438 45.1 L444 42.6 L450 38.0 L456 35.4 L462 37.4 L468 31.2 L474 31.8 L480 28.9 L486 25.9 L492 28.7 L498 28.1 L504 28.2 L510 25.7 L516 29.4 L522 26.9 L528 30.0 L534 28.7 L540 28.2 L546 24.5 L552 29.0 L558 26.0 L564 24.5 L570 21.0 L576 17.3 L582 15.7 L588 17.5 L594 18.5 L600 18.2 L606 11.5 L612 20.8 L618 19.6 L624 24.6 L630 28.1 L636 28.8 L642 29.1 L648 33.4 L654 31.2 L660 31.3 L666 32.4 L672 34.3 L678 34.6 L684 29.5 L690 29.9 L696 30.7 L702 31.6 L708 34.6 L714 33.5 L720 32.5 L726 34.3 L732 39.3 L738 39.8 L744 26.6 L750 41.1 L756 40.2 L762 42.3 L768 42.6 L774 43.0 L780 36.7 L786 26.1 L792 35.7 L798 31.2 L804 32.1 L810 30.4 L816 28.3 L822 31.0 L828 31.2 L834 26.7 L840 30.1 L846 28.9 L852 32.1 L858 32.2 L864 29.9 L870 29.3 L876 27.3 L882 23.1 L888 25.8 L894 21.2 L900 18.3 L906 20.2 L912 14.7 L918 17.3 L924 2.7 L930 15.7 L936 17.8 L942 23.3 L948 21.4 L954 26.7 L960 28.3 L966 28.5 L972 27.1 L978 30.4 L984 31.7 L990 30.4 L996 30.3 L1002 28.8 L1008 31.6 L1014 31.3 L1020 29.8 L1026 28.6 L1032 31.7 L1038 30.4 L1044 35.2 L1050 38.9 L1056 39.0 L1062 38.1 L1068 41.5 L1074 45.3 L1080 42.8 L1086 42.1 L1092 43.9 L1098 39.0 L1104 39.1 L1110 34.3 L1116 31.9 L1122 31.5 L1128 30.9 L1134 31.8 L1140 32.1 L1146 30.7 L1152 29.1 L1158 30.9 L1164 31.1 L1170 29.8 L1176 32.5 L1182 31.4 L1188 30.9 L1194 27.2 L1200 28.9 L1200 60Z'/%3E%3C/svg%3E");
	--sh-torn-bottom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath fill='%23090909' d='M0 0 L0 27.700000000000003 L6 22.5 L12 21.0 L18 25.700000000000003 L24 22.0 L30 26.1 L36 24.700000000000003 L42 27.1 L48 27.9 L54 24.700000000000003 L60 23.0 L66 25.4 L72 24.700000000000003 L78 25.5 L84 24.700000000000003 L90 20.700000000000003 L96 19.4 L102 20.799999999999997 L108 16.4 L114 16.0 L120 21.799999999999997 L126 20.6 L132 23.1 L138 24.1 L144 38.5 L150 26.700000000000003 L156 31.2 L162 33.4 L168 36.2 L174 38.1 L180 33.8 L186 33.4 L192 35.8 L198 34.7 L204 32.3 L210 31.3 L216 31.9 L222 34.4 L228 32.1 L234 33.8 L240 37.2 L246 40.6 L252 46.0 L258 39.9 L264 43.2 L270 41.0 L276 41.0 L282 41.0 L288 36.9 L294 36.9 L300 44.3 L306 32.4 L312 32.1 L318 31.3 L324 30.2 L330 24.1 L336 25.700000000000003 L342 25.0 L348 24.700000000000003 L354 28.4 L360 24.799999999999997 L366 24.200000000000003 L372 27.200000000000003 L378 27.1 L384 29.3 L390 26.299999999999997 L396 24.0 L402 24.5 L408 21.299999999999997 L414 18.799999999999997 L420 21.799999999999997 L426 20.700000000000003 L432 16.0 L438 15.399999999999999 L444 21.200000000000003 L450 17.200000000000003 L456 19.200000000000003 L462 23.9 L468 27.5 L474 25.5 L480 30.2 L486 29.7 L492 35.0 L498 33.6 L504 36.2 L510 35.6 L516 32.0 L522 34.0 L528 32.7 L534 31.9 L540 29.6 L546 34.5 L552 31.6 L558 34.6 L564 38.3 L570 38.2 L576 39.4 L582 43.4 L588 39.5 L594 40.5 L600 45.1 L606 42.1 L612 42.6 L618 41.0 L624 35.3 L630 33.5 L636 32.3 L642 31.4 L648 27.0 L654 30.4 L660 26.9 L666 29.3 L672 29.2 L678 28.9 L684 25.6 L690 28.5 L696 26.200000000000003 L702 29.1 L708 25.200000000000003 L714 28.7 L720 24.799999999999997 L726 24.200000000000003 L732 23.700000000000003 L738 18.6 L744 19.4 L750 16.200000000000003 L756 19.200000000000003 L762 16.0 L768 20.6 L774 19.299999999999997 L780 18.9 L786 23.9 L792 26.700000000000003 L798 28.1 L804 26.700000000000003 L810 31.1 L816 31.9 L822 32.1 L828 31.0 L834 30.8 L840 30.3 L846 28.8 L852 40.8 L858 30.2 L864 28.2 L870 30.3 L876 33.2 L882 37.7 L888 35.7 L894 41.5 L900 42.8 L906 41.1 L912 44.4 L918 42.9 L924 43.2 L930 38.9 L936 40.3 L942 37.1 L948 34.0 L954 32.6 L960 30.7 L966 29.4 L972 27.700000000000003 L978 29.7 L984 27.799999999999997 L990 30.2 L996 28.7 L1002 31.2 L1008 32.5 L1014 32.0 L1020 33.0 L1026 31.9 L1032 26.700000000000003 L1038 29.4 L1044 24.4 L1050 25.700000000000003 L1056 22.799999999999997 L1062 20.9 L1068 17.4 L1074 19.1 L1080 19.0 L1086 18.6 L1092 16.6 L1098 21.299999999999997 L1104 19.1 L1110 23.200000000000003 L1116 25.4 L1122 29.5 L1128 26.299999999999997 L1134 28.7 L1140 30.7 L1146 28.4 L1152 32.0 L1158 29.5 L1164 27.1 L1170 30.2 L1176 29.3 L1182 26.6 L1188 29.0 L1194 32.6 L1200 35.1 L1200 0Z'/%3E%3C/svg%3E");
}

[hidden] { display: none !important; }
html { scroll-behavior: smooth; overflow-x: clip; background: var(--sh-paper); }
body { margin: 0; -webkit-font-smoothing: antialiased; background: var(--sh-paper); color: var(--sh-text); position: relative; }
img { max-width: 100%; height: auto; }
:where(a, button, summary):focus-visible { outline: 3px solid var(--sh-gold); outline-offset: 3px; border-radius: 4px; }
.sh-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.sh-main { margin-block-start: 0 !important; position: relative; z-index: 1; }
[id] { scroll-margin-top: 96px; }
h1, h2, h3 { color: var(--sh-ink); text-wrap: balance; }
h1 span, h2 span { color: var(--sh-gold-deep); }
a { color: var(--sh-gold-ink); }

/* a faint paper grain over the whole page */
body::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .5; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .5 0 0 0 0 .42 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ---------- Header: a dark floating pill ---------- */
.sh-site-header { position: fixed; z-index: 50; top: 14px; left: 50%; transform: translateX(-50%); width: calc(100% - 2 * var(--sh-gutter)); max-width: 1240px; margin: 0 !important; }
.admin-bar .sh-site-header { top: calc(var(--wp-admin--admin-bar--height, 32px) + 12px); }
.sh-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 8px 10px 8px 18px; border-radius: 9999px; background: rgba(9, 9, 9, .78); border: 1px solid rgba(212, 171, 78, .25); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-sizing: border-box; }
.sh-header-logo { display: block; line-height: 0; }
.sh-header-logo img { width: 40px; height: auto; }
.sh-nav { display: flex; flex-wrap: wrap; gap: 2px; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.sh-nav a { color: var(--sh-bone); text-decoration: none; padding: 10px 14px; border-radius: 9999px; transition: background-color .2s ease, color .2s ease; }
.sh-nav a:hover { background: rgba(212, 171, 78, .14); color: var(--sh-gold); }
.sh-skip { position: absolute; left: 16px; top: -200px; background: var(--sh-gold); color: var(--sh-night); padding: 10px 16px; border-radius: 8px; z-index: 60; }
.sh-skip:focus { top: 64px; color: var(--sh-night); }
.sh-menu-toggle { display: none; width: 44px; height: 44px; border-radius: 9999px; border: 0; background: rgba(212, 171, 78, .14); cursor: pointer; align-items: center; justify-content: center; }
.sh-menu-icon, .sh-menu-icon::before, .sh-menu-icon::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--sh-gold); position: relative; transition: transform .2s ease, background-color .2s ease; }
.sh-menu-icon::before, .sh-menu-icon::after { content: ""; position: absolute; left: 0; }
.sh-menu-icon::before { top: -6px; }
.sh-menu-icon::after { top: 6px; }
.sh-menu-toggle[aria-expanded="true"] .sh-menu-icon { background: transparent; }
.sh-menu-toggle[aria-expanded="true"] .sh-menu-icon::before { transform: translateY(6px) rotate(45deg); }
.sh-menu-toggle[aria-expanded="true"] .sh-menu-icon::after { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 760px) {
	.sh-site-header { top: 10px; }
	.admin-bar .sh-site-header { top: calc(var(--wp-admin--admin-bar--height, 46px) + 8px); }
	.sh-header { padding: 6px 6px 6px 14px; }
	.sh-header:has(.sh-nav.is-open) { border-radius: 24px; }
	.sh-header-logo img { width: 36px; }
	.js .sh-menu-toggle { display: inline-flex; }
	.js .sh-nav { display: none; width: 100%; flex-direction: column; gap: 0; padding: 4px 4px 8px 0; }
	.js .sh-nav.is-open { display: flex; }
	.js .sh-nav a { padding: 14px 4px; border-top: 1px solid var(--sh-line); border-radius: 0; font-size: 13px; }
}

/* ---------- Shared pieces ---------- */
.sh-home > * { margin-block: 0 !important; }
.sh-home :where(.wp-block-group) > * { margin-block: 0; }
.sh-eyebrow { margin: 0; font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: .24em; color: var(--sh-muted); text-transform: uppercase; }
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.wp-block-button__link, .sh-btn { min-height: 48px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; }
.wp-block-button__link { border-radius: 2px !important; letter-spacing: .18em; text-transform: uppercase; font-size: 12px !important; }
.sh-btn { font: inherit; font-size: 15px; font-weight: 700; border-radius: 9999px; padding: 12px 26px; cursor: pointer; border: 2px solid var(--sh-gold); }
.wp-block-button__link:hover, .sh-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 26px -8px rgba(212, 171, 78, .45); }
.sh-btn--gold { background: var(--sh-gold); color: var(--sh-night); }
.sh-btn--line { background: transparent; color: var(--sh-bone); border-color: var(--sh-bone); }
.sh-text-btn { font: inherit; font-size: 14px; font-weight: 700; background: none; border: 0; color: var(--sh-gold); text-decoration: underline; cursor: pointer; padding: 8px; }
.sh-sidecap { position: absolute; margin: 0 !important; writing-mode: vertical-rl; font-size: 10px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: var(--sh-muted); }

/* ---------- The ink band, the lift light and the travelling bottle (drawn by front.js) ---------- */
.sh-bandsvg { position: absolute; left: 0; top: 0; width: 100%; z-index: 0; pointer-events: none; display: block; }
.sh-carsvg { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; display: block; }
.sh-trav { position: absolute; left: 0; top: 0; z-index: 0; pointer-events: none; will-change: transform; }
.sh-trav img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.sh-trav canvas { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; }
.sh-site-footer { position: relative; z-index: 1; }
/* without the band (no JavaScript yet, or switched off) the dark parts are plain black blocks */
html:not(.sh-band-on) .sh-hero, html:not(.sh-band-on) .sh-lineup { background: var(--sh-night); }
.sh-motion [data-sh-hero], .sh-motion .sh-slot img { visibility: hidden; }

/* ---------- Hero ---------- */
.sh-hero { position: relative; min-height: min(100svh, 940px); box-sizing: border-box; padding: 150px var(--sh-gutter) 120px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: center; gap: 24px; max-width: 1352px; margin: 0 auto !important; color: var(--sh-bone); }
.sh-hero-text { display: flex; flex-direction: column; gap: 18px; position: relative; z-index: 2; }
.sh-hero .sh-eyebrow { color: var(--sh-gold); }
.sh-hero h1 { margin: 0; color: var(--sh-bone); font-size: clamp(52px, 6.6vw, 104px) !important; line-height: .92 !important; }
.sh-hero h1 span { display: block; color: var(--sh-gold); }
.sh-lede { margin: 0; max-width: 430px; color: #cfc9bf; font-size: 17px; line-height: 1.55; }
.sh-trio { position: relative; height: clamp(420px, 62vh, 600px); }
.sh-trio img { position: absolute; bottom: 0; width: auto; filter: drop-shadow(0 30px 30px rgba(0, 0, 0, .6)); }
.sh-trio .sh-trio-lead { left: 50%; transform: translateX(-50%); height: 100%; z-index: 2; }
.sh-trio .sh-trio-side { height: 70%; bottom: 8%; filter: brightness(.48) drop-shadow(0 30px 30px rgba(0, 0, 0, .6)); }
.sh-trio .sh-trio-side:first-child { left: 6%; transform: rotate(-6deg); }
.sh-trio .sh-trio-side:last-child { right: 6%; transform: rotate(6deg); }
.sh-hero-award { position: absolute; margin: 0 !important; right: var(--sh-gutter); top: 112px; width: 84px; z-index: 3; }
.sh-hero-award img { width: 100%; height: auto; aspect-ratio: 280 / 364; filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .6)); }
.sh-hero-cap { right: 10px; top: 260px; color: var(--sh-smoke); }

/* ---------- Flavour floors ---------- */
.sh-flav { --fc: var(--sh-gold); --fci: var(--sh-gold-deep); position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 420px minmax(0, 1fr); grid-template-areas: "copy slot cards"; align-items: center; max-width: 1352px; margin: 0 auto !important; padding: 90px var(--sh-gutter); min-height: 760px; box-sizing: border-box; }
.sh-flav--r { grid-template-areas: "cards slot copy"; }
.sh-flavour-coffee { --fc: var(--sh-coffee); --fci: var(--sh-coffee-ink); }
.sh-flavour-chilli { --fc: var(--sh-chilli); --fci: var(--sh-chilli-ink); }
.sh-flavour-lemon { --fc: var(--sh-lemon); --fci: var(--sh-lemon-ink); }
.sh-copy { grid-area: copy; display: flex; flex-direction: column; gap: 10px; padding: 0 28px; position: relative; z-index: 2; }
.sh-flav .sh-copy::after { content: ""; display: block; width: 60px; height: 2px; background: var(--sh-ink); margin-top: 16px; }
.sh-bignum { margin: 0; font: 400 clamp(92px, 9vw, 132px)/.8 var(--sh-display); color: var(--sh-ink); display: flex; align-items: flex-start; gap: 4px; }
.sh-bignum span { font: 300 .32em/1 var(--sh-body); color: var(--fci); }
.sh-flav h2 { margin: 12px 0 0 !important; font-size: clamp(38px, 3.6vw, 52px) !important; line-height: .95 !important; }
.sh-flav h2 span { display: block; color: var(--fci); }
.sh-tag { margin: 6px 0 0 !important; font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--sh-muted); }
.sh-copy p:not([class]) { margin: 0; max-width: 340px; color: var(--sh-text); font-size: 16px; line-height: 1.6; }
.sh-slot { grid-area: slot; justify-self: center; height: clamp(360px, 62vh, 540px); aspect-ratio: 396 / 800; position: relative; z-index: 1; }
.sh-slot img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 28px 26px rgba(0, 0, 0, .55)); }
.sh-cards2 { grid-area: cards; position: relative; display: flex; flex-direction: column; gap: 22px; z-index: 2; }
.sh-card2 { position: relative; box-sizing: border-box; width: min(270px, 100%); padding: 22px 24px; box-shadow: 0 18px 40px rgba(0, 0, 0, .2); display: flex; flex-direction: column; gap: 6px; }
.sh-card2 h3 { margin: 4px 0 6px !important; font-size: 28px !important; line-height: 1 !important; }
.sh-card2--paper { background: var(--sh-paper); border: 1px solid #d6d0c4; }
.sh-card2--dark { background: var(--sh-coal); color: var(--sh-bone); }
.sh-card2--dark h3 { color: var(--sh-bone); }
.sh-card2--dark .sh-eyebrow { color: var(--fc, var(--sh-gold)); }
.sh-card2--flav { background: var(--fc); color: var(--sh-ink); }
.sh-card2--flav .sh-eyebrow { color: var(--sh-ink); opacity: .8; }
.sh-card2 p:not(.sh-eyebrow) { margin: 0; font-size: 14px; line-height: 1.5; }
.sh-flav--l .sh-card2:first-child { margin-left: -70px; }
.sh-flav--l .sh-card2:last-child { margin-left: 110px; }
.sh-flav--r .sh-cards2 { align-items: flex-end; }
.sh-flav--r .sh-card2:first-child { margin-right: -70px; }
.sh-flav--r .sh-card2:last-child { margin-right: 110px; }
.sh-kv { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin: 4px 0 0; font-size: 13px; line-height: 1.35; }
.sh-kv div { margin: 0; }
.sh-kv dt { font-size: 9.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; opacity: .7; }
.sh-kv dd { margin: 3px 0 0; }
.sh-flav .sh-sidecap { top: 44%; }
.sh-flav--l .sh-sidecap { left: 8px; transform: rotate(180deg); }
.sh-flav--r .sh-sidecap { right: 8px; }
.sh-ar-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.sh-ar { display: inline-block; line-height: 0; border-radius: 9999px; }
.sh-ar img { display: block; width: 204px; height: 44px; }
.sh-ar--party img { width: 104px; }
.sh-ar--lineup img { width: 260px; }
.sh-ar-hint { margin: 2px 0 0 !important; font-size: 12px !important; line-height: 1.4; }

/* ---------- Line-up ---------- */
.sh-lineup { position: relative; text-align: center; padding: 110px var(--sh-gutter) 120px; min-height: 780px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: 12px; color: var(--sh-bone); }
.sh-lineup .sh-eyebrow { color: var(--sh-gold); }
.sh-lineup h2 { margin: 0 !important; color: var(--sh-bone); font-size: clamp(42px, 5vw, 76px) !important; }
.sh-lineup h2 span { color: var(--sh-gold); }
.sh-row { display: flex; justify-content: center; align-items: flex-end; gap: clamp(8px, 5vw, 70px); margin-top: 28px; }
.sh-pick { display: flex; flex-direction: column; align-items: center; gap: 14px; text-decoration: none; color: var(--sh-bone); font-size: 11px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.sh-pick img { height: clamp(220px, 40vh, 380px); width: auto; filter: drop-shadow(0 24px 22px rgba(0, 0, 0, .6)); transition: transform .3s ease; }
.sh-pick:hover img { transform: translateY(-6px); }
.sh-pick:hover span { color: var(--sh-gold); }
.sh-pick--lead img { height: clamp(260px, 48vh, 450px); }
.sh-pick--lead { position: relative; z-index: 2; transform: translateY(20px); }
.sh-ar-all { margin-top: 30px; }

/* ---------- The serve, what's inside, FAQ: either side of the narrow shaft ---------- */
.sh-serve, .sh-faq { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); align-items: center; max-width: 1352px; margin: 0 auto !important; padding: 100px var(--sh-gutter); box-sizing: border-box; }
.sh-serve .sh-copy.sh-serve-text { grid-area: auto; grid-column: 1; padding-left: 0; }
.sh-serve-text h2, .sh-faq h2, .sh-inside h2 { margin: 6px 0 0 !important; font-size: clamp(40px, 4vw, 60px) !important; line-height: .95 !important; }
.sh-serve-note { grid-column: 3; margin-left: -30px; }
.sh-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.sh-chips button { font: 700 11px/1 var(--sh-body); letter-spacing: .16em; text-transform: uppercase; padding: 11px 15px; border: 1.5px solid var(--sh-ink); background: transparent; color: var(--sh-ink); cursor: pointer; }
.sh-chips button[aria-pressed="true"] { background: var(--sh-ink); color: var(--sh-bone); }
.sh-steps { margin: 12px 0 0; padding: 0; list-style: none; counter-reset: sh-step; }
.sh-steps li { counter-increment: sh-step; display: flex; gap: 16px; align-items: baseline; border-top: 1px solid var(--sh-rule); padding: 13px 0; font-size: 16px; line-height: 1.45; margin: 0; }
.sh-steps li::before { content: counter(sh-step); font: 400 30px/1 var(--sh-display); color: var(--sh-fc, var(--sh-gold-deep)); flex: none; width: 22px; }
.sh-cocktails { position: relative; max-width: 1352px; margin: 0 auto !important; padding: 80px var(--sh-gutter) 40px; box-sizing: border-box; }
.sh-cocktails-head { display: flex; flex-direction: column; gap: 6px; }
@media (min-width: 1000px) { .sh-cocktails-head, .sh-inside-head { max-width: calc(50% - 150px); } }
.sh-cocktails h2 { margin: 6px 0 0 !important; font-size: clamp(40px, 4vw, 60px) !important; line-height: .95 !important; }
.sh-mixes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 30px; }
.sh-mix { padding: 26px 24px 28px; border-left: 1px solid var(--sh-rule); display: flex; flex-direction: column; gap: 8px; }
.sh-mix .sh-eyebrow { color: var(--fci, var(--sh-gold-ink)); }
.sh-mix h3 { margin: 0 !important; font-size: 28px !important; line-height: 1 !important; }
.sh-mix p:not(.sh-eyebrow) { margin: 0; font-size: 15px; line-height: 1.5; }
.sh-mix .sh-kv { margin-top: 10px; }
.sh-mix-photo { margin: -26px -24px 10px !important; }
.sh-mix-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.sh-mix-taste { font-style: italic; }
.sh-spec { font-size: 14px; line-height: 1.5; margin-top: 6px; }
.sh-spec-head { margin: 10px 0 4px; font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; opacity: .75; }
.sh-spec ul, .sh-spec ol { margin: 0; padding-left: 18px; }
.sh-spec li { margin: 2px 0; }
.sh-mix--dark .sh-spec-head { color: var(--fc); opacity: 1; }
.sh-mix--dark { background: var(--sh-night); color: var(--sh-bone); border-color: var(--sh-line); }
.sh-mix--dark h3 { color: var(--sh-bone); }
.sh-mix--dark .sh-eyebrow { color: var(--fc); }
.sh-round { margin: 28px 0 0 auto; width: min(340px, 100%) !important; }
.sh-round h3 { color: var(--sh-bone); }
.sh-inside { position: relative; max-width: 1352px; margin: 0 auto !important; padding: 80px var(--sh-gutter) 60px; box-sizing: border-box; }
.sh-inside-head { display: flex; flex-direction: column; gap: 6px; }
.sh-facts4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 30px; }
.sh-fact4 { padding: 26px 24px; border-left: 1px solid var(--sh-rule); display: flex; flex-direction: column; gap: 8px; background: transparent; }
.sh-fact4 h3 { margin: 0 !important; font-size: 28px !important; line-height: 1 !important; }
.sh-fact4 p:not(.sh-eyebrow) { margin: 0; font-size: 15px; line-height: 1.5; }
.sh-fact4 .sh-eyebrow { color: var(--sh-gold-ink); }
.sh-fact4--dark { background: var(--sh-night); color: var(--sh-bone); border-color: var(--sh-line); }
.sh-fact4--dark h3 { color: var(--sh-bone); }
.sh-fact4--dark .sh-eyebrow { color: var(--sh-gold); }
.sh-faq { align-items: start; padding-bottom: 280px; }
.sh-faq-head { grid-column: 1; display: flex; flex-direction: column; gap: 6px; }
.sh-faq-list { grid-column: 3; display: flex; flex-direction: column; }
.sh-faq .wp-block-details { border-top: 1px solid var(--sh-rule); margin: 0 !important; }
.sh-faq .wp-block-details:last-child { border-bottom: 1px solid var(--sh-rule); }
.sh-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; font-size: 16px; line-height: 1.35; font-weight: 700; color: var(--sh-ink); }
.sh-faq summary::-webkit-details-marker { display: none; }
.sh-faq summary::after { content: "+"; flex: none; font: 300 24px/1 var(--sh-body); color: var(--sh-gold-deep); transition: transform .3s ease; }
.sh-faq details[open] > summary::after { transform: rotate(45deg); }
.sh-faq details > p { margin: 0 0 16px !important; font-size: 15px; line-height: 1.6; color: var(--sh-text); }

/* ---------- Wide screens ---------- */
@media (min-width: 1800px) {
	.sh-site-header { max-width: 1440px; }
	.sh-flav, .sh-serve, .sh-faq, .sh-inside, .sh-hero { max-width: 1560px; }
	.sh-flav { grid-template-columns: minmax(0, 1fr) 480px minmax(0, 1fr); }
}
@media (max-width: 1199px) { .sh-sidecap { display: none; } }
@media (min-width: 1000px) and (max-width: 1199px) {
	.sh-flav { grid-template-columns: minmax(0, 1fr) 330px minmax(0, 1fr); padding-inline: 24px; }
	.sh-copy { padding: 0 12px; }
	.sh-flav--r .sh-copy { padding-left: 52px; } /* keep the right-hand words clear of the tunnel's bulge */
	.sh-card2 { width: min(240px, 100%); }
	.sh-flav--l .sh-card2:first-child { margin-left: -40px; }
	.sh-flav--l .sh-card2:last-child { margin-left: 20px; }
	.sh-flav--r .sh-card2:first-child { margin-right: -40px; }
	.sh-flav--r .sh-card2:last-child { margin-right: 20px; }
	.sh-serve, .sh-faq { grid-template-columns: minmax(0, 1fr) 240px minmax(0, 1fr); }
}

/* ---------- Tablets and phones: one column, words on paper cards laid over the ink ---------- */
@media (max-width: 999px) {
	.sh-hero { grid-template-columns: minmax(0, 1fr); padding: 120px 20px 150px; min-height: 0; gap: 20px; }
	.sh-hero h1 { font-size: clamp(44px, 11vw, 72px) !important; }
	.sh-trio { height: clamp(300px, 52vh, 460px); }
	.sh-hero-award { width: 64px; top: 90px; right: 16px; }
	.sh-hero .sh-eyebrow { max-width: calc(100% - 76px); }
	.sh-flav, .sh-flav--r { grid-template-columns: minmax(0, 1fr); grid-template-areas: "slot" "copy" "cards"; min-height: 0; padding: 40px 16px 70px; max-width: 600px; gap: 18px; }
	.sh-slot { height: clamp(300px, 50vh, 440px); }
	/* a clear stretch of black shaft after each flavour's cards, where the bottle changes flavour in view */
	.sh-flav, .sh-flav--r { padding-bottom: max(420px, 60vh); }
	.sh-copy, .sh-faq-head, .sh-faq-list, .sh-serve-text, .sh-inside-head { background: var(--sh-paper); padding: 24px 22px 26px !important; box-shadow: 0 16px 34px rgba(0, 0, 0, .28); }
	.sh-cards2, .sh-flav--r .sh-cards2 { align-items: stretch; gap: 14px; }
	.sh-flav .sh-card2, .sh-flav--l .sh-card2:first-child, .sh-flav--l .sh-card2:last-child, .sh-flav--r .sh-card2:first-child, .sh-flav--r .sh-card2:last-child { margin: 0; width: auto; }
	.sh-flav .sh-card2--flav { margin-left: 18% !important; }
	.sh-lineup { padding: 80px 12px 90px; min-height: 0; }
	.sh-row { gap: 2px; }
	.sh-pick img { height: clamp(150px, 30vh, 280px); }
	.sh-pick--lead img { height: clamp(190px, 37vh, 340px); }
	.sh-serve, .sh-faq { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 60px 16px; max-width: 600px; }
	.sh-serve .sh-copy.sh-serve-text, .sh-serve-note, .sh-faq-head, .sh-faq-list { grid-column: 1; margin: 0; }
	.sh-serve-note { width: auto; margin-left: 18%; }
	.sh-faq { padding-bottom: 260px; }
	.sh-faq-head { box-shadow: none; padding-bottom: 0 !important; }
	.sh-faq-list { padding-top: 6px !important; }
	.sh-faq { row-gap: 0; } /* one paper card: no strip of tunnel between the heading and the questions */
	.sh-inside { padding: 60px 16px 40px; max-width: 600px; }
	.sh-cocktails { padding: 60px 16px 40px; max-width: 600px; }
	.sh-cocktails-head { background: var(--sh-paper); padding: 24px 22px 6px !important; }
	.sh-mixes { grid-template-columns: minmax(0, 1fr); margin-top: 0; }
	.sh-mix { background: var(--sh-paper); border-left: 0; border-top: 1px solid var(--sh-rule); }
	.sh-mix--dark { background: var(--sh-night); }
	.sh-mix.sh-flavour-coffee { order: -1; }
	.sh-round { margin: 16px 0 0 18%; width: auto !important; }
	.sh-inside-head { box-shadow: none; padding-bottom: 6px !important; }
	.sh-facts4 { grid-template-columns: 1fr 1fr; margin-top: 0; }
	.sh-fact4 { background: var(--sh-paper); }
	.sh-fact4--dark { background: var(--sh-night); }
}
@media (max-width: 420px) { .sh-facts4 { grid-template-columns: 1fr; } }
/* a phone on its side: shorter bottles so each one fits the screen */
@media (max-height: 520px) and (orientation: landscape) {
	.sh-hero { padding-top: 96px; }
	.sh-trio { height: 300px; }
	.sh-slot { height: 300px; }
	.sh-pick img { height: 180px; }
	.sh-pick--lead img { height: 220px; }
}

/* ---------- Footer: black, with a torn top edge ---------- */
.sh-site-footer { background: var(--sh-night); color: var(--sh-bone); margin-top: 60px !important; }
.sh-site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: -59px; height: 60px; background: var(--sh-torn-top) center / 100% 100% no-repeat; pointer-events: none; }
.sh-band-on .home .sh-site-footer { background: transparent; margin-top: 0 !important; }
.sh-band-on .home .sh-site-footer::before { display: none; }
.home .sh-footer { padding-top: 0; }
.sh-footer { max-width: 1240px; margin: 0 auto; padding: clamp(56px, 8vw, 96px) var(--sh-gutter) 24px; display: flex; flex-direction: column; gap: 40px; box-sizing: border-box; }
.sh-footer a { color: var(--sh-bone); }
.sh-footer a:hover { color: var(--sh-gold); }
.sh-footer-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px; }
.sh-footer-brand { display: flex; flex-direction: column; gap: 14px; max-width: 360px; }
.sh-footer-brand > * { margin: 0; }
.sh-footer-brand img { width: 64px; height: auto; }
.sh-footer-brand p { font-size: 15px; line-height: 1.5; color: var(--sh-smoke); }
.sh-footer-brand .sh-footer-tagline { font-family: var(--sh-display); text-transform: uppercase; font-size: clamp(26px, 2.6vw, 34px); line-height: 1.05; color: var(--sh-bone); }
.sh-footer-nav { display: flex; flex-wrap: wrap; gap: 56px; font-size: 15px; line-height: 30px; }
.sh-footer-nav > div { display: flex; flex-direction: column; }
.sh-footer-nav a { text-decoration: none; }
.sh-footer-head { margin: 0 0 8px; font-size: 11px; font-weight: 700; letter-spacing: .22em; color: var(--sh-gold); }
.sh-footer-bottom { border-top: 1px solid var(--sh-line); padding-top: 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; font-size: 13px; line-height: 19px; color: var(--sh-smoke); }
.sh-footer-bottom p { margin: 0; }
.sh-footer-bottom a { color: var(--sh-smoke); }
@media (max-width: 480px) { .sh-footer-nav { gap: 32px; } }
@media (min-width: 1800px) { .sh-footer { max-width: 1440px; } }

/* ---------- Inner pages: a black head with a torn bottom edge, then paper ---------- */
.sh-page-hero { position: relative; background: var(--sh-night); color: var(--sh-bone); padding: 150px var(--sh-gutter) 56px; margin-bottom: 60px; }
.sh-page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -59px; height: 60px; background: var(--sh-torn-bottom) center / 100% 100% no-repeat; }
.sh-page-hero h1 { margin: 0; color: var(--sh-bone); }
.sh-page-hero > * + * { margin-top: 16px; }
.sh-prose { position: relative; padding: 40px var(--sh-gutter) 88px; color: var(--sh-text); }
.sh-prose h2 { font-size: 30px; margin-top: 48px; }
.sh-prose h3 { font-size: 22px; margin-top: 30px; }
.sh-prose strong { color: var(--sh-ink); }
.sh-prose table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sh-prose th, .sh-prose td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--sh-rule); }
.sh-prose th { background: var(--sh-night); color: var(--sh-gold); }
.sh-prose .wp-block-table { overflow-x: auto; }
.sh-prose .sh-small, .sh-small { font-size: 13px; color: var(--sh-muted); }
.sh-prose .sh-eyebrow { color: var(--sh-gold-ink); }
.sh-prose .sh-legal-list { list-style: none; padding-left: 0; }
.sh-prose .sh-legal-list li + li { margin-top: 10px; }
.sh-404 { padding-bottom: 96px; margin-bottom: 0; }
.sh-404::after, .error404 .sh-site-footer::before { display: none; } /* the 404 page is all ink: no paper edges */
.error404 .sh-site-footer { margin-top: 0 !important; }
.sh-404 .sh-eyebrow { color: var(--sh-smoke); }

/* ---------- Age check ---------- */
.sh-age { position: fixed; inset: 0; z-index: 1000; background: radial-gradient(circle at 18% 30%, rgba(176, 119, 63, .35), transparent 40%), radial-gradient(circle at 50% 85%, rgba(226, 72, 61, .3), transparent 42%), radial-gradient(circle at 84% 28%, rgba(232, 207, 58, .26), transparent 40%), var(--sh-night); display: flex; align-items: center; justify-content: center; padding: 24px 16px; overflow-y: auto; box-sizing: border-box; }
.sh-age[hidden] { display: none; }
.sh-age-card { width: 100%; max-width: 470px; background: rgba(20, 20, 20, .92); border: 1px solid rgba(212, 171, 78, .35); border-radius: 30px; box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .9); padding: 40px 32px 28px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.sh-age-card > img { width: 64px; height: auto; }
.sh-age-ask, .sh-age-no { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.sh-age-ask[hidden], .sh-age-no[hidden] { display: none; }
.sh-age .sh-age-title { margin: 6px 0 0; font-family: var(--sh-display); text-transform: uppercase; font-weight: 400; color: var(--sh-bone); font-size: 40px; line-height: 1; }
.sh-age .sh-age-title:focus { outline: none; }
.sh-age p { margin: 0; font-size: 15px; line-height: 1.5; max-width: 26em; color: var(--sh-smoke); }
.sh-age-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 10px; }
.sh-age-actions .sh-btn { min-width: 132px; }
.sh-age .sh-age-small { margin-top: 6px; font-size: 12px; line-height: 1.5; }
.sh-age a, .sh-consent a, .sh-prefs a { color: var(--sh-gold); } /* gold that reads on the dark card */
body.sh-age-open { overflow: hidden; }
@media (max-width: 480px) { .sh-age-card { padding: 32px 20px 24px; border-radius: 24px; } .sh-age .sh-age-title { font-size: 34px; } }

/* ---------- Cookie banner ---------- */
.sh-consent { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); width: min(820px, calc(100% - 32px)); z-index: 900; background: rgba(20, 20, 20, .95); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid rgba(212, 171, 78, .35); border-radius: 24px; box-shadow: 0 20px 60px -20px rgba(0, 0, 0, .9); animation: shRise .6s cubic-bezier(.2, .9, .2, 1) both; }
@keyframes shRise { from { transform: translate(-50%, 140%); } to { transform: translate(-50%, 0); } }
.sh-consent[hidden] { display: none; }
.sh-consent-inner { padding: 20px 22px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 22px; box-sizing: border-box; }
.sh-consent-copy { flex: 1 1 380px; min-width: 0; }
.sh-consent-title { margin: 0 0 4px; font-family: var(--sh-display); text-transform: uppercase; font-weight: 400; font-size: 24px; line-height: 1.1; color: var(--sh-bone); }
.sh-consent-copy p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--sh-smoke); }
.sh-consent-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sh-consent-actions .sh-btn { font-size: 13px; padding: 8px 18px; min-height: 40px; }
.sh-prefs { position: fixed; inset: 0; z-index: 950; background: rgba(0, 0, 0, .65); display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; overflow-y: auto; }
.sh-prefs[hidden] { display: none; }
.sh-prefs-card { width: 100%; max-width: 560px; background: var(--sh-coal); border: 1px solid rgba(212, 171, 78, .35); border-radius: 24px; padding: 30px; box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; color: var(--sh-bone); }
.sh-prefs-card h2 { margin: 0; font-size: 34px; }
.sh-prefs-card h2:focus { outline: none; }
.sh-prefs-card > p { margin: 0; font-size: 15px; line-height: 23px; color: var(--sh-smoke); }
.sh-pref { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 16px 0; border-top: 1px solid var(--sh-line); }
.sh-pref h3 { margin: 0; font-family: var(--sh-body); text-transform: none; font-weight: 700; letter-spacing: 0; font-size: 16px; line-height: 22px; }
.sh-pref p { margin: 4px 0 0; font-size: 14px; line-height: 21px; color: var(--sh-smoke); }
.sh-pref-always { flex: none; font-size: 13px; font-weight: 700; color: var(--sh-night); background: var(--sh-gold); border-radius: 9999px; padding: 6px 12px; white-space: nowrap; }
.sh-switch { flex: none; position: relative; width: 52px; height: 30px; margin-top: 2px; border-radius: 9999px; border: 0; padding: 0; cursor: pointer; background: #4a4743; transition: background-color .2s ease; }
.sh-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 9999px; background: var(--sh-bone); transition: transform .2s ease; }
.sh-switch[aria-checked="true"] { background: var(--sh-gold); }
.sh-switch[aria-checked="true"]::after { transform: translateX(22px); background: var(--sh-night); }
.sh-prefs-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; padding-top: 4px; }
@media (max-width: 640px) {
	.sh-consent { bottom: 10px; width: calc(100% - 20px); }
	.sh-consent-inner { padding: 18px; gap: 12px; }
	.sh-consent-actions { width: 100%; }
	.sh-consent-actions .sh-btn { flex: 1 1 calc(50% - 4px); min-width: 0; }
	.sh-consent-actions [data-act="manage"] { flex-basis: 100%; }
	.sh-prefs-card { padding: 24px 20px; }
}

/* ---------- Motion off ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.wp-block-button__link:hover, .sh-btn:hover, .sh-pick:hover img { transform: none; }
}