/* =========================================================
   DABOMB — Homepage styles (v6, Silver / Platinum / Chrome)
   Per design_handoff_dabomb_silver spec.
   Builds on tokens from dabomb-tokens.css.
   ========================================================= */

/* ─── Accessibility utility ─── */
.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;
}

/* =================================================================
   COUNTRY DOTS — used on home (CHEGA AO BRASIL) and about pages.
   Originally inline in page-about-dabomb.php; lifted here so home
   can share the styling without duplication.
   ================================================================= */
.pd-countries {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: center;
	margin-top: 8px;
}
.pd-country {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.pd-country {
	cursor: default;
	transition: transform 0.2s ease;
}
.pd-country:hover { transform: translateY(-2px); }
.pd-country__dot {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	border: 1px solid var(--gold);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: 0.08em;
	color: var(--gold);
	background: rgba(201,168,76,0.08);
	position: relative;
	transition: background 0.2s, box-shadow 0.2s;
}
.pd-country:hover .pd-country__dot {
	background: rgba(201,168,76,0.18);
	box-shadow: 0 0 18px rgba(201,168,76,0.35);
}
/* BR is the focus market — pulse it constantly */
.pd-country--active .pd-country__dot {
	animation: pd-country-pulse 2.4s ease-in-out infinite;
}
@keyframes pd-country-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(201,168,76,0.55); }
	50%      { box-shadow: 0 0 0 10px rgba(201,168,76,0); }
}
@media (prefers-reduced-motion: reduce) {
	.pd-country--active .pd-country__dot { animation: none; }
}
.pd-country__name {
	font-family: var(--mono);
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--gold);
}

.dabomb-redesign .home-brazil__countries {
	margin-top: 32px;
	margin-bottom: 8px;
}

/* ─── Reset / base ─── */
*, *::before, *::after { box-sizing: border-box; }

html { overflow-x: hidden; }

body.dabomb-redesign {
	background: var(--bg);
	color: var(--ink);
	font-family: var(--sans);
	font-weight: 300;
	font-size: 15px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin: 0;
	overflow-x: hidden;
	/* Syne has no italic cut — font-synthesis: none prevents the browser from
	   faking an oblique slant on <em> tags. */
	font-synthesis: none;
}
body.dabomb-redesign img { max-width: 100%; display: block; }
body.dabomb-redesign a { color: inherit; text-decoration: none; }
/* Sitewide em neutralization — kills synthetic italic on legacy emphasis
   markup anywhere on the page (Elementor headings, wp editor content, etc). */
.dabomb-redesign em { font-style: normal; }

/* ─── Elementor-rendered interior pages (partner marketing, about, etc.) ───
   These pages set font-size inline on heading widgets, often via the
   editor's "Custom CSS" or inline style attribute with !important. Syne Bold
   at those sizes can overflow narrow containers, so cap every heading
   under page.php's <article class="page-content"> wrapper. Scoped this
   way so front-page.php's hand-tuned headlines (.hero__headline, etc.)
   stay unaffected.

   Higher specificity + !important is intentional — Elementor's default
   widget CSS uses !important on font-size, and page-level Custom CSS
   often does too. We need to reliably win. */
.dabomb-redesign .page-content .elementor-heading-title,
.dabomb-redesign .page-content .elementor-widget-text-editor h1,
.dabomb-redesign .page-content .elementor-widget-text-editor h2,
.dabomb-redesign .page-content .elementor-widget-text-editor h3,
.dabomb-redesign .page-content h1,
.dabomb-redesign .page-content h2,
.dabomb-redesign .page-content h3 {
	font-family: var(--serif) !important;
	font-weight: 700 !important;
	letter-spacing: var(--tr-display) !important;
	text-transform: uppercase !important;
	line-height: 1.18 !important;
	color: var(--ink) !important;
}
/* Fluid size cap — ~24px on a 320px phone, ~40px at 1440px desktop. */
.dabomb-redesign .page-content .elementor-widget-heading .elementor-heading-title,
.dabomb-redesign .page-content .elementor-widget-text-editor h1,
.dabomb-redesign .page-content .elementor-widget-text-editor h2,
.dabomb-redesign .page-content h1,
.dabomb-redesign .page-content h2 {
	font-size: clamp(22px, 3.2vw, 40px) !important;
}
.dabomb-redesign .page-content .elementor-widget-text-editor h3,
.dabomb-redesign .page-content h3 {
	font-size: clamp(18px, 2.2vw, 26px) !important;
}
/* Bottle template (page-the-bottle.php): lede uses “DáBomb Vodka…” — keep
   sentence case. Template does not wrap in `.page-content`, so select h1
   directly; also cover wrapped variants for consistency. */
.dabomb-redesign .bottle-hero__h1,
.dabomb-redesign .page-content .bottle-hero__h1 {
	text-transform: none !important;
	letter-spacing: 0.03em !important;
}

/* ─── Main landmark ─── */
.dabomb-redesign .site-main { display: block; }
/* Front-page main must span the full viewport — Hello Elementor's kit CSS
   caps #main to ~1140px on translated home pages (which are really page IDs,
   not the true front page), which was clipping the hero side rails. */
.dabomb-redesign .site-main.is-front {
	padding: 0;
	width: 100%;
	max-width: none;
	margin: 0;
}
.dabomb-redesign .site-main.is-interior {
	padding: 72px var(--pad-x) 96px;
	max-width: 1440px;
	margin: 0 auto;
	min-height: calc(100vh - 120px);
}
/* Full-bleed hero pages (a-garrafa) don't want the 72px top pad —
   the header floats over and the hero owns its own top spacing. */
.dabomb-redesign .site-main.is-interior:has(> .bottle-hero:first-child) {
	padding-top: 0;
}
/* About (Elementor full-bleed hero): default interior padding-top leaves a
   large dead band below the sticky header on mobile; tuck copy under the menu. */
@media (max-width: 768px) {
	.dabomb-redesign body.page-sobre-dabomb .site-main.is-interior,
	.dabomb-redesign body.page-about-dabomb .site-main.is-interior,
	.dabomb-redesign body.page-sobre-a-dabomb .site-main.is-interior {
		padding-top: 8px;
	}
}
.dabomb-redesign .site-main.is-interior .elementor,
.dabomb-redesign .site-main.is-interior .elementor-section {
	background: transparent;
}

/* ─── Typography utilities ─── */
.dabomb-redesign .eyebrow {
	font-family: var(--mono);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--gold);
}
/* Keep glow-variant eyebrow text aligned with other eyebrow labels. */
.dabomb-redesign .eyebrow--glow { color: var(--gold); }

.eyebrow-row {
	display: flex;
	align-items: center;
	gap: 14px;
}
.eyebrow-row .tick {
	width: 40px;
	height: 1px;
	background: var(--gold);
	flex-shrink: 0;
}
.eyebrow-row .tick--glow {
	background: var(--gold);
}

.hairline {
	height: 1px;
	background: var(--hairline);
	border: none;
}

/* ─── Buttons ─── */
.dabomb-redesign .btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: var(--tr-btn);
	text-transform: uppercase;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.dabomb-redesign .btn .dot {
	font-size: 14px;
	line-height: 1;
}
.dabomb-redesign .btn .arrow {
	transition: transform 0.2s var(--ease);
}

.dabomb-redesign .btn-primary {
	padding: 16px 26px;
	background: linear-gradient(180deg, #ffffff 0%, #d8dde5 50%, #a8aeb8 100%);
	color: #0a0910;
	position: relative;
}
.dabomb-redesign .btn-primary::before {
	content: '';
	position: absolute;
	inset: -1px;
	background: linear-gradient(180deg, #e8ecf2, #aab0ba);
	z-index: -1;
	filter: blur(14px);
	opacity: 0.45;
}
.dabomb-redesign .btn-primary:hover {
	transform: translateY(-1px);
}

.dabomb-redesign .btn-ghost {
	padding: 16px 4px;
	color: var(--ink);
	background: none;
	font-weight: 600;
	border-bottom: 1px solid var(--gold);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: border-color 200ms ease, color 200ms ease;
}
.dabomb-redesign .btn-ghost:hover {
	color: var(--gold);
	border-bottom-color: var(--gold-bright, var(--gold));
}
.dabomb-redesign .btn-ghost:hover .arrow {
	transform: translateX(4px);
}
.dabomb-redesign .btn-ghost .dot,
.dabomb-redesign .btn-ghost .arrow {
	color: var(--gold);
}


/* =================================================================
   NAV — Desktop
   ================================================================= */
.site-header {
	position: sticky;
	top: 0;
	/* High z-index so Elementor's e-con containers (which create their own
	   stacking contexts with z-index up to ~1000) never paint on top of the
	   header — including, crucially, the language-switch dropdown rendered
	   inside the header. */
	z-index: 99999;
	background: transparent;
	transition: background 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease;
	display: block;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0;
}

/* Desktop nav: flexbox + absolute-centered logo so it sits in the middle of
   the SAME row as the left/right link groups (not above them). */
.nav-desktop {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 22px var(--pad-x);
}
.nav-desktop__logo {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	flex-shrink: 0;
	z-index: 2;
}
.nav-desktop__left {
	display: flex;
	gap: 36px;
	align-items: center;
}
.nav-desktop__right {
	display: flex;
	gap: 36px;
	align-items: center;
}
.nav-desktop a {
	color: var(--ink-dim);
	font-family: var(--mono, "JetBrains Mono", monospace);
	font-size: 11px;
	letter-spacing: var(--tr-nav);
	text-transform: uppercase;
	font-weight: 500;
	transition: color 0.2s;
	white-space: nowrap;
}
.nav-desktop a:hover { color: var(--ink); }

/* Star logo — rotating emblem (same as production) */
.logo-star-img {
	animation: dabomb-star-spin 9s linear infinite;
	display: block;
}
@keyframes dabomb-star-spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* PARTNERS AREA → button — champagne treatment per gold-premium spec.
   Solid champagne text (not gradient — gradient-text fights with the
   button's background-color tint via specificity), wide tracking,
   inset top highlight, soft outer glow on hover. The spec's "simpler
   version" — gets ~90% of the premium feel reliably. */
.partner-btn {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	padding: 11px 18px 10px !important;
	border: 1px solid var(--db-gold-dim) !important;
	border-radius: 2px;
	font-family: var(--mono, "JetBrains Mono", monospace) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.22em !important;
	line-height: 1 !important;
	min-height: 32px;
	text-transform: uppercase;
	color: var(--db-gold-bright) !important;
	background: rgba(201, 168, 107, 0.04) !important;
	box-shadow:
		inset 0 1px 0 rgba(226, 200, 138, 0.18),
		0 0 0 0 rgba(201, 168, 107, 0);
	transition: border-color .35s cubic-bezier(0.22, 0.61, 0.36, 1),
	            box-shadow .35s cubic-bezier(0.22, 0.61, 0.36, 1),
	            color .35s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.partner-btn:hover {
	border-color: var(--db-gold-bright) !important;
	box-shadow:
		inset 0 1px 0 rgba(226, 200, 138, 0.30),
		0 0 16px -2px rgba(201, 168, 107, 0.40) !important;
	background: rgba(201, 168, 107, 0.04) !important;
}
/* Inline SVG arrow + nudge on hover */
.partner-btn .nav-arrow,
.partner-btn .arrow {
	display: inline-block;
	transition: transform .3s cubic-bezier(0.22, 0.61, 0.36, 1);
	stroke: var(--db-gold);
}
.partner-btn:hover .nav-arrow,
.partner-btn:hover .arrow {
	transform: translateX(3px);
	stroke: var(--db-gold-bright);
}
@media (prefers-reduced-motion: reduce) {
	.partner-btn,
	.partner-btn .nav-arrow,
	.partner-btn .arrow {
		transition: none !important;
	}
}

/* NAV — Mobile */
.nav-mobile {
	display: none;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: 1px solid var(--hairline);
}

.hamburger {
	width: 22px;
	height: 14px;
	position: relative;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}
.hamburger span {
	position: absolute;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--ink);
}
.hamburger span:first-child { top: 0; }
.hamburger span:nth-child(2) { top: 50%; transform: translateY(-50%); }
.hamburger span:last-child { bottom: 0; }

@media (max-width: 1200px) {
	.nav-desktop { gap: 24px; }
	.nav-desktop__left,
	.nav-desktop__right { gap: 18px; }
	.nav-desktop a { font-size: 13px; }
}
@media (max-width: 1050px) {
	.nav-desktop { gap: 14px; }
	.nav-desktop__left,
	.nav-desktop__right { gap: 12px; }
	.nav-desktop a { font-size: 12px; letter-spacing: 0.04em; }
	.partner-btn { padding: 8px 12px !important; font-size: 12px !important; }
}
/* Homepage: float header over hero so smoke shows through.
   absolute at top → fixed once is-scrolled fires (>20px scroll). */
.home .site-header {
	position: absolute;
	width: 100%;
	background: transparent !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	border: none !important;
	box-shadow: none !important;
}
.home .site-header.is-scrolled {
	position: fixed !important;
}
.home .nav-desktop {
	border: none !important;
	background: transparent !important;
}

/* Belt-and-braces: kill any border-bottom on the nav anywhere — except the
   partner button, which needs its full gold border to render. */
.site-header,
.site-header *:not(.partner-btn),
.nav-desktop,
.nav-desktop *:not(.partner-btn) {
	border-bottom-width: 0 !important;
}

@media (max-width: 900px) {
	.nav-desktop { display: none; }
	.nav-mobile { display: flex; }

	.home .nav-mobile {
		border-bottom: none;
		background: transparent;
		padding: 12px 16px;
	}
	.home .hamburger {
		width: auto;
		height: auto;
		display: flex;
		flex-direction: column;
		gap: 6px;
	}
	.home .hamburger span {
		position: static;
		width: 18px;
		height: 1px;
	}
}

/* Mobile nav — right-side slide-in panel with dimmed backdrop */
.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: 99998;
	background: rgba(0,0,0,0);
	pointer-events: none;
	transition: background 0.35s ease;
}
.mobile-nav.is-open {
	background: rgba(0,0,0,0.55);
	pointer-events: auto;
}
.mobile-nav__inner {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 68%;
	max-width: 320px;
	background: rgba(4,6,18,0.97);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	padding: 60px 32px 60px 24px;
	gap: 28px;
	transform: translateX(100%);
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.mobile-nav.is-open .mobile-nav__inner {
	transform: translateX(0);
}
.mobile-nav__inner a {
	font-family: var(--mono);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--ink-dim);
	text-align: right;
	transition: color 0.2s;
	white-space: nowrap;
}
.mobile-nav__inner a:hover,
.mobile-nav__inner a.is-active { color: var(--glow-hue); }
.mobile-nav__inner .partner-btn {
	color: var(--gold) !important;
	border: none !important;
	background: none !important;
	font-family: var(--mono) !important;
	font-size: 18px !important;
	letter-spacing: 0.18em !important;
	padding: 0 !important;
}


/* =================================================================
   HERO
   ================================================================= */
.hero {
	position: relative;
	padding: 90px var(--pad-x) 24px;
	min-height: 0;
	/* Nav is now fixed/overlaid — hero fills the full viewport.
	   Top padding clears the floating nav pills. */
	max-height: 100svh;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 40px;
	align-items: start;
	overflow: hidden;
}

/* Club backdrop — real nightclub photo vignetted to the edges.
   Sits below rails, copy, and bottle stage (z-index stacking via source order).
   Absolute children are positioned to the padding-box, not the border-box, so
   Animated noise texture fills the whole viewport hero — same technique as
   production's `.ruido` GIF overlay. The ::before pseudo-element adds the
   vivid cobalt ambient glow on both sides so the black bg reads as atmospheric
   blue smoke rather than flat darkness. */

/* Smoke video background — matches staging/prod Vimeo video background */
.hero-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: 0;
	pointer-events: none;
	opacity: 0.95;
}

/* Thin dark vignette on top of video so text stays legible */
.hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		radial-gradient(ellipse 80% 60% at 50% 50%, transparent 30%, rgba(0,0,0,0.45) 80%, rgba(0,0,0,0.75) 100%),
		linear-gradient(to right, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
}
.hero > :not(.hero-video) { position: relative; z-index: 2; }

/* Vertical rails */
.rail {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	writing-mode: vertical-rl;
	text-orientation: mixed;
	rotate: 180deg;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--ink-faint);
	display: flex;
	align-items: center;
	gap: 14px;
}
.rail--left { left: 22px; }
.rail--right { right: 22px; }
.rail .tick {
	width: 24px;
	height: 1px;
	background: var(--silver);
	opacity: 0.6;
}

/* Hero copy — widened so headline + sub fill the left column on wide desktops.
   Explicit grid placement — otherwise absolute-positioned siblings (backdrop,
   rails, scroll-cue) consume auto-placement slots and push copy into row 2+. */
.hero__copy {
	grid-column: 1;
	grid-row: 1;
	max-width: 640px;
	z-index: 2;
}
.hero__copy .eyebrow-row {
	margin-bottom: 32px;
}

.hero__headline {
	font-family: var(--serif);
	font-size: clamp(26px, 3.4vw, 52px);
	line-height: 0.96;
	font-weight: 700;
	letter-spacing: var(--tr-display);
	text-transform: none;
	color: var(--ink);
	text-shadow: var(--bloom);
	mix-blend-mode: screen;
	margin-bottom: 24px;
}
/* Syne has no italic — neutralize <em> to inherit so legacy PHP markup
   still renders cleanly. */
.hero__headline em {
	font-family: inherit;
	font-style: normal;
	font-weight: inherit;
	letter-spacing: inherit;
	background: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	color: inherit;
	text-shadow: inherit;
}

.hero__sub {
	color: var(--ink-dim);
	font-size: 16px;
	line-height: 1.65;
	font-weight: 300;
	max-width: 540px;
	margin-bottom: 28px;
}

.hero__stats {
	display: flex;
	gap: 40px;
	margin-bottom: 44px;
	padding: 20px 0;
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
}

/* On short/medium desktop viewports, compress hero to keep CTA above fold.
   Handoff acceptance: both CTAs visible in first viewport at 1440×900 — so
   we hide stats and tighten spacing whenever viewport height ≤ 920px.
   Must come AFTER the base .hero__stats rule so source-order wins on equal specificity. */
@media (max-height: 920px) and (min-width: 901px) {
	.hero { padding: 80px var(--pad-x) 20px; gap: 32px; }
	/* ruido has no inset dependency — it fills via inset:0 from base rule */
	.hero__stats { display: none; }
	.hero__sub { margin-bottom: 14px; }
	.hero__copy .eyebrow-row { margin-bottom: 14px; }
	.hero__headline { margin-bottom: 12px; font-size: clamp(28px, 3.4vw, 52px); }
	.scroll-cue { display: none; }
}
@media (max-height: 840px) and (min-width: 901px) {
	.hero__headline { font-size: clamp(24px, 3vw, 44px); line-height: 0.95; }
	.hero__sub { font-size: 14px; margin-bottom: 12px; }
}
.stat__n {
	font-family: var(--serif);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--ink);
	text-shadow: var(--bloom);
	display: block;
}
.stat__l {
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: var(--tr-lux);
	color: var(--ink-faint);
	text-transform: uppercase;
	margin-top: 4px;
	display: block;
}

.cta-row {
	display: flex;
	gap: 20px;
	align-items: center;
}


/* =================================================================
   BOTTLE STAGE — the signature glow element
   ================================================================= */
.bottle-stage {
	position: relative;
	/* Explicit grid placement — same reason as .hero__copy above. */
	grid-column: 2;
	grid-row: 1;
	align-self: start;
	min-height: 0;
	width: 100%;
	display: grid;
	place-items: center;
}

/* Halo — big radial glow behind bottle */
.halo {
	position: absolute;
	left: 50%;
	top: 55%;
	width: 520px;
	height: 520px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(circle at center,
		rgba(var(--glow), 0.55) 0%,
		rgba(var(--glow), 0.25) 20%,
		rgba(var(--glow), 0.08) 45%,
		transparent 70%);
	filter: blur(30px);
	opacity: var(--glow-intensity);
	pointer-events: none;
	animation: breathe 4.5s ease-in-out infinite;
}

/* Floor — elliptical blue pool under bottle, slow LED-style pulse so the
   page environment mirrors the bottle's LED base. */
.floor {
	position: absolute;
	bottom: 8%;
	left: 50%;
	transform: translateX(-50%);
	width: 80%;
	aspect-ratio: 3 / 1;
	background: radial-gradient(ellipse at center,
		rgba(var(--glow), 0.55) 0%,
		rgba(var(--glow), 0.22) 30%,
		transparent 72%);
	filter: blur(24px);
	opacity: 0.9;
	pointer-events: none;
	animation: floor-pulse 6s ease-in-out infinite;
}
@keyframes floor-pulse {
	0%, 100% { opacity: 0.6; transform: translateX(-50%) scale(1); }
	50%      { opacity: 1; transform: translateX(-50%) scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
	.floor { animation: none; }
}

/* Rays — 24 radial lines */
.rays {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 700px;
	height: 700px;
	opacity: calc(var(--glow-intensity) * 0.5);
	pointer-events: none;
	mix-blend-mode: screen;
}

/* Bottle base layer */
.bottle-wrap {
	position: relative;
	z-index: 2;
	display: inline-block;
}
.bottle-img {
	position: relative;
	z-index: 2;
	/* Bottle fits inside the hero row (100svh). Subtract top/bottom padding
	   (~114px) so the cap/base never clip. Caps at 720px on tall monitors. */
	max-height: min(720px, calc(100svh - 140px));
	width: auto;
	display: block;
	object-fit: contain;
	filter:
		drop-shadow(0 30px 60px rgba(0,0,0,0.6))
		drop-shadow(0 0 40px rgba(var(--glow), calc(var(--glow-intensity) * 0.3)))
		drop-shadow(0 0 100px rgba(var(--glow), calc(var(--glow-intensity) * 0.17)));
	animation: float 6s ease-in-out infinite;
}

/* Short-viewport overrides for the bottle stage.
   MUST come AFTER the base .bottle-img / .halo / .rays rules so source order
   wins on equal specificity. Each breakpoint tightens the bottle + glow so
   the full bottle (cap + base) stays inside the viewport below the nav. */
@media (max-height: 920px) and (min-width: 901px) {
	.bottle-img { max-height: calc(100svh - 140px); }
	.halo { width: 440px; height: 440px; }
	.rays { width: 600px; height: 600px; }
}
@media (max-height: 840px) and (min-width: 901px) {
	.bottle-img { max-height: calc(100svh - 140px); }
	.halo { width: 400px; height: 400px; }
	.rays { width: 540px; height: 540px; }
}

/* Scroll cue */
.scroll-cue {
	position: absolute;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--ink-faint);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	z-index: 3;
}
.scroll-cue__line {
	width: 1px;
	height: 40px;
	background: linear-gradient(180deg, var(--silver), transparent);
	animation: drop 2.5s ease-in-out infinite;
}


/* =================================================================
   ANIMATIONS
   ================================================================= */
@keyframes breathe {
	0%, 100% { opacity: var(--glow-intensity); transform: translate(-50%, -50%) scale(1); }
	50% { opacity: calc(var(--glow-intensity) * 1.18); transform: translate(-50%, -50%) scale(1.04); }
}

@keyframes glow-pulse {
	0%, 100% { opacity: calc(var(--glow-intensity) * 0.75); }
	50% { opacity: var(--glow-intensity); }
}

@keyframes float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-8px); }
}

@keyframes drop {
	0% { transform: scaleY(0); transform-origin: top; }
	50% { transform: scaleY(1); transform-origin: top; }
	50.01% { transform: scaleY(1); transform-origin: bottom; }
	100% { transform: scaleY(0); transform-origin: bottom; }
}

@keyframes ticker-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}


/* =================================================================
   TICKER
   ================================================================= */
.ticker {
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
	background: linear-gradient(180deg, rgba(200,205,214,0.04), transparent);
	overflow: hidden;
	padding: 20px 0;
	white-space: nowrap;
}
.ticker__track {
	display: inline-flex;
	animation: ticker-scroll 40s linear infinite;
	gap: 0;
}
.ticker__set {
	font-family: var(--serif);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: rgba(212, 182, 117, 0.82);
	text-shadow: 0 0 18px rgba(201, 168, 76, 0.35);
	padding-right: 48px;
	will-change: transform;
}
/* Style the diamond separators — ◆ in the copy */


/* =================================================================
   SECTION BLOCKS
   ================================================================= */
.section-block {
	padding: var(--pad-section) var(--pad-x);
	position: relative;
}

.section-headline {
	font-family: var(--serif);
	font-size: clamp(24px, 2.6vw, 36px);
	line-height: 1.04;
	font-weight: 700;
	letter-spacing: var(--tr-display);
	text-transform: uppercase;
	color: var(--ink);
	text-shadow: var(--bloom);
	mix-blend-mode: screen;
	margin: 22px 0 28px;
}
.section-headline em {
	font-family: inherit;
	font-style: normal;
	font-weight: 800;
	letter-spacing: inherit;
	background: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	color: inherit;
	text-shadow: inherit;
}

.section-body {
	color: var(--ink-dim);
	font-size: 15px;
	line-height: 1.7;
	max-width: 480px;
	font-weight: 300;
	margin-bottom: 32px;
}


/* =================================================================
   MARCA (Cap. 01)
   ================================================================= */
.two-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
	align-items: center;
}

.marca-visual {
	aspect-ratio: 4 / 5;
	background: url('../images/redesign/on-ice.jpeg') center/cover;
	border: none;
	position: relative;
	overflow: hidden;
}
.marca-visual::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 30%, rgba(8,7,10,0.7));
}
.marca-visual__caption {
	position: absolute;
	bottom: 24px;
	left: 24px;
	right: 24px;
	z-index: 2;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--ink);
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}


/* =================================================================
   O BRILHO / SIGNATURE (Cap. 02)
   ================================================================= */
.signature {
	position: relative;
	padding: 160px var(--pad-x);
	background:
		radial-gradient(circle at 30% 40%, rgba(var(--glow), 0.12), transparent 50%),
		radial-gradient(circle at 70% 60%, rgba(var(--glow), 0.08), transparent 50%),
		var(--bg-signature);
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
	overflow: hidden;
}

.signature__bg {
	position: absolute;
	inset: 0;
	background: url('../images/redesign/hands-glow.jpg') center/cover;
	opacity: 0.3;
	filter: contrast(1.1) saturate(1.15);
}
/* Homepage-injected variant: bottle bg + bumped opacity per audit. */
body.home .signature--injected .signature__bg {
	background: url('../images/bottle-full.webp') center 30%/cover, #08070a;
	opacity: 0.55;
	filter: contrast(1.05) saturate(1.05) brightness(0.85);
}
/* Center the inner content on the injected variant (the original
   front-page.php signature was left-aligned; the homepage version
   reads better centered with 4 steps in a row). */
body.home .signature--injected .signature__inner {
	max-width: 1100px;
	margin: 0 auto;
	text-align: center;
}
body.home .signature--injected .eyebrow-row {
	justify-content: center;
}
body.home .signature--injected .signature__steps {
	text-align: left;
}
@media (max-width: 900px) {
	body.home .signature--injected .signature__steps {
		flex-direction: column;
		gap: 24px;
	}
}
.signature__bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(5,4,10,0.85), rgba(5,4,10,0.6) 50%, rgba(5,4,10,0.95));
}

.signature__inner {
	position: relative;
	z-index: 2;
	max-width: 720px;
}

.signature__headline {
	font-family: var(--serif);
	font-size: clamp(28px, 3.2vw, 44px);
	line-height: 1.0;
	font-weight: 700;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--ink);
	text-shadow: var(--bloom);
	mix-blend-mode: screen;
	margin: 22px 0 28px;
}
.signature__headline em {
	font-family: inherit;
	font-style: normal;
	font-weight: 800;
	letter-spacing: inherit;
	color: inherit;
	text-shadow: inherit;
}

.signature__body {
	color: var(--ink-dim);
	font-size: 16px;
	line-height: 1.7;
	max-width: 540px;
	font-weight: 300;
}

.signature__steps {
	display: flex;
	gap: 40px;
	margin-top: 48px;
}
.signature__step {
	flex: 1;
	border-left: 1px solid var(--silver);
	padding-left: 20px;
}
.signature__step .eyebrow {
	color: var(--ink);
	margin-bottom: 8px;
	display: block;
}
.signature__step p {
	color: var(--ink-dim);
	font-size: 13px;
	line-height: 1.6;
}


/* =================================================================
   PRODUTO (Cap. 03)
   ================================================================= */
.lineup {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	margin-top: 60px;
}

.product-card {
	border: none;
	background: linear-gradient(180deg, rgba(20,18,24,0.55) 0%, #000 100%);
	padding: 48px 40px;
	position: relative;
	overflow: hidden;
}

.product-card__tag {
	position: absolute;
	top: 24px;
	right: 24px;
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--silver);
	border: 1px solid var(--silver);
	padding: 4px 8px;
}

.product-card__img-wrap {
	height: 360px;
	display: grid;
	place-items: center;
	margin-bottom: 32px;
	position: relative;
}
.product-card__glow {
	position: absolute;
	inset: 10% 20%;
	background: radial-gradient(ellipse, rgba(var(--glow), 0.35), transparent 60%);
	filter: blur(26px);
	opacity: 0.7;
}
.product-card__img-wrap img {
	max-height: 340px;
	position: relative;
	z-index: 2;
	filter: drop-shadow(0 10px 40px rgba(var(--glow), 0.4));
}

.product-card h3 {
	font-family: var(--serif);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--ink);
	text-shadow: var(--bloom);
	mix-blend-mode: screen;
}
.product-card__meta {
	display: flex;
	gap: 24px;
	margin-top: 10px;
	color: var(--ink-dim);
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: var(--tr-label);
	text-transform: uppercase;
}


/* =================================================================
   EVENTOS (Cap. 04)
   ================================================================= */
.section-block--eventos {
	background: linear-gradient(180deg, transparent, rgba(var(--glow), 0.03), transparent);
}
.eventos__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.gallery-grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 16px;
	margin-top: 60px;
}
.gallery-grid__item {
	background-size: cover;
	background-position: center;
	border: 1px solid var(--hairline);
	aspect-ratio: 1 / 1;
	position: relative;
	overflow: hidden;
}
.gallery-grid__item::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.6));
}
.gallery-grid__item--feature {
	grid-row: 1 / span 2;
	aspect-ratio: auto;
}
.gallery-grid__caption {
	position: absolute;
	bottom: 16px;
	left: 16px;
	right: 16px;
	z-index: 2;
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--ink);
	display: flex;
	justify-content: space-between;
}


/* =================================================================
   IMPRENSA
   ================================================================= */
.section-block--press {
	padding-top: 80px;
	padding-bottom: 80px;
}
.press-strip {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 40px;
	padding: 60px 0;
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
	margin-top: 40px;
}
.press-logo {
	font-family: var(--serif);
	font-size: 12px;
	font-weight: 600;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: -0.005em;
	color: var(--ink-dim);
	opacity: 0.7;
}


/* =================================================================
   FOOTER
   ================================================================= */
.site-footer {
	background: var(--bg-signature);
	border-top: 1px solid rgba(201,168,76,0.22);
	padding: 80px var(--pad-x) 40px;
	position: relative;
}
.site-footer::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(201,168,76,0.55), transparent);
}

.foot-grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
	gap: 48px;
}

.foot-brand .logo-star {
	margin-bottom: 20px;
}
.foot-brand h3 {
	font-family: var(--serif);
	font-size: 19px;
	font-weight: 700;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: var(--tr-display);
	color: var(--ink);
	text-shadow: var(--bloom);
	margin-bottom: 12px;
}
.foot-brand__tag {
	color: var(--ink-dim);
	font-size: 14px;
	line-height: 1.65;
	max-width: 340px;
	font-weight: 300;
	font-style: italic;
	font-family: var(--sans);
}

.foot-col h4 {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: var(--tr-lux);
	text-transform: uppercase;
	color: var(--silver);
	margin-bottom: 16px;
	font-weight: 500;
}
.foot-col a {
	display: block;
	color: var(--ink-dim);
	font-size: 13px;
	margin-bottom: 10px;
	transition: color 0.2s;
}
.foot-col a:hover { color: var(--ink); }

/* Social column: icon + label rows */
.foot-col--social a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.foot-col--social a svg {
	flex-shrink: 0;
	color: var(--gold);
	transition: transform 0.2s ease;
}
.foot-col--social a:hover svg { transform: translateY(-1px); }

.foot-bottom {
	margin-top: 60px;
	padding-top: 24px;
	border-top: 1px solid var(--hairline);
	display: flex;
	justify-content: space-between;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: var(--tr-nav);
	text-transform: uppercase;
	color: var(--ink-faint);
	flex-wrap: wrap;
	gap: 8px;
}
.foot-bottom__legal {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	color: var(--gold);
	border: 1px solid rgba(201,168,76,0.4);
	padding: 4px 10px;
	border-radius: 2px;
}


/* =================================================================
   AGE GATE
   ================================================================= */
.age-gate {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(5, 4, 10, 0.95);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	display: grid;
	place-items: center;
	transition: opacity 0.8s var(--ease);
}
.age-gate.is-closed {
	opacity: 0;
	pointer-events: none;
}

.age-gate__card {
	text-align: center;
	max-width: 420px;
	padding: 48px;
}
.age-gate__star-img {
	display: block;
	margin: 0 auto 24px;
	animation: dabomb-star-spin 9s linear infinite;
}
.age-gate__brand {
	font-family: var(--sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.38em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 24px;
}
.age-gate__card .hairline {
	margin: 0 0 24px;
}
.age-gate__card h2 {
	font-family: var(--serif);
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--tr-display);
	color: var(--ink);
	text-shadow: var(--bloom);
	margin-bottom: 12px;
}
.age-gate__card h2 em {
	font-family: inherit;
	font-style: normal;
	font-weight: inherit;
	background: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	color: inherit;
	text-shadow: inherit;
}
.age-gate__card p {
	color: var(--ink-dim);
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: 32px;
}
.age-gate__actions {
	display: flex;
	gap: 16px;
	justify-content: center;
	margin-bottom: 32px;
}
.age-gate__legal {
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ink-faint);
	margin-bottom: 0 !important;
}


/* =================================================================
   RESPONSIVE — Mobile (< 768px)
   ================================================================= */
@media (max-width: 900px) {
	/* Hero — switch to flex column so bottle fills remaining space.
	   Header is now fixed/overlaid on mobile, so hero fills the full
	   viewport. Top padding clears the floating nav pill. */
	.hero {
		display: flex;
		flex-direction: column;
		padding: 76px var(--pad-x) 14px;
		height: 100svh;
		max-height: none;
		gap: 0;
	}
	/* Edge-to-edge smoky backdrop on mobile. Longhand insets (no calc/var).
	   On mobile the club photo is a 3:2 landscape forced into portrait by
	   `background-size: cover`, which pulled a narrow slice and produced
	   On mobile the vignette can be lighter since the video fills the frame. */
	.hero::before {
		background:
			radial-gradient(ellipse 110% 70% at 50% 50%, transparent 25%, rgba(0,0,0,0.5) 75%, rgba(0,0,0,0.8) 100%);
	}
	.hero__copy {
		order: 1;
		flex-shrink: 0; /* copy never shrinks — CTA must stay visible */
	}
	.bottle-stage {
		order: -1;
		flex: 1 1 0%;    /* bottle takes ALL remaining space */
		min-height: 0;   /* allow shrinking below content size */
		height: auto;
		width: 100%;     /* fill horizontal space in column flex */
	}
	.hero__headline {
		font-size: 22px;
		line-height: 1.05;
		letter-spacing: -0.02em;
		font-weight: 700;
		margin-bottom: 6px;
	}
	.hero__sub {
		font-size: 10px;
		line-height: 1.4;
		margin-bottom: 8px;
	}
	.hero__stats { display: none; }
	.hero__copy .eyebrow-row { margin-bottom: 6px; }
	.cta-row { gap: 8px; flex-wrap: wrap; }
	.hero .btn-primary {
		padding: 8px 10px;
		font-size: 8px;
		letter-spacing: 0.14em;
	}
	.hero .btn-ghost {
		padding: 8px 2px;
		font-size: 8px;
		letter-spacing: 0.14em;
	}
	.rail { display: none; }
	.scroll-cue { display: none; }

	/* Bottle fills its stage — use absolute positioning for reliable sizing */
	.bottle-stage {
		position: relative; /* already set, but reinforce */
	}
	.bottle-wrap {
		position: absolute;
		inset: 5% 0;  /* 5% top/bottom breathing room */
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.bottle-img {
		max-height: 100%;
		max-width: 100%;
		width: auto;
		height: auto;
		object-fit: contain;
	}
	.halo { width: 70%; max-width: 360px; aspect-ratio: 1; height: auto; top: 50%; }
	.rays { width: 90%; max-width: 400px; height: auto; aspect-ratio: 1; }
	.floor { bottom: 4%; }
	/* Bottle glow drop-shadow: the 100px spread clips against the hero's
	   overflow: hidden edge on narrow mobile viewports, painting a hard
	   vertical line on each side. Drop the wide bloom, keep the tighter
	   40px cyan glow + the black depth shadow. */
	.bottle-img {
		filter:
			drop-shadow(0 20px 40px rgba(0,0,0,0.55))
			drop-shadow(0 0 30px rgba(var(--glow), calc(var(--glow-intensity) * 0.22)));
	}

	/* Ticker */
	.ticker__set { font-size: 16px; }

	/* Section blocks */
	.section-headline { font-size: 32px; letter-spacing: -0.025em; }

	/* Marca */
	.two-col { grid-template-columns: 1fr; gap: 40px; }

	/* Signature */
	.signature { padding: var(--pad-section) var(--pad-x); }
	.signature__headline { font-size: 36px; letter-spacing: -0.03em; }
	.signature__steps { flex-direction: column; }

	/* Produto */
	.lineup { grid-template-columns: 1fr; gap: 24px; }

	/* Eventos */
	.eventos__header { flex-direction: column; align-items: flex-start; gap: 20px; }
	.gallery-grid {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
	}
	.gallery-grid__item--feature {
		grid-row: auto;
		grid-column: 1 / -1;
		aspect-ratio: 16 / 9;
	}

	/* Press */
	.press-strip { flex-wrap: wrap; gap: 20px; justify-content: flex-start; }

	/* Footer */
	.site-footer { padding: 60px var(--pad-x) 32px; }
	.foot-grid {
		grid-template-columns: 1fr 1fr;
		gap: 32px;
	}
	.foot-brand { grid-column: 1 / -1; }
	.foot-bottom { flex-direction: column; gap: 8px; }
}

@media (max-width: 480px) {
	.gallery-grid { grid-template-columns: 1fr; }
	.gallery-grid__item--feature { grid-column: auto; }
}


/* =================================================================
   REDUCED MOTION
   ================================================================= */
@media (prefers-reduced-motion: reduce) {
	.halo,
	.bottle-img,
	.ticker__track,
	.scroll-cue__line,
	.logo-star-img,
	.age-gate__star-img {
		animation: none !important;
	}
	.halo { opacity: var(--glow-intensity); }
}

/* =================================================================
   WOOCOMMERCE — dark-theme checkout & shop
   Scoped to .woocommerce-* and .wc-block-* so nothing leaks globally.
   ================================================================= */

/* ── Reset WC section headings — stop them inheriting our Syne 800 display style ── */
.woocommerce-checkout h2,
.woocommerce-checkout h3,
.wc-block-checkout h2,
.wc-block-checkout h3,
.wp-block-woocommerce-checkout h2,
.wp-block-woocommerce-checkout h3 {
	font-family: var(--mono) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--silver) !important;
	text-shadow: none !important;
	margin-bottom: 20px !important;
}

/* ── Input & select — dark background, visible text ── */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout select,
.woocommerce-checkout textarea,
.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-select__container select,
.wc-block-checkout input[type="text"],
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"],
.wc-block-checkout select {
	background: rgba(255, 255, 255, 0.05) !important;
	color: var(--ink) !important;
	border: 1px solid rgba(255, 255, 255, 0.18) !important;
	border-radius: 0 !important;
	padding: 14px 16px !important;
	font-family: var(--sans) !important;
	font-size: 14px !important;
	font-weight: 300 !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
}

/* ── Placeholder text ── */
.woocommerce-checkout input::placeholder,
.wc-block-components-text-input input::placeholder,
.wc-block-checkout input::placeholder {
	color: rgba(255, 255, 255, 0.35) !important;
}

/* ── Focus state ── */
.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus,
.wc-block-checkout input:focus,
.wc-block-checkout select:focus {
	border-color: rgba(var(--glow), 0.6) !important;
	box-shadow: 0 0 0 3px rgba(var(--glow), 0.1) !important;
	outline: none !important;
}

/* ── Floating labels (WC blocks pattern) ── */
.wc-block-components-text-input label,
.wc-block-components-select label {
	color: rgba(255, 255, 255, 0.5) !important;
	font-family: var(--sans) !important;
	font-size: 13px !important;
	font-weight: 300 !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input:focus-within label {
	color: rgba(var(--glow), 0.9) !important;
	font-size: 11px !important;
}

/* ── Classic WC form labels ── */
.woocommerce-checkout label,
.woocommerce-checkout .form-row label {
	color: var(--ink-dim) !important;
	font-family: var(--sans) !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	margin-bottom: 6px !important;
}

/* ── Select dropdown arrow — keep visible on dark bg ── */
.woocommerce-checkout select,
.wc-block-components-select select {
	appearance: none !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='rgba(255,255,255,0.5)' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	padding-right: 40px !important;
}

/* ── Order summary sidebar ── */
.wc-block-checkout__sidebar,
.woocommerce-checkout-review-order {
	background: rgba(255, 255, 255, 0.03) !important;
	border: 1px solid var(--hairline) !important;
	padding: 32px !important;
}
.wc-block-order-summary__title,
.wc-block-components-order-summary__title {
	font-family: var(--mono) !important;
	font-size: 11px !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--silver) !important;
}
.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-totals-item {
	color: var(--ink-dim) !important;
	font-size: 13px !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--ink) !important;
	font-weight: 700 !important;
}

/* ── Payment method section ── */
.wc-block-components-radio-control__option,
.wc-block-components-payment-method-label {
	color: var(--ink-dim) !important;
	font-size: 14px !important;
}
.wc-block-components-radio-control__input {
	accent-color: rgb(var(--glow)) !important;
}

/* ── Place order / submit button — gold treatment matching btn-gold ── */
.wc-block-checkout__actions .wc-block-components-checkout-place-order-button,
.woocommerce-checkout #place_order,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
	background: linear-gradient(180deg, var(--db-gold-bright) 0%, var(--db-gold) 50%, var(--db-gold-dim) 100%) !important;
	color: #0a0910 !important;
	border: 1px solid var(--db-gold) !important;
	border-radius: 3px !important;
	font-family: var(--mono) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	padding: 14px 32px !important;
	width: 100% !important;
	cursor: pointer !important;
	box-shadow: 0 0 16px rgba(201,168,76,0.18) !important;
	transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
.wc-block-checkout__actions .wc-block-components-checkout-place-order-button:hover,
.woocommerce-checkout #place_order:hover,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
	filter: brightness(1.08) !important;
	box-shadow: 0 4px 22px rgba(201,168,76,0.32) !important;
}

/* ── Notices / validation errors ── */
.woocommerce-error,
.wc-block-components-validation-error {
	color: #ff6b6b !important;
	font-size: 12px !important;
	background: rgba(255, 107, 107, 0.08) !important;
	border-left: 2px solid #ff6b6b !important;
	padding: 8px 12px !important;
	margin-top: 6px !important;
}

/* ── Checkbox (terms / newsletter) ── */
.wc-block-checkout input[type="checkbox"],
.woocommerce-checkout input[type="checkbox"] {
	accent-color: rgb(var(--glow)) !important;
}

/* ── "Store coming soon" banner override — hide on shop/checkout ── */
.woocommerce-shop .site-header::before,
.woocommerce-checkout .site-header::before { display: none; }

/* ── Sitewide smoky background (non-home, non-portal) ──
   Mirrors home: dark at top so the nav blends in, smoky at the bottom. */
.dabomb-page-bg {
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
	background: #050308;
}
.dabomb-page-bg__video {
	display: none;
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 140%;
	max-width: none;
	height: 70vh;
	transform: translateX(-50%);
	object-fit: cover;
	object-position: center bottom;
	opacity: 0.85;
}
/* Top-down scrim — solid at top to hide the nav line, fades into smoke below */
.dabomb-page-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg,
		#050308 0%,
		#050308 18%,
		rgba(5,3,8,0.85) 32%,
		rgba(5,3,8,0.55) 50%,
		rgba(5,3,8,0.20) 75%,
		transparent 100%
	);
	z-index: 1;
}
.dabomb-page-bg__video { z-index: 0; }
/* Ensure header, footer, and main content sit above the background layer */
body.dabomb-redesign .site-header,
body.dabomb-redesign .site-footer,
body.dabomb-redesign main,
body.dabomb-redesign .interior-hero,
body.dabomb-redesign .page-content {
	position: relative;
	z-index: 1;
}

/* ── Solid panels — copy sits over smoke background, must read clearly ── */
/* Contact cards */
.contact-card {
	background: rgba(8, 10, 17, 0.94) !important;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
/* A-garrafa: hero copy panel, features, closing copy panel */
.bottle-hero__copy,
.bottle-closing__copy {
	background: rgba(8, 10, 17, 0.94);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	padding: clamp(20px, 5.5vw, 80px) clamp(32px, 5vw, 60px) !important;
}
/* Mobile: kill the centering so copy sits tight at the top */
@media (max-width: 640px) {
	.bottle-hero {
		min-height: 0 !important;
	}
	.bottle-hero__copy {
		justify-content: flex-start !important;
		padding: 24px clamp(20px, 5vw, 28px) 28px !important;
	}
}
.bottle-features {
	background: rgba(8, 10, 17, 0.96) !important;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
/* A-garrafa hero visual: drop the solid black so the new beach photo shows through */
.bottle-hero__visual {
	background: transparent !important;
}
/* Sobre a DaBomb (about page) panels */
.about-section,
.about-card,
.about-block,
.profile-card {
	background: rgba(8, 10, 17, 0.94);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
/* Generic page-content wrapper gets a subtle dark veil so any unstyled copy is readable */
body.dabomb-redesign:not(.home):not(.dabomb-portal) .page-content > .contact-grid {
	position: relative;
	z-index: 1;
}

/* ── Privacy policy (plain WP editor HTML, PT/EN/ES slugs + core privacy-policy body class) ── */
body.dabomb-redesign.privacy-policy .page-content,
body.dabomb-redesign.page-privacidade .page-content,
body.dabomb-redesign.page-privacy-policy .page-content,
body.dabomb-redesign.page-politica-de-privacidad .page-content {
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
	padding: clamp(28px, 5vw, 52px) clamp(22px, 4vw, 44px);
	background: rgba(18, 20, 30, 0.96);
	border: 1px solid rgba(232, 236, 242, 0.14);
	border-radius: 14px;
	box-shadow:
		0 4px 24px rgba(0, 0, 0, 0.45),
		inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body.dabomb-redesign.privacy-policy .page-content h2,
body.dabomb-redesign.page-privacidade .page-content h2,
body.dabomb-redesign.page-privacy-policy .page-content h2,
body.dabomb-redesign.page-politica-de-privacidad .page-content h2 {
	color: #f6f9fc !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

body.dabomb-redesign.privacy-policy .page-content h4,
body.dabomb-redesign.page-privacidade .page-content h4,
body.dabomb-redesign.page-privacy-policy .page-content h4,
body.dabomb-redesign.page-politica-de-privacidad .page-content h4 {
	font-family: var(--sans) !important;
	font-weight: 600 !important;
	font-size: clamp(15px, 1.85vw, 18px) !important;
	line-height: 1.35 !important;
	letter-spacing: 0.02em !important;
	text-transform: none !important;
	color: rgba(248, 250, 252, 0.98) !important;
	margin-top: 1.35em;
	margin-bottom: 0.45em;
}

body.dabomb-redesign.privacy-policy .page-content p,
body.dabomb-redesign.page-privacidade .page-content p,
body.dabomb-redesign.page-privacy-policy .page-content p,
body.dabomb-redesign.page-politica-de-privacidad .page-content p,
body.dabomb-redesign.privacy-policy .page-content li,
body.dabomb-redesign.page-privacidade .page-content li,
body.dabomb-redesign.page-privacy-policy .page-content li,
body.dabomb-redesign.page-politica-de-privacidad .page-content li {
	color: rgba(236, 241, 247, 0.96) !important;
	font-size: 16px !important;
	line-height: 1.68 !important;
	font-weight: 400 !important;
}

body.dabomb-redesign.privacy-policy .page-content ul,
body.dabomb-redesign.page-privacidade .page-content ul,
body.dabomb-redesign.page-privacy-policy .page-content ul,
body.dabomb-redesign.page-politica-de-privacidad .page-content ul {
	padding-left: 1.25em;
	color: rgba(236, 241, 247, 0.96) !important;
}

body.dabomb-redesign.privacy-policy .page-content strong,
body.dabomb-redesign.page-privacidade .page-content strong,
body.dabomb-redesign.page-privacy-policy .page-content strong,
body.dabomb-redesign.page-politica-de-privacidad .page-content strong {
	color: #fafcfe !important;
	font-weight: 600 !important;
}

body.dabomb-redesign.privacy-policy .page-content a,
body.dabomb-redesign.page-privacidade .page-content a,
body.dabomb-redesign.page-privacy-policy .page-content a,
body.dabomb-redesign.page-politica-de-privacidad .page-content a {
	color: var(--db-gold-bright) !important;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
	text-decoration-color: rgba(232, 203, 122, 0.55);
}

body.dabomb-redesign.privacy-policy .page-content a:hover,
body.dabomb-redesign.page-privacidade .page-content a:hover,
body.dabomb-redesign.page-privacy-policy .page-content a:hover,
body.dabomb-redesign.page-politica-de-privacidad .page-content a:hover {
	color: #fff5d6 !important;
	text-decoration-color: rgba(255, 245, 214, 0.85);
}

/* ── GTranslate: move floating widget to bottom-right so it doesn't overlap CTAs ── */
.gtranslate_wrapper,
[id^="gt-wrapper"] {
	left: auto !important;
	right: 16px !important;
}
.gtranslate_wrapper > *,
[id^="gt-wrapper"] > * {
	left: auto !important;
	right: 0 !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   Elementor Hero CTA overrides — James redesign May 2026
   Element IDs are stable (Elementor JSON) and only appear on the homepage.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── DESKTOP: buttons side-by-side, Comprar left (order:1), Seja right (order:2) ── */
@media (min-width: 1025px) {
	/* 1695651 = row container holding text column + bottle column */
	.elementor-element-1695651.e-con {
		flex-direction: row !important;
		align-items: center !important;
	}
	.elementor-element-e72fe5e { order: 1 !important; }
	.elementor-element-8beafc5 { order: 2 !important; }

	/* Button row — Buy Online (5fb91ec) LEFT, Become a Partner (48ee9ae)
	   RIGHT. DOM order matches what we want, so no `order:` overrides
	   needed. (Earlier `order:` rules were inverting the layout after
	   the May 2026 settings swap — silver had moved between widgets but
	   the order rules still pointed at the original IDs.) */
	.elementor-element-4ba46fb.e-con {
		flex-direction: row !important;
		gap: 20px !important;
		align-items: stretch !important;
	}
	.elementor-element-5fb91ec,
	.elementor-element-48ee9ae {
		flex: 1 1 0 !important;
		min-width: 0 !important;
	}
}

/* ── MOBILE: bottle-first layout ──
   Uses column-reverse on hero row so bottle (DOM 2nd child) appears at top.
   Overrides Elementor's --flex-direction CSS variable to prevent it winning. */
@media (max-width: 1024px) {
	.elementor-element-f2dd2ac.e-con {
		justify-content: flex-start !important;
		align-items: stretch !important;
		padding-top: 0 !important;
	}

	/* column-reverse puts the bottle column (DOM 2nd) at the top */
	.elementor-element-1695651.e-con {
		position: relative !important;
		--flex-direction: column-reverse;
		flex-direction: column-reverse !important;
		margin: 0 !important;
		gap: 0 !important;
		min-height: calc(100svh - 80px) !important;
		min-height: calc(100dvh - 80px) !important;
		padding-bottom: 0 !important;
	}

	/* Bottle column: fills available space at top (DOM 2nd → visual 1st via column-reverse) */
	.elementor-element-8beafc5 {
		width: 100% !important;
		flex: 1 1 auto !important;
		align-items: center !important;
		justify-content: center !important;
		min-height: 0 !important;
		padding: 0 !important;
	}
	.elementor-element-8beafc5 .elementor-widget-image,
	.elementor-element-8beafc5 .elementor-widget-image .elementor-widget-container {
		width: 100% !important;
		text-align: center !important;
	}
	.elementor-element-8beafc5 .elementor-widget-image img {
		max-height: 58vh !important;
		max-width: 92% !important;
		width: auto !important;
		height: auto !important;
		object-fit: contain !important;
		display: inline-block !important;
		margin: 0 auto !important;
	}

	/* Text column: sits at bottom (DOM 1st → visual 2nd via column-reverse) */
	.elementor-element-e72fe5e {
		position: static !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 20px 8px !important;
		flex: 0 0 auto !important;
		min-height: 0 !important;
	}

	/* Previously hid the eyebrow + tagline on mobile (elementor-element-
	   40e2f28 + ddd16f7) because they weren't in the design at the time.
	   Restored as visible per the gold-premium upgrade — both are now
	   core to the hero on every viewport. */

	/* CTA buttons: side-by-side within text column */
	.elementor-element-4ba46fb.e-con {
		--flex-direction: row;
		flex-direction: row !important;
		position: relative !important;
		bottom: auto !important;
		left: auto !important;
		right: auto !important;
		transform: none !important;
		width: calc(100% - 40px) !important;
		max-width: 460px !important;
		margin: 0 auto !important;
		padding: 0 0 calc(env(safe-area-inset-bottom, 0px) + 16px) !important;
		gap: 10px !important;
		z-index: 10 !important;
	}
	.elementor-element-5fb91ec { order: 1 !important; padding: 0 !important; flex: 1 1 0 !important; }
	.elementor-element-48ee9ae { order: 2 !important; padding: 0 !important; flex: 1 1 0 !important; }
}

/* 5fb91ec = "Seja um Parceiro" button widget — silver gradient (matches /a-garrafa/ btn-primary) */
.elementor-element-5fb91ec {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	position: relative;
}
.elementor-element-5fb91ec .elementor-button {
	background: linear-gradient(180deg, #ffffff 0%, #d8dde5 50%, #a8aeb8 100%) !important;
	color: #0a0910 !important;
	border: none !important;
	font-family: "JetBrains Mono", monospace !important;
	font-size: 11px !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	width: 100% !important;
	border-radius: 3px !important;
	font-weight: 600 !important;
	position: relative !important;
	padding: 14px 20px !important;
	min-height: 48px !important;
	line-height: 1.2 !important;
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.elementor-element-5fb91ec .elementor-button::after {
	content: '';
	position: absolute;
	inset: -1px;
	background: linear-gradient(180deg, #e8ecf2, #aab0ba);
	z-index: -1;
	filter: blur(14px);
	opacity: 0.45;
	border-radius: 3px;
}
.elementor-element-5fb91ec .elementor-button:hover {
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 24px rgba(200,205,214,0.35) !important;
}

/* 48ee9ae = "Comprar Online" button widget — ghost outline button only, no card box */
.elementor-element-48ee9ae {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
.elementor-element-48ee9ae .elementor-button {
	background: transparent !important;
	border: 1px solid rgba(200,205,214,0.45) !important;
	color: rgba(232,236,242,0.85) !important;
	font-family: "JetBrains Mono", monospace !important;
	font-size: 11px !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	width: 100% !important;
	border-radius: 3px !important;
	padding: 14px 20px !important;
	min-height: 48px !important;
	line-height: 1.2 !important;
	box-sizing: border-box !important;
	font-weight: 600 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.elementor-element-48ee9ae .elementor-button:hover {
	background: rgba(255,255,255,0.06) !important;
	border-color: rgba(232,236,242,0.85) !important;
}

/* 8beafc5 = bottle image container — strip any accidental border */
.elementor-element-8beafc5 {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

/* dd0a9fb = heading "DáBomb Premium Vodka" — keep to one line.
   ddd16f7 = tagline — compact single-line at desktop; minimized at mobile.
   Both reduce vertical stack height so CTA buttons are above the fold. */
body.home .elementor-element-dd0a9fb .elementor-heading-title {
	white-space: nowrap !important;
	overflow: visible !important;
	text-transform: none !important;
}
/* ddd16f7 tagline — font-size (11px) is now set natively in Elementor
   data at all breakpoints; no font-size override needed here.
   CSS only handles: single-line clamp (white-space) + left-align on mobile.
   Using [data-id] attribute selector (specificity 10, same as class)
   instead of !important — avoids cascade fights. */
[data-id="ddd16f7"] {
	width: auto;
	max-width: 100%;
}
[data-id="ddd16f7"] p {
	white-space: nowrap;
	overflow: visible;
	margin-bottom: 0;
}
@media (max-width: 600px) {
	[data-id="ddd16f7"],
	[data-id="ddd16f7"] p {
		text-align: left;
	}
}

/* HERO CTA #2 — BECOME A PARTNER ➜ (48ee9ae, RIGHT). Silver
   primary-button fill: white → platinum → chrome gradient with black
   text and the gold arrow. This is the page's prominent CTA — the
   silver should read as polished metal, not a flat panel. */
body.home .elementor-element-48ee9ae .elementor-button {
	background: linear-gradient(180deg, #ffffff 0%, #d8dde5 55%, #a8aeb8 100%) !important;
	background-image: linear-gradient(180deg, #ffffff 0%, #d8dde5 55%, #a8aeb8 100%) !important;
	border: 1px solid #c8cdd6 !important;
	color: #0a0910 !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.65),
		inset 0 -1px 0 rgba(0, 0, 0, 0.18),
		0 2px 10px rgba(0, 0, 0, 0.18) !important;
	transition:
		background .35s cubic-bezier(0.22, 0.61, 0.36, 1),
		box-shadow .35s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
body.home .elementor-element-48ee9ae .elementor-button:hover {
	background: linear-gradient(180deg, #ffffff 0%, #e8ecf2 55%, #b8bec8 100%) !important;
	background-image: linear-gradient(180deg, #ffffff 0%, #e8ecf2 55%, #b8bec8 100%) !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.85),
		inset 0 -1px 0 rgba(0, 0, 0, 0.22),
		0 4px 16px rgba(0, 0, 0, 0.25) !important;
}
body.home .elementor-element-48ee9ae .elementor-button,
body.home .elementor-element-48ee9ae .elementor-button .elementor-button-text,
body.home .elementor-element-48ee9ae .elementor-button-content-wrapper {
	color: #0a0910 !important;
}

/* HERO CTA #1 — BUY ONLINE (5fb91ec, LEFT). Blue-transparent style:
   navy tint background, bright-blue thin border, white text. Pairs
   with the silver "Become a Partner" on the right as a less-prominent
   secondary action. Applies at all viewports. */
body.home .elementor-element-5fb91ec .elementor-button {
	background: rgba(18, 44, 103, 0.18) !important;
	background-image: linear-gradient(180deg,
		rgba(18, 44, 103, 0.10) 0%,
		rgba(18, 44, 103, 0.28) 100%) !important;
	border: 1px solid rgba(107, 152, 255, 0.45) !important;
	color: #ffffff !important;
	box-shadow:
		inset 0 1px 0 rgba(150, 190, 255, 0.18),
		0 0 0 0 rgba(107, 152, 255, 0) !important;
	transition:
		background .35s cubic-bezier(0.22, 0.61, 0.36, 1),
		border-color .35s cubic-bezier(0.22, 0.61, 0.36, 1),
		box-shadow .35s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
body.home .elementor-element-5fb91ec .elementor-button:hover {
	background: rgba(18, 44, 103, 0.28) !important;
	border-color: rgba(107, 152, 255, 0.75) !important;
	box-shadow:
		inset 0 1px 0 rgba(150, 190, 255, 0.30),
		0 0 18px -2px rgba(107, 152, 255, 0.40) !important;
}
body.home .elementor-element-5fb91ec .elementor-button .elementor-button-text {
	color: #ffffff !important;
}

/* 15f4828 = bottom-of-hero marquee heading. Title is the brand-spec
   tagline DUPLICATED in the data (for seamless looping). Elementor's
   motion-fx (translateY + blur + rotateZ:-8 + scale:1.1) was making
   it look choppy + jumbled on scroll. Override with a clean CSS
   keyframe animation that translates the inline-block title by -50%
   of its OWN content width — so a doubled title loops seamlessly.

   Critical: title MUST be inline-block (not block) so its computed
   width = content width. translateX(-50%) on a block-level element
   uses the BLOCK width (= viewport), which doesn't match the
   doubled-content width and causes visual jumbling.

   Also kills the inline margin-left jiggle some legacy marquee JS
   adds on this widget. */
@keyframes dabomb-marquee {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}
body.home .elementor-element-15f4828 {
	overflow: hidden !important;
	transform: none !important;
	filter: none !important;
	/* Push the marquee further below the CTA buttons so it doesn't
	   visually crowd them. Element is _position:absolute end-anchored
	   to the hero — bumping bottom negative pushes it BELOW the hero
	   into the seam, which gives the buttons breathing room. */
	bottom: -32px !important;
}
@media (max-width: 600px) {
	body.home .elementor-element-15f4828 {
		bottom: -48px !important;
	}
}
body.home .elementor-element-15f4828 .elementor-widget-container {
	overflow: hidden !important;
	width: 100%;
	max-width: 100vw;
}
body.home .elementor-element-15f4828 .elementor-heading-title {
	display: inline-block !important;
	white-space: nowrap !important;
	overflow: visible !important;
	transform: none;
	filter: none !important;
	animation: dabomb-marquee 38s linear infinite !important;
	will-change: transform;
	margin: 0 !important;            /* override the inline margin-left:-21.5px */
	padding-left: 0 !important;
	padding-right: 0 !important;
	min-width: 200%;                  /* doubled title content fits */
}
@media (max-width: 900px) {
	body.home .elementor-element-15f4828 .elementor-heading-title {
		font-size: clamp(14px, 4vw, 22px) !important;
		letter-spacing: 0.04em !important;
		animation-duration: 28s !important;
	}
}
@media (prefers-reduced-motion: reduce) {
	body.home .elementor-element-15f4828 .elementor-heading-title {
		animation: none !important;
	}
}

/* 40e2f28 = eyebrow divider widget. Restyled as a gold-bordered
   "PIONEERING ADVANTAGE FOR PREMIUM ESTABLISHMENTS" badge — the
   premium concept the partners loved. Hide the divider-line
   separators, render the text as a centered gold-bordered pill.
   IMPORTANT: also override elementor-invisible (entrance animation
   hiding) and the element-align-right class on the widget — both
   would prevent the badge from showing where we want it. */
body.home .elementor-element-40e2f28 {
	text-align: center !important;
	visibility: visible !important;
	opacity: 1 !important;
}
body.home .elementor-element-40e2f28.elementor-invisible {
	visibility: visible !important;
	opacity: 1 !important;
	animation: none !important;
}
body.home .elementor-element-40e2f28.elementor-widget-divider--element-align-right .elementor-divider {
	justify-content: center !important;
}
body.home .elementor-element-40e2f28 .elementor-divider {
	justify-content: center !important;
}
/* Elementor divider widget structure (line_text view):
     .elementor-divider-separator (FLEX wrapper, NOT a line)
       ::before  ← left horizontal line
       .elementor-divider__text  ← actual text
       ::after   ← right horizontal line
   To make a clean gold pill, hide the ::before/::after lines and
   style .elementor-divider__text as the badge. Don't hide the
   separator itself or the text inside vanishes. */
body.home .elementor-element-40e2f28 .elementor-divider-separator::before,
body.home .elementor-element-40e2f28 .elementor-divider-separator::after {
	display: none !important;
	border: none !important;
	flex: 0 !important;
}
body.home .elementor-element-40e2f28 .elementor-divider-separator {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	max-width: 100% !important;
}
/* PIONEERING ADVANTAGE ribbon — embossed brass plaque feel per gold-
   premium spec. Champagne-gradient text, gold-gradient border with
   inset highlight on top edge + inset shadow on bottom (gives the
   embossed look), soft outer glow. Wider tracking than buttons (the
   ribbon is the marquee gold piece). */
body.home .elementor-element-40e2f28 .elementor-divider__text {
	display: inline-block !important;
	font-family: var(--mono, "JetBrains Mono", monospace) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	border: 1px solid var(--db-gold-dim) !important;
	border-radius: 1px !important;
	padding: 10px 22px !important;
	white-space: nowrap !important;
	line-height: 1 !important;
	max-width: none !important;
	box-sizing: border-box !important;
	text-align: center !important;
	flex: 0 0 auto !important;
	box-shadow:
		inset 0 1px 0 rgba(226, 200, 138, 0.22),
		inset 0 -1px 0 rgba(0, 0, 0, 0.25),
		0 0 18px -4px rgba(201, 168, 107, 0.18) !important;

	/* Gold gradient text */
	color: transparent !important;
	background-image: linear-gradient(180deg,
		var(--db-gold-bright) 0%,
		var(--db-gold) 60%,
		var(--db-gold-dim) 100%);
	-webkit-background-clip: text;
	background-clip: text;
}
@media (max-width: 600px) {
	body.home .elementor-element-40e2f28 .elementor-divider__text {
		font-size: 9px !important;
		letter-spacing: 0.06em !important;
		padding: 8px 14px !important;
	}
}

/* Champagne-gold bullet dots inside CTA buttons — radial gradient with
   inset highlight + soft halo so they read as tiny jewels not generic
   bullet circles. */
.dabomb-redesign .btn .dot,
.cta-dot {
	display: inline-block !important;
	width: 5px !important;
	height: 5px !important;
	border-radius: 50% !important;
	font-size: 0 !important;            /* hide the literal "·" character */
	line-height: 0 !important;
	background: radial-gradient(circle at 35% 35%,
		var(--db-gold-bright) 0%,
		var(--db-gold) 65%,
		var(--db-gold-dim) 100%) !important;
	box-shadow:
		0 0 0 3px rgba(201, 168, 107, 0.12),
		inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
}

/* =================================================================
   HOMEPAGE Elementor section spacing — eliminate visual black gaps
   reported in the May audit. Heuristic: 100vh hero feels empty when
   bottle+headline only fill the upper half; last "A New Concept"
   section had 297px of unused bottom padding.
   ================================================================= */

/* =================================================================
   "Become a Partner" CTA — homepage only.
   Injected via functions.php the_content filter (after Elementor data
   renders). Lives between the last Elementor section ("A New Concept")
   and the footer. Gold-bordered card on charcoal — visually distinct
   from Elementor sections but on-brand. ================================================================= */
body.home .dabomb-partner-cta {
	display: block;
	background: linear-gradient(180deg, rgba(212,182,117,0.04) 0%, rgba(212,182,117,0.10) 100%);
	border-top: 1px solid rgba(212,182,117,0.30);
	border-bottom: 1px solid rgba(212,182,117,0.30);
	padding: clamp(56px, 9vw, 112px) clamp(20px, 5vw, 80px);
	text-align: center;
}
body.home .dabomb-partner-cta__inner {
	max-width: 760px;
	margin: 0 auto;
}
/* Gold-bordered "PIONEERING ADVANTAGE FOR PREMIUM ESTABLISHMENTS"
   badge — restored from the design concept the partners liked.
   Tighter tracking than a 1-2 word eyebrow because the full sentence
   needs to fit in a single readable line on desktop, wrapping cleanly
   on mobile. */
body.home .dabomb-partner-cta__eyebrow {
	display: inline-block;
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	color: var(--db-gold-bright);
	border: 1px solid rgba(212,182,117,0.55);
	border-radius: 2px;
	padding: 8px 16px;
	margin-bottom: 28px;
	text-transform: uppercase;
	max-width: 100%;
	box-sizing: border-box;
}
@media (max-width: 600px) {
	body.home .dabomb-partner-cta__eyebrow {
		font-size: 10px;
		letter-spacing: 0.14em;
		padding: 7px 12px;
	}
}
body.home .dabomb-partner-cta__h {
	font-family: var(--serif);
	font-size: clamp(32px, 4.4vw, 56px);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--ink);
	margin: 0 0 16px;
	text-transform: uppercase;
	line-height: 1.05;
}
body.home .dabomb-partner-cta__body {
	font-family: var(--sans);
	font-size: clamp(15px, 1.4vw, 18px);
	font-weight: 400;
	color: var(--ink-dim);
	margin: 0 0 32px;
	line-height: 1.55;
}
/* Silver primary treatment — aligns with Elementor hero "Become a Partner" */
body.home .dabomb-partner-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #0a0910;
	background: linear-gradient(180deg, #ffffff 0%, #d8dde5 50%, #a8aeb8 100%);
	border: 1px solid rgba(232, 236, 242, 0.9);
	padding: 16px 26px;
	border-radius: 2px;
	text-decoration: none;
	transition: transform 0.18s var(--ease), filter 0.18s, box-shadow 0.18s;
	box-shadow: 0 2px 16px rgba(255, 255, 255, 0.08);
	position: relative;
}
body.home .dabomb-partner-cta__btn::before {
	content: '';
	position: absolute;
	inset: -1px;
	background: linear-gradient(180deg, #e8ecf2, #aab0ba);
	z-index: -1;
	filter: blur(14px);
	opacity: 0.45;
	border-radius: 2px;
}
body.home .dabomb-partner-cta__btn:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
	box-shadow: 0 6px 28px rgba(255, 255, 255, 0.12);
}
body.home .dabomb-partner-cta__btn:hover .dabomb-partner-cta__arrow {
	transform: translateX(4px);
}
body.home .dabomb-partner-cta__arrow {
	display: inline-block;
	transition: transform 0.18s var(--ease);
}

/* ── Injected "The Difference": match shared eyebrow rule + improve legibility ── */
body.home .signature--injected .signature__headline {
	font-size: clamp(22px, 2.85vw, 38px);
	margin-top: 12px;
}
body.home .signature .signature__step p {
	font-family: var(--sans);
	font-size: 15px;
	line-height: 1.5;
	color: rgba(232, 236, 242, 0.96);
	font-weight: 400;
	text-shadow: none;
	background: transparent;
	padding: 0;
	border-radius: 0;
}

/* Homepage Elementor imagery: soften aggressive borders / blue glow ── */
body.home .elementor-widget-image img,
body.home .elementor-widget-image .elementor-widget-container img {
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	filter: drop-shadow(0 12px 28px rgba(8, 7, 10, 0.45));
}
body.home .marca-visual img {
	border: none !important;
	box-shadow: none !important;
}

/* Top marquee (15f4828): match lower strip typography (Syne heavy) ── */
body.home .elementor-element-15f4828 .elementor-widget-container {
	overflow: hidden;
}
body.home .elementor-element-15f4828 .elementor-heading-title {
	font-family: Syne, var(--sans) !important;
	font-weight: 900 !important;
	letter-spacing: 0.04em !important;
	white-space: nowrap;
	color: rgba(212, 182, 117, 0.92) !important;
}

/* Hero f2dd2ac: 100vh -> 82vh. Keeps cinematic feel while tightening
   the gap between hero and the next section ("British Perspective"). */
body.home .elementor-element-f2dd2ac {
	min-height: 82vh !important;
}

/* Last section 603c27e ("A New Concept") sits before footer with a
   58px bottom pad and ~239px of dead vertical space below the inner
   content. Eliminate that. */
body.home .elementor-element-603c27e {
	padding-bottom: 0 !important;
	min-height: 0 !important;
}
body.home .elementor-element-603c27e > .e-con-inner,
body.home .elementor-element-603c27e > .elementor-container {
	padding-bottom: 40px !important;
}

/* ── Section eyebrow dividers — gold (A Marca, O Brilho, O Processo, Um Novo Cap, A Expressão) ── */
/* IDs: f9984e4 · d7f2d39 · 3f69517 · 037d4df · f3cb51b */
.elementor-element-f9984e4 .elementor-divider__text,
.elementor-element-d7f2d39 .elementor-divider__text,
.elementor-element-3f69517 .elementor-divider__text,
.elementor-element-037d4df .elementor-divider__text,
.elementor-element-f3cb51b .elementor-divider__text {
	color: var(--db-gold) !important;
	font-family: "JetBrains Mono", monospace !important;
	letter-spacing: 0.12em !important;
}
.elementor-element-f9984e4 .elementor-divider-separator,
.elementor-element-d7f2d39 .elementor-divider-separator,
.elementor-element-3f69517 .elementor-divider-separator,
.elementor-element-037d4df .elementor-divider-separator,
.elementor-element-f3cb51b .elementor-divider-separator {
	border-color: var(--db-gold) !important;
}

/* =================================================================
   HOMEPAGE Elementor scroll-effect fixes — narrow viewports.
   At ≤1300px the production-cards row uses Elementor "Horizontal
   Scroll" motion effects with translateX values up to -210px which
   exceeds the cards' width and causes text to overlap. Force static
   positioning at these widths. (Cards are .e-grid container 5f37426
   inside section fbb0db4 which has the Vimeo video background.)
   Also: prevent card text overflow by clamping children width and
   allowing word-break on narrow Portuguese words like DESTILAÇÕES. */

/* Disable Elementor "Horizontal Scroll" motion effect on this row at
   ALL viewports — translateX up to -210px overflows narrow cards
   regardless of viewport width. Use a flowing auto-fill grid so cards
   size naturally and never get below ~240px wide. */
body.home .elementor-element-5f37426 > .e-con,
body.home .elementor-element-5f37426 .elementor-element {
	transform: none !important;
}
body.home .elementor-element-5f37426 {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 18px !important;
}
body.home .elementor-element-5f37426 > .e-con {
	min-width: 0;
}
@media (max-width: 1280px) {
	body.home .elementor-element-5f37426 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 540px) {
	body.home .elementor-element-5f37426 {
		grid-template-columns: 1fr !important;
	}
}

/* Mobile: ensure Elementor's video background container stays visible
   on the production section. fbb0db4 = inner container with Vimeo bg. */
.elementor-element-fbb0db4 .elementor-background-video-container,
.elementor-element-fbb0db4 .elementor-background-video,
.elementor-element-fbb0db4 .elementor-background-video-embed,
.elementor-element-fbb0db4 .elementor-background-video-hosted {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}
@media (max-width: 900px) {
	.elementor-element-fbb0db4 {
		min-height: 70vh !important;
	}
}

/* Partner nav item — gold callout box (matches any area-parceiros / para-parceiros href) */
.menu-item a[href*="area-parceiros"],
.menu-item a[href*="area-do-parceiro"],
.menu-item a[href*="para-parceiros"] {
	border: 1px solid var(--db-gold) !important;
	color: var(--db-gold) !important;
	padding: 4px 14px !important;
	border-radius: 2px !important;
	transition: background 0.2s ease;
}
.menu-item a[href*="area-parceiros"]:hover,
.menu-item a[href*="area-do-parceiro"]:hover,
.menu-item a[href*="para-parceiros"]:hover {
	background: rgba(201,168,76,0.12) !important;
}

/* =================================================================
   NAV v9 — glass blur on scroll, active state, hover microanims,
   inline language switcher.
   ================================================================= */

/* Interior pages: glass effect on scroll. The .home rule above keeps the
   homepage solid black; this applies to every other page. */
body:not(.home) .site-header {
	background: rgba(8, 7, 10, 0.85);
	transition: background 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease;
}
body:not(.home) .site-header.is-scrolled {
	background: rgba(2, 8, 22, 0.65);
	backdrop-filter: blur(20px) saturate(140%);
	-webkit-backdrop-filter: blur(20px) saturate(140%);
	border-bottom: 1px solid rgba(201,168,76,0.18) !important;
}
.home .site-header.is-scrolled {
	border-bottom: 1px solid rgba(201,168,76,0.14) !important;
	background: rgba(0,0,0,0.86) !important;
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
}

/* Hover microanim: letter-spacing + tiny color brightening */
.nav-desktop a {
	transition: color 0.25s ease, letter-spacing 0.3s ease, opacity 0.25s ease;
}
.nav-desktop a:hover {
	letter-spacing: 0.16em;
	color: var(--ink);
}

/* Active page state: thin gold underline */
.nav-desktop a.is-active {
	color: var(--ink);
	position: relative;
}
.nav-desktop a.is-active::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -8px;
	height: 1px;
	background: var(--gold);
	box-shadow: 0 0 8px rgba(201,168,76,0.55);
}

/* Partner CTA — SVG arrow that translates on hover */
.partner-btn { gap: 8px; }
.partner-btn .nav-arrow {
	transition: transform 0.25s ease;
}
.partner-btn:hover .nav-arrow {
	transform: translateX(4px);
}
.partner-btn.is-active {
	background: rgba(201,168,76,0.18) !important;
}

/* Mobile nav — active state + arrow */
.mobile-nav__inner a.is-active { color: var(--gold); }
.mobile-nav__inner .partner-btn { gap: 8px; }

/* ── Hide Google Translate's persistent loading spinner ──
   Google's own translate widget injects elements with obfuscated class
   names like `VIpgJd-ZVi9od-aZ2wEe-OiiCO` (a top-left progress
   indicator) that should be transient but stay visible on some pages
   (notably /loja/ where WC's archive layout interacts oddly with
   gTranslate). Hide all of them — gTranslate's pill at bottom-right
   is the only language UI we want visible. */
[class*="VIpgJd-ZVi9od-aZ2wEe-OiiCO"],
.skiptranslate iframe,
iframe.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame {
	display: none !important;
}
body { top: 0 !important; }

/* ── gTranslate floating widget — bottom-right of viewport ──
   Plugin sets `floating_language_selector: bottom_right` so it injects
   .gtranslate_wrapper near </body>. Light tint to match the dark UI. */
.gtranslate_wrapper {
	z-index: 90;
}
.gtranslate_wrapper .gt_float_switcher,
.gtranslate_wrapper .gt-current-lang {
	font-family: var(--mono, "JetBrains Mono", monospace) !important;
	letter-spacing: 0.06em !important;
}

/* Hide-on-narrow: shrink the right-side nav cluster as the viewport gets
   narrower so partner-btn never overflows into html's overflow-x: hidden
   clip. Keep the partner arrow visible as long as possible. */
@media (max-width: 1500px) {
	.nav-desktop__left,
	.nav-desktop__right { gap: 22px; }
	.partner-btn { padding: 6px 12px !important; }
}
@media (max-width: 1300px) {
	.nav-desktop__left,
	.nav-desktop__right { gap: 16px; }
}
@media (max-width: 1100px) {
	/* Last-resort: only if the layout still overflows do we drop the arrow. */
	.partner-btn .nav-arrow { display: none; }
}

/* =================================================================
   GLOBAL: scroll-triggered fade-up reveal
   ================================================================= */
[data-animate="fade-up"] {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.7s var(--ease, cubic-bezier(0.22, 0.61, 0.36, 1)),
	            transform 0.7s var(--ease, cubic-bezier(0.22, 0.61, 0.36, 1));
	will-change: opacity, transform;
}
[data-animate="fade-up"].is-revealed {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	[data-animate="fade-up"] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* =================================================================
   GLOBAL: back-to-top button
   ================================================================= */
.back-to-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 90;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(8,7,10,0.85);
	border: 1px solid rgba(201,168,76,0.4);
	color: var(--gold);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transform: translateY(8px);
	transition: opacity 0.3s ease, transform 0.3s ease, background 0.2s ease, border-color 0.2s ease;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 8px 22px rgba(0,0,0,0.5), 0 0 18px rgba(var(--glow), 0.18);
}
.back-to-top.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}
.back-to-top:hover {
	background: rgba(201,168,76,0.12);
	border-color: var(--gold);
}
.back-to-top svg { width: 16px; height: 16px; }

/* =================================================================
   GLOBAL: Cookie / GDPR consent banner — on-brand replacement.
   The cookie-notice-and-consent-banner plugin (cncb_banner) injects an
   off-brand banner via cookiebanner.js into #cookiebanner-root. We hide
   it so only the branded .cookie-banner from footer.php paints.
   ================================================================= */
#cookiebanner-root,
[id^="cncb_"],
[class*="cncb-"] { display: none !important; }

.cookie-banner {
	position: fixed;
	left: 20px;
	right: 20px;
	bottom: 20px;
	z-index: 95;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
	padding: 16px 20px;
	background: rgba(8,7,10,0.96);
	border: 1px solid rgba(201,168,76,0.28);
	border-radius: 4px;
	box-shadow: 0 24px 50px rgba(0,0,0,0.6), 0 0 28px rgba(var(--glow), 0.14);
	backdrop-filter: blur(12px) saturate(140%);
	-webkit-backdrop-filter: blur(12px) saturate(140%);
	opacity: 0;
	transform: translateY(20px);
	pointer-events: none;
	transition: opacity 0.35s ease, transform 0.35s ease;
	max-width: 720px;
	margin: 0 auto;
}
.cookie-banner.is-shown {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.cookie-banner__text {
	flex: 1 1 280px;
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	line-height: 1.5;
	color: var(--ink-dim);
	margin: 0;
}
.cookie-banner__text a {
	color: var(--gold);
	border-bottom: 1px solid rgba(201,168,76,0.4);
	text-decoration: none;
}
.cookie-banner__text a:hover { border-bottom-color: var(--gold); }
.cookie-banner__actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}
.cookie-banner__btn {
	font-family: var(--mono);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 9px 16px;
	border-radius: 2px;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.cookie-banner__btn--accept {
	background: var(--gold);
	border: 1px solid var(--gold);
	color: #0a0910;
}
.cookie-banner__btn--accept:hover { background: #e0bb5a; }
.cookie-banner__btn--refuse {
	background: transparent;
	border: 1px solid rgba(255,255,255,0.2);
	color: var(--ink-dim);
}
.cookie-banner__btn--refuse:hover {
	border-color: var(--gold);
	color: var(--gold);
}
@media (max-width: 540px) {
	.cookie-banner { left: 12px; right: 12px; bottom: 12px; padding: 14px; }
	.cookie-banner__actions { width: 100%; }
	.cookie-banner__btn { flex: 1; text-align: center; }
}

/* =================================================================
   MOBILE AUDIT FIXES (390px iPhone target)
   May 2026 — addresses the 18-item mobile audit. Each rule targets
   a specific Elementor element ID or generic class so it doesn't
   bleed onto desktop. Section ID map (from scripts/audit-homepage-
   gaps.ts):
     f2dd2ac  Hero "NOT JUST A VODKA"
     12ea1ed  British Perspective
     0a6fccb  Crystal Clear marquee
     ca3da80  Forged in the Night (The Brand)
     f307c77  Light Up the Base (The Shine)
     f03874c  Production outer
     fbb0db4  Production inner (Vimeo bg)
     5f37426  Production card grid (handled separately)
     ae9b77b  Arrives in Brazil
     839cbfd  Designed in Europe
     603c27e  A New Concept
   Hero CTA buttons:
     5fb91ec  Become a Partner (silver, closer to bottle = right side)
     48ee9ae  Buy Online (left side)
   ================================================================= */

@media (max-width: 600px) {
	/* --- Hero (f2dd2ac) — relax 100vh min-height + reduce padding ---
	   On a 844px-tall iPhone the 100vh min-height plus generous padding
	   leaves the bottle floating with too much black above and below. */
	body.home .elementor-element-f2dd2ac {
		min-height: auto !important;
		padding-top: 20px !important;
		padding-bottom: 40px !important;
	}

	/* --- Hero CTA buttons side-by-side on mobile, equal width ---
	   flex: 1 1 0 forces both widget containers to compute the SAME
	   width regardless of content length. Combined with the parent
	   row layout (defined separately below) the two buttons fill the
	   available column with a small gap between them, so the silver
	   "Become a Partner" doesn't visually dominate the navy "Buy
	   Online" — symmetric pair, not lopsided. */
	body.home .elementor-element-5fb91ec,
	body.home .elementor-element-48ee9ae {
		flex: 1 1 0 !important;
		width: auto !important;
		max-width: none !important;
		flex-basis: 0 !important;
		min-width: 0 !important;
	}
	/* Parent container — force row, equal-stretch children. Without
	   this, Elementor's flex_direction:column setting would stack the
	   buttons vertically on mobile breakpoints. */
	body.home .elementor-element-4ba46fb.e-con,
	body.home .elementor-element-4ba46fb {
		display: flex !important;
		flex-direction: row !important;
		gap: 12px !important;
		align-items: stretch !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	body.home .elementor-element-5fb91ec .elementor-button,
	body.home .elementor-element-48ee9ae .elementor-button {
		width: 100% !important;
		height: 56px !important;
		min-height: 56px !important;
		max-height: 56px !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		white-space: nowrap !important;
		padding: 0 8px !important;
		font-size: 11px !important;
		letter-spacing: 0.04em !important;
		box-sizing: border-box !important;
	}
	/* Inner span (Elementor wraps button text) inherits same constraints */
	body.home .elementor-element-5fb91ec .elementor-button-content-wrapper,
	body.home .elementor-element-48ee9ae .elementor-button-content-wrapper,
	body.home .elementor-element-5fb91ec .elementor-button-text,
	body.home .elementor-element-48ee9ae .elementor-button-text {
		white-space: nowrap !important;
		display: inline-flex !important;
		align-items: center !important;
	}

	/* --- Reduce 100vh / 630px section min-heights on mobile ---
	   These are too tall for content on a 844px screen and create
	   the "loading / broken page" feel. */
	body.home .elementor-element-ca3da80,
	body.home .elementor-element-ae9b77b,
	body.home .elementor-element-839cbfd,
	body.home .elementor-element-603c27e {
		min-height: auto !important;
	}

	/* --- Tighten section vertical padding to kill the visible black
	       gaps between Light Up the Base and Production sections. --- */
	body.home .elementor-element-f307c77,
	body.home .elementor-element-f03874c,
	body.home .elementor-element-fbb0db4,
	body.home .elementor-element-12ea1ed,
	body.home .elementor-element-ca3da80,
	body.home .elementor-element-ae9b77b,
	body.home .elementor-element-839cbfd,
	body.home .elementor-element-603c27e {
		padding-top: 60px !important;
		padding-bottom: 60px !important;
	}
	/* The production inner has a Vimeo bg — keep more vertical room
	   so the video doesn't compress into a thin strip. */
	body.home .elementor-element-fbb0db4 {
		min-height: 60vh !important;
		padding-top: 80px !important;
		padding-bottom: 80px !important;
	}

	/* --- The Difference section (.signature--injected) ---
	   Steps already stack column at 900px (handled earlier). Just
	   reduce headline + horizontal padding for 390px. */
	body.home .signature--injected {
		padding-left: 20px !important;
		padding-right: 20px !important;
		padding-top: 64px !important;
		padding-bottom: 64px !important;
	}
	body.home .signature--injected .signature__headline {
		font-size: clamp(22px, 6.8vw, 30px) !important;
	}
	body.home .signature .signature__step p {
		font-family: var(--sans) !important;
		font-size: 15px !important;
		line-height: 1.5 !important;
		color: rgba(232, 236, 242, 0.96) !important;
		font-weight: 400 !important;
		text-shadow: none !important;
		background: transparent !important;
		padding: 0 !important;
		border-radius: 0 !important;
	}

	/* --- Become a Partner CTA card — tighten padding on mobile --- */
	body.home .dabomb-partner-cta {
		padding-top: 56px !important;
		padding-bottom: 56px !important;
	}
	body.home .dabomb-partner-cta__h {
		font-size: clamp(26px, 7vw, 36px) !important;
	}

	/* --- Body text floor (Elementor text-editor widgets) ---
	   Some inherit 13-14px on narrow columns; bump to 15px for
	   premium readability per audit item 17.
	   Exclude ddd16f7 (hero tagline) which intentionally uses 11px. */
	body.home .elementor-widget-text-editor:not(.elementor-element-ddd16f7) p,
	body.home .elementor-widget-text-editor:not(.elementor-element-ddd16f7),
	body.home .elementor-widget-theme-post-content p {
		font-size: 15px !important;
		line-height: 1.55 !important;
	}

	/* --- Defensive: any leftover 2-col Elementor flex/grid rows on
	       homepage collapse to single column. Catches anything not
	       responsive-configured in Elementor. --- */
	body.home .elementor-element.e-grid:not(.elementor-element-5f37426) {
		grid-template-columns: 1fr !important;
	}

	/* --- Hero h1 word-break safety: long words don't blow out --- */
	body.home .elementor-element-f2dd2ac h1,
	body.home .elementor-element-f2dd2ac .elementor-heading-title {
		overflow-wrap: break-word !important;
		word-break: normal !important;
		max-width: 100% !important;
	}
}