/**
 * Duuabl Core - Custom Styles
 *
 * Extends theme.json with CSS that can't be expressed declaratively.
 * Design tokens sourced from Duuabl landing page.
 */

/* ─── Base ─── */
html {
	scroll-behavior: smooth;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* ─── Focus states (accessibility) ─── */
:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* ─── Custom CSS variables from landing ─── */
:root {
	--duuabl-border: rgba(15, 42, 43, 0.08);
	--duuabl-border-strong: rgba(15, 42, 43, 0.14);
	--duuabl-accent-dim: rgba(13, 155, 106, 0.08);
	--duuabl-accent-glow: rgba(13, 155, 106, 0.2);
	--duuabl-radius-sm: 8px;
	--duuabl-radius: 12px;
	--duuabl-radius-lg: 20px;
	--duuabl-shadow-sm: 0 1px 3px rgba(15,42,43,0.04);
	--duuabl-shadow-md: 0 4px 16px rgba(15,42,43,0.08);
	--duuabl-shadow-lg: 0 24px 80px rgba(15,42,43,0.10);
}

/* ─── Utility classes ─── */
.duuabl-card {
	background: var(--wp--preset--color--card);
	border-radius: var(--duuabl-radius);
	padding: var(--wp--preset--spacing--l);
	transition: background 0.2s ease;
}

.duuabl-card:hover {
	background: var(--wp--preset--color--card-hover);
}

.duuabl-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	background: var(--duuabl-accent-dim);
	color: var(--wp--preset--color--accent);
	border-radius: 100px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.02em;
}

.duuabl-glass {
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.duuabl-section-alt {
	background: var(--wp--preset--color--card);
}

/* ─── Smooth button transitions (extends theme.json buttons) ─── */
.wp-element-button,
.wp-block-button__link {
	transition: all 0.2s ease;
}

.wp-element-button:hover,
.wp-block-button__link:hover {
	transform: translateY(-1px);
	box-shadow: var(--duuabl-shadow-md);
}

/* ─── Full-bleed helper ─── */
.duuabl-full-bleed {
	width: 100vw;
	margin-left: calc(-50vw + 50%);
}