/* =========================================================================
   alibarbarprime — design system v3
   One family (Montserrat 400–700, LOST MARY-style usage). Champagne gold on
   layered black. Lighter titles, normal tracking, title-case. Shorter hero,
   AU express-shipping badge, image-forward masonry branding. Ports to theme.
   ========================================================================= */

/* ---- 1. Tokens ---------------------------------------------------------- */
:root {
	--g-pale: #F6E6B6;
	--g-hi: #ECD597;
	--g: #C9A24B;
	--g-mid: #B68C3C;
	--g-dk: #8C6C2C;
	--g-deep: #5E481D;
	--foil: linear-gradient(100deg, #C9A24B 0%, #F6E6B6 25%, #9A7B2E 50%, #F6E6B6 75%, #C9A24B 100%); /* periodic: 0%==100% for seamless shimmer */

	--ink: #09090A;
	--ink-1: #0D0D0F;
	--ink-2: #131316;
	--ink-3: #1B1B1F;
	--line-d: rgba(236, 213, 151, .16);
	--line-dd: rgba(255, 255, 255, .07);

	--paper: #F7F5EF;
	--paper-2: #EFEBE0;
	--card: #FFFFFF;
	--line-l: #E5DFD0;

	--t-d: #F4F2EC;
	--t-d-mut: #9D9A90;
	--t-l: #17161B;
	--t-l-mut: #6A6860;

	--accent: #B98CFF;
	/* iridescent accents — RESTRAINED: colour lives only in the hero aurora; pure gold everywhere else */
	--iris-a: #B98CFF; --iris-b: #FF74C8; --iris-c: #5BD6FF; --iris-d: #ECD597;
	--iris: linear-gradient(100deg, #B98CFF, #FF74C8, #5BD6FF, #ECD597);

	--maxw: 1240px;
	--r: 14px;
	--ease: cubic-bezier(.22, .61, .36, 1);
	--f: "Montserrat", system-ui, -apple-system, sans-serif;
}

/* ---- 2. Base ------------------------------------------------------------ */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: var(--f);
	font-weight: 400;
	background: var(--ink);
	color: var(--t-d);
	line-height: 1.62;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

h1, h2, h3, h4 { font-family: var(--f); font-weight: 700; line-height: 1.08; letter-spacing: -.012em; margin: 0; }

.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: 1.75rem; }
.section { padding-block: clamp(3.5rem, 7vw, 6rem); position: relative; }

/* film grain for dark surfaces */
.grain { position: relative; }
.grain::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	opacity: .5; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
}
.grain > * { position: relative; z-index: 1; }

/* metallic foil text + slow shimmer */
.foil { background: var(--foil); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 5s linear infinite; }
/* moves exactly one tile (200%); with a periodic gradient the wrap is seamless */
@keyframes shimmer { from { background-position: 0 0; } to { background-position: -200% 0; } }

.eyebrow {
	font-weight: 600; font-size: .74rem; letter-spacing: .2em; text-transform: uppercase;
	color: var(--g-hi); display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 1.2rem;
}
.eyebrow::before { content: ""; width: 24px; height: 1px; background: linear-gradient(90deg, transparent, var(--g)); }
.section--light .eyebrow { color: var(--g-dk); }
.section--light .eyebrow::before { background: linear-gradient(90deg, transparent, var(--g-dk)); }

/* scroll reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in { opacity: 1; transform: none; }

/* ---- 3. Icons ---------------------------------------------------------- */
.icon { width: 1em; height: 1em; display: inline-block; vertical-align: middle; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.icon--fill { fill: currentColor; stroke: none; }

/* ---- 4. Buttons -------------------------------------------------------- */
.btn { display: inline-flex; align-items: center; gap: .55rem; padding: .95rem 1.7rem; font-weight: 600; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; border: 0; cursor: pointer; border-radius: 3px; transition: transform .35s var(--ease), box-shadow .35s var(--ease), color .25s, background .25s; }
.btn .icon { font-size: 1.05em; stroke-width: 2; }
.btn-gold { color: #1A1305; background: linear-gradient(95deg, #E8CE8A, #C9A24B 52%, #E2C173); box-shadow: 0 0 0 1px rgba(246, 230, 182, .35) inset; }
.btn-gold:hover { transform: translateY(-3px); box-shadow: 0 16px 38px -14px rgba(201, 162, 75, .85), 0 0 22px -6px rgba(236, 213, 151, .45), 0 0 0 1px rgba(246, 230, 182, .55) inset; }
.btn-gold .icon { transition: transform .35s var(--ease); }
.btn-gold:hover .icon { transform: translateX(4px); }
.btn-line { color: var(--g-hi); background: transparent; box-shadow: 0 0 0 1px var(--g-deep) inset; }
.btn-line:hover { transform: translateY(-3px); color: var(--g-pale); box-shadow: 0 0 0 1px var(--g) inset; }
.section--light .btn-line { color: var(--g-dk); box-shadow: 0 0 0 1px var(--line-l) inset; }
.section--light .btn-line:hover { color: var(--t-l); box-shadow: 0 0 0 1px var(--g) inset; }
.btn-wa { color: #07310f; background: linear-gradient(95deg, #3BE07A, #1FB257); }
.btn-wa:hover { transform: translateY(-3px); box-shadow: 0 16px 40px -16px rgba(37, 211, 102, .6); }

/* ---- 5. Announcement --------------------------------------------------- */
.announce { background: var(--ink-1); border-bottom: 1px solid var(--line-dd); color: var(--g-hi); font-weight: 600; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; text-align: center; padding: .6rem 1rem; }
.announce .sep { color: var(--g-dk); margin: 0 .8rem; }

/* ---- 6. Header --------------------------------------------------------- */
.header { position: sticky; top: 0; z-index: 60; background: rgba(9, 9, 10, .72); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid var(--line-dd); }
.header__in { display: flex; align-items: center; gap: 2.5rem; height: 72px; }
.brand { font-weight: 800; font-size: 1.35rem; letter-spacing: -.03em; color: #fff; margin-right: auto; }
.brand .p { background: var(--foil); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 5s linear infinite; }
/* header logo (webp wordmark) + small solid-gold "prime" badge at its top-right */
.brand--logo { position: relative; display: inline-flex; align-items: center; line-height: 0; }
.brand__logo { height: 34px; width: auto; display: block; }
.brand__prime { position: absolute; top: 0; left: 100%; margin-left: 6px; display: inline-block; padding: 3px 6px 2px; font-weight: 700; font-size: .5rem; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: #1A1305; background: linear-gradient(125deg, #F6E6B6 0%, #E8CE8A 38%, #C9A24B 100%); border-radius: 4px; box-shadow: 0 2px 7px -1px rgba(201, 162, 75, .55), inset 0 1px 0 rgba(255, 255, 255, .5); }
.nav { display: flex; gap: 1.9rem; }
.nav a { font-weight: 600; font-size: .82rem; color: var(--t-d); padding: .4rem 0; position: relative; }
.nav a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: var(--g); transition: width .3s var(--ease); }
.nav a:hover { color: var(--g-hi); }
.nav a:hover::after { width: 100%; }
.header__icons { display: flex; align-items: center; gap: 1.35rem; color: var(--t-d); font-size: 1.2rem; }
.header__icons a { display: inline-flex; transition: color .2s; }
.header__icons a:hover { color: var(--g-hi); }
.cart { position: relative; }
.cart__n { position: absolute; top: -7px; right: -9px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: linear-gradient(95deg, #E8CE8A, #C9A24B); color: #1A1305; font-size: .62rem; font-weight: 700; display: grid; place-items: center; }
.burger { display: none; background: 0; border: 0; color: var(--g-hi); font-size: 1.35rem; cursor: pointer; }

/* ---- 7. Hero (compact) ------------------------------------------------- */
.hero { background: var(--ink); overflow: hidden; }
.hero__in { display: grid; grid-template-columns: 1.05fr .95fr; gap: 2rem; align-items: center; padding-block: clamp(2.4rem, 4.5vw, 3.8rem); }
.hero h1 { font-size: clamp(2.5rem, 5.6vw, 4.4rem); font-weight: 700; line-height: 1.04; margin-bottom: 1.3rem; }
.hero h1 .lt { color: #fff; }
.hero p.lead { font-size: 1.05rem; color: var(--t-d-mut); max-width: 30rem; margin: 0 0 1.9rem; }

/* Australia express-shipping badge — the headline selling point */
.ausbadge { display: inline-flex; align-items: center; gap: .8rem; padding: .55rem 1.05rem; border: 1px solid var(--g-deep); border-radius: 11px; background: linear-gradient(120deg, rgba(201, 162, 75, .12), rgba(255, 255, 255, .015)); box-shadow: 0 12px 34px -20px rgba(201, 162, 75, .55); }
.ausflag { width: 42px; height: 21px; border-radius: 3px; flex: none; box-shadow: 0 3px 10px rgba(0, 0, 0, .5); }
.ausbadge__txt strong { display: block; font-weight: 700; font-size: .9rem; line-height: 1.2; color: #fff; letter-spacing: -.01em; }
.ausbadge__txt span { display: block; font-size: .72rem; line-height: 1.25; color: var(--g-hi); margin-top: .04rem; }
.hero__mini { display: flex; flex-wrap: wrap; gap: 1.4rem; margin-top: 1.6rem; }
.hero__mini span { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; color: var(--t-d-mut); }
.hero__mini .icon { color: var(--g); font-size: .95rem; }

/* gold device (CSS placeholder for product photography) */
.stage { position: relative; display: grid; place-items: center; min-height: 330px; }
.stage::before { content: ""; position: absolute; top: 47%; left: 52%; width: min(138%, 640px); height: min(124%, 520px); border-radius: 58% 42% 63% 37% / 47% 60% 40% 53%; background: radial-gradient(56% 66% at 24% 34%, rgba(185, 140, 255, .30), transparent 70%), radial-gradient(52% 60% at 78% 26%, rgba(91, 214, 255, .22), transparent 72%), radial-gradient(64% 58% at 72% 78%, rgba(255, 116, 200, .24), transparent 70%), radial-gradient(74% 80% at 38% 64%, rgba(236, 213, 151, .30), transparent 78%); filter: blur(62px) saturate(118%); transform: translate(-50%, -50%); opacity: .92; animation: irisdrift 28s ease-in-out infinite; }
.stage::after { content: ""; position: absolute; bottom: 8%; width: 220px; height: 28px; border-radius: 50%; background: radial-gradient(ellipse, rgba(0, 0, 0, .45), transparent 70%); filter: blur(7px); }
/* hero product image — mix-blend-mode:multiply removes white bg so aurora bleeds through */
.hero__img { position: relative; z-index: 1; width: min(112%, 540px); max-height: 400px; object-fit: contain; mix-blend-mode: multiply; drop-shadow(0 8px 24px rgba(0,0,0,.3)); filter: drop-shadow(0 8px 28px rgba(0,0,0,.35)); }
.device { position: relative; z-index: 1; width: 138px; height: 268px; border-radius: 32px; background: linear-gradient(116deg, #6E541F 0%, #F6E6B6 24%, #C9A24B 50%, #EAD18A 68%, #6E541F 100%); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .32), inset -14px 0 30px rgba(0, 0, 0, .3), inset 14px 0 24px rgba(255, 255, 255, .2), 0 30px 70px -16px rgba(0, 0, 0, .7); }
.device::before { content: ""; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); width: 40px; height: 23px; border-radius: 10px 10px 5px 5px; background: #131316; box-shadow: inset 0 -3px 6px rgba(255, 255, 255, .1); }
.device span { position: absolute; inset: 0; display: grid; place-items: center; writing-mode: vertical-rl; transform: rotate(180deg); font-weight: 700; font-size: .8rem; letter-spacing: .32em; color: rgba(40, 28, 6, .5); }

/* ---- 8. Marquee -------------------------------------------------------- */
.marquee { background: var(--ink-1); border-block: 1px solid var(--line-dd); overflow: hidden; padding-block: 1rem; }
.marquee__track { display: inline-flex; white-space: nowrap; animation: roll 28s linear infinite; }
.marquee__track span { font-weight: 700; font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1px var(--g-dk); padding: 0 1.4rem; display: inline-flex; align-items: center; gap: 1.4rem; }
.marquee__track span .dot { color: var(--g); -webkit-text-stroke: 0; }
@keyframes roll { to { transform: translateX(-50%); } }

/* ---- 9. Products (LIGHT) ----------------------------------------------- */
.section--light { background: var(--paper); color: var(--t-l); }
.section--light h2 { color: var(--t-l); }
.head { max-width: 44rem; }
.head--center { text-align: center; margin-inline: auto; }
.head h2 { font-size: clamp(1.9rem, 4vw, 2.9rem); font-weight: 700; margin-bottom: .8rem; }
.head p { color: var(--t-l-mut); margin: 0; font-size: 1rem; }
.section--dark .head p { color: var(--t-d-mut); }

.shopbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 2.4rem; }
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(228px, 1fr)); gap: 1.4rem; }

.card { position: relative; background: var(--card); border: 0; border-radius: var(--r); padding: 1.05rem; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 6px 22px -14px rgba(20, 18, 10, .25); transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.card:hover { transform: translateY(-7px); box-shadow: 0 28px 50px -26px rgba(201, 162, 75, .6); }
.card__media { position: relative; aspect-ratio: 1; display: grid; place-items: center; border-radius: var(--r) var(--r) 0 0; background: radial-gradient(circle at 50% 34%, #fff, #EFEBE0 74%); margin: -1.05rem -1.05rem 1rem; overflow: hidden; cursor: pointer; }
.card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgrid__empty { grid-column: 1 / -1; text-align: center; color: var(--t-l-mut); padding: 2rem 0; }
.card__media .device { width: 76px; height: 148px; border-radius: 19px; transition: transform .45s var(--ease); }
.card__media .device::before { width: 23px; height: 13px; top: -9px; }
.card__media .device span { font-size: .5rem; letter-spacing: .22em; }
.card:hover .card__media .device { transform: translateY(-4px) scale(1.045); }
.card__tag { position: absolute; top: .8rem; left: .8rem; font-weight: 700; font-size: .6rem; letter-spacing: .12em; color: var(--g-dk); border: 1px solid var(--g-hi); background: #FBF4DF; padding: .22rem .48rem; border-radius: 3px; z-index: 2; }
.card__view { position: absolute; left: 0; right: 0; bottom: 0; padding: .5rem; text-align: center; font-weight: 700; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #1A1305; background: linear-gradient(95deg, #E8CE8A, #C9A24B); transform: translateY(101%); transition: transform .35s var(--ease); z-index: 2; }
.card:hover .card__view { transform: none; }
.card__series { font-weight: 600; font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--g-dk); margin-bottom: .35rem; }
.card h3 { font-weight: 600; font-size: .98rem; line-height: 1.32; color: var(--t-l); margin: 0 0 .5rem; min-height: 2.6em; }
.stars { display: inline-block; width: 82px; height: 14px; margin-bottom: .8rem; background-repeat: repeat-x; background-size: 16.4px 14px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='14' viewBox='0 0 16 14'%3E%3Cpath fill='%23C9A24B' d='M8 1l1.9 3.9 4.3.4-3.2 2.9.95 4.2L8 10.1 3.95 12.3l.95-4.2L1.7 5.3l4.3-.4z'/%3E%3C/svg%3E"); }
.card__row { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: auto; margin-bottom: .7rem; }
.price { font-weight: 700; font-size: 1.2rem; color: var(--t-l); }
.qty { display: inline-flex; align-items: center; border: 1px solid var(--line-l); border-radius: 8px; overflow: hidden; flex: none; }
.qty__btn { width: 28px; height: 30px; border: 0; background: #fff; color: var(--t-l); font: 700 1rem/1 var(--f); cursor: pointer; display: grid; place-items: center; transition: background .2s, color .2s; }
.qty__btn:hover { background: var(--g-hi); color: #1A1305; }
.qty__n { min-width: 26px; text-align: center; font-weight: 700; font-size: .9rem; color: var(--t-l); }
.card__cta { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.btn-add, .btn-buy { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; padding: .62rem .4rem; font: 700 .72rem/1 var(--f); letter-spacing: .04em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: transform .25s var(--ease), box-shadow .3s var(--ease), background .25s, color .2s; }
.btn-add { background: #fff; color: var(--g-dk); box-shadow: 0 0 0 1px var(--g) inset; }
.btn-add:hover { background: var(--g-hi); color: #1A1305; transform: translateY(-2px); }
.btn-buy { background: linear-gradient(120deg, #1C1C21, #0C0C0E); color: #fff; box-shadow: 0 0 0 1px var(--g-deep) inset; }
.btn-buy:hover { transform: translateY(-2px); box-shadow: 0 12px 24px -10px rgba(0, 0, 0, .6), 0 0 0 1px var(--g) inset; }

/* ---- 10. Branding — image-forward masonry (LOST MARY style) ------------ */
/* large, asymmetric iridescent ambient — client wants colour back in THIS section
   (exception to the gold-only rule; hero is still the other colour zone) */
.brand-sec { background: radial-gradient(940px 660px at 80% -8%, rgba(185, 140, 255, .22), transparent 60%), radial-gradient(820px 720px at 2% 38%, rgba(91, 214, 255, .15), transparent 58%), radial-gradient(700px 560px at 98% 86%, rgba(255, 116, 200, .17), transparent 58%), radial-gradient(560px 440px at 26% 112%, rgba(236, 213, 151, .13), transparent 62%), var(--ink); }
.bgrid { column-count: 2; column-gap: 2.2rem; margin-top: 2.6rem; }
.bcard { break-inside: avoid; margin-bottom: 2.6rem; }
.bcard__label { font-weight: 600; font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--g-hi); }
.bcard__title { font-weight: 700; font-size: clamp(1.7rem, 3.2vw, 2.6rem); line-height: 1.05; color: #fff; margin: .5rem 0 .8rem; }
.bcard__more { display: inline-flex; align-items: center; gap: .45rem; font-weight: 700; font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: var(--t-d); border-bottom: 2px solid var(--g); padding-bottom: 3px; transition: color .2s, gap .25s var(--ease); }
.bcard__more:hover { color: var(--g-hi); gap: .75rem; }
.bcard__more .icon { font-size: .95rem; stroke-width: 2.2; }
.bcard__img { margin-top: 1.2rem; border-radius: 14px; overflow: hidden; position: relative; border: 1px solid var(--line-d); display: grid; place-items: center; }
.bcard__img .device { width: 96px; height: 188px; }
.bcard__img .ph { position: absolute; bottom: .9rem; left: .9rem; font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; color: var(--t-d-mut); }
/* atmospheric placeholder backdrops (swap for real photography) */
.img-wide { aspect-ratio: 16 / 10; background: radial-gradient(120% 110% at 32% 24%, #251f2c, #0B0B0C 74%); }
.img-tall { aspect-ratio: 3 / 4; background: radial-gradient(120% 120% at 62% 28%, #1c2331, #0B0B0C 74%); }
.bcard:nth-child(3) .img-wide { background: radial-gradient(120% 110% at 50% 30%, #2a241a, #0B0B0C 74%); }
.bcard:nth-child(2) .img-tall { background: radial-gradient(120% 120% at 42% 30%, #271c2e, #0B0B0C 74%); }
/* RESTRAINED RULE (client): iridescent colour lives ONLY in the hero aurora
   (behind the transparent product PNG). Everywhere else is pure champagne gold
   — gold hover halos, gold card accent, gold ambient. No glow inside image
   boxes (opaque/PNG images cover it). Gold dominates; colour stays in the hero. */

/* ---- 11. The Standard (why) -------------------------------------------- */
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line-dd); border-radius: var(--r); overflow: hidden; }
.why { padding: 2.1rem; border-right: 1px solid var(--line-dd); border-bottom: 1px solid var(--line-dd); transition: background .3s; }
.why:hover { background: rgba(236, 213, 151, .035); }
.why__i { width: 40px; height: 40px; color: var(--g-hi); font-size: 1.6rem; display: grid; place-items: center; margin-bottom: 1.1rem; }
.why h3 { font-weight: 700; font-size: 1rem; color: #fff; margin-bottom: .4rem; }
.why p { margin: 0; color: var(--t-d-mut); font-size: .9rem; }

/* ---- 12. Wholesale ----------------------------------------------------- */
.ws { background: var(--ink); }
.ws__in { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; border: 1px solid var(--line-d); border-radius: 20px; padding: clamp(1.8rem, 4vw, 3.2rem); padding-bottom: clamp(1.5rem, 2.6vw, 1.9rem); background: linear-gradient(130deg, var(--ink-2), var(--ink-1)); }
/* rising gold smoke behind wholesale content — seamless loop: each puff fades to 0
   opacity at BOTH 0% and 100%, so there is no visible seam where it repeats */
.ws__in > div:not(.ws-smoke) { position: relative; z-index: 1; }
.ws-smoke { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: 20px; pointer-events: none; }
.ws-smoke i { position: absolute; bottom: -14%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(246, 230, 182, .5), rgba(201, 162, 75, .2) 46%, transparent 70%); filter: blur(30px); opacity: 0; animation: smokerise linear infinite; will-change: transform, opacity; }
.ws-smoke i:nth-child(1) { left: 6%;  width: 42%; animation-duration: 15s; animation-delay: -2s; }
.ws-smoke i:nth-child(2) { left: 34%; width: 54%; animation-duration: 20s; animation-delay: -8s; }
.ws-smoke i:nth-child(3) { left: 62%; width: 44%; animation-duration: 17s; animation-delay: -13s; }
.ws-smoke i:nth-child(4) { left: 20%; width: 36%; animation-duration: 23s; animation-delay: -5s; }
.ws-smoke i:nth-child(5) { left: 76%; width: 40%; animation-duration: 18s; animation-delay: -10s; }
@keyframes smokerise { 0% { transform: translateY(8%) scale(.6); opacity: 0; } 15% { opacity: .75; } 55% { opacity: .5; } 100% { transform: translateY(-180%) scale(1.5); opacity: 0; } }
.ws h2 { font-size: clamp(1.7rem, 3.6vw, 2.6rem); font-weight: 700; margin-bottom: 1rem; }
.ws p { color: var(--t-d-mut); margin-bottom: 1.4rem; }
.chips { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.9rem; }
.chip { font-weight: 600; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; padding: .48rem .9rem; border-radius: 3px; border: 1px solid var(--g-deep); color: var(--g-hi); }
.ws__contact { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.4rem; }
.ws__email { display: inline-flex; align-items: center; gap: .5rem; color: var(--g-hi); font-weight: 600; font-size: .92rem; transition: color .2s; }
.ws__email:hover { color: var(--g-pale); }
.ws__email .icon { font-size: 1.15rem; }
/* pure-white placeholder image below the wholesale contact buttons */
.ws__ph { position: relative; margin-top: 1.9rem; aspect-ratio: 16 / 7; background: #fff; border-radius: 14px; box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .7); }
.ws__ph .ph { position: absolute; bottom: .85rem; left: 1rem; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #B9B2A2; }
.ws__art { display: grid; place-items: center; }
.ws__art .stage { min-height: 280px; }
/* wholesale: gold-only aurora — colour stays in the hero */
.ws__art .stage::before { background: conic-gradient(from 0deg, rgba(236, 213, 151, .3), rgba(201, 162, 75, .22), rgba(140, 108, 44, .16), rgba(236, 213, 151, .3)); }
.ws__art .device { transform: rotate(-9deg); width: 116px; height: 226px; }

/* ---- 13. Reviews (LIGHT) — summary + authentic cards ------------------- */
/* summary: average score · rating breakdown · sales stats */
.rsum { display: grid; grid-template-columns: minmax(190px, .85fr) 1.5fr; gap: clamp(1.4rem, 4vw, 3rem); align-items: center; background: var(--card); border: 1px solid var(--line-l); border-radius: var(--r); padding: clamp(1.5rem, 3.5vw, 2.6rem); margin: 3rem 0 2.6rem; }
.rsum__score { text-align: center; border-right: 1px solid var(--line-l); padding-right: clamp(1rem, 3vw, 2.2rem); }
.rsum__big { font-weight: 700; font-size: clamp(3rem, 7vw, 4.4rem); line-height: 1; color: var(--t-l); letter-spacing: -.02em; }
.rsum__big span { font-size: .3em; color: var(--t-l-mut); font-weight: 600; }
.rsum__score .stars--lg { margin: .55rem auto .5rem; }
.rsum__based { font-size: .8rem; color: var(--t-l-mut); }
.stars--lg { width: 132px; height: 22px; background-size: 26.4px 22px; }
.rsum__bars { display: flex; flex-direction: column; gap: .5rem; }
.rbar { display: flex; align-items: center; gap: .7rem; font-size: .8rem; }
.rbar__k { display: inline-flex; align-items: center; gap: .22rem; width: 38px; flex: none; font-weight: 600; color: var(--t-l); }
.rstar { width: 11px; height: 11px; fill: var(--g); }
.rbar__t { flex: 1; height: 8px; border-radius: 999px; background: var(--paper-2); overflow: hidden; }
.rbar__t b { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--g-mid), var(--g-hi)); }
.rbar em { width: 36px; flex: none; text-align: right; font-style: normal; font-weight: 600; color: var(--t-l-mut); }
.rsum__stats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; border-top: 1px solid var(--line-l); padding-top: 1.5rem; }
.rstat { text-align: center; }
.rstat strong { display: block; font-weight: 700; font-size: clamp(1.5rem, 3.6vw, 2.1rem); letter-spacing: -.01em; background: var(--foil); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 5s linear infinite; }
.rstat span { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--t-l-mut); }

/* review cards */
.tgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.4rem; }
.t { background: var(--card); border: 1px solid var(--line-l); border-radius: var(--r); padding: 1.6rem; display: flex; flex-direction: column; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease); }
.t:hover { transform: translateY(-5px); border-color: var(--g-hi); box-shadow: 0 22px 44px -26px rgba(201, 162, 75, .5); }
.t__top { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .85rem; }
.t .stars { margin: 0; }
.t__ver { display: inline-flex; align-items: center; gap: .32rem; font-weight: 600; font-size: .66rem; letter-spacing: .03em; text-transform: uppercase; color: var(--t-l-mut); }
.t__ver .icon { font-size: 1rem; stroke-width: 2.6; color: #1FB257; }
.t__txt { margin: 0 0 1.1rem; color: var(--t-l); font-size: .94rem; }
.t__buy { font-weight: 600; font-size: .72rem; letter-spacing: .03em; color: var(--g-dk); margin: 0 0 1.1rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line-l); }
.t__who { display: flex; align-items: center; gap: .75rem; margin-top: auto; }
.t__av { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(95deg, #E8CE8A, #C9A24B); color: #1A1305; display: grid; place-items: center; font-weight: 700; font-size: .95rem; flex: none; }
.t__name { font-weight: 700; color: var(--t-l); font-size: .88rem; }
.t__name .t__city { font-weight: 500; color: var(--t-l-mut); }
.t__date { color: var(--t-l-mut); font-size: .76rem; margin-top: .1rem; }

/* ---- 14. FAQ (LIGHT) --------------------------------------------------- */
.faq { max-width: 820px; margin-inline: auto; }
.q { border-top: 1px solid var(--line-l); }
.q:last-child { border-bottom: 1px solid var(--line-l); }
.q__btn { width: 100%; background: 0; border: 0; text-align: left; font-weight: 600; font-size: 1.02rem; color: var(--t-l); padding: 1.4rem 3rem 1.4rem 0; position: relative; cursor: pointer; }
.q__btn .pm { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--g-dk); }
.q__btn .pm::before, .q__btn .pm::after { content: ""; position: absolute; background: currentColor; transition: transform .3s var(--ease); }
.q__btn .pm::before { top: 9px; left: 2px; width: 16px; height: 2px; }
.q__btn .pm::after { left: 9px; top: 2px; width: 2px; height: 16px; }
.q.open .pm::after { transform: scaleY(0); }
.q__a { max-height: 0; overflow: hidden; transition: max-height .35s var(--ease); }
.q__a p { color: var(--t-l-mut); margin: 0 0 1.4rem; }

/* ---- 15. Final + footer ------------------------------------------------ */
.final { background: radial-gradient(640px 380px at 50% 122%, rgba(236, 213, 151, .12), rgba(201, 162, 75, .06) 48%, transparent 66%), var(--ink); text-align: center; }
.final h2 { font-size: clamp(2rem, 5vw, 3.6rem); font-weight: 700; margin-bottom: 1rem; }
.final p { color: var(--t-d-mut); max-width: 34rem; margin: 0 auto 2rem; }
.final__cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

.foot { background: var(--ink-1); border-top: 1px solid var(--line-dd); padding-block: 3.6rem 2rem; }
.foot__grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; gap: 2.5rem; padding-bottom: 2.8rem; border-bottom: 1px solid var(--line-dd); }
.foot__brand .brand { font-size: 1.55rem; display: inline-block; margin-bottom: 1rem; }
.foot__brand p { color: var(--t-d-mut); font-size: .9rem; max-width: 24rem; }
.foot__soc { display: flex; gap: .8rem; margin-top: 1.3rem; }
.foot__soc a { width: 38px; height: 38px; border: 1px solid var(--line-d); border-radius: 50%; display: grid; place-items: center; color: var(--g-hi); font-size: 1.1rem; transition: border-color .25s, transform .25s; }
.foot__soc a:hover { border-color: var(--g); transform: translateY(-2px); }
.foot h4 { font-weight: 700; color: var(--g-hi); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 1rem; }
.foot a.fl { display: block; color: var(--t-d-mut); padding: .32rem 0; font-size: .9rem; transition: color .2s; }
.foot a.fl:hover { color: var(--g-hi); }
.foot__bot { padding-top: 1.7rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; color: var(--t-d-mut); font-size: .8rem; }
.foot__age { color: var(--g-dk); }

/* ---- 16. Responsive ---------------------------------------------------- */
@media (max-width: 960px) {
	.hero__in, .ws__in { grid-template-columns: 1fr; }
	.ws__art { display: none; } /* the placeholder image is the wholesale visual when stacked; drop the trailing aurora so the card ends at the image */
	.stage { min-height: 280px; order: -1; }
	.bgrid { column-count: 1; }
	.why-grid { grid-template-columns: 1fr 1fr; }
	.foot__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
	.nav, .header__icons .ic-search { display: none; }
	.burger { display: inline-flex; }
	/* The Standard: always two per row on mobile (never collapse to one) */
	.why-grid { grid-template-columns: 1fr 1fr; }
	.why { padding: 1.5rem 1.15rem; }
	.why__i { margin-bottom: .75rem; font-size: 1.4rem; }
	.why h3 { font-size: .92rem; }
	.why p { font-size: .8rem; line-height: 1.5; }
	.foot__grid { grid-template-columns: 1fr; }
}

/* =======================================================================
   v4 — clean split (fig4), range lookbook (fig5), rich footer (fig3)
   ======================================================================= */
.imgbox { position: relative; border-radius: 16px; overflow: hidden; display: grid; place-items: center; border: 1px solid var(--line-l); }
.imgbox .ph { position: absolute; bottom: .8rem; left: .9rem; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .42); }

/* Fig 4: clean split feature (light) */
.feat { background: var(--paper); color: var(--t-l); }
.feat__in { display: grid; grid-template-columns: 1.04fr .96fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.feat h2 { font-size: clamp(2rem, 4.5vw, 3.3rem); font-weight: 700; color: var(--t-l); margin-bottom: 1.1rem; }
.feat .lead { color: var(--t-l-mut); margin: 0 0 1.7rem; max-width: 30rem; }
.feat .bcard__more { color: var(--t-l); border-color: var(--g); }
.feat .bcard__more:hover { color: var(--g-dk); }
.feat__main { aspect-ratio: 1 / 1; background: radial-gradient(120% 120% at 50% 38%, #1b1b20, #000 76%); border-color: #1b1b20; }
.feat__main .device { width: 150px; height: 290px; }
.feat__mini { width: 62%; aspect-ratio: 4 / 3; margin: 2rem 0 0 auto; background: radial-gradient(120% 120% at 50% 40%, #221b16, #000 76%); border-color: #221b16; }
.feat__mini .device { width: 84px; height: 164px; transform: rotate(8deg); }

/* Fig 5: range lookbook (dark) */
.range { background: var(--ink); }
.rgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.rcard { position: relative; aspect-ratio: 3 / 4; border-radius: 14px; overflow: hidden; border: 1px solid var(--line-d); display: grid; place-items: center; }
.rcard::before { content: ""; position: absolute; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(201, 162, 75, .2), transparent 66%); }
.rcard .device { width: 92px; height: 180px; position: relative; }
.r-1 { background: radial-gradient(120% 120% at 40% 26%, #241d2b, #0B0B0C 74%); }
.r-2 { background: radial-gradient(120% 120% at 60% 30%, #1c2330, #0B0B0C 74%); }
.r-3 { background: radial-gradient(120% 120% at 50% 30%, #2a221a, #0B0B0C 74%); }
.rcard__tag { position: absolute; top: .9rem; left: .9rem; z-index: 1; font-weight: 700; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--g-hi); border: 1px solid var(--g-deep); background: rgba(0, 0, 0, .4); padding: .3rem .55rem; border-radius: 3px; }
.range__all { text-align: center; margin-top: 2.8rem; }
.range__all a { display: inline-flex; align-items: center; gap: .6rem; font-weight: 700; font-size: clamp(1.3rem, 3vw, 1.9rem); color: #fff; border-bottom: 2px solid var(--g); padding-bottom: 4px; transition: gap .25s var(--ease), color .2s; }
.range__all a:hover { gap: 1rem; color: var(--g-hi); }
.range__all .icon { font-size: .9em; stroke-width: 2.2; }

/* Fig 3: rich footer */
.foot2 { background: var(--ink-1); border-top: 1px solid var(--line-dd); }
.foot2__follow { border-block: 0; border-bottom: 1px solid var(--line-dd); }
/* footer thumbs auto-scroll (no manual scrollbar — products drift slowly) */
.foot2__thumbs { overflow: hidden; border-bottom: 1px solid var(--line-dd); }
.fthumb-track { display: flex; width: max-content; animation: roll 45s linear infinite; }
.fthumb-track:hover { animation-play-state: paused; }
.fthumb { width: clamp(150px, 20vw, 240px); flex: none; aspect-ratio: 5 / 4; position: relative; display: grid; place-items: center; border-right: 1px solid var(--line-dd); }
.fthumb .device { width: 56px; height: 110px; }
.ft-1 { background: radial-gradient(120% 120% at 40% 30%, #2a1d2e, #0B0B0C 76%); }
.ft-2 { background: radial-gradient(120% 120% at 60% 30%, #231f2e, #0B0B0C 76%); }
.ft-3 { background: radial-gradient(120% 120% at 50% 40%, #2a241a, #0B0B0C 76%); }
.ft-4 { background: radial-gradient(120% 120% at 50% 30%, #1c2330, #0B0B0C 76%); }
.ft-5 { background: radial-gradient(120% 120% at 45% 30%, #271c2e, #0B0B0C 76%); }
.foot2__body { text-align: center; padding-block: clamp(2.5rem, 5vw, 4rem); }
.foot2__soc { display: flex; justify-content: center; gap: 1rem; margin-bottom: 2.6rem; }
.foot2__soc a { width: 44px; height: 44px; border: 1px solid var(--line-d); border-radius: 50%; display: grid; place-items: center; color: var(--g-hi); font-size: 1.2rem; transition: border-color .25s, transform .25s, color .25s; }
.foot2__soc a:hover { border-color: var(--g); color: var(--g-pale); transform: translateY(-3px); }
.foot2__news .brand { font-size: 1.6rem; display: inline-block; margin-bottom: 1rem; }
.foot2__news h4 { font-weight: 700; font-size: clamp(1.4rem, 3vw, 1.9rem); color: #fff; margin-bottom: .5rem; }
.foot2__news p { color: var(--t-d-mut); margin-bottom: 1.4rem; }
.news-form { display: flex; gap: .6rem; max-width: 460px; margin: 0 auto 3rem; }
.news-form input { flex: 1; min-width: 0; background: var(--ink-3); border: 1px solid var(--line-dd); border-radius: 4px; padding: .9rem 1rem; color: var(--t-d); font: inherit; }
.news-form input::placeholder { color: var(--t-d-mut); }
.foot2__svc { display: flex; flex-wrap: wrap; justify-content: center; gap: 2.8rem; margin-bottom: 2.4rem; }
.foot2__svc h5 { font-weight: 700; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--g-hi); margin-bottom: .4rem; }
.foot2__svc a { font-weight: 700; color: var(--t-d); }
.foot2__svc small { display: block; color: var(--t-d-mut); font-size: .8rem; margin-top: .2rem; }
/* anti-counterfeit notice — gold-bordered pill, premium */
.foot2__anti { max-width: 660px; margin: 0 auto 1.5rem; display: inline-flex; align-items: center; gap: .7rem; padding: .8rem 1.4rem; border: 1px solid var(--g-deep); border-radius: 999px; background: linear-gradient(120deg, rgba(201, 162, 75, .10), rgba(201, 162, 75, .02)); text-align: left; }
.foot2__anti .icon { color: var(--g-hi); font-size: 1.35rem; stroke-width: 1.8; flex: none; }
.foot2__anti p { margin: 0; color: var(--t-d); font-size: .84rem; font-weight: 600; }
.foot2__warn { max-width: 620px; margin: 0 auto; color: var(--g-dk); font-size: .82rem; }
.foot2__legal { border-top: 1px solid var(--line-dd); padding-block: 1.6rem; display: flex; justify-content: center; gap: 1.6rem; flex-wrap: wrap; color: var(--t-d-mut); font-size: .8rem; }
.foot2__legal a:hover { color: var(--g-hi); }

@media (max-width: 960px) {
	.feat__in { grid-template-columns: 1fr; }
	.rgrid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
	.rgrid { grid-template-columns: 1fr; }
	.news-form { flex-direction: column; }
}

/* =======================================================================
   v5 — iridescent accents, staggered 2-col masonry, feat single shot
   ======================================================================= */
@keyframes irisspin { from { transform: translate(-50%, -50%) rotate(0); } to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes irisdrift {
	0%   { transform: translate(-50%, -50%) rotate(0deg) scale(1); }
	33%  { transform: translate(-53%, -47%) rotate(6deg) scale(1.05); }
	66%  { transform: translate(-48%, -52%) rotate(-5deg) scale(1.03); }
	100% { transform: translate(-50%, -50%) rotate(0deg) scale(1); }
}

/* product-card top accent stripe removed per client — hover is clean lift + gold border only */

/* two-column staggered masonry — stays 2 cols on mobile (no tall single stack) */
.bmason { display: flex; gap: 1.8rem; align-items: flex-start; margin-top: 2.6rem; }
.bcol { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2.4rem; }
.bcol--offset { margin-top: 4.5rem; }
/* push the Delivery card further down so the heading clears the previous image with spacing */
.bcard--drop { margin-top: 3.2rem; }

/* feat: single clean product shot (big image removed) */
.feat__shot { aspect-ratio: 4 / 5; background: radial-gradient(120% 120% at 50% 38%, #1b1b20, #000 76%); border-color: #1b1b20; }
.feat__shot .device { width: 122px; height: 238px; }

@media (max-width: 620px) {
	.bmason { gap: 1rem; }
	.bcol { gap: 1.2rem; }
	.bcol--offset { margin-top: 2.4rem; }
	.bcard--drop { margin-top: 1.6rem; }
}

/* =======================================================================
   v6 — reviews summary + authentic cards; products always 2-up on mobile;
        card stripe removed (client feedback 2026-06-04)
   ======================================================================= */
@media (max-width: 760px) {
	.rsum { grid-template-columns: 1fr; }
	.rsum__score { border-right: 0; border-bottom: 1px solid var(--line-l); padding: 0 0 1.4rem; }
}
@media (max-width: 620px) {
	/* products: never collapse to a single column — always two per row */
	.pgrid { grid-template-columns: repeat(2, 1fr); gap: .8rem; }
	.card { padding: .7rem; }
	.card h3 { font-size: .9rem; min-height: 0; }
	.card__series { font-size: .58rem; }
	.price { font-size: 1.06rem; }
	.card__row { flex-wrap: wrap; gap: .4rem .5rem; }
	.qty__btn { width: 26px; }
	.card__cta { grid-template-columns: 1fr; gap: .4rem; }
	.btn-add, .btn-buy { padding: .58rem .4rem; }
	.rsum__stats { gap: .5rem; }
	.rstat strong { font-size: 1.3rem; }
	.rstat span { font-size: .62rem; letter-spacing: .06em; }
}

/* reviews: collapsed shows only the first card; "View More" reveals the rest */
.reviews-more { text-align: center; margin-top: 2.2rem; }
/* collapsed default (mobile / fallback): a single centered card */
#reviews.is-collapsed .tgrid { grid-template-columns: minmax(0, 560px); justify-content: center; }
#reviews.is-collapsed .t:nth-child(n+2) { display: none; }

/* PC: peek carousel — full centered card flanked by a half card on each side, clipped by the screen */
@media (min-width: 768px) {
	#reviews.is-collapsed .tgrid { display: flex; flex-wrap: nowrap; justify-content: center; align-items: stretch; gap: 1.6rem; width: 100vw; margin-left: calc(50% - 50vw); overflow: clip; overflow-clip-margin: 30px; }
	#reviews.is-collapsed .t { flex: 0 0 min(620px, calc(50vw - 1.6rem)); }
	#reviews.is-collapsed .t:nth-child(-n+3) { display: flex; }
	#reviews.is-collapsed .t:nth-child(n+4) { display: none; }
}
#reviews .reviews-more .icon { transform: rotate(90deg); transition: transform .3s var(--ease); }
#reviews:not(.is-collapsed) .reviews-more .icon { transform: rotate(-90deg); }

/* =======================================================================
   v7 — reviews refinement (gold laurel + frame), toast for card actions
   ======================================================================= */
.rsum { position: relative; }
.rsum::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; border-radius: var(--r) var(--r) 0 0; background: linear-gradient(90deg, transparent, var(--g) 22%, var(--g-pale) 50%, var(--g) 78%, transparent); }
.rsum__rate { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; }
.laurel { width: 38px; height: 76px; color: var(--g); flex: none; filter: drop-shadow(0 2px 5px rgba(201, 162, 75, .35)); }
.laurel--l { transform: scaleX(-1); }
.rsum__rate .rsum__big { margin: 0; }

/* toast — preview feedback for the product-card interactions */
.toast { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 18px); z-index: 200; background: rgba(13, 13, 15, .94); border: 1px solid var(--g-deep); color: var(--g-hi); font-weight: 600; font-size: .82rem; padding: .8rem 1.3rem; border-radius: 999px; box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .7), 0 0 0 1px rgba(246, 230, 182, .12) inset; opacity: 0; pointer-events: none; transition: opacity .3s var(--ease), transform .3s var(--ease); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); max-width: min(90vw, 440px); text-align: center; }
.toast.in { opacity: 1; transform: translate(-50%, 0); }

/* =======================================================================
   v8 — hero Bulk Order (WhatsApp) + copy-email; product "View all flavors";
        dedicated all-flavours shop page
   ======================================================================= */

/* hero: shipping badge on top, a gold Bulk Order button stretched to the badge
   width, then the click-to-copy email — left-aligned stack (PC + mobile) */
.hero__ship { display: flex; flex-direction: column; align-items: stretch; gap: .7rem; width: fit-content; max-width: 100%; margin-top: .5rem; }
.ausbadge { gap: .7rem; padding: .5rem .95rem; }   /* shortened a touch; widest item — sets the stack width */
.hero__bulk { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.hero__wa { align-self: stretch; justify-content: center; padding: .82rem 1.4rem; font-size: .82rem; }   /* stretch to the badge width */
.hero__wa .icon { font-size: 1.3em; }
.hero__wa:hover .icon { transform: none; }   /* keep the WhatsApp glyph steady (override btn-gold arrow nudge) */
/* click-to-copy email under the Bulk Order button */
.hero__email { display: inline-flex; align-items: center; gap: .45rem; margin: 0; padding: .15rem 0; background: 0; border: 0; font: 600 .84rem/1.1 var(--f); color: var(--g-hi); cursor: pointer; transition: color .2s; }
.hero__email .icon { font-size: 1.1em; color: var(--g); }
.hero__email span { border-bottom: 1px dashed rgba(236, 213, 151, .42); padding-bottom: 2px; transition: border-color .2s; }
.hero__email:hover { color: var(--g-pale); }
.hero__email:hover span { border-bottom-color: var(--g-pale); }

/* products: "View all flavors" — top-right link + button below the grid */
.viewall { display: inline-flex; align-items: center; gap: .5rem; flex: none; font-weight: 700; font-size: .82rem; letter-spacing: .03em; color: var(--g-dk); border-bottom: 2px solid var(--g); padding-bottom: 3px; white-space: nowrap; transition: color .2s, gap .25s var(--ease); }
.viewall:hover { color: var(--t-l); gap: .8rem; }
.viewall .icon { font-size: 1em; stroke-width: 2.2; }
.shopmore { text-align: center; margin-top: 2.6rem; }

/* ---- all-flavours shop page -------------------------------------------- */
.shophero { position: relative; background: var(--ink); padding-block: .9rem; border-bottom: 1px solid var(--line-dd); }
.crumb { display: flex; align-items: center; gap: .5rem; font-size: .76rem; letter-spacing: .04em; color: var(--t-d-mut); margin: 0; }
.crumb a { transition: color .2s; }
.crumb a:hover { color: var(--g-hi); }
.crumb .sep { color: var(--g-dk); }

/* sticky filter / count bar (sits under the sticky header) */
.shoptools { position: sticky; top: 72px; z-index: 40; background: rgba(247, 245, 239, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--line-l); }
.shoptools__in { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .8rem 1.2rem; padding-block: .85rem; }
.shopfilter { display: flex; flex-wrap: wrap; gap: .5rem; }
.fpill { font: 600 .74rem/1 var(--f); letter-spacing: .08em; text-transform: uppercase; padding: .55rem .95rem; border-radius: 999px; border: 1px solid var(--line-l); background: #fff; color: var(--t-l-mut); cursor: pointer; transition: color .2s, border-color .2s, background .2s, transform .2s var(--ease); }
.fpill:hover { border-color: var(--g); color: var(--t-l); transform: translateY(-1px); }
.fpill.is-on { background: linear-gradient(95deg, #E8CE8A, #C9A24B); border-color: transparent; color: #1A1305; box-shadow: 0 8px 20px -10px rgba(201, 162, 75, .7); }
.shopcount { flex: none; font-size: .82rem; color: var(--t-l-mut); }
.shopcount b { color: var(--t-l); font-weight: 700; }
.shopgrid { padding-block: clamp(2.4rem, 5vw, 4rem); }

/* slim trust strip (shop page) */
.trustrow { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line-dd); border-radius: var(--r); overflow: hidden; }
.trustitem { display: flex; align-items: center; gap: .8rem; padding: 1.5rem 1.5rem; border-right: 1px solid var(--line-dd); }
.trustitem:last-child { border-right: 0; }
.trustitem .icon { color: var(--g-hi); font-size: 1.6rem; flex: none; }
.trustitem b { display: block; font-weight: 700; font-size: .92rem; color: #fff; }
.trustitem span { display: block; font-size: .76rem; color: var(--t-d-mut); margin-top: .12rem; }

@media (max-width: 960px) {
	.trustrow { grid-template-columns: 1fr 1fr; }
	.trustitem:nth-child(2) { border-right: 0; }
	.trustitem:nth-child(-n+2) { border-bottom: 1px solid var(--line-dd); }
}
@media (max-width: 620px) {
	.hero__ship { gap: .8rem; }
	.viewall { font-size: .72rem; }
	.shoptools { top: 64px; }
	.shoptools__in { gap: .6rem; }
	.fpill { padding: .48rem .8rem; font-size: .68rem; }
	.shopcount { width: 100%; }
	.trustitem { padding: 1.2rem 1.1rem; }
	.trustitem .icon { font-size: 1.35rem; }
	.trustitem b { font-size: .84rem; }
	.trustitem span { font-size: .7rem; }
}

/* =======================================================================
   v9 — product detail page (PDP): gallery + buy box + sticky mobile bar
   ======================================================================= */
.pdp-sec { padding-top: clamp(1.4rem, 3vw, 2.2rem); }
/* breadcrumb on the light PDP */
.section--light .crumb { color: var(--t-l-mut); margin-bottom: 1.6rem; }
.section--light .crumb a:hover { color: var(--g-dk); }
.section--light .crumb .sep { color: var(--g); }

.pdp { display: grid; grid-template-columns: 1.02fr .98fr; gap: clamp(1.6rem, 4vw, 3.4rem); align-items: start; }
.pdp__gallery { position: sticky; top: 96px; }

/* gallery: blank light placeholders (real photos come from WooCommerce) */
.pdp__main { position: relative; aspect-ratio: 1; border-radius: var(--r); overflow: hidden; background: radial-gradient(circle at 50% 36%, #fff, #EFEBE0 76%); box-shadow: 0 18px 48px -28px rgba(20, 18, 10, .4); display: grid; place-items: center; }
.pdp__main img { width: 100%; height: 100%; object-fit: cover; }
.pdp__tag { position: absolute; top: 1rem; left: 1rem; font-weight: 700; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--g-dk); border: 1px solid var(--g-hi); background: #FBF4DF; padding: .3rem .6rem; border-radius: 3px; }
.pdp__ph { font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--t-l-mut); }
.pdp__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin-top: .7rem; }
.pdp__thumb { aspect-ratio: 1; border-radius: 9px; overflow: hidden; border: 1px solid var(--line-l); background: radial-gradient(circle at 50% 40%, #fff, #EFEBE0 78%); cursor: pointer; padding: 0; transition: border-color .2s, transform .2s var(--ease); }
.pdp__thumb:hover { transform: translateY(-2px); border-color: var(--g); }
.pdp__thumb.is-on { border-color: var(--g); box-shadow: 0 0 0 1px var(--g) inset; }

/* info column */
.pdp__series { font-weight: 600; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--g-dk); margin-bottom: .5rem; }
.pdp__title { font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 700; color: var(--t-l); line-height: 1.12; margin-bottom: .7rem; }
.pdp__rate { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; }
.pdp__rate .stars { margin: 0; }
.pdp__rate a { font-size: .82rem; color: var(--t-l-mut); border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.pdp__rate a:hover { color: var(--g-dk); border-bottom-color: var(--g); }
.pdp__price { display: flex; align-items: baseline; gap: .7rem; margin-bottom: 1.1rem; }
.pdp__price .price { font-size: 2rem; }
.pdp__price .pdp__gst { font-size: .8rem; color: var(--t-l-mut); font-weight: 600; }
.pdp__desc { color: var(--t-l-mut); margin: 0 0 1.2rem; max-width: 34rem; }
.pdp__notes { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.6rem; }
.pdp__notes span { font-weight: 600; font-size: .72rem; letter-spacing: .04em; padding: .42rem .85rem; border-radius: 999px; border: 1px solid var(--line-l); background: #fff; color: var(--t-l); }

/* buy box */
.pdp__buy { display: flex; flex-direction: column; gap: .8rem; margin-bottom: 1.5rem; }
.pdp__cartrow { display: flex; gap: .8rem; }
.qty--lg { border-radius: 10px; }
.qty--lg .qty__btn { width: 44px; height: 52px; font-size: 1.2rem; }
.qty--lg .qty__n { min-width: 42px; font-size: 1rem; }
.btn-add--lg, .btn-buy--lg { padding: .98rem 1rem; font-size: .8rem; border-radius: 10px; }
.btn-add--lg { flex: 1; }
.btn-buy--lg { width: 100%; }

/* mini trust row */
.pdp__trust { list-style: none; display: flex; flex-wrap: wrap; gap: 1.2rem; padding: 0; margin: 0 0 1.6rem; }
.pdp__trust li { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; font-weight: 600; color: var(--t-l); }
.pdp__trust .icon { color: var(--g-dk); font-size: 1.1rem; }

/* at-a-glance spec list */
.pdp__meta { border-top: 1px solid var(--line-l); }
.pdp__meta dl { display: grid; grid-template-columns: max-content 1fr; margin: 0; }
.pdp__meta dt { font-weight: 700; font-size: .82rem; color: var(--t-l); padding: .72rem 1.4rem .72rem 0; border-bottom: 1px solid var(--line-l); }
.pdp__meta dd { font-size: .82rem; color: var(--t-l-mut); padding: .72rem 0; margin: 0; border-bottom: 1px solid var(--line-l); text-align: right; }
.pdp__warn { font-size: .78rem; color: var(--g-dk); margin: 1.2rem 0 0; }
.pdp__acc { max-width: none; margin: 1.4rem 0 0; }

/* sticky mobile add-to-cart bar (hidden on desktop) */
.pdp__sticky { display: none; }
@media (max-width: 760px) {
	.pdp { grid-template-columns: 1fr; }
	.pdp__gallery { position: static; }
	.pdp__sticky { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--line-l); box-shadow: 0 -10px 30px -18px rgba(0, 0, 0, .4); padding: .65rem 0; }
	.pdp__sticky-in { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
	.pdp__sticky-name { display: block; font-weight: 700; font-size: .78rem; color: var(--t-l); }
	.pdp__sticky .price { font-size: 1.1rem; }
	.pdp__sticky .btn-add { flex: none; padding: .82rem 1.7rem; border-radius: 10px; }
	body.has-sticky-buy { padding-bottom: 78px; }
}

/* =======================================================================
   v10 — PDP real content: live bulk pricing, specs, review system
   ======================================================================= */
.pdp__rate { flex-wrap: wrap; }
.pdp__sku { font-size: .72rem; letter-spacing: .04em; color: var(--t-l-mut); padding-left: .65rem; border-left: 1px solid var(--line-l); }

/* price + savings */
.pdp__price { margin-bottom: .4rem; }
.pdp__was { font-size: 1rem; font-weight: 600; }
.pdp__was s { color: var(--t-l-mut); }
.pdp__saveline { font-size: .86rem; font-weight: 700; color: var(--g-dk); margin: 0 0 1.2rem; }

/* bulk pricing table — the "buy more, save more" highlight */
.bulk { border: 1px solid var(--line-l); border-radius: 12px; overflow: hidden; margin: 0 0 1.5rem; background: #fff; }
.bulk__title { display: flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .8rem; letter-spacing: .02em; color: var(--t-l); padding: .8rem 1rem; background: linear-gradient(100deg, rgba(201, 162, 75, .16), rgba(201, 162, 75, .04)); border-bottom: 1px solid var(--line-l); }
.bulk__title .icon { color: var(--g-dk); font-size: 1.1rem; }
.bulk__row { display: grid; grid-template-columns: 1fr auto 1.4fr; align-items: center; gap: .8rem; padding: .68rem 1rem; font-size: .86rem; border-top: 1px solid var(--line-l); transition: background .2s; }
.bulk__row:first-child { border-top: 0; }
.bulk__q { font-weight: 600; color: var(--t-l); }
.bulk__u { font-weight: 700; color: var(--t-l); }
.bulk__s { text-align: right; font-weight: 700; font-size: .76rem; letter-spacing: .02em; color: var(--g-dk); }
.bulk__row:first-child .bulk__s { color: var(--t-l-mut); font-weight: 600; }
.bulk__row.is-on { background: linear-gradient(100deg, rgba(201, 162, 75, .18), rgba(201, 162, 75, .05)); box-shadow: inset 3px 0 0 var(--g); }
.bulk__row.is-on .bulk__u { color: var(--g-dk); }

/* Add-to-Cart total + free-shipping hint */
.btn-add__total { font-weight: 700; margin-left: .15rem; }
.pdp__ship { display: flex; align-items: center; gap: .5rem; margin: .15rem 0 0; font-size: .82rem; font-weight: 600; color: var(--t-l-mut); }
.pdp__ship .icon { color: var(--g-dk); font-size: 1.2rem; flex: none; }
.pdp__ship.is-free { color: var(--g-dk); }

/* specs with leading icons */
.pdp__metah { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--g-dk); margin: 1.6rem 0 .2rem; }
.pdp__meta dt { display: flex; align-items: center; gap: .55rem; }
.pdp__meta dt .icon { color: var(--g-dk); font-size: 1.05rem; flex: none; }

/* ---- reviews: compact summary + list + write form -------------------- */
.rvsum { display: grid; grid-template-columns: minmax(150px, .7fr) 1.4fr; gap: clamp(1.4rem, 4vw, 2.6rem); align-items: center; background: var(--card); border: 1px solid var(--line-l); border-radius: var(--r); padding: clamp(1.4rem, 3vw, 2rem); margin: 2rem 0 1.8rem; max-width: 740px; }
.rvsum__score { text-align: center; border-right: 1px solid var(--line-l); padding-right: clamp(1rem, 3vw, 2rem); }
.rvsum__big { font-weight: 700; font-size: clamp(2.6rem, 6vw, 3.6rem); line-height: 1; color: var(--t-l); letter-spacing: -.02em; }
.rvsum__big span { font-size: .3em; color: var(--t-l-mut); font-weight: 600; }
.rvsum__score .stars--lg { margin: .5rem auto .4rem; }
.rvsum__based { font-size: .78rem; color: var(--t-l-mut); }
.rvsum__bars { display: flex; flex-direction: column; gap: .45rem; }
.rv-list { margin-bottom: 2.4rem; }
.t__title { font-weight: 700; font-size: .98rem; color: var(--t-l); margin: 0 0 .4rem; }
/* pending (held-for-approval) review — only the author sees this in the real build */
.t--pending { border-style: dashed; background: #FCFBF7; }
.t__pending { display: inline-flex; align-items: center; gap: .32rem; font-weight: 700; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--g-dk); background: #FBF4DF; border: 1px solid var(--g-hi); padding: .22rem .5rem; border-radius: 3px; }

.rvwrite { max-width: 740px; background: var(--card); border: 1px solid var(--line-l); border-radius: var(--r); padding: clamp(1.4rem, 3vw, 2rem); }
.rvwrite h3 { font-size: 1.2rem; font-weight: 700; color: var(--t-l); margin: 0 0 .8rem; }
.rvwrite__gate { display: flex; align-items: flex-start; gap: .55rem; font-size: .84rem; line-height: 1.5; color: var(--t-l-mut); background: var(--paper-2); border-radius: 10px; padding: .8rem 1rem; margin: 0 0 1.4rem; }
.rvwrite__gate .icon { color: var(--g-dk); font-size: 1.15rem; flex: none; margin-top: .12rem; }
.rvwrite__gate strong { color: var(--t-l); }
.rvform__row { margin-bottom: 1rem; }
.rvform__row > label { display: block; font-weight: 700; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--t-l); margin-bottom: .45rem; }
.rvform__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.rvform input, .rvform textarea { width: 100%; background: #fff; border: 1px solid var(--line-l); border-radius: 9px; padding: .75rem .9rem; font: 400 .92rem var(--f); color: var(--t-l); }
.rvform input:focus, .rvform textarea:focus { outline: 0; border-color: var(--g); box-shadow: 0 0 0 3px rgba(201, 162, 75, .15); }
.rvform textarea { resize: vertical; }
.rvform__foot { display: flex; align-items: center; gap: 1rem 1.2rem; flex-wrap: wrap; margin-top: .2rem; }
.rvform__note { font-size: .78rem; color: var(--t-l-mut); }

/* interactive star rating picker */
.starpick { display: inline-flex; gap: .3rem; }
.starpick__s { background: 0; border: 0; padding: .12rem; cursor: pointer; line-height: 0; }
.starpick__s svg { width: 28px; height: 28px; fill: #DAD3C3; transition: fill .15s, transform .15s var(--ease); }
.starpick__s:hover svg { transform: scale(1.12); }
.starpick__s.on svg { fill: var(--g); }
.starpick__s.hot svg { fill: var(--g-hi); }

@media (max-width: 620px) {
	.rvsum { grid-template-columns: 1fr; }
	.rvsum__score { border-right: 0; border-bottom: 1px solid var(--line-l); padding: 0 0 1.2rem; }
	.rvform__grid { grid-template-columns: 1fr; }
}

/* =======================================================================
   v11 — slide-out cart drawer + fly-to-cart animation
   ======================================================================= */
.cart { background: 0; border: 0; cursor: pointer; padding: 0; }
/* fly-to-cart dot */
.flydot { position: fixed; z-index: 300; width: 20px; height: 20px; margin: -10px 0 0 -10px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #F6E6B6, #C9A24B 72%); box-shadow: 0 6px 18px -4px rgba(201, 162, 75, .85); pointer-events: none; animation: flycart .7s cubic-bezier(.5, 0, .35, 1) forwards; }
@keyframes flycart { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 70% { opacity: .95; } 100% { transform: translate(var(--dx), var(--dy)) scale(.2); opacity: .15; } }
.cart__n.pop { animation: cartpop .45s var(--ease); }
@keyframes cartpop { 0% { transform: scale(1); } 40% { transform: scale(1.55); } 100% { transform: scale(1); } }

.cartwrap { position: fixed; inset: 0; z-index: 120; }
.cartoverlay { position: absolute; inset: 0; background: rgba(9, 9, 10, .55); opacity: 0; transition: opacity .42s var(--ease); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.cartwrap.is-open .cartoverlay { opacity: 1; }
.cartdrawer { position: absolute; top: 0; right: 0; height: 100%; width: min(410px, 92vw); display: flex; flex-direction: column; background: var(--paper); color: var(--t-l); box-shadow: -24px 0 60px -24px rgba(0, 0, 0, .6); transform: translateX(100%); transition: transform .42s var(--ease); }
.cartwrap.is-open .cartdrawer { transform: none; }
.cartdrawer__head { display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 1.3rem; border-bottom: 1px solid var(--line-l); }
.cartdrawer__head h3 { font-size: 1.05rem; font-weight: 700; color: var(--t-l); display: flex; align-items: center; gap: .55rem; }
.cartdrawer__n { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: linear-gradient(95deg, #E8CE8A, #C9A24B); color: #1A1305; font-size: .72rem; font-weight: 700; display: inline-grid; place-items: center; }
.cartdrawer__x { background: 0; border: 0; color: var(--t-l-mut); cursor: pointer; padding: .2rem; display: inline-flex; font-size: 1.3rem; transition: color .2s; }
.cartdrawer__x:hover { color: var(--t-l); }
.cartdrawer__body { flex: 1; overflow-y: auto; padding: .4rem 1.3rem; }
.cartempty { text-align: center; color: var(--t-l-mut); padding: 3rem 1rem; }
.cartempty .icon { font-size: 2.4rem; color: var(--line-l); }
.cartempty p { margin: .8rem 0 1.4rem; }
.citem { display: grid; grid-template-columns: 56px 1fr auto; gap: .85rem; align-items: start; padding: 1rem 0; border-bottom: 1px solid var(--line-l); }
.citem__thumb { width: 56px; height: 56px; border-radius: 9px; background: radial-gradient(circle at 50% 38%, #fff, #EFEBE0 76%); border: 1px solid var(--line-l); }
.citem__name { font-weight: 700; font-size: .82rem; color: var(--t-l); line-height: 1.3; }
.citem__unit { font-size: .74rem; color: var(--t-l-mut); margin: .15rem 0 .55rem; }
.citem__unit s { opacity: .65; margin-left: .3rem; }
.citem__row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.qty--sm { border: 1px solid var(--line-l); border-radius: 7px; }
.qty--sm .qty__btn { width: 26px; height: 28px; font-size: .9rem; }
.qty--sm .qty__n { min-width: 24px; font-size: .82rem; }
.citem__line { font-weight: 700; font-size: .9rem; color: var(--t-l); }
.citem__rm { grid-column: 3; grid-row: 1; background: 0; border: 0; color: var(--t-l-mut); font-size: 1.25rem; line-height: 1; cursor: pointer; padding: 0 .1rem; transition: color .2s; }
.citem__rm:hover { color: #b3402f; }
.cartdrawer__foot { border-top: 1px solid var(--line-l); padding: 1.1rem 1.3rem 1.3rem; background: var(--card); }
.cartdrawer__ship { display: flex; align-items: center; gap: .45rem; font-size: .78rem; font-weight: 600; color: var(--t-l-mut); margin: 0 0 .8rem; min-height: 1.1em; }
.cartdrawer__ship .icon { font-size: 1.05rem; flex: none; }
.cartdrawer__ship.is-free { color: var(--g-dk); }
.cartdrawer__sub { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 1rem; }
.cartdrawer__sub span { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--t-l-mut); }
.cartdrawer__sub b { font-size: 1.4rem; font-weight: 700; color: var(--t-l); }
.cartdrawer__checkout { width: 100%; justify-content: center; }
.cartdrawer__cont { display: block; width: 100%; text-align: center; background: 0; border: 0; color: var(--t-l-mut); font: 600 .8rem var(--f); padding: .9rem 0 0; cursor: pointer; transition: color .2s; }
.cartdrawer__cont:hover { color: var(--t-l); }
body.cart-open { overflow: hidden; }

/* ---- v12: PDP total beside the counter + richer discount/shipping hint ---- */
.pdp__cartrow { flex-wrap: wrap; align-items: center; gap: .85rem .9rem; }
.pdp__cartrow .qty { flex: none; }
.pdp__totalbox { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: .1rem; line-height: 1.05; }
.pdp__totalbox-l { font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--t-l-mut); }
.pdp__totalwrap { display: flex; align-items: baseline; gap: .5rem; }
.pdp__total { font-size: 1.5rem; font-weight: 700; letter-spacing: -.01em; color: var(--t-l); }
.pdp__wastotal { font-size: .92rem; font-weight: 600; color: var(--t-l-mut); }
.pdp__cartrow .btn-add--lg { flex: 1 0 100%; }
.pdp__ship { display: flex; flex-direction: column; align-items: flex-start; gap: .42rem; margin-top: .55rem; }
.pdp__ship-line { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .82rem; font-weight: 600; color: var(--t-l-mut); }
.pdp__ship-line .icon { color: var(--g-dk); font-size: 1.15rem; flex: none; }
.pdp__ship-line.is-on { color: var(--g-dk); font-weight: 700; }

/* ---- v13: The Brand — global brand story, real photography ---- */
.brand-sec .head .brand-lede { max-width: 56ch; margin: 1.15rem 0 0; font-size: .98rem; line-height: 1.75; color: var(--t-d); }
.brand-creds { list-style: none; display: flex; flex-wrap: wrap; gap: .55rem 2rem; margin: 1.5rem 0 0; padding: 0; }
.brand-creds li { position: relative; padding-left: 1.05rem; font-weight: 600; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--g-hi); }
.brand-creds li::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; transform: translateY(-50%) rotate(45deg); background: linear-gradient(135deg, var(--g-hi), var(--g-dk)); }
.bcard__cap { margin: .55rem 0 0; max-width: 46ch; font-size: .85rem; line-height: 1.65; color: var(--t-d-mut); }
.bcard__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .65s var(--ease); }
.bcard:hover .bcard__img img { transform: scale(1.035); }
.img-169 { aspect-ratio: 16 / 9; background: #101013; }
.img-xtall { aspect-ratio: 3 / 5; background: #101013; }
.img-78 { aspect-ratio: 7 / 8; background: #101013; }
.brand-sec .bcol:not(.bcol--offset) { flex: 1.3; }
@media (max-width: 620px) {
	.brand-sec .bcol:not(.bcol--offset) { flex: 1; }
	.brand-sec .head .brand-lede { font-size: .88rem; line-height: 1.7; }
	.brand-creds { gap: .5rem 1.1rem; }
	.brand-creds li { font-size: .66rem; }
	.bcard__cap { font-size: .76rem; line-height: 1.55; }
}