/* ==========================================================================
   Fynbos Distillery — luxury theme layer
   --------------------------------------------------------------------------
   Built to sit on top of the Kadence theme. Colours use Kadence's own global
   palette variables (--global-palette1..9) so they map 1:1 to
   Customizer → Colors → Global Palette. All custom components use the `fd-`
   prefix so they never collide with Kadence, Kadence Blocks or WooCommerce.
   ========================================================================== */

:root {
	/* Kadence global palette (same colours as the current fynbosdistillery.co.za) */
	--global-palette1: #F5A524; /* Amber — accent / buttons                 */
	--global-palette2: #D98C0A; /* Amber deep — accent hover                */
	--global-palette3: #1A202C; /* Ink — strongest dark                     */
	--global-palette4: #2D3748; /* Slate — headings on light, panels        */
	--global-palette5: #4A5568; /* Slate mid — muted text on light          */
	--global-palette6: #A0AEC0; /* Mist — muted text on dark                */
	--global-palette7: #FFECCC; /* Cream — warm light                       */
	--global-palette8: #F7FAFC; /* Off-white                                */
	--global-palette9: #FFFFFF; /* White                                    */

	/* Theme tokens (derived from the palette) */
	--fd-night: #090C10;               /* deepest background, from the live site */
	--fd-ink: var(--global-palette3);
	--fd-slate: var(--global-palette4);
	--fd-gold: var(--global-palette1);
	--fd-gold-deep: var(--global-palette2);
	--fd-cream: var(--global-palette7);
	--fd-paper: #FBF6EC;               /* label-paper tone from the new bottles */
	--fd-text-dark: rgba(255, 236, 204, 0.78);
	--fd-line-dark: rgba(255, 236, 204, 0.14);
	--fd-line-light: rgba(26, 32, 44, 0.12);

	--fd-font-display: "Cormorant Garamond", "Times New Roman", serif;
	--fd-font-body: "Jost", "Segoe UI", Roboto, sans-serif;

	--fd-max: 1240px;
	--fd-gutter: clamp(16px, 4vw, 48px);
	--fd-section: clamp(80px, 12vw, 160px);
	--fd-radius: 2px;
	--fd-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Base ---------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--fd-night);
	color: var(--fd-text-dark);
	font-family: var(--fd-font-body);
	font-weight: 300;
	font-size: 17px;
	line-height: 1.75;
	letter-spacing: 0.01em;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--fd-gold); text-decoration: none; transition: color .3s var(--fd-ease); }
a:hover { color: var(--fd-cream); }
h1, h2, h3, h4, .fd-display {
	font-family: var(--fd-font-display);
	font-weight: 400;
	color: var(--global-palette9);
	line-height: 1.08;
	letter-spacing: -0.01em;
	margin: 0 0 .5em;
}
h1 { font-size: clamp(48px, 8vw, 112px); }
h2 { font-size: clamp(38px, 5.2vw, 72px); }
h3 { font-size: clamp(26px, 2.6vw, 34px); }
h4 { font-size: 22px; }
h1 em, h2 em, h3 em { font-style: italic; color: var(--fd-gold); }
p { margin: 0 0 1.25em; }
::selection { background: var(--fd-gold); color: var(--fd-ink); }
:focus-visible { outline: 2px solid var(--fd-gold); outline-offset: 3px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.skip-link:focus {
	clip: auto; width: auto; height: auto; z-index: 1000; top: 12px; left: 12px;
	background: var(--fd-gold); color: var(--fd-ink); padding: 10px 18px;
}

/* Film grain over everything — subtle luxury texture */
body::after {
	content: ""; position: fixed; inset: -50%; z-index: 999; pointer-events: none;
	opacity: .05;
	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='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Layout helpers ------------------------------------------------ */
.fd-container { width: 100%; max-width: var(--fd-max); margin: 0 auto; padding: 0 var(--fd-gutter); }
.fd-container--narrow { max-width: 820px; }
.fd-section { padding: var(--fd-section) 0; position: relative; }
.fd-section--tight { padding: calc(var(--fd-section) * .6) 0; }
.fd-section--ink { background: var(--fd-ink); }
.fd-section--slate { background: var(--fd-slate); }
.fd-section--paper {
	background: var(--fd-paper);
	color: var(--global-palette5);
}
.fd-section--paper h1, .fd-section--paper h2, .fd-section--paper h3, .fd-section--paper h4 { color: var(--fd-ink); }
.fd-section--paper h2 em, .fd-section--paper h3 em { color: var(--fd-gold-deep); }
.fd-center { text-align: center; }
.fd-grid { display: grid; gap: clamp(24px, 3vw, 48px); }
.fd-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; }
.fd-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fd-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fd-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1024px) {
	.fd-grid--4, .fd-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.fd-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.fd-grid--2, .fd-grid--3, .fd-grid--4, .fd-grid--5 { grid-template-columns: 1fr; }
}

/* Eyebrow / kicker label */
.fd-eyebrow {
	display: inline-flex; align-items: center; gap: 14px;
	font-family: var(--fd-font-body); font-size: 12px; font-weight: 500;
	letter-spacing: .32em; text-transform: uppercase; color: var(--fd-gold);
	margin-bottom: 24px;
}
.fd-section--paper .fd-eyebrow { color: var(--fd-gold-deep); }
.fd-lead { font-size: clamp(18px, 1.6vw, 22px); line-height: 1.7; color: var(--fd-cream); }
.fd-section--paper .fd-lead { color: var(--fd-slate); }

/* Ornament divider echoing the logo's diamond rule */
.fd-ornament {
	display: flex; align-items: center; justify-content: center; gap: 14px;
	color: var(--fd-gold); margin: 28px auto; max-width: 260px;
}
.fd-ornament span { width: 8px; height: 8px; border: 1px solid currentColor; transform: rotate(45deg); }

/* ---------- Buttons (mirror .wp-block-button__link so Kadence picks them up) */
.fd-btn, .wp-block-button__link, .button {
	display: inline-flex; align-items: center; justify-content: center; gap: 12px;
	padding: 17px 34px; border: 1px solid var(--fd-gold); border-radius: var(--fd-radius);
	background: var(--fd-gold); color: var(--fd-ink);
	font: 500 12px/1 var(--fd-font-body); letter-spacing: .24em; text-transform: uppercase;
	cursor: pointer; position: relative; overflow: hidden; isolation: isolate;
	transition: color .5s var(--fd-ease), border-color .5s var(--fd-ease);
}
.fd-btn::before, .wp-block-button__link::before, .button::before {
	content: ""; position: absolute; inset: 0; z-index: -1; background: var(--fd-cream);
	transform: scaleX(0); transform-origin: right; transition: transform .6s var(--fd-ease);
}
.fd-btn:hover, .wp-block-button__link:hover, .button:hover { color: var(--fd-ink); border-color: var(--fd-cream); }
.fd-btn:hover::before, .wp-block-button__link:hover::before, .button:hover::before { transform: scaleX(1); transform-origin: left; }
.fd-btn--ghost { background: transparent; color: var(--fd-cream); border-color: rgba(255, 236, 204, .45); }
.fd-section--paper .fd-btn--ghost { color: var(--fd-ink); border-color: var(--fd-ink); }
.fd-btn--ghost::before { background: var(--fd-gold); }
.fd-btn--ghost:hover { border-color: var(--fd-gold); }
.fd-btn svg { width: 16px; height: 16px; transition: transform .4s var(--fd-ease); }
.fd-btn:hover svg { transform: translateX(4px); }
.fd-btn-row { display: flex; flex-wrap: wrap; gap: 16px; }
.fd-center .fd-btn-row { justify-content: center; }
.fd-link {
	font: 500 12px/1 var(--fd-font-body); letter-spacing: .24em; text-transform: uppercase;
	color: var(--fd-gold); display: inline-flex; gap: 10px; align-items: center;
	padding-bottom: 6px; border-bottom: 1px solid currentColor;
}

/* ---------- Age gate ----------------------------------------------------- */
.fd-agegate {
	position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 16px;
	background: radial-gradient(ellipse at center, rgba(45, 55, 72, .92), rgba(9, 12, 16, .98));
	backdrop-filter: blur(10px);
	opacity: 0; visibility: hidden; transition: opacity .6s var(--fd-ease), visibility .6s;
}
.fd-agegate.is-open { opacity: 1; visibility: visible; }
.fd-agegate__panel {
	max-width: 520px; width: 100%; text-align: center; padding: clamp(32px, 6vw, 56px);
	border: 1px solid var(--fd-line-dark); background: rgba(9, 12, 16, .6);
}
.fd-agegate__logo { width: 120px; margin: 0 auto 28px; border-radius: 50%; }
.fd-agegate h2 { font-size: clamp(30px, 5vw, 42px); }
.fd-agegate small { display: block; margin-top: 24px; font-size: 12px; color: var(--global-palette6); }

/* ---------- Header (Kadence: #masthead .site-header) ---------------------- */
.site-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 900;
	transition: background .5s var(--fd-ease), padding .5s var(--fd-ease), border-color .5s;
	border-bottom: 1px solid transparent;
}
.site-header .fd-header-inner {
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
	max-width: 1440px; margin: 0 auto; padding: 22px var(--fd-gutter);
	transition: padding .5s var(--fd-ease);
}
.site-header.is-scrolled {
	background: rgba(9, 12, 16, .88); backdrop-filter: blur(14px);
	border-bottom-color: var(--fd-line-dark);
}
.site-header.is-scrolled .fd-header-inner { padding-top: 12px; padding-bottom: 12px; }
.site-branding a { display: flex; align-items: center; gap: 14px; color: var(--fd-cream); }
.site-branding img { width: 58px; height: 58px; border-radius: 50%; transition: width .5s var(--fd-ease), height .5s var(--fd-ease); box-shadow: 0 0 0 1px rgba(245, 165, 36, .4); }
.site-header.is-scrolled .site-branding img { width: 46px; height: 46px; }
.site-title { font-family: var(--fd-font-display); font-size: 22px; letter-spacing: .28em; text-transform: uppercase; line-height: 1; }
@media (max-width: 480px) {
	.site-title { font-size: 19px; letter-spacing: .22em; }
}
.site-title small { display: block; font-family: var(--fd-font-body); font-size: 9.5px; letter-spacing: .5em; color: var(--fd-gold); margin-top: 6px; }

.main-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; gap: clamp(18px, 2.2vw, 36px); }
.main-navigation a {
	position: relative; color: var(--fd-cream); padding: 8px 0;
	font-size: 12px; font-weight: 400; letter-spacing: .2em; text-transform: uppercase;
}
.main-navigation a::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--fd-gold);
	transform: scaleX(0); transform-origin: right; transition: transform .5s var(--fd-ease);
}
.main-navigation a:hover, .main-navigation .current-menu-item > a { color: var(--fd-gold); }
.main-navigation a:hover::after, .main-navigation .current-menu-item > a::after { transform: scaleX(1); transform-origin: left; }

.fd-header-actions { display: flex; align-items: center; gap: 18px; }
.fd-cart-link { position: relative; color: var(--fd-cream); display: inline-flex; }
.fd-cart-link svg { width: 22px; height: 22px; }
.fd-cart-count {
	position: absolute; top: -8px; right: -10px; min-width: 18px; height: 18px; padding: 0 5px;
	border-radius: 9px; background: var(--fd-gold); color: var(--fd-ink);
	font-size: 10px; font-weight: 600; line-height: 18px; text-align: center;
}
.fd-header-actions .fd-btn { padding: 13px 22px; }
.menu-toggle { display: none; background: none; border: 0; color: var(--fd-cream); padding: 6px; cursor: pointer; }
.menu-toggle span { display: block; width: 26px; height: 1px; background: currentColor; margin: 7px 0; transition: transform .4s var(--fd-ease), opacity .3s; }

@media (max-width: 1100px) {
	.menu-toggle { display: block; }
	.fd-header-actions .fd-btn { display: none; }
	/* A blur on the header would trap the fixed menu inside it, so drop it while open */
	.nav-open .site-header, .nav-open #masthead.site-header { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: var(--fd-night) !important; }
	.nav-open { overflow: hidden; }
	.site-branding, .fd-header-actions { position: relative; z-index: 2; }
	.main-navigation {
		position: fixed; inset: 0; z-index: 1; display: grid; place-items: center; overflow-y: auto; padding: 96px 16px 32px;
		background: var(--fd-night);
		opacity: 0; visibility: hidden; transition: opacity .5s var(--fd-ease), visibility .5s;
	}
	.main-navigation ul { flex-direction: column; align-items: center; gap: 22px; }
	.main-navigation a { font-family: var(--fd-font-display); font-size: 34px; letter-spacing: .04em; text-transform: none; }
	.nav-open .main-navigation { opacity: 1; visibility: visible; }
	.nav-open .menu-toggle span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
	.nav-open .menu-toggle span:nth-child(2) { opacity: 0; }
	.nav-open .menu-toggle span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
	.site-branding a { gap: 10px; }
	.site-branding img { width: 48px; height: 48px; }
}

/* ---------- Hero --------------------------------------------------------- */
.fd-hero {
	position: relative; min-height: 100svh; display: flex; align-items: flex-end;
	overflow: hidden; isolation: isolate; padding: 140px 0 clamp(60px, 10vh, 120px);
}
.fd-hero__media { position: absolute; inset: 0; z-index: -2; }
.fd-hero__media img {
	width: 100%; height: 100%; object-fit: cover;
	animation: fd-kenburns 24s var(--fd-ease) both;
}
.fd-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(180deg, rgba(9, 12, 16, .35) 0%, rgba(9, 12, 16, 0) 30%, rgba(9, 12, 16, .45) 72%, var(--fd-night) 100%),
		radial-gradient(ellipse at 25% 70%, rgba(9, 12, 16, .35), transparent 55%);
}
.fd-hero__content { text-shadow: 0 2px 24px rgba(9, 12, 16, .55); }
.fd-hero__content { max-width: 880px; }
.fd-hero h1 { margin-bottom: .3em; }
.fd-hero .fd-lead { max-width: 560px; margin-bottom: 40px; }
.fd-hero--page { min-height: 72svh; }
.fd-hero--page h1 { font-size: clamp(44px, 7vw, 96px); }
/* Shop: bottles fill the right of the photo, so the photo is nudged right and
   the text keeps to the dark left-hand column. */
.fd-hero--shop .fd-hero__media { left: 16%; }
.fd-hero--shop::before {
	background:
		linear-gradient(90deg, var(--fd-night) 0%, var(--fd-night) 14%, rgba(9, 12, 16, .55) 24%, rgba(9, 12, 16, 0) 40%),
		linear-gradient(180deg, rgba(9, 12, 16, .4) 0%, rgba(9, 12, 16, 0) 25%, rgba(9, 12, 16, 0) 80%, var(--fd-night) 100%);
}
.fd-hero--shop .fd-hero__content { max-width: min(400px, 30vw); }
.fd-hero--shop h1 { font-size: clamp(44px, 5.6vw, 88px); }
.fd-hero--shop .fd-lead { font-size: clamp(16px, 1.3vw, 19px); }
@media (max-width: 1100px) {
	.fd-hero--shop .fd-hero__media { left: 0; }
	.fd-hero--shop .fd-hero__content { max-width: 520px; }
	.fd-hero--shop::before { background: linear-gradient(180deg, rgba(9, 12, 16, .5) 0%, rgba(9, 12, 16, .15) 35%, rgba(9, 12, 16, .8) 72%, var(--fd-night) 100%); }
}

/* Showcase: the same photo on the full-screen home hero. Full height would scale
   the bottles into the text column, so the photo sits lower and to the right and
   fades into the night background at its top and left edges. */
.fd-hero--showcase .fd-hero__media { left: 24%; top: auto; bottom: 0; height: 84%; }
.fd-hero--showcase .fd-hero__media img { object-position: right bottom; }
.fd-hero--showcase::before {
	background:
		linear-gradient(90deg, var(--fd-night) 0%, var(--fd-night) 24%, rgba(9, 12, 16, .55) 32%, rgba(9, 12, 16, 0) 46%),
		linear-gradient(180deg, var(--fd-night) 0%, var(--fd-night) 16%, rgba(9, 12, 16, 0) 34%, rgba(9, 12, 16, 0) 88%, var(--fd-night) 100%);
}
.fd-hero--showcase .fd-btn-row { flex-direction: column; align-items: flex-start; }
.fd-hero--showcase .fd-btn { min-width: 220px; }
@media (max-width: 1100px) {
	.fd-hero--showcase .fd-hero__media { left: 0; top: 0; height: 100%; }
	.fd-hero--showcase::before { background: linear-gradient(180deg, rgba(9, 12, 16, .55) 0%, rgba(9, 12, 16, .2) 30%, rgba(9, 12, 16, .85) 68%, var(--fd-night) 100%); }
}
/* Phones: a shorter photo across the top keeps several bottles in view, text below it */
@media (max-width: 760px) {
	.fd-hero--showcase .fd-hero__media { height: 52%; bottom: auto; }
	.fd-hero--showcase .fd-hero__media img { object-position: 64% center; }
	.fd-hero--showcase::before { background: linear-gradient(180deg, rgba(9, 12, 16, .4) 0%, rgba(9, 12, 16, 0) 18%, rgba(9, 12, 16, 0) 36%, var(--fd-night) 52%); }
}

/* Taproom: bright tanks sit behind the headline, so shade from the left and
   crop lower to keep the pint and taps in view. */
.fd-hero--taproom .fd-hero__media img { object-position: center 72%; }
/* Blog: same left shade, with the headline wrapped to keep off the notebook pages */
.fd-hero--blog .fd-hero__media img { object-position: center 55%; }
.fd-hero--blog .fd-hero__content { max-width: 560px; }
/* Narrow: for photos with the subject mid-frame (Danger Point and Stanford posts),
   the title stays in a narrow shaded column on the left */
.fd-hero--narrow .fd-hero__content { max-width: min(440px, 34vw); }
.fd-hero--narrow h1 { font-size: clamp(38px, 4.2vw, 66px); }
.fd-hero--taproom::before, .fd-hero--blog::before, .fd-hero--narrow::before {
	background:
		linear-gradient(90deg, rgba(9, 12, 16, .82) 0%, rgba(9, 12, 16, .6) 35%, rgba(9, 12, 16, 0) 62%),
		linear-gradient(180deg, rgba(9, 12, 16, .35) 0%, rgba(9, 12, 16, 0) 30%, rgba(9, 12, 16, 0) 82%, var(--fd-night) 100%);
}
@media (max-width: 1100px) {
	.fd-hero--narrow .fd-hero__content { max-width: 560px; }
	.fd-hero--taproom::before, .fd-hero--blog::before, .fd-hero--narrow::before { background: linear-gradient(180deg, rgba(9, 12, 16, .45) 0%, rgba(9, 12, 16, .2) 30%, rgba(9, 12, 16, .85) 70%, var(--fd-night) 100%); }
}

/* Light hero: for pale photos (e.g. the gin post). Dark ink text sits on the
   empty left of the photo, and only the very bottom fades into the page. */
.fd-hero--light { align-items: center; }
.fd-hero--light::before {
	background:
		linear-gradient(90deg, rgba(251, 246, 236, .85) 0%, rgba(251, 246, 236, .55) 30%, rgba(251, 246, 236, 0) 50%),
		linear-gradient(180deg, rgba(9, 12, 16, 0) 82%, var(--fd-night) 100%);
}
.fd-hero--light .fd-hero__content { max-width: min(460px, 35vw); text-shadow: none; }
.fd-hero--light h1 { color: var(--fd-ink); font-size: clamp(38px, 4vw, 64px); }
.fd-hero--light h1 em { color: var(--fd-gold-deep); }
.fd-hero--light .entry-meta { color: var(--global-palette5); }
.fd-hero--light .entry-meta .category, .fd-hero--light .entry-meta a { color: var(--fd-gold-deep); }
.fd-hero--light .fd-lead { color: var(--fd-slate); }
@media (max-width: 1100px) {
	.fd-hero--light { align-items: flex-start; padding-top: 140px; }
	.fd-hero--light .fd-hero__content { max-width: 560px; }
	.fd-hero--light::before { background: linear-gradient(180deg, rgba(251, 246, 236, .9) 0%, rgba(251, 246, 236, .7) 45%, rgba(251, 246, 236, 0) 70%, var(--fd-night) 100%); }
}
/* Keep the cream menu readable: on a light hero the header has its dark bar from the start */
body:has(.fd-hero--light) .site-header { background: rgba(9, 12, 16, .88); backdrop-filter: blur(14px); border-bottom-color: var(--fd-line-dark); }

/* Home: the bottles along the bottom of the photo are the feature, so the
   text sits higher and the shading comes from the left instead of below. */
.fd-hero--home { align-items: flex-start; padding-top: clamp(130px, 17vh, 190px); }
.fd-hero--home .fd-hero__media img { object-position: center bottom; }
.fd-hero--home::before {
	background:
		linear-gradient(90deg, rgba(9, 12, 16, .78) 0%, rgba(9, 12, 16, .45) 32%, rgba(9, 12, 16, 0) 58%),
		linear-gradient(180deg, rgba(9, 12, 16, .45) 0%, rgba(9, 12, 16, 0) 22%, rgba(9, 12, 16, 0) 88%, var(--fd-night) 100%);
}
/* Narrow enough to stay left of the first bottle at desktop sizes */
.fd-hero--home .fd-hero__content { max-width: min(360px, 28vw); }
.fd-hero--home h1 { font-size: clamp(46px, 5.2vw, 84px); }
.fd-hero--home .fd-lead { font-size: clamp(16px, 1.3vw, 19px); margin-bottom: 32px; }
/* Tablet / phone: the photo crops to the centre, so stack the text on a top-down fade */
@media (max-width: 1100px) {
	.fd-hero--home { min-height: 92svh; }
	.fd-hero--home .fd-hero__content { max-width: 460px; }
	.fd-hero--home::before { background: linear-gradient(180deg, rgba(9, 12, 16, .82) 0%, rgba(9, 12, 16, .6) 42%, rgba(9, 12, 16, .1) 68%, rgba(9, 12, 16, 0) 90%, var(--fd-night) 100%); }
}
.fd-scroll-cue {
	position: absolute; right: var(--fd-gutter); bottom: 48px; display: flex; flex-direction: column;
	align-items: center; gap: 14px; font-size: 10px; letter-spacing: .4em; text-transform: uppercase;
	color: var(--fd-cream); writing-mode: vertical-rl;
}
.fd-scroll-cue::after { content: ""; width: 1px; height: 70px; background: linear-gradient(var(--fd-gold), transparent); animation: fd-drip 2.4s ease-in-out infinite; }
@media (max-width: 760px) { .fd-scroll-cue { display: none; } }

@keyframes fd-kenburns { from { transform: scale(1.18); } to { transform: scale(1.02); } }
@keyframes fd-drip { 0%, 100% { transform: scaleY(.3); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; } }

/* Hero headline word reveal */
.fd-split .fd-word { display: inline-block; overflow: hidden; vertical-align: bottom; }
.fd-split .fd-word > span { display: inline-block; transform: translateY(110%); animation: fd-rise 1.2s var(--fd-ease) forwards; }
@keyframes fd-rise { to { transform: translateY(0); } }

/* ---------- Scroll reveal ------------------------------------------------ */
.fd-reveal { opacity: 0; transform: translateY(40px); transition: opacity 1.2s var(--fd-ease), transform 1.2s var(--fd-ease); }
.fd-reveal.is-visible { opacity: 1; transform: none; }
.fd-reveal[data-delay="1"] { transition-delay: .12s; }
.fd-reveal[data-delay="2"] { transition-delay: .24s; }
.fd-reveal[data-delay="3"] { transition-delay: .36s; }
.fd-reveal[data-delay="4"] { transition-delay: .48s; }

/* ---------- Marquee (awards) --------------------------------------------- */
.fd-marquee { overflow: hidden; border-block: 1px solid var(--fd-line-dark); padding: 26px 0; background: var(--fd-ink); }
.fd-marquee__track { display: flex; gap: 64px; width: max-content; animation: fd-marquee 40s linear infinite; }
.fd-marquee__track span {
	font-family: var(--fd-font-display); font-size: clamp(22px, 2.4vw, 30px); font-style: italic;
	color: var(--fd-cream); white-space: nowrap; display: inline-flex; align-items: center; gap: 64px;
}
.fd-marquee__track span::after { content: "✦"; font-style: normal; font-size: 14px; color: var(--fd-gold); }
@keyframes fd-marquee { to { transform: translateX(-50%); } }

/* ---------- Principles / feature cards ----------------------------------- */
.fd-principle { padding: 36px 28px; border-top: 1px solid var(--fd-line-dark); transition: background .6s var(--fd-ease); }
.fd-principle:hover { background: rgba(255, 236, 204, .03); }
.fd-principle__num { font-family: var(--fd-font-display); font-size: 15px; color: var(--fd-gold); letter-spacing: .2em; display: block; margin-bottom: 22px; }
.fd-principle img { width: 40px; height: 40px; margin-bottom: 22px; filter: invert(72%) sepia(68%) saturate(800%) hue-rotate(352deg) brightness(101%); }
.fd-principle h3 { font-size: 26px; }
.fd-principle p { font-size: 15px; margin: 0; }

/* ---------- Split media / story blocks ------------------------------------ */
.fd-media { position: relative; overflow: hidden; }
.fd-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--fd-ease); }
.fd-media:hover img { transform: scale(1.04); }
.fd-media--tall { aspect-ratio: 4 / 5; }
.fd-media--wide { aspect-ratio: 16 / 10; }
.fd-media--square { aspect-ratio: 1; }
.fd-media__frame { position: absolute; inset: 18px; border: 1px solid rgba(255, 236, 204, .35); pointer-events: none; }
.fd-media__caption {
	position: absolute; left: 24px; bottom: 24px; right: 24px;
	font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--fd-cream);
}
.fd-story { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: center; }
.fd-story--flip > :first-child { order: 2; }
@media (max-width: 900px) { .fd-story { grid-template-columns: 1fr; } .fd-story--flip > :first-child { order: 0; } }
.fd-stat-row { display: flex; flex-wrap: wrap; gap: clamp(24px, 4vw, 56px); margin: 40px 0; padding-top: 32px; border-top: 1px solid var(--fd-line-dark); }
.fd-section--paper .fd-stat-row { border-color: var(--fd-line-light); }
.fd-stat strong { display: block; font-family: var(--fd-font-display); font-weight: 400; font-size: clamp(40px, 4.4vw, 60px); line-height: 1; color: var(--fd-gold); }
.fd-section--paper .fd-stat strong { color: var(--fd-gold-deep); }
.fd-stat span { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; }

/* Parallax full-bleed band */
.fd-band { position: relative; min-height: 80vh; display: grid; place-items: center; overflow: hidden; isolation: isolate; text-align: center; padding: 120px 0; }
.fd-band__media { position: absolute; inset: -15% 0; z-index: -2; }
.fd-band__media img { width: 100%; height: 100%; object-fit: cover; }
.fd-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(9, 12, 16, .62); }
.fd-band blockquote { margin: 0 auto; max-width: 980px; }
.fd-band blockquote p { font-family: var(--fd-font-display); font-size: clamp(30px, 4.4vw, 60px); line-height: 1.18; color: var(--global-palette9); font-style: italic; }
.fd-band cite { font-style: normal; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--fd-gold); }

/* ---------- Product cards (WooCommerce loop markup: ul.products li.product) */
.woocommerce ul.products, ul.products.fd-products {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 2.4vw, 36px);
}
@media (max-width: 1100px) { .woocommerce ul.products, ul.products.fd-products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Phones and small tablets: always two products to a row */
@media (max-width: 820px) { .woocommerce ul.products, ul.products.fd-products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 14px; } }
ul.products li.product { position: relative; display: flex; flex-direction: column; }
.fd-product__media {
	position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--fd-paper); display: block;
}
.fd-product__media img, .fd-product__media .fd-lineup {
	width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--fd-ease), filter 1s var(--fd-ease);
}
li.product:hover .fd-product__media img, li.product:hover .fd-product__media .fd-lineup { transform: scale(1.06); }
.fd-product__media::after {
	content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(9, 12, 16, .45), transparent 45%);
	opacity: 0; transition: opacity .6s var(--fd-ease);
}
li.product:hover .fd-product__media::after { opacity: 1; }
.fd-badge {
	position: absolute; top: 14px; left: 14px; z-index: 2;
	padding: 7px 12px; background: var(--fd-ink); color: var(--fd-gold);
	font-size: 10px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase;
}
.fd-badge--new { background: var(--fd-gold); color: var(--fd-ink); }
.fd-product__body { padding: 22px 2px 0; display: flex; flex-direction: column; flex: 1; }
.fd-product__cat { font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--global-palette6); margin-bottom: 8px; }
.woocommerce-loop-product__title { font-family: var(--fd-font-display); font-size: 25px; line-height: 1.15; color: var(--global-palette9); margin: 0 0 8px; }
.woocommerce-loop-product__title a { color: inherit; }
.fd-product__note { font-size: 14px; line-height: 1.6; margin: 0 0 16px; color: var(--global-palette6); }
.fd-product__foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px solid var(--fd-line-dark); }
.price { font-family: var(--fd-font-display); font-size: 24px; color: var(--fd-gold); }
.price small { font-family: var(--fd-font-body); font-size: 11px; letter-spacing: .14em; color: var(--global-palette6); text-transform: uppercase; margin-right: 6px; }
.add_to_cart_button {
	background: none; border: 0; padding: 0; cursor: pointer; color: var(--fd-cream);
	font: 500 11px/1 var(--fd-font-body); letter-spacing: .22em; text-transform: uppercase;
	display: inline-flex; align-items: center; gap: 8px;
}
.add_to_cart_button:hover { color: var(--fd-gold); }
.single_add_to_cart_button.fd-btn { background: var(--fd-gold); color: var(--fd-ink); padding: 17px 34px; letter-spacing: .24em; }
.single_add_to_cart_button.fd-btn:hover { color: var(--fd-ink); }
.add_to_cart_button svg { width: 16px; height: 16px; }

/* Cropped bottle from the full-range line-up photo (products without a solo shot) */
.fd-lineup {
	background-image: url("../images/site/Fynbos-Distillery-Feature-2.jpg");
	background-repeat: no-repeat; background-size: 768% auto; background-position: var(--x, 50%) 81.4%;
}

/* Shop toolbar / filters */
.fd-shop-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 48px; padding-bottom: 24px; border-bottom: 1px solid var(--fd-line-dark); }
.fd-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.fd-filter {
	background: none; border: 1px solid var(--fd-line-dark); color: var(--fd-cream); cursor: pointer;
	padding: 10px 18px; font: 400 11px/1 var(--fd-font-body); letter-spacing: .2em; text-transform: uppercase;
	transition: all .4s var(--fd-ease); border-radius: var(--fd-radius);
}
.fd-filter:hover { border-color: var(--fd-gold); color: var(--fd-gold); }
.fd-filter.is-active { background: var(--fd-gold); border-color: var(--fd-gold); color: var(--fd-ink); }
.woocommerce-result-count { font-size: 13px; letter-spacing: .1em; color: var(--global-palette6); margin: 0; }

/* Horizontal product rail (home) */
ul.products.fd-products.fd-rail { grid-template-columns: none; }
.fd-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 23%); gap: 28px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 28px; scrollbar-width: thin; scrollbar-color: var(--fd-gold) transparent; }
.fd-rail > li { scroll-snap-align: start; }
@media (max-width: 760px) { .fd-rail { grid-auto-columns: 78%; } }

/* Carousel arrows (added by fynbos.js around each .fd-rail) */
.fd-carousel { position: relative; }
.fd-carousel .fd-rail { scrollbar-width: none; padding-bottom: 0; }
.fd-carousel .fd-rail::-webkit-scrollbar { display: none; }
.fd-carousel__arrow {
	position: absolute; z-index: 3; top: 40%;
	width: 52px; height: 52px; display: grid; place-items: center; cursor: pointer;
	border: 1px solid rgba(255, 236, 204, .4); border-radius: 50%;
	background: rgba(9, 12, 16, .72); color: var(--fd-cream); backdrop-filter: blur(6px);
	transition: background .4s var(--fd-ease), border-color .4s var(--fd-ease), color .4s var(--fd-ease), opacity .4s;
}
.fd-carousel__arrow svg { width: 22px; height: 22px; }
.fd-carousel__arrow:hover:not(:disabled) { background: var(--fd-gold); border-color: var(--fd-gold); color: var(--fd-ink); }
.fd-carousel__arrow:disabled { opacity: .3; cursor: default; }
.fd-carousel__arrow--prev { left: -26px; }
.fd-carousel__arrow--next { right: -26px; }
.fd-carousel.is-static .fd-carousel__arrow { display: none; }
@media (max-width: 1340px) { .fd-carousel__arrow--prev { left: 10px; } .fd-carousel__arrow--next { right: 10px; } }
@media (max-width: 760px) {
	.fd-carousel__arrow { width: 44px; height: 44px; }
}
.fd-rail-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 48px; flex-wrap: wrap; }
.fd-rail-head h2 { margin: 0; }

/* ---------- Single product (WooCommerce: .product .summary) --------------- */
.fd-single { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
@media (max-width: 900px) { .fd-single { grid-template-columns: 1fr; } }
.woocommerce-product-gallery { position: sticky; top: 110px; }
@media (max-width: 900px) { .woocommerce-product-gallery { position: static; } }
.woocommerce-product-gallery__image { aspect-ratio: 4 / 5; background: var(--fd-paper); overflow: hidden; }
.woocommerce-product-gallery__image img, .woocommerce-product-gallery__image .fd-lineup { width: 100%; height: 100%; object-fit: cover; }
.fd-thumbs { display: flex; gap: 12px; margin-top: 12px; }
.fd-thumbs button { width: 84px; aspect-ratio: 4/5; padding: 0; border: 1px solid var(--fd-line-dark); background: none; cursor: pointer; overflow: hidden; opacity: .6; transition: opacity .3s; }
.fd-thumbs button.is-active, .fd-thumbs button:hover { opacity: 1; border-color: var(--fd-gold); }
.fd-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.product_title { font-size: clamp(40px, 5vw, 68px); margin-bottom: 14px; }
.summary .price { font-size: 38px; display: block; margin-bottom: 28px; }
.woocommerce-product-details__short-description { font-size: 18px; color: var(--fd-cream); }
.fd-specs { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--fd-line-dark); margin: 32px 0; }
.fd-specs div { padding: 18px; border-right: 1px solid var(--fd-line-dark); }
.fd-specs div:last-child { border-right: 0; }
.fd-specs dt { font-size: 10px; letter-spacing: .26em; text-transform: uppercase; color: var(--global-palette6); }
.fd-specs dd { margin: 6px 0 0; font-family: var(--fd-font-display); font-size: 24px; color: var(--global-palette9); }
.variations { margin-bottom: 24px; }
.variations label { display: block; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; margin-bottom: 12px; color: var(--global-palette6); }
.fd-swatches { display: flex; gap: 10px; flex-wrap: wrap; }
.fd-swatches button { padding: 14px 22px; background: none; border: 1px solid var(--fd-line-dark); color: var(--fd-cream); cursor: pointer; font: 400 13px/1 var(--fd-font-body); letter-spacing: .1em; }
.fd-swatches button.is-active { border-color: var(--fd-gold); color: var(--fd-gold); }
form.cart { display: flex; gap: 12px; flex-wrap: wrap; align-items: stretch; margin-bottom: 32px; }
.quantity input { width: 84px; height: 100%; min-height: 52px; background: transparent; border: 1px solid var(--fd-line-dark); color: var(--fd-cream); text-align: center; font: 400 16px var(--fd-font-body); }
.fd-tabs { border-top: 1px solid var(--fd-line-dark); }
.fd-tabs details { border-bottom: 1px solid var(--fd-line-dark); }
.fd-tabs summary { cursor: pointer; list-style: none; padding: 22px 0; display: flex; justify-content: space-between; font-family: var(--fd-font-display); font-size: 24px; color: var(--global-palette9); }
.fd-tabs summary::-webkit-details-marker { display: none; }
.fd-tabs summary::after { content: "+"; color: var(--fd-gold); font-family: var(--fd-font-body); font-weight: 200; transition: transform .4s var(--fd-ease); }
.fd-tabs details[open] summary::after { transform: rotate(45deg); }
.fd-tabs details > div { padding: 0 0 24px; font-size: 15px; }
.fd-tabs ul { padding-left: 18px; margin: 0; }
.woocommerce-breadcrumb { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--global-palette6); margin-bottom: 28px; }
.woocommerce-breadcrumb a { color: var(--global-palette6); }
.woocommerce-breadcrumb a:hover { color: var(--fd-gold); }

/* ---------- Price list table --------------------------------------------- */
.fd-pricelist { width: 100%; border-collapse: collapse; font-size: 15px; }
.fd-pricelist th { text-align: left; font-size: 10.5px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--fd-gold); padding: 0 12px 16px; border-bottom: 1px solid var(--fd-gold); }
.fd-pricelist td { padding: 18px 12px; border-bottom: 1px solid var(--fd-line-dark); vertical-align: top; }
.fd-pricelist td:first-child strong { display: block; font-family: var(--fd-font-display); font-weight: 500; font-size: 21px; color: var(--global-palette9); }
.fd-pricelist td:first-child span { font-size: 13px; color: var(--global-palette6); }
.fd-pricelist .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fd-pricelist td.num:last-child { color: var(--fd-gold); font-family: var(--fd-font-display); font-size: 20px; }
.fd-table-wrap { overflow-x: auto; }

/* ---------- Process timeline -------------------------------------------- */
.fd-steps { counter-reset: step; display: grid; gap: 0; }
.fd-step { display: grid; grid-template-columns: 140px 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding: 56px 0; border-top: 1px solid var(--fd-line-dark); }
.fd-step__num { font-family: var(--fd-font-display); font-size: clamp(60px, 8vw, 110px); line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--fd-gold); }
.fd-step .fd-media { aspect-ratio: 3 / 2; }
@media (max-width: 900px) { .fd-step { grid-template-columns: 1fr; } }

/* ---------- Info cards / hours ------------------------------------------- */
.fd-card { padding: clamp(28px, 3vw, 44px); border: 1px solid var(--fd-line-dark); background: rgba(255, 236, 204, .02); height: 100%; transition: border-color .5s var(--fd-ease), transform .5s var(--fd-ease); }
.fd-card:hover { border-color: rgba(245, 165, 36, .5); transform: translateY(-4px); }
.fd-section--paper .fd-card { border-color: var(--fd-line-light); background: var(--global-palette9); }
.fd-card h3 { margin-bottom: .4em; }
.fd-card .price { display: block; margin-bottom: 14px; }
.fd-card ul { padding-left: 18px; margin: 0 0 1em; }
.fd-hours { list-style: none; padding: 0; margin: 0; }
.fd-hours li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--fd-line-dark); }
.fd-hours li span:last-child { color: var(--fd-cream); }
.fd-section--paper .fd-link { color: var(--fd-gold-deep); }
.fd-section--paper .fd-link:hover { color: var(--fd-ink); }
.fd-section--paper .fd-hours li { border-bottom-color: var(--fd-line-light); }
.fd-section--paper .fd-hours li span:last-child { color: var(--fd-slate); }
.fd-section--paper .fd-hours strong { color: var(--fd-ink); font-weight: 500; }

/* ---------- Blog (Kadence archive: .entry .loop-entry) -------------------- */
.fd-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); }
@media (max-width: 1024px) { .fd-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .fd-posts { grid-template-columns: 1fr; } }
.loop-entry .post-thumbnail { display: block; aspect-ratio: 3 / 2; overflow: hidden; margin-bottom: 26px; }
.loop-entry .post-thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--fd-ease); }
.loop-entry:hover .post-thumbnail img { transform: scale(1.06); }
.entry-meta { font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--global-palette6); margin-bottom: 14px; display: flex; gap: 14px; flex-wrap: wrap; }
.entry-meta .category { color: var(--fd-gold); }
.loop-entry .entry-title { font-size: clamp(26px, 2.4vw, 32px); }
.loop-entry .entry-title a { color: var(--global-palette9); }
.loop-entry .entry-title a:hover { color: var(--fd-gold); }
.loop-entry--featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: center; margin-bottom: 40px; }
.loop-entry--featured .post-thumbnail { aspect-ratio: 16 / 10; margin: 0; }
.loop-entry--featured .entry-title { font-size: clamp(34px, 4vw, 54px); }
@media (max-width: 820px) { .loop-entry--featured { grid-template-columns: 1fr; } }

/* Single post content */
.single-content { font-size: 19px; line-height: 1.85; }
.single-content > * + h2 { margin-top: 1.6em; }
.single-content h2 { font-size: clamp(30px, 3.4vw, 44px); }
.single-content blockquote { margin: 2em 0; padding-left: 32px; border-left: 1px solid var(--fd-gold); font-family: var(--fd-font-display); font-size: 30px; line-height: 1.3; font-style: italic; color: var(--fd-cream); }
.single-content figure { margin: 2.4em 0; }
.single-content figcaption { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--global-palette6); margin-top: 12px; }
.single-content ul, .single-content ol { padding-left: 22px; }
.single-content li { margin-bottom: .5em; }
.fd-post-nav { display: flex; justify-content: space-between; gap: 24px; padding: 40px 0; border-top: 1px solid var(--fd-line-dark); margin-top: 60px; flex-wrap: wrap; }

/* ---------- Forms (Kadence Blocks form compatible) ------------------------ */
.fd-form { display: grid; gap: 22px; }
.fd-form .fd-row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
@media (max-width: 640px) { .fd-form .fd-row { grid-template-columns: 1fr; } }
.fd-form label { display: block; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--global-palette6); margin-bottom: 10px; }
.fd-form input, .fd-form select, .fd-form textarea {
	width: 100%; background: transparent; border: 0; border-bottom: 1px solid rgba(255, 236, 204, .3);
	color: var(--fd-cream); padding: 12px 0; font: 300 17px var(--fd-font-body); border-radius: 0;
	transition: border-color .4s var(--fd-ease);
}
.fd-form select option { background: var(--fd-ink); color: var(--fd-cream); }
.fd-form input:focus, .fd-form select:focus, .fd-form textarea:focus { outline: none; border-bottom-color: var(--fd-gold); }
.fd-form textarea { min-height: 140px; resize: vertical; }
.fd-form-note { font-size: 14px; color: var(--fd-gold); min-height: 1.5em; margin: 0; }
.fd-contact-list { list-style: none; padding: 0; margin: 0; }
.fd-contact-list li { padding: 22px 0; border-bottom: 1px solid var(--fd-line-dark); }
.fd-contact-list strong { display: block; font-size: 11px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--fd-gold); margin-bottom: 6px; }
.fd-contact-list a, .fd-contact-list span { color: var(--fd-cream); font-size: 18px; }
.fd-grid--contact { grid-template-columns: 1fr 1.3fr; align-items: start; }
/* Greyscale map tinted with the site's cream text colour (palette 7) */
.fd-map-wrap { position: relative; }
.fd-map-wrap::after { content: ""; position: absolute; inset: 0; background: var(--fd-cream); mix-blend-mode: multiply; pointer-events: none; }
@media (max-width: 900px) { .fd-grid--contact { grid-template-columns: 1fr; } }
.fd-map { aspect-ratio: 16 / 9; border: 0; width: 100%; filter: grayscale(1) contrast(1.1); display: block; }

/* ---------- CTA ---------------------------------------------------------- */
.fd-cta { position: relative; overflow: hidden; isolation: isolate; text-align: center; }
.fd-cta__media { position: absolute; inset: 0; z-index: -2; }
.fd-cta__media img { width: 100%; height: 100%; object-fit: cover; }
.fd-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--fd-night), rgba(9, 12, 16, .7) 30%, rgba(9, 12, 16, .7) 70%, var(--fd-night)); }

/* ---------- Footer (Kadence: #colophon .site-footer) ---------------------- */
.site-footer { background: var(--fd-night); border-top: 1px solid var(--fd-line-dark); padding: clamp(64px, 9vw, 120px) 0 32px; font-size: 15px; }
.fd-footer-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: clamp(32px, 4vw, 64px); }
@media (max-width: 900px) { .fd-footer-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .fd-footer-top { grid-template-columns: 1fr; } }
.site-footer h4 { font-family: var(--fd-font-body); font-size: 11px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--fd-gold); margin-bottom: 22px; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: 10px; }
.site-footer a { color: var(--fd-text-dark); }
.site-footer a:hover { color: var(--fd-gold); }
.fd-footer-brand img { width: 120px; border-radius: 50%; margin-bottom: 24px; }
.fd-footer-brand p { max-width: 320px; }
.fd-newsletter { display: flex; border-bottom: 1px solid rgba(255, 236, 204, .3); margin-top: 8px; }
.fd-newsletter input { flex: 1; min-width: 0; background: none; border: 0; color: var(--fd-cream); padding: 12px 0; font: 300 15px var(--fd-font-body); }
.fd-newsletter input:focus { outline: none; }
.fd-newsletter button { background: none; border: 0; color: var(--fd-gold); cursor: pointer; font: 500 11px var(--fd-font-body); letter-spacing: .22em; text-transform: uppercase; }
.fd-social { display: flex; gap: 12px; margin-top: 24px; }
.fd-social a { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--fd-line-dark); border-radius: 50%; }
.fd-social a:hover { border-color: var(--fd-gold); }
.fd-social svg { width: 16px; height: 16px; }
.fd-footer-word { font-family: var(--fd-font-display); font-size: clamp(64px, 17vw, 260px); line-height: .8; letter-spacing: .06em; text-align: center; color: rgba(245, 165, 36, .1); -webkit-text-stroke: 1.5px rgba(245, 165, 36, .65); margin: clamp(48px, 8vw, 100px) 0 32px; user-select: none; }
.fd-footer-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-top: 28px; border-top: 1px solid var(--fd-line-dark); font-size: 12px; letter-spacing: .08em; color: var(--global-palette6); }

.fd-footer-legal { display: inline-flex; gap: 20px; }
.fd-footer-legal a { color: var(--global-palette6); }
.fd-footer-legal a:hover { color: var(--fd-gold); }

/* ---------- Legal pages (Privacy Policy, Terms of Use) ------------------- */
.fd-legal { padding-top: clamp(150px, 16vw, 200px); }
.fd-legal h1 { font-size: clamp(44px, 6vw, 76px); margin-bottom: .35em; }
.fd-legal__date { font-size: 13px; letter-spacing: .08em; color: var(--global-palette6); margin-bottom: 32px; }
.fd-legal__body { font-size: 17px; line-height: 1.8; }
.fd-legal__body h2 { font-size: clamp(26px, 2.8vw, 34px); margin: 1.8em 0 .5em; }
.fd-legal__body ul { padding-left: 22px; margin: 0 0 1.25em; }
.fd-legal__body li { margin-bottom: .5em; }
.fd-legal__body strong { color: var(--fd-cream); font-weight: 500; }
.fd-legal__body a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Toast (add to cart feedback) --------------------------------- */
.fd-toast {
	position: fixed; left: 50%; bottom: 28px; z-index: 1500; transform: translate(-50%, 140%);
	background: var(--fd-cream); color: var(--fd-ink); padding: 16px 26px; font-size: 14px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, .4); transition: transform .6s var(--fd-ease); max-width: calc(100% - 32px);
}
.fd-toast.is-visible { transform: translate(-50%, 0); }

/* ---------- Reduced motion ---------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
	.fd-reveal { opacity: 1; transform: none; }
	.fd-split .fd-word > span { transform: none; }
	html { scroll-behavior: auto; }
}