/* DBM landings — layout, type, components, FX helpers */

.dbm-landing {
	--dbm-font: "Inter Tight", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--dbm-serif: "Instrument Serif", Georgia, "Times New Roman", serif;
	--dbm-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	--dbm-text-xs: 0.9375rem;
	--dbm-text-sm: 1.0625rem;
	--dbm-text-btn: 1.0625rem;
	--dbm-text-base: 1.25rem;
	--dbm-text-md: 1.375rem;
	--dbm-text-lg: 1.5rem;
	--dbm-line-body: 1.65;
	font-family: var(--dbm-font);
	font-size: var(--dbm-text-base);
	font-feature-settings: "ss01", "cv11";
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.dbm-shell {
	width: 100%;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Particles (hero bg) ---------- */
.dbm-hero-section {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.dbm-hero-section .dbm-particle-wrap {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.55;
}

.dbm-landing--dark .dbm-hero-section .dbm-particle-wrap {
	opacity: 0.35;
	mix-blend-mode: screen;
}

.dbm-hero-section .dbm-particle-canvas {
	display: block;
	width: 100%;
	height: 100%;
}

.dbm-hero-section .dbm-shell {
	position: relative;
	z-index: 1;
}

/* ---------- Hero ---------- */
.dbm-hero-top {
	padding-bottom: 0;
}

.dbm-hero-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(32px, 5vw, 64px);
	align-items: start;
	padding-bottom: 48px;
}

@media (max-width: 900px) {
	.dbm-hero-grid {
		grid-template-columns: 1fr;
	}
}

.dbm-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border-radius: 100px;
	font-size: var(--dbm-text-xs, 0.875rem);
	font-weight: 700;
	letter-spacing: 0.02em;
	margin-bottom: 22px;
	border: 1px solid var(--dbm-badge-border);
	background: var(--dbm-badge-bg);
	color: var(--dbm-badge-text);
}

.dbm-badge-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--accent);
	flex-shrink: 0;
}

.dbm-badge--pulse .dbm-badge-dot {
	animation: dbm-pulse-dot 2s ease-in-out infinite;
}

@keyframes dbm-pulse-dot {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.35;
	}
}

.dbm-display-title {
	font-family: var(--dbm-font);
	font-size: clamp(1.85rem, 4.2vw, 3.15rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.045em;
	color: var(--ink);
	margin: 0 0 18px;
	max-width: 20ch;
}

.dbm-display-grad {
	display: block;
	margin-top: 4px;
	font-family: var(--dbm-serif);
	font-style: italic;
	font-weight: 400;
	letter-spacing: -0.03em;
	background: linear-gradient(135deg, var(--accent), var(--dbm-purple, #7c3aed));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.dbm-lede {
	font-size: var(--dbm-text-md, clamp(1.125rem, 1.8vw, 1.3125rem));
	line-height: var(--dbm-line-body, 1.65);
	color: var(--ink-2);
	margin: 0 0 28px;
	max-width: 48ch;
}

.dbm-lede strong {
	color: var(--ink);
	font-weight: 600;
}

.dbm-cta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 16px;
}

.dbm-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 24px;
	border-radius: 12px;
	font-size: var(--dbm-text-sm, 1rem);
	font-weight: 650;
	letter-spacing: -0.01em;
	text-decoration: none;
	transition:
		transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.28s ease,
		background 0.22s ease,
		border-color 0.22s ease,
		color 0.22s ease,
		filter 0.22s ease;
	border: 1px solid transparent;
	cursor: pointer;
	min-height: 48px;
}

/* Force readable label on primary (theme link colors won’t tint text) */
.dbm-landing a.dbm-btn--solid,
.dbm-landing a.dbm-btn--solid:visited {
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
}

.dbm-landing--light .dbm-btn--solid {
	background: linear-gradient(180deg, #3b82f6 0%, #2563eb 52%, #1d4ed8 100%);
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.2) inset,
		0 4px 14px rgba(37, 99, 235, 0.35),
		0 12px 32px rgba(37, 99, 235, 0.18);
}

.dbm-landing--light .dbm-btn--solid:hover {
	transform: translateY(-2px);
	filter: brightness(1.04);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.25) inset,
		0 8px 22px rgba(37, 99, 235, 0.42),
		0 20px 44px rgba(37, 99, 235, 0.22);
}

.dbm-landing--light .dbm-btn--solid:active {
	transform: translateY(0);
	filter: brightness(0.98);
}

.dbm-landing--dark .dbm-btn--solid {
	background: linear-gradient(180deg, #22d3ee 0%, #06b6d4 55%, #0891b2 100%);
	color: #042f2e !important;
	-webkit-text-fill-color: #042f2e !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.35) inset,
		0 4px 18px rgba(6, 182, 212, 0.45);
}

.dbm-landing--dark .dbm-btn--solid:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.4) inset,
		0 10px 36px rgba(34, 211, 238, 0.35);
}

.dbm-landing .dbm-btn:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
}

.dbm-landing--light .dbm-btn--outline {
	background: #ffffff;
	color: var(--ink) !important;
	-webkit-text-fill-color: var(--ink) !important;
	border-color: #e2e8f0;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.dbm-landing--light .dbm-btn--outline:hover {
	border-color: color-mix(in srgb, var(--accent) 45%, #e2e8f0);
	background: #f8fafc;
	box-shadow: 0 6px 20px rgba(15, 23, 42, 0.07);
	transform: translateY(-2px);
}

.dbm-landing--light .dbm-btn--outline:active {
	transform: translateY(0);
}

.dbm-btn--sm {
	padding: 10px 18px;
	font-size: 14px;
}

.dbm-play {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	background: linear-gradient(180deg, #eff6ff, #dbeafe);
	color: #1d4ed8;
	border: 1px solid #bfdbfe;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dbm-landing--dark .dbm-play {
	background: rgba(34, 211, 238, 0.12);
	color: #22d3ee;
	border-color: rgba(34, 211, 238, 0.35);
}

.dbm-landing--light .dbm-btn--outline:hover .dbm-play {
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15);
}

.dbm-micro-trust {
	font-size: 12.5px;
	color: var(--ink-3);
	margin: 0;
}

/* FX card (hero + sections) */
.dbm-fx-card {
	background: var(--bg-3);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 18px 18px 16px;
	position: relative;
	overflow: hidden;
	box-shadow: var(--dbm-fx-card-shadow);
	isolation: isolate;
}

.dbm-fx-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	z-index: 0;
	pointer-events: none;
	opacity: 0.55;
	background-image:
		linear-gradient(to right, var(--dbm-fx-grid, rgba(100, 116, 139, 0.09)) 1px, transparent 1px),
		linear-gradient(to bottom, var(--dbm-fx-grid, rgba(100, 116, 139, 0.09)) 1px, transparent 1px);
	background-size: 22px 22px;
}

.dbm-fx-card > * {
	position: relative;
	z-index: 1;
}

.dbm-fx-card--tall {
	min-height: 280px;
}

.dbm-fx-card-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--line);
	margin-bottom: 12px;
	font-family: var(--dbm-mono);
	font-size: 9px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ink-3);
}

.dbm-fx-card-head strong {
	color: var(--ink);
	font-weight: 600;
	font-size: 10px;
}

.dbm-live-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	background: var(--pos);
	border-radius: 50%;
	margin-right: 6px;
	vertical-align: middle;
	animation: dbm-pulse-dot 1.8s ease-out infinite;
}

.dbm-flow[data-fx-mounted] {
	min-height: 200px;
}

.dbm-fx--reduced {
	min-height: 160px;
	border-radius: 6px;
	background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 8%, var(--bg-3)), var(--bg-3));
}

.dbm-mini-metrics {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 14px;
}

.dbm-mini {
	background: var(--bg-2);
	border: 1px solid var(--line);
	border-radius: 10px;
	padding: 12px 14px;
	transition:
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease;
}

.dbm-mini:hover {
	border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
	box-shadow: 0 10px 28px color-mix(in srgb, var(--accent) 12%, transparent);
	transform: translateY(-2px);
}

.dbm-mini-l {
	font-family: var(--dbm-mono);
	font-size: 9px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin-bottom: 6px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.dbm-pulse-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--pos);
	animation: dbm-pulse-dot 1.8s ease-out infinite;
}

.dbm-mini-v {
	font-family: var(--dbm-serif);
	font-style: italic;
	font-size: 26px;
	line-height: 1;
	color: var(--ink);
}

.dbm-mini-v em {
	color: var(--accent);
	font-style: italic;
}

.dbm-mini-d {
	margin-top: 4px;
	font-family: var(--dbm-mono);
	font-size: 10px;
	color: var(--pos);
	font-weight: 500;
}

/* Stat strip */
.dbm-stat-strip {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	margin-top: 20px;
	border: 1px solid var(--line);
	border-radius: 16px;
	overflow: hidden;
	background: color-mix(in srgb, var(--bg-3) 55%, var(--bg));
	box-shadow: 0 1px 0 color-mix(in srgb, #fff 40%, transparent) inset;
}

@media (max-width: 900px) {
	.dbm-stat-strip {
		grid-template-columns: 1fr 1fr;
	}
}

.dbm-stat-cell {
	padding: 26px 18px;
	border-right: 1px solid var(--line);
}

.dbm-stat-cell:last-child {
	border-right: none;
}

.dbm-stat-cell-v {
	font-family: var(--dbm-serif);
	font-size: clamp(1.65rem, 3.2vw, 2.35rem);
	line-height: 0.95;
	letter-spacing: -0.03em;
	color: var(--ink);
}

.dbm-stat-cell-v em {
	color: var(--accent);
	font-style: italic;
}

.dbm-stat-cell-l {
	margin-top: 10px;
	font-family: var(--dbm-mono);
	font-size: var(--dbm-text-xs, 0.9375rem);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-3);
	line-height: 1.45;
}

/* Logos band + client marks */
.dbm-logos-band {
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.dbm-logos-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.dbm-client-logo-wrap {
	padding-top: 8px;
	border-top: 1px solid var(--line);
}

.dbm-client-logo-label {
	margin: 0 0 14px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ink-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.dbm-client-logo-track {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: clamp(20px, 4vw, 40px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dbm-client-logo {
	margin: 0;
	padding: 0;
}

.dbm-client-logo figure {
	margin: 0;
	padding: 0;
}

.dbm-client-logo img {
	display: block;
	max-height: 40px;
	width: auto;
	max-width: 140px;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.72;
	transition:
		opacity 0.25s ease,
		filter 0.25s ease,
		transform 0.25s ease;
}

.dbm-client-logo:hover img {
	filter: grayscale(0);
	opacity: 1;
	transform: translateY(-2px);
}

.dbm-logos-label {
	font-size: 11px;
	font-weight: 600;
	color: var(--ink-3);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-right: 6px;
}

a.dbm-logo-chip,
.dbm-logo-chip {
	display: inline-flex;
	align-items: center;
	background: var(--bg-2);
	border: 1px solid var(--line);
	border-radius: 10px;
	padding: 8px 16px;
	font-size: var(--dbm-text-sm, 1.0625rem);
	font-weight: 700;
	color: var(--ink-3);
	text-decoration: none;
	transition:
		transform 0.22s ease,
		border-color 0.22s ease,
		box-shadow 0.22s ease,
		color 0.22s ease;
}

a.dbm-logo-chip:hover,
.dbm-logo-chip:hover {
	color: var(--ink-2);
	border-color: color-mix(in srgb, var(--accent) 22%, var(--line));
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
	transform: translateY(-2px);
}

/* Proof bar */
.dbm-band-proof {
	padding: 0 !important;
}

.dbm-proof-bar {
	background: var(--accent);
	padding: 28px 24px;
}

.dbm-proof-inner {
	max-width: 1140px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: clamp(20px, 3vw, 40px);
	align-items: start;
	padding-inline: clamp(16px, 4vw, 32px);
	box-sizing: border-box;
}

@media (max-width: 960px) {
	.dbm-proof-inner {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.dbm-proof-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 16px;
	}
}

.dbm-proof-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	min-width: 0;
	text-align: center;
}

.dbm-proof-stat strong {
	display: block;
	font-size: clamp(1.5rem, 2.8vw, 2.125rem);
	font-weight: 900;
	color: #fff;
	letter-spacing: -0.03em;
	line-height: 1.1;
	white-space: nowrap;
}

.dbm-proof-stat span {
	display: block;
	max-width: 11em;
	font-size: var(--dbm-text-xs, 0.9375rem);
	color: rgba(255, 255, 255, 0.72);
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.35;
}

/* Case study + testimonials */
.dbm-cs-intro {
	margin-bottom: clamp(20px, 3vw, 32px);
}

.dbm-cs-heading {
	margin: 0 auto 12px !important;
}

.dbm-cs-deck {
	margin: 0 auto;
	max-width: 52ch;
	text-align: center;
	font-size: clamp(1.02rem, 1.35vw, 1.125rem);
	line-height: 1.6;
	color: var(--ink-2);
}

.dbm-cs-spotlight {
	margin-bottom: clamp(20px, 3vw, 28px);
}

.dbm-cs-card {
	background: linear-gradient(135deg, var(--dbm-cs-a), var(--dbm-cs-b));
	border: 1px solid var(--dbm-cs-border);
	border-radius: 22px;
	padding: clamp(28px, 4vw, 40px);
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	align-items: center;
	box-shadow:
		0 1px 0 color-mix(in srgb, #fff 55%, transparent) inset,
		0 28px 64px -24px rgba(15, 23, 42, 0.14);
	backdrop-filter: blur(12px);
}

.dbm-cs-card--featured {
	padding: clamp(32px, 4.5vw, 48px);
	border-radius: 24px;
}

.dbm-cs-num {
	text-align: center;
	min-width: 110px;
}

.dbm-cs-num strong {
	display: block;
	font-size: clamp(2.65rem, 6.5vw, 3.75rem);
	font-weight: 900;
	background: linear-gradient(135deg, var(--accent), var(--dbm-purple, #7c3aed));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	letter-spacing: -0.04em;
	line-height: 1;
}

.dbm-cs-num span {
	font-size: 13px;
	color: var(--ink-2);
	font-weight: 600;
	margin-top: 8px;
	display: block;
	line-height: 1.4;
}

.dbm-cs-div {
	width: 1px;
	background: var(--dbm-cs-border);
	align-self: stretch;
	min-height: 120px;
}

@media (max-width: 700px) {
	.dbm-cs-div {
		display: none;
	}
}

.dbm-cs-body {
	flex: 1;
	min-width: min(100%, 280px);
	position: relative;
	padding-left: 22px;
	border-left: 3px solid color-mix(in srgb, var(--accent) 75%, var(--dbm-purple, #7c3aed));
}

.dbm-cs-quote {
	margin: 0;
	font-size: clamp(1.08rem, 1.65vw, 1.25rem);
	line-height: 1.68;
	color: var(--ink);
	font-style: italic;
	letter-spacing: -0.015em;
}

.dbm-cs-quote p {
	margin: 0;
}

.dbm-cs-author {
	font-size: clamp(0.95rem, 1.1vw, 1.02rem);
	color: var(--ink-3);
	margin: 18px 0 0;
	line-height: 1.45;
}

.dbm-cs-author strong {
	color: var(--ink-2);
	font-weight: 700;
}

/* Secondary testimonials grid */
.dbm-cs-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(16px, 2.5vw, 22px);
	max-width: 1120px;
	margin: 0 auto;
}

@media (max-width: 720px) {
	.dbm-cs-grid {
		grid-template-columns: 1fr;
	}
}

.dbm-cs-tile {
	margin: 0;
	padding: clamp(22px, 3vw, 30px);
	border-radius: 18px;
	border: 1px solid var(--line);
	background: var(--bg-3);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 1px 2px rgba(15, 23, 42, 0.04);
	transition:
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.dbm-cs-tile:hover {
	border-color: color-mix(in srgb, var(--accent) 22%, var(--line));
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.75) inset,
		0 18px 40px -16px color-mix(in srgb, var(--accent) 12%, transparent);
	transform: translateY(-2px);
}

.dbm-cs-tile-kicker {
	margin: 0 0 14px;
	font-family: var(--dbm-mono);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--accent);
}

.dbm-cs-tile-quote {
	margin: 0;
	padding: 0;
	border: none;
}

.dbm-cs-tile-quote p {
	margin: 0;
	font-size: clamp(1.02rem, 1.35vw, 1.12rem);
	line-height: 1.65;
	color: var(--ink);
	letter-spacing: -0.012em;
	font-style: normal;
	font-weight: 450;
}

.dbm-cs-tile-author {
	margin: 16px 0 0;
	font-size: clamp(0.9rem, 1.05vw, 0.98rem);
	color: var(--ink-3);
	line-height: 1.45;
}

.dbm-cs-tile-author strong {
	color: var(--ink-2);
	font-weight: 700;
}

@media (max-width: 520px) {
	.dbm-cs-body {
		padding-left: 0;
		border-left: none;
		border-top: 3px solid color-mix(in srgb, var(--accent) 75%, var(--dbm-purple, #7c3aed));
		padding-top: 22px;
	}
}

/* Section typography */
.dbm-section-inner {
	max-width: 1120px;
	margin: 0 auto;
}

.dbm-section-pad {
	padding-block: clamp(44px, 7vw, 92px);
	padding-inline: clamp(16px, 3vw, 28px);
}

.dbm-section-problem {
	position: relative;
}

.dbm-sec-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 0 0 12px;
}

.dbm-sec-label--center {
	text-align: center;
	display: block;
}

.dbm-sec-h2 {
	font-family: var(--dbm-font);
	font-size: clamp(1.65rem, 3.2vw, 2.6rem);
	font-weight: 900;
	letter-spacing: -0.035em;
	line-height: 1.12;
	margin: 0 0 14px;
	color: var(--ink);
}

.dbm-sec-h2--center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	max-width: 22ch;
}

.dbm-sec-sub {
	font-size: 16px;
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0 0 40px;
	max-width: 54ch;
}

.dbm-accent-italic {
	color: var(--accent);
	font-style: italic;
	font-family: var(--dbm-serif);
	font-weight: 400;
}

/* Problem grid */
.dbm-prob-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(14px, 2.4vw, 22px);
}

@media (max-width: 900px) {
	.dbm-prob-grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 520px) {
	.dbm-prob-grid {
		grid-template-columns: 1fr;
	}
}

.dbm-prob-card {
	position: relative;
	background: color-mix(in srgb, var(--bg-3) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: 18px;
	padding: 26px 22px 24px;
	overflow: hidden;
	transition:
		transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.32s ease,
		border-color 0.26s ease;
}

.dbm-prob-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(
		90deg,
		var(--accent),
		color-mix(in srgb, var(--accent) 35%, var(--dbm-purple, #7c3aed))
	);
	opacity: 0.9;
	transform: scaleX(0.55);
	transform-origin: left center;
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.dbm-prob-card:hover::before {
	transform: scaleX(1);
}

.dbm-prob-card:hover {
	transform: translateY(-4px);
	border-color: color-mix(in srgb, var(--accent) 30%, var(--line));
	box-shadow:
		0 22px 52px -14px color-mix(in srgb, var(--accent) 16%, transparent),
		0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent);
}

.dbm-prob-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-bottom: 14px;
	border-radius: 12px;
	background: linear-gradient(
		145deg,
		color-mix(in srgb, var(--accent) 14%, var(--bg-2)),
		var(--bg-3)
	);
	border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line));
	color: var(--accent);
}

.dbm-prob-svg {
	display: block;
	flex-shrink: 0;
}

.dbm-prob-h {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 8px;
	letter-spacing: -0.02em;
	color: var(--ink);
}

.dbm-prob-card p {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.58;
	color: var(--ink-2);
}

/* Compare section shell */
.dbm-cmp-wrap {
	position: relative;
}

.dbm-cmp-inner {
	max-width: 1120px;
	margin: 0 auto;
}

.dbm-table-scroll {
	border-radius: 16px;
	border: 1px solid var(--line);
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	background: var(--bg-3);
	box-shadow:
		0 1px 0 color-mix(in srgb, #fff 40%, transparent) inset,
		0 24px 56px -20px rgba(15, 23, 42, 0.09);
}

.dbm-cmp-table {
	width: 100%;
	min-width: 560px;
	border-collapse: separate;
	border-spacing: 0;
}

.dbm-cmp-table thead th {
	padding: 12px 18px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.dbm-cmp-table thead th:first-child {
	text-align: left;
	color: var(--ink-3);
	width: 34%;
}

.dbm-cmp-table thead th:nth-child(2) {
	text-align: center;
	color: var(--ink-3);
	background: var(--bg-3);
	border: 1px solid var(--line);
	border-bottom: none;
	border-radius: 10px 10px 0 0;
}

.dbm-cmp-table thead th:nth-child(3) {
	text-align: center;
	color: var(--accent);
	background: var(--dbm-cmp-hl);
	border: 1px solid var(--dbm-cmp-hl-border);
	border-bottom: none;
	border-radius: 10px 10px 0 0;
}

.dbm-cmp-table tbody th {
	text-align: left;
	padding: 12px 18px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink-2);
	border-bottom: 1px solid var(--line);
}

.dbm-cmp-table tbody td {
	padding: 12px 18px;
	font-size: 14px;
	border-bottom: 1px solid var(--line);
}

.dbm-cmp-table tbody td:nth-child(2) {
	text-align: center;
	background: var(--bg-3);
	border-left: 1px solid var(--line);
	border-right: 1px solid var(--line);
	color: var(--ink-3);
}

.dbm-cmp-table tbody td:nth-child(3) {
	text-align: center;
	background: var(--dbm-cmp-hl);
	border-left: 1px solid var(--dbm-cmp-hl-border);
	border-right: 1px solid var(--dbm-cmp-hl-border);
	color: var(--accent);
	font-weight: 700;
}

.dbm-cmp-inner .dbm-sec-h2--center {
	max-width: 28ch;
	margin-bottom: 36px;
}

/* Diffs */
.dbm-diffs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-top: 12px;
	border-top: none;
}

@media (max-width: 900px) {
	.dbm-diffs {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 520px) {
	.dbm-diffs {
		grid-template-columns: 1fr;
	}
}

.dbm-diff {
	padding: 24px 22px 28px;
	border-right: none;
	background: color-mix(in srgb, var(--bg-3) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: 18px;
	transition:
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.3s ease,
		border-color 0.25s ease;
}

.dbm-diff:hover {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--accent) 24%, var(--line));
	box-shadow: 0 18px 44px -12px rgba(15, 23, 42, 0.1);
}

.dbm-diff:last-child {
	padding-right: 22px;
}

.dbm-diff-num {
	font-family: var(--dbm-serif);
	font-style: italic;
	font-size: 28px;
	color: var(--accent);
	line-height: 1;
	margin-bottom: 14px;
}

.dbm-diff-h {
	font-family: var(--dbm-serif);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.02em;
	margin: 0 0 10px;
	color: var(--ink);
}

.dbm-diff-h em {
	font-style: italic;
	color: var(--accent);
}

.dbm-diff p {
	margin: 0;
	font-size: 14px;
	color: var(--ink-3);
	line-height: 1.55;
}

.dbm-diff-badge {
	display: inline-block;
	margin-top: 12px;
	padding: 4px 10px;
	background: var(--accent-soft);
	color: var(--accent);
	font-family: var(--dbm-mono);
	font-size: 9px;
	letter-spacing: 0.08em;
	border-radius: 4px;
	font-weight: 600;
}

/* Forecast */
.dbm-forecast-sec {
	max-width: 1120px;
	margin: 0 auto;
}

.dbm-forecast-grid {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 48px;
	align-items: center;
}

@media (max-width: 900px) {
	.dbm-forecast-grid {
		grid-template-columns: 1fr;
	}
}

/* Steps */
.dbm-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

@media (max-width: 900px) {
	.dbm-steps {
		grid-template-columns: 1fr;
	}
}

.dbm-step {
	background: color-mix(in srgb, var(--bg-3) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: 18px;
	padding: 28px;
	position: relative;
	overflow: hidden;
	transition:
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.3s ease,
		border-color 0.25s ease;
}

.dbm-step:hover {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--accent) 22%, var(--line));
	box-shadow: 0 18px 46px -14px rgba(15, 23, 42, 0.1);
}

.dbm-step-accent {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--accent), var(--dbm-purple, #7c3aed));
}

.dbm-step-num {
	font-size: 10px;
	font-weight: 800;
	color: var(--accent);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 12px;
	background: var(--accent-soft);
	display: inline-block;
	padding: 4px 10px;
	border-radius: 6px;
	font-family: var(--dbm-mono);
}

.dbm-step-h {
	font-size: 17px;
	font-weight: 800;
	margin: 0 0 8px;
	color: var(--ink);
}

.dbm-step p {
	margin: 0;
	font-size: 14px;
	color: var(--ink-2);
	line-height: 1.55;
}

/* Who */
.dbm-who-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

@media (max-width: 900px) {
	.dbm-who-grid {
		grid-template-columns: 1fr;
	}
}

.dbm-who-card {
	background: color-mix(in srgb, var(--bg-3) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: 18px;
	padding: 26px;
	transition:
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.3s ease,
		border-color 0.25s ease;
}

.dbm-who-card:hover {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--accent) 22%, var(--line));
	box-shadow: 0 18px 44px -14px rgba(15, 23, 42, 0.09);
}

.dbm-who-tag {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--accent);
	background: var(--accent-soft);
	display: inline-block;
	padding: 4px 10px;
	border-radius: 6px;
	margin-bottom: 12px;
	font-family: var(--dbm-mono);
}

.dbm-who-h {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--ink);
}

.dbm-who-card p {
	margin: 0;
	font-size: 13.5px;
	color: var(--ink-2);
	line-height: 1.55;
}

/* FAQ — Lovable-style cards, larger type (SEO + readability), staggered reveal */
.dbm-faq-intro {
	margin-bottom: clamp(28px, 4vw, 44px);
}

.dbm-faq-wrap .dbm-sec-h2--center {
	max-width: 26ch;
	margin-bottom: 0;
	font-size: clamp(1.75rem, 3.2vw, 2.35rem);
	line-height: 1.12;
	letter-spacing: -0.035em;
}

.dbm-faq {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.dbm-faq-item {
	margin: 0;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: var(--bg-3);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 1px 2px rgba(15, 23, 42, 0.04);
	overflow: hidden;
	transition:
		border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.dbm-faq-item:hover {
	border-color: color-mix(in srgb, var(--accent) 28%, var(--line));
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.75) inset,
		0 16px 40px -12px color-mix(in srgb, var(--accent) 14%, transparent);
	transform: translateY(-2px);
}

.dbm-faq-item.dbm-reveal {
	opacity: 1;
	transform: translate3d(0, 22px, 0);
	transition:
		transform 0.78s cubic-bezier(0.16, 1, 0.3, 1),
		border-color 0.35s ease,
		box-shadow 0.35s ease;
}

.dbm-faq-item.dbm-reveal.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.dbm-faq-q {
	position: relative;
	font-size: clamp(1.0625rem, 1.45vw, 1.1875rem);
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.02em;
	color: var(--ink);
	margin: 0;
	padding: 22px 26px 14px;
	list-style: none;
	transition:
		color 0.25s ease,
		transform 0.65s cubic-bezier(0.16, 1, 0.3, 1) 0.04s;
	transform: translate3d(0, 10px, 0);
}

.dbm-faq-item.is-visible .dbm-faq-q {
	transform: translate3d(0, 0, 0);
}

.dbm-faq-q::after {
	content: "";
	position: absolute;
	left: 26px;
	right: 26px;
	bottom: 0;
	height: 1px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		color-mix(in srgb, var(--accent) 35%, var(--line)) 20%,
		var(--line) 50%,
		color-mix(in srgb, var(--accent) 35%, var(--line)) 80%,
		transparent 100%
	);
	transform: scaleX(0.35);
	transform-origin: left center;
	opacity: 0.85;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease;
}

.dbm-faq-item:hover .dbm-faq-q::after {
	transform: scaleX(1);
	opacity: 1;
}

.dbm-faq-item.is-visible .dbm-faq-q::after {
	transform: scaleX(1);
}

.dbm-faq-a {
	margin: 0;
	padding: 4px 26px 26px;
	font-size: clamp(1.02rem, 1.25vw, 1.125rem);
	line-height: 1.68;
	letter-spacing: -0.011em;
	color: var(--ink-2);
	max-width: none;
	transform: translate3d(0, 14px, 0);
	transition:
		transform 0.68s cubic-bezier(0.16, 1, 0.3, 1) 0.1s,
		color 0.25s ease;
}

.dbm-faq-item.is-visible .dbm-faq-a {
	transform: translate3d(0, 0, 0);
}

.dbm-faq-item:hover .dbm-faq-q {
	color: color-mix(in srgb, var(--accent) 12%, var(--ink));
}

.dbm-faq-item:hover .dbm-faq-a {
	color: var(--ink-2);
}

/* Final CTA */
.dbm-band-final-cta {
	padding: 0 !important;
}

.dbm-final-cta {
	background: linear-gradient(135deg, var(--dbm-cta-a), var(--dbm-cta-b));
	padding: clamp(72px, 10vw, 110px) 24px;
	text-align: center;
}

.dbm-cta-eyebrow {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dbm-cta-eyebrow);
	margin: 0 0 12px;
}

.dbm-final-cta-h {
	font-family: var(--dbm-font);
	font-size: clamp(1.75rem, 3.5vw, 2.75rem);
	font-weight: 900;
	color: #fff;
	margin: 0 auto 14px;
	max-width: 22ch;
	line-height: 1.12;
	letter-spacing: -0.03em;
}

.dbm-final-cta-sub {
	color: rgba(255, 255, 255, 0.68);
	font-size: 16px;
	line-height: 1.55;
	margin: 0 auto 28px;
	max-width: 48ch;
}

.dbm-audit-list {
	list-style: none;
	margin: 0 auto 32px;
	padding: 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 12px 28px;
	max-width: 900px;
}

.dbm-audit-list li {
	position: relative;
	padding-left: 26px;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.78);
	text-align: left;
}

.dbm-audit-list li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	color: #fff;
	font-weight: 700;
}

.dbm-btn--white {
	background: #fff;
	color: #1e3a8a !important;
	-webkit-text-fill-color: #1e3a8a !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.65) inset,
		0 4px 20px rgba(0, 0, 0, 0.18);
}

.dbm-btn--white:hover {
	transform: translateY(-3px);
	filter: brightness(1.02);
	box-shadow:
		0 1px 0 #fff inset,
		0 12px 36px rgba(0, 0, 0, 0.28);
}

.dbm-btn--white:active {
	transform: translateY(-1px);
}

.dbm-cta-fine {
	margin: 16px 0 0;
	font-size: 12.5px;
	color: rgba(255, 255, 255, 0.42);
}

/* ---------- SVG FX (from DBM Old v2) ---------- */
.dbm-landing .fx-flow {
	width: 100%;
	height: auto;
	display: block;
}

.dbm-landing .fx-pulse {
	transform-origin: center;
	animation: dbm-fx-pulse 3.2s ease-in-out infinite;
}

@keyframes dbm-fx-pulse {
	0%,
	100% {
		opacity: 0.88;
		transform: scale(1);
	}
	50% {
		opacity: 1;
		transform: scale(1.045);
	}
}

.dbm-landing .fx-ring {
	transform-origin: center;
	animation: dbm-fx-ring 5s ease-in-out infinite;
}

.dbm-landing .fx-ring-2 {
	animation-delay: -2.5s;
}

@keyframes dbm-fx-ring {
	0%,
	100% {
		transform: scale(1);
		opacity: 0.55;
	}
	50% {
		transform: scale(1.12);
		opacity: 0.18;
	}
}

.dbm-landing .fx-edge {
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 7 5;
	animation: dbm-fx-dash 3.4s linear infinite;
}

.dbm-landing .fx-edge.fx-edge-out {
	animation-duration: 2.9s;
	animation-direction: reverse;
	opacity: 0.92;
}

@keyframes dbm-fx-dash {
	to {
		stroke-dashoffset: -48;
	}
}

.dbm-landing .fx-arc {
	stroke-linecap: round;
	stroke-dasharray: 5 6;
	animation: dbm-fx-dash 9s linear infinite, dbm-fx-arc-breathe 4s ease-in-out infinite;
}

@keyframes dbm-fx-arc-breathe {
	0%,
	100% {
		opacity: 0.55;
	}
	50% {
		opacity: 0.9;
	}
}

.dbm-landing .fx-node {
	transform-origin: center;
	animation: dbm-fx-pulse 3.5s ease-in-out infinite;
}

.dbm-landing .fx-dot {
	filter: drop-shadow(0 0 5px color-mix(in srgb, var(--accent) 40%, transparent));
}

/* World map: faint base paths + marching “signal” strokes along arcs */
.dbm-landing .fx-world-arc-base {
	stroke-linecap: round;
}

.dbm-landing .fx-world-arc-energy {
	stroke-linecap: round;
	stroke-dasharray: 10 90;
	stroke-dashoffset: 0;
	animation: dbm-fx-world-line-flow 2.6s linear infinite;
	filter: drop-shadow(0 0 3px color-mix(in srgb, var(--accent) 45%, transparent));
}

@keyframes dbm-fx-world-line-flow {
	to {
		stroke-dashoffset: -100;
	}
}

/* ---------- Reveal ---------- */
.dbm-reveal {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition:
		opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.dbm-reveal.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
	.dbm-landing .fx-edge,
	.dbm-landing .fx-arc,
	.dbm-landing .fx-world-arc-base,
	.dbm-landing .fx-world-arc-energy,
	.dbm-landing .fx-pulse,
	.dbm-landing .fx-ring,
	.dbm-landing .fx-node {
		animation: none !important;
	}

	.dbm-landing .fx-arc,
	.dbm-landing .fx-world-arc-base {
		stroke-opacity: 0.32;
		opacity: 1;
	}

	.dbm-landing .fx-world-arc-energy {
		animation: none !important;
		stroke-dashoffset: 0;
		stroke-opacity: 0.55;
	}

	.dbm-badge--pulse .dbm-badge-dot,
	.dbm-live-dot,
	.dbm-pulse-dot {
		animation: none !important;
	}

	.dbm-mini:hover {
		transform: none;
		box-shadow: none;
	}

	.dbm-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.dbm-faq-item .dbm-faq-a {
		transform: none !important;
		transition: none !important;
	}

	.dbm-faq-item .dbm-faq-q {
		transform: none !important;
		transition: none !important;
	}

	.dbm-faq-item.dbm-reveal {
		transform: none !important;
		transition: none !important;
	}

	.dbm-faq-q::after {
		transform: scaleX(1) !important;
		transition: none !important;
	}

	.dbm-cs-tile:hover {
		transform: none;
	}
}

/* v6-only human strips in shared markup — revealed on .dbm-landing--v6 only */
.dbm-v6-only-human {
	display: none !important;
}