/* ==========================================================================
   Alembic — craft distillery theme
   Modern CSS throughout: @property, oklch + color-mix, nesting, container
   queries, :has(), scroll-driven animations, @starting-style, popover and
   dialog, cross-document view transitions. Every effect degrades to a calm,
   static layout where unsupported.
   ========================================================================== */

@font-face { font-family: "Fraunces"; src: url("../fonts/fraunces-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Fraunces"; src: url("../fonts/fraunces-var-italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/instrument-sans-var.woff2") format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/jetbrains-mono-var.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }

@property --liquid { syntax: "<color>"; inherits: true; initial-value: #c27a2c; }
@property --swirl { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@property --v { syntax: "<number>"; inherits: false; initial-value: 5; }

@view-transition { navigation: auto; }

:root {
	--ink: #120d09;
	--ink-2: #1c150f;
	--ink-3: #2a2018;
	--paper: #f4ecdf;
	--paper-2: #eadfcb;
	--text: #21190f;
	--muted: color-mix(in oklch, var(--text) 62%, var(--paper));
	--on-dark: #f3e9d8;
	--on-dark-muted: color-mix(in oklch, var(--on-dark) 64%, var(--ink));
	--accent: #c8862f;
	--accent-ink: #7a4a14;
	--line: color-mix(in oklch, var(--text) 16%, transparent);
	--line-dark: color-mix(in oklch, var(--on-dark) 16%, transparent);

	--f-display: "Fraunces", "Iowan Old Style", Georgia, serif;
	--f-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--f-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;

	--gutter: clamp(1rem, 4vw, 3rem);
	--wrap: 1280px;
	--radius: 14px;
	--ease: cubic-bezier(.2, .7, .1, 1);
	--ease-out: cubic-bezier(.16, 1, .3, 1);
	color-scheme: light;
	interpolate-size: allow-keywords;
}

.alm-mood-botanical { --accent: #5f8f6e; --accent-ink: #2f5a3d; --liquid: #9fb79c; }
.alm-mood-copper { --accent: #c0643a; --accent-ink: #7b3415; }

/* ---------- Base ---------- */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
body {
	margin: 0;
	background: var(--paper);
	color: var(--text);
	font: 400 1.0625rem/1.65 var(--f-body);
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { text-wrap: balance; margin: 0; }
p { text-wrap: pretty; margin: 0 0 1em; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: color-mix(in oklch, var(--accent) 40%, transparent); }
.screen-reader-text, .alm-skip:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.alm-skip:focus { position: fixed; z-index: 1000; top: 1rem; left: 1rem; padding: .7rem 1rem; background: var(--ink); color: var(--on-dark); border-radius: 8px; }

.alm-wrap { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }
.alm-eyebrow {
	font: 500 .75rem/1.3 var(--f-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 0 0 1rem;
	& a { text-decoration: none; }
}
.alm-h1 { font: 380 clamp(2.6rem, 6vw, 5.4rem)/1 var(--f-display); letter-spacing: -.02em; font-variation-settings: "SOFT" 60, "WONK" 0; }
.alm-h2 { font: 380 clamp(2rem, 4.2vw, 3.6rem)/1.04 var(--f-display); letter-spacing: -.018em; font-variation-settings: "SOFT" 50; }
.alm-h3 { font: 450 1.6rem/1.15 var(--f-display); }
.alm-icon { width: 1.15em; height: 1.15em; flex: none; }

.alm-btn {
	--bg: transparent; --fg: currentColor; --bd: currentColor;
	display: inline-flex; align-items: center; gap: .6em;
	padding: .9em 1.45em;
	border-radius: 999px;
	border: 1px solid var(--bd);
	background: var(--bg);
	color: var(--fg);
	font: 600 .95rem/1 var(--f-body);
	letter-spacing: .01em;
	text-decoration: none;
	cursor: pointer;
	transition: background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), border-color .3s;
	& .alm-icon { transition: translate .35s var(--ease-out); }
	&:hover .alm-icon { translate: 4px 0; }
	&:active { transform: scale(.97); }
}
.alm-btn--solid { --bg: var(--accent); --fg: #170f07; --bd: var(--accent); &:hover { --bg: color-mix(in oklch, var(--accent) 82%, white); } }
.alm-btn--ghost { --bd: color-mix(in oklch, currentColor 40%, transparent); &:hover { --bg: color-mix(in oklch, currentColor 10%, transparent); } }
.alm-btn--line { --bd: var(--line); &:hover { --bd: var(--text); } }
.alm-btn--small { padding: .65em 1.1em; font-size: .85rem; }
.alm-link {
	display: inline-flex; align-items: center; gap: .5em;
	font-weight: 600; text-decoration: none;
	border-bottom: 1px solid currentColor; padding-bottom: .15em;
	& .alm-icon { transition: translate .35s var(--ease-out); }
	&:hover .alm-icon { translate: 4px 0; }
}

/* ---------- Header ---------- */

.alm-head {
	--head-fg: var(--text);
	position: fixed; inset: 0 0 auto; z-index: 50;
	color: var(--head-fg);
	transition: background .4s var(--ease), color .4s, backdrop-filter .4s, box-shadow .4s;
	view-transition-name: site-head;
	&.is-scrolled {
		--head-fg: var(--on-dark);
		background: color-mix(in srgb, var(--ink) 90%, transparent);
		backdrop-filter: blur(16px) saturate(140%);
		box-shadow: 0 1px 0 var(--line-dark);
	}
}
.home .alm-head, .single-alm_spirit .alm-head { --head-fg: var(--on-dark); }
.alm-head__inner {
	width: min(100% - 2 * var(--gutter), 1440px); margin-inline: auto;
	display: flex; align-items: center; gap: 2rem;
	min-height: 76px;
}
.alm-brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; margin-right: auto; }
.alm-brand__mark svg { width: 34px; height: 34px; }
.alm-brand__text { display: grid; line-height: 1.05; }
.alm-brand__name { font: 500 1.18rem/1.1 var(--f-display); letter-spacing: -.01em; }
.alm-brand__est { font: 500 .66rem/1.3 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.alm-brand__logo { max-height: 44px; width: auto; }
.alm-nav__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 1.8rem; }
.alm-nav__list a {
	text-decoration: none; font-weight: 500; font-size: .95rem; position: relative;
	&::after { content: ""; position: absolute; inset: auto 0 -6px; height: 1px; background: currentColor; scale: 0 1; transform-origin: right; transition: scale .4s var(--ease-out); }
	&:hover::after, &[aria-current]::after { scale: 1 1; transform-origin: left; }
}
.alm-nav__list .current-menu-item > a::after { scale: 1 1; }
.alm-head__actions { display: flex; align-items: center; gap: .6rem; }
.alm-head__menu, .alm-nav__close { display: none; background: none; border: 0; padding: .5rem; cursor: pointer; color: inherit; }
.alm-head__menu .alm-icon, .alm-nav__close .alm-icon { width: 26px; height: 26px; }

@media (min-width: 900px) {
	.alm-nav[popover] { display: block; position: static; inset: auto; margin: 0; padding: 0; border: 0; background: none; color: inherit; overflow: visible; }
}
@media (max-width: 899px) {
	.alm-head__menu, .alm-nav__close { display: inline-flex; }
	.alm-head__actions .alm-btn { display: none; }
	.alm-nav[popover] {
		position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0;
		border: 0; padding: 5.5rem var(--gutter) 2rem;
		background: var(--ink); color: var(--on-dark);
		opacity: 1; translate: 0 0;
		transition: opacity .35s var(--ease), translate .45s var(--ease-out), display .45s allow-discrete, overlay .45s allow-discrete;
		@starting-style { opacity: 0; translate: 0 -12px; }
		&:not(:popover-open) { opacity: 0; translate: 0 -12px; }
	}
	.alm-nav__close { position: absolute; top: 1.1rem; right: var(--gutter); }
	.alm-nav__list { flex-direction: column; gap: .4rem; }
	.alm-nav__list a { font: 380 2.6rem/1.15 var(--f-display); }
}

/* ---------- The glass (hero + spirit) ---------- */

.alm-glass {
	position: relative; isolation: isolate;
	background: var(--ink);
	color: var(--on-dark);
	overflow: clip;
}
.alm-glass__fallback, .alm-glass__canvas, .alm-glass__grain, .alm-hero__scrim { position: absolute; inset: 0; z-index: -1; }
.alm-glass__canvas { width: 100%; height: 100%; opacity: 0; transition: opacity 1.4s var(--ease); }
.alm-glass.is-live .alm-glass__canvas { opacity: 1; }
/* Painted fallback: a warm window-light through liquid, gently swirling via an animated @property angle. */
.alm-glass__fallback {
	background:
		radial-gradient(60% 55% at 70% 42%, color-mix(in oklch, var(--liquid) 85%, white) 0%, color-mix(in oklch, var(--liquid) 70%, black) 38%, transparent 70%),
		conic-gradient(from var(--swirl) at 66% 48%, transparent 0 20%, color-mix(in oklch, var(--liquid) 40%, transparent) 30%, transparent 45%, color-mix(in oklch, var(--liquid) 30%, transparent) 70%, transparent 85%),
		radial-gradient(120% 90% at 60% 40%, color-mix(in oklch, var(--liquid) 30%, var(--ink)) 0%, var(--ink) 70%);
	filter: blur(18px) saturate(115%);
	scale: 1.1;
	animation: alm-swirl 38s linear infinite;
	transition: --liquid 1.2s var(--ease);
}
@keyframes alm-swirl { to { --swirl: 360deg; } }
.alm-glass__grain {
	opacity: .14; mix-blend-mode: overlay; pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.alm-hero__scrim {
	z-index: -1; pointer-events: none;
	background:
		linear-gradient(90deg, color-mix(in oklch, var(--ink) 82%, transparent) 0%, color-mix(in oklch, var(--ink) 40%, transparent) 42%, transparent 70%),
		linear-gradient(0deg, color-mix(in oklch, var(--ink) 75%, transparent) 0%, transparent 32%),
		linear-gradient(180deg, color-mix(in oklch, var(--ink) 55%, transparent) 0%, transparent 18%);
}

.alm-hero {
	min-height: 100svh;
	display: grid;
	grid-template-rows: 1fr auto;
	padding-top: 96px;
}
.alm-hero__content { align-self: center; padding-block: 3rem 2rem; max-width: var(--wrap); }
.alm-hero__kicker { color: color-mix(in oklch, var(--liquid) 55%, var(--on-dark)); }
.alm-hero__title {
	font: 330 clamp(3.1rem, 8.4vw, 8.2rem)/.94 var(--f-display);
	letter-spacing: -.03em;
	max-width: 11ch;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
	margin-bottom: 1.6rem;
}
.alm-word {
	display: inline-block;
	animation: alm-rise 1.2s var(--ease-out) both;
	animation-delay: calc(.25s + var(--i) * 70ms);
	&:nth-child(n+5) { font-style: italic; color: color-mix(in oklch, var(--liquid) 45%, var(--on-dark)); }
}
@keyframes alm-rise { from { opacity: 0; translate: 0 .35em; filter: blur(8px); } }
.alm-hero__text { max-width: 44ch; font-size: clamp(1.02rem, 1.3vw, 1.18rem); color: var(--on-dark-muted); animation: alm-rise 1.2s .8s var(--ease-out) both; }
.alm-hero__ctas { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; animation: alm-rise 1.2s 1s var(--ease-out) both; }

.alm-hero__dock {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem;
	padding-block: 1.2rem 1.6rem;
	border-top: 1px solid var(--line-dark);
	animation: alm-rise 1.2s 1.2s var(--ease-out) both;
}
/* Leave room for a fixed bottom-left badge if a plugin adds one. */
body:has(> .kln-store-tag) .alm-hero__dock { padding-bottom: 4.6rem; }
.alm-pour { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.alm-pour__label { font: 500 .7rem/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--on-dark-muted); margin-right: .4rem; }
.alm-pour__chip {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .5em .95em .5em .55em; border-radius: 999px; cursor: pointer;
	border: 1px solid var(--line-dark); background: color-mix(in oklch, var(--ink) 40%, transparent);
	backdrop-filter: blur(8px);
	font-size: .85rem; color: var(--on-dark);
	transition: border-color .3s, background .3s;
	&:hover { border-color: color-mix(in oklch, var(--liquid) 70%, transparent); }
	&[aria-checked="true"] { border-color: var(--liquid); background: color-mix(in oklch, var(--liquid) 22%, transparent); }
}
.alm-pour__swatch { width: 1.1em; height: 1.1em; border-radius: 50%; background: radial-gradient(circle at 35% 30%, color-mix(in oklch, var(--liquid) 50%, white), var(--liquid) 55%, color-mix(in oklch, var(--liquid) 60%, black)); box-shadow: 0 0 0 1px rgb(255 255 255 / .2); }
.alm-glass__controls { display: flex; align-items: center; gap: .5rem; }
.alm-ctl {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .55em 1em; border-radius: 999px; cursor: pointer;
	border: 1px solid var(--line-dark); background: color-mix(in oklch, var(--ink) 40%, transparent);
	backdrop-filter: blur(8px); color: var(--on-dark); font-size: .85rem;
	&:hover { background: color-mix(in oklch, var(--on-dark) 12%, transparent); }
}
.alm-ctl--icon { padding: .55em; }
.alm-ctl__play { display: none; }
.is-paused .alm-ctl__pause { display: none; }
.is-paused .alm-ctl__play { display: inline-flex; }
.alm-glass__status {
	font: 500 .68rem/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-muted);
	display: inline-flex; align-items: center; gap: .5em;
	&::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--on-dark-muted); }
	.is-live &::before { background: #7fd18b; box-shadow: 0 0 0 0 #7fd18b; animation: alm-pulse 2.4s infinite; }
}
.alm-glass__status--corner { position: absolute; right: var(--gutter); bottom: 1.4rem; }
@keyframes alm-pulse { 70% { box-shadow: 0 0 0 7px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }

/* ---------- Manifesto (scroll-driven ink fill) ---------- */

.alm-manifesto { padding-block: clamp(5rem, 12vw, 10rem) clamp(4rem, 8vw, 7rem); }
.alm-manifesto__text {
	font: 360 clamp(1.7rem, 3.6vw, 3.1rem)/1.18 var(--f-display);
	letter-spacing: -.012em;
	max-width: 30ch;
	margin-bottom: 2rem;
	color: var(--text);
}
@supports (animation-timeline: view()) {
	.alm-manifesto__text {
		background: linear-gradient(90deg, var(--text) 50%, color-mix(in oklch, var(--text) 22%, var(--paper)) 50%) 100% 0 / 200% 100% no-repeat;
		-webkit-background-clip: text; background-clip: text; color: transparent;
		animation: alm-ink linear both;
		animation-timeline: view();
		animation-range: entry 30% cover 55%;
	}
	@keyframes alm-ink { to { background-position: 0 0; } }
}

/* ---------- Section heads ---------- */

.alm-section-head { display: grid; gap: .2rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); justify-items: start; }
.alm-section-head .alm-h2 { max-width: 18ch; margin-bottom: 1rem; }
.alm-section-head p:not(.alm-eyebrow) { max-width: 52ch; color: var(--muted); }

/* ---------- The range / shelf ---------- */

.alm-range { padding-block: clamp(4rem, 8vw, 7rem); background: var(--paper-2); }
.alm-shelf {
	display: grid; gap: clamp(1rem, 2vw, 1.6rem);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr));
}
.alm-shelf--three { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }

.alm-card {
	container-type: inline-size;
	border-radius: var(--radius);
	background: var(--paper);
	box-shadow: 0 1px 0 var(--line), 0 0 0 1px var(--line);
	transition: translate .5s var(--ease-out), box-shadow .5s var(--ease);
	&:hover { translate: 0 -6px; box-shadow: 0 0 0 1px color-mix(in oklch, var(--liquid) 50%, transparent), 0 24px 50px -24px color-mix(in oklch, var(--liquid) 60%, black); }
}
.alm-card__link { display: grid; height: 100%; text-decoration: none; }
.alm-card__stage {
	aspect-ratio: 4 / 5; display: grid; place-items: center; overflow: clip;
	border-radius: var(--radius) var(--radius) 0 0;
	background:
		radial-gradient(60% 45% at 50% 62%, color-mix(in oklch, var(--liquid) 55%, transparent), transparent 70%),
		linear-gradient(180deg, var(--ink-2), var(--ink));
}
.alm-card__bottle { height: 82%; transition: transform .7s var(--ease-out); }
.alm-card__bottle svg { height: 100%; width: auto; filter: drop-shadow(0 22px 26px rgb(0 0 0 / .5)); }
.alm-card:hover .alm-card__bottle { transform: translateY(-4px) rotate(-3deg) scale(1.03); }
.alm-card__img { width: 100%; height: 100%; object-fit: cover; }
.alm-card__body { padding: 1.2rem 1.25rem 1.4rem; display: grid; gap: .35rem; align-content: start; }
.alm-card__type { font: 500 .68rem/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: color-mix(in oklch, var(--liquid) 55%, var(--text)); margin: 0; }
.alm-card__title { font: 420 1.5rem/1.1 var(--f-display); }
.alm-card__meta { font-size: .85rem; color: var(--muted); margin: 0; }
.alm-card__excerpt { font-size: .92rem; margin: .4rem 0 0; display: none; }
.alm-card__more { display: inline-flex; align-items: center; gap: .4em; margin-top: .6rem; font-weight: 600; font-size: .88rem; }
@container (min-width: 320px) {
	.alm-card__excerpt { display: block; }
	.alm-card__title { font-size: 1.75rem; }
}

/* Bottle drawing */
.alm-bottle__cork { fill: #5a3a22; }
.alm-bottle__glass { fill: rgb(255 255 255 / .07); }
.alm-bottle__outline { fill: none; stroke: rgb(255 255 255 / .42); stroke-width: 1.4; }
.alm-bottle__label rect { fill: #f2e7d3; }
.alm-bottle__label text { text-anchor: middle; fill: #2a1f15; }
.alm-bottle__est { font: 600 6px var(--f-mono); letter-spacing: .25em; }
.alm-bottle__name { font: 500 12.5px var(--f-display); }
.alm-bottle__name--sm { font-size: 9px; font-style: italic; }
.alm-bottle__abv { font: 500 6.5px var(--f-mono); letter-spacing: .12em; fill: #8a6a48 !important; }

/* Archive filter: radio chips + :has() */
.alm-archive { padding-bottom: clamp(4rem, 8vw, 7rem); }
.alm-filter { border: 0; padding: 0; margin: 0 0 2rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.alm-filter__chip {
	display: inline-flex; align-items: center; gap: .4em; cursor: pointer;
	padding: .55em 1.05em; border-radius: 999px; border: 1px solid var(--line); font-weight: 500; font-size: .92rem;
	transition: background .25s, color .25s, border-color .25s;
	& input { position: absolute; opacity: 0; pointer-events: none; }
	&:has(input:checked) { background: var(--text); color: var(--paper); border-color: var(--text); }
	&:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
}
.alm-filter__count { font: 500 .7rem var(--f-mono); opacity: .6; }

/* ---------- Process (sticky still + scroll steps) ---------- */

.alm-process { background: var(--ink); color: var(--on-dark); padding-block: clamp(5rem, 9vw, 8rem); --muted: var(--on-dark-muted); }
.alm-process__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); }
.alm-process__visual { position: sticky; top: 12vh; height: 76vh; display: grid; place-items: center; align-self: start; }
.alm-still { width: min(100%, 420px); height: auto; overflow: visible; }
.alm-still__wash { fill: color-mix(in oklch, var(--accent) 65%, #f4dcae); opacity: .85; translate: 0 120px; transition: translate 1.2s var(--ease-out), fill 1s; }
.alm-still__vapour { stroke: #fff6e6; stroke-dasharray: .08 .06; stroke-dashoffset: 1; opacity: 0; transition: opacity .8s; }
.alm-still__drip { stroke: var(--liquid); opacity: 0; stroke-dasharray: 6 10; }
.alm-still__receiver { fill: rgb(255 255 255 / .06); stroke: rgb(255 255 255 / .4); }
.alm-still__spirit { fill: var(--liquid); opacity: .85; transform-box: fill-box; transform-origin: bottom; scale: 1 0; transition: scale 1.4s var(--ease-out), fill 1s; }
.alm-still__flame path { fill: none; stroke: #ffb35c; stroke-width: 3; stroke-linecap: round; opacity: .2; transition: opacity .6s; }
.alm-process[data-step="0"] .alm-still__wash { translate: 0 60px; }
.alm-process[data-step="1"] .alm-still__wash { translate: 0 30px; fill: color-mix(in oklch, var(--accent) 40%, #f7e9c6); }
.alm-process:is([data-step="2"], [data-step="3"]) {
	& .alm-still__wash { translate: 0 40px; }
	& .alm-still__flame path { opacity: 1; animation: alm-flicker .9s ease-in-out infinite alternate; }
	& .alm-still__vapour { opacity: .8; animation: alm-flow 2.4s linear infinite; }
	& .alm-still__drip { opacity: 1; animation: alm-drip 1s linear infinite; }
	& .alm-still__spirit { scale: 1 .55; }
}
.alm-process[data-step="3"] .alm-still__spirit { scale: 1 .9; fill: color-mix(in oklch, var(--liquid) 80%, #3a1c08); }
@keyframes alm-flicker { to { translate: 0 -3px; opacity: .7; } }
@keyframes alm-flow { to { stroke-dashoffset: 0; } }
@keyframes alm-drip { to { stroke-dashoffset: -16; } }
.alm-process__dots { list-style: none; display: flex; gap: .5rem; padding: 0; margin: 1.5rem 0 0; }
.alm-process__dots li { width: 28px; height: 3px; border-radius: 2px; background: var(--line-dark); transition: background .5s; }
.alm-process[data-step="0"] li:nth-child(-n+1),
.alm-process[data-step="1"] li:nth-child(-n+2),
.alm-process[data-step="2"] li:nth-child(-n+3),
.alm-process[data-step="3"] li { background: var(--accent); }

.alm-step {
	min-height: 52vh; display: grid; align-content: center; gap: .4rem;
	border-top: 1px solid var(--line-dark); padding-block: 2.5rem;
	opacity: .35; transition: opacity .6s var(--ease);
	&.is-current { opacity: 1; }
}
.alm-step__num { font: 500 .8rem var(--f-mono); color: var(--accent); margin: 0; }
.alm-step__title { font: 360 clamp(2.4rem, 5vw, 4.2rem)/1 var(--f-display); font-style: italic; letter-spacing: -.02em; }
.alm-step__text { max-width: 42ch; color: var(--on-dark-muted); margin: .6rem 0 .4rem; }
.alm-step__fact { font: 500 .78rem var(--f-mono); letter-spacing: .08em; color: var(--on-dark); margin: 0; }
@supports (animation-timeline: view()) {
	.alm-step__title { animation: alm-slide linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
	@keyframes alm-slide { from { translate: -24px 0; opacity: 0; } }
}

/* ---------- Flavour finder ---------- */

.alm-finder { padding-block: clamp(5rem, 9vw, 8rem); transition: --liquid .8s var(--ease); }
.alm-finder__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.alm-sliders { display: grid; gap: 1.1rem; }
.alm-slider { display: grid; grid-template-columns: 6rem 1fr 2rem; align-items: center; gap: 1rem; }
.alm-slider__label { font-weight: 600; }
.alm-slider__out { font: 500 .9rem var(--f-mono); text-align: right; }
.alm-slider input {
	appearance: none; -webkit-appearance: none; height: 6px; border-radius: 3px; cursor: pointer; margin: 0;
	background: linear-gradient(90deg, var(--liquid) calc(var(--v) * 10%), var(--line) calc(var(--v) * 10%));
	transition: --v .15s;
	&::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: var(--paper); border: 2px solid var(--text); box-shadow: 0 2px 8px rgb(0 0 0 / .2); }
	&::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--paper); border: 2px solid var(--text); }
}
.alm-finder__result {
	display: grid; gap: 1rem; padding: clamp(1.4rem, 3vw, 2.4rem);
	border-radius: calc(var(--radius) * 1.5);
	background: var(--ink); color: var(--on-dark); --muted: var(--on-dark-muted);
	box-shadow: 0 40px 80px -40px color-mix(in oklch, var(--liquid) 70%, black);
}
.alm-finder__match { view-transition-name: finder-match; }
.alm-finder__name { font: 380 2.4rem/1.05 var(--f-display); margin-bottom: .6rem; }
.alm-finder__notes { color: var(--on-dark-muted); }
.alm-finder__legend { font: 500 .72rem var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--on-dark-muted); display: flex; align-items: center; gap: .5rem; margin: 0; }
.alm-key { width: 18px; height: 3px; border-radius: 2px; display: inline-block; }
.alm-key--spirit { background: var(--liquid); }
.alm-key--you { background: repeating-linear-gradient(90deg, var(--on-dark) 0 4px, transparent 4px 7px); margin-left: .8rem; }

.alm-radar { width: 100%; max-width: 420px; margin-inline: auto; overflow: visible; }
.alm-radar__ring { fill: none; stroke: currentColor; stroke-opacity: .14; }
.alm-radar__spoke { stroke: currentColor; stroke-opacity: .14; }
.alm-radar__label { font: 500 10px var(--f-mono); letter-spacing: .1em; text-transform: uppercase; fill: currentColor; opacity: .7; text-anchor: middle; }
.alm-radar__shape { fill: color-mix(in oklch, var(--liquid) 45%, transparent); stroke: var(--liquid); stroke-width: 2; stroke-linejoin: round; transition: all .6s var(--ease-out); }
.alm-radar__you { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-dasharray: 4 3; transition: all .3s var(--ease-out); }

/* ---------- Numbers ---------- */

.alm-numbers { background: var(--ink-2); color: var(--on-dark); padding-block: clamp(3.5rem, 7vw, 6rem); }
.alm-numbers__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2rem; }
.alm-number { border-top: 1px solid var(--line-dark); padding-top: 1.2rem; }
.alm-number__value { font: 300 clamp(3rem, 6vw, 5rem)/1 var(--f-display); font-variant-numeric: tabular-nums; color: color-mix(in oklch, var(--accent) 70%, var(--on-dark)); margin-bottom: .6rem; }
.alm-number__label { color: var(--on-dark-muted); max-width: 20ch; margin: 0; }

/* ---------- Tours ---------- */

.alm-visit-teaser { padding-block: clamp(5rem, 9vw, 8rem); }
.alm-visit-teaser--page { padding-block: 0 clamp(3rem, 6vw, 5rem); }
.alm-tours { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: 1.2rem; }
.alm-tour {
	display: grid; align-content: start; gap: .7rem;
	padding: 1.8rem; border-radius: var(--radius);
	border: 1px solid var(--line); background: #fbf6ee;
	transition: border-color .3s, translate .5s var(--ease-out);
	&:hover { border-color: var(--text); translate: 0 -4px; }
}
.alm-tour__title { font: 420 1.7rem/1.1 var(--f-display); }
.alm-tour__meta { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .88rem; color: var(--muted); margin: 0; & span { display: inline-flex; gap: .35em; align-items: center; } }
.alm-tour__text { margin: 0; }
.alm-tour__list { margin: 0; padding-left: 1.1rem; font-size: .92rem; color: var(--muted); }
.alm-tour__price { font: 400 2rem/1 var(--f-display); margin: .4rem 0; & small { font: 400 .85rem var(--f-body); color: var(--muted); } }
.alm-tour .alm-btn { justify-self: start; }

/* ---------- Journal ---------- */

.alm-journal { padding-block: clamp(4rem, 8vw, 7rem); background: var(--paper-2); }
.alm-journal--index { background: none; padding-top: 0; }
.alm-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: clamp(1.2rem, 3vw, 2.4rem); }
.alm-post__link { display: grid; gap: .55rem; text-decoration: none; }
.alm-post__cover {
	aspect-ratio: 3 / 2; border-radius: var(--radius); overflow: clip; display: grid; place-items: center; margin-bottom: .6rem;
	background:
		radial-gradient(70% 60% at 70% 30%, oklch(.72 .13 calc(var(--hue) * 1deg + 30deg) / .9), transparent 70%),
		linear-gradient(160deg, oklch(.32 .06 calc(var(--hue) * 1deg + 30deg)), var(--ink));
	transition: scale .6s var(--ease-out);
}
.alm-post__link:hover .alm-post__cover { scale: .985; }
.alm-post__glyph { font: 300 7rem/1 var(--f-display); font-style: italic; color: rgb(255 245 230 / .85); }
.alm-post__img { width: 100%; height: 100%; object-fit: cover; }
.alm-post__meta { font: 500 .7rem/1.4 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin: 0; }
.alm-post__title { font: 420 1.55rem/1.15 var(--f-display); }
.alm-post__excerpt { color: var(--muted); margin: 0; }
.nav-links { display: flex; gap: .5rem; margin-top: 3rem; flex-wrap: wrap; }
.page-numbers { padding: .5em .9em; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; &.current { background: var(--text); color: var(--paper); } }

/* Reveal-on-scroll for cards (scroll timelines, IO fallback below) */
@supports (animation-timeline: view()) {
	.alm-card, .alm-post, .alm-tour, .alm-number {
		animation: alm-up linear both; animation-timeline: view(); animation-range: entry 5% entry 60%;
	}
	@keyframes alm-up { from { opacity: 0; translate: 0 40px; } }
}
.no-scroll-timeline :is(.alm-card, .alm-post, .alm-tour, .alm-number):not(.is-in) { opacity: 0; translate: 0 30px; }
.no-scroll-timeline :is(.alm-card, .alm-post, .alm-tour, .alm-number) { transition: opacity .8s var(--ease), translate .8s var(--ease-out); }

/* ---------- Page heads, prose, articles ---------- */

.alm-page-head { padding-block: calc(76px + clamp(3rem, 7vw, 6rem)) clamp(2.5rem, 5vw, 4rem); }
.alm-page-head__text { max-width: 58ch; font-size: 1.15rem; color: var(--muted); margin-top: 1.4rem; }
.alm-prose {
	width: min(100% - 2 * var(--gutter), 720px); margin-inline: auto;
	font-size: 1.1rem;
	& > * + * { margin-top: 1.2em; }
	& h2 { font: 420 2rem/1.15 var(--f-display); margin-top: 2em; }
	& h3 { font: 450 1.45rem/1.2 var(--f-display); margin-top: 1.6em; }
	& blockquote { margin-inline: 0; padding-left: 1.4rem; border-left: 2px solid var(--accent); font: italic 380 1.5rem/1.35 var(--f-display); }
	& a { color: var(--accent-ink); }
	& img { border-radius: var(--radius); }
	& .alignwide { width: min(100vw - 2 * var(--gutter), 1100px); margin-inline: 50%; translate: -50% 0; }
	& ul, & ol { padding-left: 1.2rem; }
}
.alm-article { padding-bottom: clamp(4rem, 8vw, 7rem); }
.alm-article__head { padding-top: calc(76px + clamp(3rem, 7vw, 6rem)); padding-bottom: 2.5rem; max-width: 980px; }
.alm-article__lede { font: 360 1.5rem/1.4 var(--f-display); color: var(--muted); margin-top: 1.5rem; max-width: 46ch; }
.alm-article__figure { margin-block: 0 3rem; & img { border-radius: var(--radius); width: 100%; } }
.alm-article__foot { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.alm-article__nav { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; font-weight: 600; & a { text-decoration: none; } }
.alm-progress {
	position: fixed; inset: 0 0 auto; height: 3px; z-index: 60; background: var(--accent);
	transform-origin: left; scale: 0 1;
	animation: alm-grow linear both; animation-timeline: scroll(root);
}
@keyframes alm-grow { to { scale: 1 1; } }
@supports not (animation-timeline: scroll()) { .alm-progress { display: none; } }

/* ---------- Single spirit ---------- */

.alm-spirit__hero { min-height: 92svh; display: grid; align-items: center; padding-block: 110px 4rem; }
.alm-spirit__hero .alm-hero__scrim { background: linear-gradient(90deg, color-mix(in oklch, var(--ink) 75%, transparent), transparent 60%), linear-gradient(0deg, color-mix(in oklch, var(--ink) 70%, transparent), transparent 30%); }
.alm-spirit__hero-grid { display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: 3rem; }
.alm-spirit__title { font: 330 clamp(3rem, 7.5vw, 7rem)/.95 var(--f-display); letter-spacing: -.03em; font-variation-settings: "SOFT" 100, "opsz" 144; margin-bottom: 1.4rem; }
.alm-spirit__lede { font-size: 1.2rem; max-width: 40ch; color: var(--on-dark-muted); }
.alm-spirit__buy { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 2rem; }
.alm-spirit__price { font: 380 2rem/1 var(--f-display); }
.alm-spirit__bottle { justify-self: center; height: min(66svh, 560px); & svg { height: 100%; width: auto; filter: drop-shadow(0 40px 40px rgb(0 0 0 / .55)); } }
.alm-spirit__img { height: 100%; width: auto; object-fit: contain; }
.alm-spirit__body { padding-block: clamp(3rem, 7vw, 6rem); display: grid; gap: clamp(3rem, 6vw, 5rem); }
.alm-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin: 0; border-block: 1px solid var(--line); }
.alm-fact { padding: 1.3rem 1rem 1.3rem 0; & dt { font: 500 .68rem var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); } & dd { margin: .4rem 0 0; font: 420 1.25rem/1.2 var(--f-display); } }
.alm-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2.5rem; }
.alm-note__title { font: 360 2.6rem/1 var(--f-display); font-style: italic; color: color-mix(in oklch, var(--liquid) 60%, var(--text)); margin-bottom: 1rem; }
.alm-note__text { font-size: 1.1rem; }
.alm-spirit__profile { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; padding: clamp(1.5rem, 4vw, 3rem); border-radius: calc(var(--radius) * 1.5); background: var(--ink); color: var(--on-dark); --muted: var(--on-dark-muted); }
.alm-serve__text { font: 360 1.7rem/1.3 var(--f-display); }
.alm-spirit .alm-prose { width: 100%; margin: 0; max-width: 720px; }
.alm-range--more { background: var(--paper-2); }

/* ---------- Visit + form ---------- */

.alm-visit { display: grid; grid-template-columns: 1fr 340px; gap: 3rem; align-items: start; padding-bottom: clamp(3rem, 6vw, 5rem); }
.alm-visit .alm-prose { width: 100%; margin: 0; }
.alm-visit__card {
	position: sticky; top: 100px; padding: 1.8rem; border-radius: var(--radius); background: var(--ink); color: var(--on-dark); --muted: var(--on-dark-muted);
	& .alm-eyebrow { display: flex; gap: .5em; align-items: center; margin-top: 1.2rem; &:first-child { margin-top: 0; } }
	& address { font-style: normal; }
}
.alm-visit__book { padding-block: clamp(3rem, 6vw, 5rem); border-top: 1px solid var(--line); }

.alm-form { display: grid; gap: 1.6rem; max-width: 980px; }
.alm-form__alert { padding: 1rem 1.2rem; border-radius: 10px; background: #f8ddd2; color: #6d2311; font-weight: 600; margin: 0; }
.alm-form__legend { font: 500 .75rem var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: .8rem; }
.alm-form__tours { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .8rem; }
.alm-pick {
	position: relative; cursor: pointer; padding: 1.1rem 1.2rem; border-radius: 12px; border: 1px solid var(--line);
	background: #fbf6ee;
	transition: border-color .25s, box-shadow .25s;
	& input { position: absolute; opacity: 0; }
	&:has(input:checked) { border-color: var(--text); box-shadow: inset 0 0 0 1px var(--text); }
	&:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
}
.alm-pick__body { display: grid; gap: .25rem; }
.alm-pick__title { font: 450 1.2rem/1.2 var(--f-display); }
.alm-pick__meta { font-size: .85rem; color: var(--muted); }
.alm-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; }
.alm-field { display: grid; gap: .4rem; align-content: start; }
.alm-field__label { font-weight: 600; font-size: .92rem; }
.alm-field__hint { font-size: .8rem; color: var(--muted); }
.alm-field :is(input, select, textarea) {
	width: 100%; padding: .85rem 1rem; border-radius: 10px; border: 1px solid color-mix(in oklch, var(--text) 25%, transparent);
	background: #fffaf2; transition: border-color .2s, box-shadow .2s;
	&:focus { outline: none; border-color: var(--text); box-shadow: 0 0 0 3px color-mix(in oklch, var(--accent) 30%, transparent); }
	&[aria-invalid="true"], &:user-invalid { border-color: #b3401f; }
}
.alm-field__error { color: #9e3416; font-size: .85rem; font-weight: 600; }
.alm-form__checks { display: grid; gap: .6rem; }
.alm-check { display: flex; gap: .7rem; align-items: start; cursor: pointer; & input { width: 1.15rem; height: 1.15rem; margin-top: .25rem; accent-color: var(--text); } }
.alm-form__hp { position: absolute; left: -9999px; }
.alm-form__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.alm-form__estimate { margin: 0; font: 500 .8rem var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); & output { font: 420 1.5rem var(--f-display); letter-spacing: 0; text-transform: none; color: var(--text); margin-left: .5rem; } }
.alm-form__small { font-size: .85rem; color: var(--muted); margin: 0; }
.alm-book__done { padding: 2rem; border-radius: var(--radius); background: var(--ink); color: var(--on-dark); --muted: var(--on-dark-muted); &:focus { outline: none; } }
.alm-ref { font-family: var(--f-mono); color: var(--accent); }

.alm-faq { padding-bottom: clamp(4rem, 8vw, 7rem); & > * { max-width: 860px; } & .alm-h2 { margin-bottom: 2rem; } }
.alm-faq__item {
	border-top: 1px solid var(--line);
	&:last-child { border-bottom: 1px solid var(--line); }
	& summary { cursor: pointer; list-style: none; padding: 1.3rem 2.5rem 1.3rem 0; position: relative; font: 420 1.3rem/1.3 var(--f-display); }
	& summary::-webkit-details-marker { display: none; }
	& summary::after { content: "+"; position: absolute; right: 0; top: 1.1rem; font: 300 1.8rem var(--f-body); transition: rotate .35s var(--ease-out); }
	&[open] summary::after { rotate: 45deg; }
	& p { padding-bottom: 1.3rem; color: var(--muted); margin: 0; }
	&::details-content { block-size: 0; overflow: clip; transition: block-size .45s var(--ease-out), content-visibility .45s allow-discrete; }
	&[open]::details-content { block-size: auto; }
}

/* ---------- Age notice ---------- */

.alm-gate {
	border: 0; padding: 0; max-width: min(92vw, 520px); border-radius: 22px;
	background: color-mix(in oklch, var(--ink) 92%, transparent); color: var(--on-dark);
	box-shadow: 0 40px 100px rgb(0 0 0 / .6), inset 0 0 0 1px var(--line-dark);
	opacity: 1; scale: 1;
	transition: opacity .5s var(--ease), scale .6s var(--ease-out), display .6s allow-discrete, overlay .6s allow-discrete;
	@starting-style { opacity: 0; scale: .94; }
	&::backdrop { background: rgb(10 7 4 / .45); backdrop-filter: blur(10px); transition: background .5s, display .5s allow-discrete, overlay .5s allow-discrete; }
	&:not([open]) { opacity: 0; scale: .96; }
}
.alm-gate__inner { padding: clamp(1.8rem, 5vw, 3rem); text-align: center; display: grid; justify-items: center; }
.alm-gate .alm-eyebrow { color: var(--on-dark-muted); }
.alm-gate__title { font: 360 clamp(2rem, 6vw, 3rem)/1.05 var(--f-display); margin-bottom: 1rem; }
.alm-gate__text { color: var(--on-dark-muted); max-width: 36ch; }
.alm-gate__actions { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; margin-top: .8rem; }

/* ---------- Footer ---------- */

.alm-foot { background: var(--ink); color: var(--on-dark); padding-top: clamp(4rem, 8vw, 6rem); --muted: var(--on-dark-muted); }
.alm-foot__inner { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 2.5rem; padding-bottom: 3.5rem; }
.alm-foot__name { font: 380 clamp(2rem, 3.5vw, 2.8rem)/1 var(--f-display); margin-bottom: .8rem; }
.alm-foot__tag { color: var(--on-dark-muted); max-width: 28ch; }
.alm-foot address { font-style: normal; }
.alm-foot a { text-decoration: none; &:hover { text-decoration: underline; } }
.alm-foot__menu { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .3rem; }
.alm-foot__widgets { grid-column: 1 / -1; }
.alm-foot__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-block: 1.6rem 2.2rem; border-top: 1px solid var(--line-dark); font-size: .85rem; color: var(--on-dark-muted); & p { margin: 0; } }

/* ---------- Search form, comments, misc ---------- */

.search-form { display: flex; gap: .5rem; margin-top: 2rem; max-width: 520px; }
.search-form label { flex: 1; }
.search-field { width: 100%; padding: .8rem 1rem; border-radius: 999px; border: 1px solid var(--line); background: #fffaf2; }
.search-submit { padding: .8rem 1.3rem; border-radius: 999px; border: 0; background: var(--text); color: var(--paper); cursor: pointer; }
.alm-comments { margin-top: 4rem; }
.alm-comments__list { list-style: none; padding: 0; }
.comment-body { padding: 1.2rem 0; border-top: 1px solid var(--line); }
.comment-form :is(input[type=text], input[type=email], input[type=url], textarea) { width: 100%; padding: .8rem 1rem; border-radius: 10px; border: 1px solid var(--line); background: #fffaf2; }
.alm-tags a { display: inline-block; padding: .3em .8em; border: 1px solid var(--line); border-radius: 999px; font-size: .85rem; text-decoration: none; margin: 0 .3rem .3rem 0; }
.wp-caption-text, figcaption { font-size: .88rem; color: var(--muted); margin-top: .6rem; }
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { margin-inline: auto; }
.sticky, .bypostauthor, .gallery-caption { outline: 0; }

/* ---------- View transitions ---------- */

::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; animation-timing-function: var(--ease); }
::view-transition-group(*) { animation-duration: .6s; animation-timing-function: var(--ease-out); }
::view-transition-group(site-head) { animation: none; }

/* ---------- Responsive ---------- */

@media (max-width: 960px) {
	.alm-process__grid, .alm-finder__grid, .alm-spirit__hero-grid, .alm-spirit__profile, .alm-visit { grid-template-columns: 1fr; }
	.alm-process__visual { position: sticky; top: 76px; height: 34vh; z-index: 1; background: linear-gradient(var(--ink) 85%, transparent); }
	.alm-still { height: 100%; width: auto; }
	.alm-process__dots { display: none; }
	.alm-step { min-height: 46vh; }
	.alm-spirit__bottle { height: 46svh; order: -1; }
	.alm-visit__card { position: static; }
	.alm-foot__inner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
	.alm-hero .alm-hero__scrim { background: linear-gradient(180deg, color-mix(in oklch, var(--ink) 30%, transparent) 0%, color-mix(in oklch, var(--ink) 62%, transparent) 22%, color-mix(in oklch, var(--ink) 70%, transparent) 70%, color-mix(in oklch, var(--ink) 85%, transparent) 100%); }
	.alm-hero__dock { flex-direction: column; align-items: flex-start; }
	.alm-pour__label { width: 100%; }
	.alm-slider { grid-template-columns: 4.6rem 1fr 1.6rem; gap: .7rem; }
	.alm-foot__inner { grid-template-columns: 1fr; }
	.alm-brand__est { display: none; }
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
	.alm-manifesto__text { animation: none !important; background: none !important; color: var(--text) !important; }
	.alm-card, .alm-post, .alm-tour, .alm-number { animation: none !important; }
	.alm-step { opacity: 1; }
	@view-transition { navigation: none; }
}
@media (forced-colors: active) {
	.alm-glass__canvas, .alm-glass__fallback, .alm-glass__grain { display: none; }
	.alm-btn { border: 1px solid ButtonText; }
}

/* ==========================================================================
   Inner pages: breadcrumbs, cocktails, story, dilution calculator, journal
   ========================================================================== */

.alm-crumbs { margin-bottom: 1.4rem; font: 500 .72rem/1.3 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; }
.alm-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.alm-crumbs li + li::before { content: "/"; margin-right: .4rem; opacity: .45; }
.alm-crumbs a { text-decoration: none; color: inherit; opacity: .7; &:hover { opacity: 1; text-decoration: underline; } }
.alm-crumbs [aria-current] { opacity: .95; }
.alm-spirit__hero .alm-crumbs, .alm-spirit__intro .alm-crumbs { color: var(--on-dark-muted); }

.alm-finder-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.5rem; margin-bottom: 1.6rem; border-radius: var(--radius); background: var(--ink); color: var(--on-dark); & p { margin: 0; } }
.alm-finder-cta strong { font: 420 1.25rem var(--f-display); margin-right: .5rem; }

/* Chips (shared) */
.alm-chips { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 1.6rem 0 0; }
.alm-chips li { display: inline-flex; align-items: center; gap: .4em; padding: .45em .95em; border: 1px solid var(--line); border-radius: 999px; font-size: .88rem; font-weight: 500; }

/* ---------- Cocktails ---------- */

.alm-cocktails { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: clamp(1rem, 2vw, 1.6rem); }
.alm-cocktails--row { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.alm-cocktail { border-radius: var(--radius); background: #fbf6ee; box-shadow: 0 0 0 1px var(--line); transition: translate .5s var(--ease-out), box-shadow .5s var(--ease); &:hover { translate: 0 -5px; box-shadow: 0 0 0 1px color-mix(in oklch, var(--liquid) 55%, transparent), 0 22px 44px -24px color-mix(in oklch, var(--liquid) 60%, black); } }
.alm-cocktail__link { display: grid; text-decoration: none; height: 100%; }
.alm-cocktail__stage {
	aspect-ratio: 5 / 4; display: grid; place-items: center; overflow: clip; border-radius: var(--radius) var(--radius) 0 0;
	background: radial-gradient(60% 55% at 50% 55%, color-mix(in oklch, var(--liquid) 45%, transparent), transparent 70%), linear-gradient(180deg, var(--ink-2), var(--ink));
	& .alm-cg { height: 78%; width: auto; transition: transform .7s var(--ease-out); }
}
.alm-cocktail:hover .alm-cg { transform: translateY(-4px) rotate(-3deg) scale(1.04); }
.alm-cocktail__body { padding: 1.1rem 1.25rem 1.3rem; display: grid; gap: .3rem; }
.alm-cg__liquid { fill: var(--liquid); opacity: .9; }
.alm-cg__ice { fill: rgb(255 255 255 / .22); stroke: rgb(255 255 255 / .5); stroke-width: 1; }
.alm-cg__line { stroke: rgb(255 255 255 / .6); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; fill: none; }

.alm-recipe__head { display: grid; grid-template-columns: 1.3fr .7fr; gap: 3rem; align-items: center; }
.alm-recipe__glass { height: min(46vh, 380px); display: grid; place-items: center; border-radius: calc(var(--radius) * 1.5); background: radial-gradient(60% 55% at 50% 55%, color-mix(in oklch, var(--liquid) 50%, transparent), transparent 70%), var(--ink); overflow: clip; & svg, & img { height: 78%; width: auto; } }
.alm-recipe__grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(2rem, 6vw, 5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.alm-recipe__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.alm-scaler { display: inline-flex; align-items: center; gap: .6rem; font: 500 .75rem var(--f-mono); letter-spacing: .1em; text-transform: uppercase; & input { width: 4.2rem; padding: .5rem .7rem; border-radius: 999px; border: 1px solid var(--line); background: #fffaf2; text-align: center; font: 500 1rem var(--f-body); } }
.alm-ingredients { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.alm-ingredients li { padding: .85rem 0; border-bottom: 1px solid var(--line); font: 400 1.2rem/1.3 var(--f-display); font-variant-numeric: tabular-nums; }
.alm-garnish { margin-top: 1.2rem; color: var(--muted); }
.alm-steps { counter-reset: s; list-style: none; padding: 0; margin: 1.2rem 0 0; display: grid; gap: 1.2rem; }
.alm-steps li { counter-increment: s; display: grid; grid-template-columns: 2.6rem 1fr; gap: .8rem; font-size: 1.12rem; }
.alm-steps li::before { content: counter(s, decimal-leading-zero); font: 500 .85rem var(--f-mono); color: color-mix(in oklch, var(--liquid) 60%, var(--text)); padding-top: .35rem; }
.alm-recipe__prose { width: 100%; margin: 2rem 0 0; }
.alm-recipe__spirit { padding-bottom: clamp(3rem, 6vw, 5rem); }
.alm-spiritlink { display: flex; align-items: center; gap: 1.6rem; padding: 1.4rem 2rem; border-radius: calc(var(--radius) * 1.5); background: var(--ink); color: var(--on-dark); text-decoration: none; transition: translate .4s var(--ease-out); &:hover { translate: 0 -3px; } & > .alm-icon { margin-left: auto; width: 28px; height: 28px; } }
.alm-spiritlink__bottle { height: 110px; & svg { height: 100%; width: auto; } }
.alm-spiritlink > span:nth-child(2) { display: grid; gap: .2rem; }
.alm-spiritlink__name { font: 380 2rem/1.1 var(--f-display); }
.alm-spiritlink__meta { color: var(--on-dark-muted); font-size: .92rem; }
.alm-spiritlink .alm-eyebrow { margin: 0; color: var(--on-dark-muted); }

/* ---------- Story ---------- */

.alm-timeline-wrap { background: var(--ink); color: var(--on-dark); padding-block: clamp(4rem, 8vw, 7rem); margin-top: clamp(3rem, 6vw, 5rem); --muted: var(--on-dark-muted); }
.alm-timeline { list-style: none; margin: 0; padding: 0 0 0 1.6rem; position: relative; max-width: 860px; }
.alm-timeline::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 2px; background: var(--line-dark); }
.alm-timeline::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 2px; background: var(--accent); transform-origin: top; scale: 1 0; animation: alm-draw linear both; animation-timeline: view(); animation-range: entry 30% exit 60%; }
@supports not (animation-timeline: view()) { .alm-timeline::after { scale: 1 1; animation: none; } }
@keyframes alm-draw { to { scale: 1 1; } }
.alm-timeline__item { display: grid; grid-template-columns: 6rem 1fr; gap: 1.6rem; padding-block: 1.6rem; position: relative; }
.alm-timeline__item::before { content: ""; position: absolute; left: -1.6rem; top: 2.25rem; width: 11px; height: 11px; margin-left: -4.5px; border-radius: 50%; background: var(--ink); border: 2px solid var(--accent); }
.alm-timeline__year { font: 300 2.4rem/1 var(--f-display); color: var(--accent); margin: 0; font-variant-numeric: tabular-nums; }
.alm-timeline__title { font: 420 1.6rem/1.2 var(--f-display); margin-bottom: .5rem; }
.alm-timeline__item p:last-child { color: var(--on-dark-muted); max-width: 52ch; margin: 0; }

.alm-values { padding-block: clamp(4rem, 8vw, 7rem); }
.alm-values__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 2rem; }
.alm-value { border-top: 1px solid var(--text); padding-top: 1.4rem; }
.alm-value__num { font: 500 .8rem var(--f-mono); color: var(--accent-ink); margin: 0 0 1rem; }
.alm-value .alm-h3 { font-style: italic; margin-bottom: .6rem; }
.alm-value p:last-child { color: var(--muted); margin: 0; }

.alm-people { background: var(--paper-2); padding-block: clamp(4rem, 8vw, 7rem); }
.alm-people__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1.4rem; }
.alm-person { padding: 1.6rem; border-radius: var(--radius); background: #fbf6ee; box-shadow: 0 0 0 1px var(--line); }
.alm-person__badge { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 1.2rem; font: 400 1.5rem var(--f-display); color: #fff7e8; background: radial-gradient(circle at 30% 25%, color-mix(in oklch, var(--liquid) 60%, white), var(--liquid) 55%, color-mix(in oklch, var(--liquid) 55%, black)); box-shadow: 0 8px 20px -8px var(--liquid); }
.alm-person__name { font: 430 1.35rem/1.2 var(--f-display); }
.alm-person__role { font: 500 .7rem var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: .3rem 0 .8rem; }
.alm-person p:last-child { margin: 0; font-size: .96rem; color: var(--muted); }

.alm-estate { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; padding-block: clamp(4rem, 8vw, 7rem); }
.alm-estate__list { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: .9rem; & li { display: grid; grid-template-columns: 6rem 1fr; align-items: baseline; border-top: 1px solid var(--line); padding-top: .9rem; } & strong { font: 300 2.4rem/1 var(--f-display); color: var(--accent-ink); } }
.alm-estate__cta { padding: clamp(1.8rem, 4vw, 3rem); border-radius: calc(var(--radius) * 1.5); background: var(--ink); color: var(--on-dark); display: grid; gap: 1.4rem; justify-items: start; }
.alm-estate__quote { font: 360 clamp(1.8rem, 3vw, 2.4rem)/1.15 var(--f-display); font-style: italic; margin: 0; }

/* ---------- Dilution calculator ---------- */

.alm-dilute { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 3rem; padding: clamp(1.5rem, 4vw, 2.6rem); border-radius: calc(var(--radius) * 1.5); background: color-mix(in oklch, var(--liquid) 12%, #fbf6ee); box-shadow: 0 0 0 1px color-mix(in oklch, var(--liquid) 35%, transparent); }
.alm-dilute__intro p:last-child { color: var(--muted); margin: .6rem 0 0; }
.alm-dilute__form { display: grid; gap: 1.2rem; align-content: center; }
.alm-dilute__row { display: grid; grid-template-columns: 4.5rem 1fr 4.5rem; align-items: center; gap: 1rem; font-weight: 600; & output { font: 500 .95rem var(--f-mono); text-align: right; } & input { appearance: none; -webkit-appearance: none; height: 6px; border-radius: 3px; cursor: pointer; margin: 0; background: linear-gradient(90deg, var(--liquid) calc(var(--v) * 10%), var(--line) calc(var(--v) * 10%)); &::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: var(--paper); border: 2px solid var(--text); } &::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--paper); border: 2px solid var(--text); } } }
.alm-dilute__result { grid-column: 1 / -1; display: grid; gap: .6rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.alm-dilute__water { font: 360 clamp(2.4rem, 5vw, 3.6rem)/1 var(--f-display); margin: 0; & small { font: 400 1rem var(--f-body); color: var(--muted); } }
.alm-dilute__drops { color: var(--muted); margin: 0; }
.alm-dilute__bar { display: flex; height: 14px; border-radius: 7px; overflow: clip; box-shadow: inset 0 0 0 1px var(--line); margin-top: .4rem; }
.alm-dilute__spirit { width: var(--spirit, 80%); background: var(--liquid); transition: width .3s var(--ease-out); }
.alm-dilute__add { flex: 1; background: repeating-linear-gradient(135deg, rgb(255 255 255 / .6) 0 6px, rgb(150 190 220 / .35) 6px 12px); }

.alm-pairs { display: grid; gap: 1.4rem; }
.alm-pn { display: flex; justify-content: space-between; gap: 1rem; padding-top: 2rem; border-top: 1px solid var(--line); flex-wrap: wrap; }
.alm-pn__link { display: grid; gap: .2rem; text-decoration: none; & small { font: 500 .7rem var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); } & span { font: 420 1.6rem/1.15 var(--f-display); } &:hover span { text-decoration: underline; text-underline-offset: .15em; } }
.alm-pn__link--next { text-align: right; margin-left: auto; }

/* ---------- Journal ---------- */

.alm-cats { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2.4rem; }
.alm-cats__chip { padding: .55em 1.05em; border: 1px solid var(--line); border-radius: 999px; font-weight: 500; font-size: .92rem; text-decoration: none; transition: background .25s, color .25s; &:hover { border-color: var(--text); } &[aria-current] { background: var(--text); color: var(--paper); border-color: var(--text); } }
.alm-lead { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.alm-lead__link { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(1.4rem, 4vw, 3.5rem); align-items: center; text-decoration: none; }
.alm-lead__cover { aspect-ratio: 4 / 3; margin: 0; & .alm-post__glyph { font-size: 12rem; } }
.alm-lead__body { display: grid; gap: .8rem; }
.alm-lead__title { font: 380 clamp(2rem, 4vw, 3.4rem)/1.05 var(--f-display); letter-spacing: -.015em; }
.alm-lead__excerpt { font-size: 1.12rem; color: var(--muted); margin: 0; }
.alm-lead__link:hover .alm-post__cover { scale: .985; }
.alm-related { background: var(--paper-2); }

.alm-article__layout { display: grid; grid-template-columns: minmax(0, 1fr); }
.alm-article__layout > .alm-prose { grid-column: 1; }
@media (min-width: 1180px) {
	.alm-article__layout { grid-template-columns: minmax(0, 1fr) minmax(0, 720px) minmax(0, 1fr); }
	.alm-article__layout > .alm-prose { grid-column: 2; }
	.alm-toc { grid-column: 3; grid-row: 1; align-self: start; position: sticky; top: 110px; margin-left: 3rem; max-width: 240px; }
}
@media (max-width: 1179px) { .alm-toc { width: min(100% - 2 * var(--gutter), 720px); margin: 0 auto 2rem; padding: 1.2rem 1.4rem; border-radius: var(--radius); background: var(--paper-2); } }
.alm-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; font-size: .92rem; & a { text-decoration: none; color: var(--muted); display: block; padding-left: .9rem; border-left: 2px solid var(--line); transition: color .25s, border-color .25s; &:hover { color: var(--text); } &[aria-current] { color: var(--text); border-color: var(--accent); font-weight: 600; } } }
.alm-share { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1.4rem; & .alm-eyebrow { margin: 0 .4rem 0 0; } }

/* ---------- Responsive ---------- */

@media (max-width: 960px) {
	.alm-recipe__head, .alm-recipe__grid, .alm-estate, .alm-dilute, .alm-lead__link { grid-template-columns: 1fr; }
	.alm-recipe__glass { height: 280px; order: -1; }
	.alm-timeline__item { grid-template-columns: 1fr; gap: .4rem; }
	.alm-spiritlink { flex-wrap: wrap; }
}
@media (max-width: 600px) {
	.alm-dilute__row { grid-template-columns: 3.6rem 1fr 3.6rem; gap: .6rem; }
	.alm-estate__list li { grid-template-columns: 4.6rem 1fr; }
}
@media (prefers-reduced-motion: reduce) { .alm-timeline::after { animation: none; scale: 1 1; } }
.alm-home-cocktails { padding-block: clamp(4rem, 8vw, 7rem); }