/*
Theme Name: Ayaner — Plugin & Theme Store
Theme URI: https://ayaner.com
Author: Websel Dönüşüm
Author URI: https://ayaner.com
Description: Classic WordPress theme for a premium plugin & theme store, built with SEO and GEO (Generative Engine Optimization) in mind. Dark Modern Tech design, ships with custom Elementor widgets, a solutions catalog and WooCommerce checkout flow.
Version: 1.2.0
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 8.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: websel-donusum
Domain Path: /languages
Tags: agency, seo, marketing, business, classic-theme, custom-post-types, woocommerce, elementor, dark
*/

/* ============================================================
 * TOKEN — Modern Tech direction (dark mode)
 * ============================================================ */
:root {
	--wd-bg: #0A0F1A;
	--wd-bg-soft: #0F1729;
	--wd-bg-card: #131D33;
	--wd-surface: #0F1729;
	--wd-surface-2: #131D33;
	--wd-ink: #F2F5FB;
	--wd-ink-soft: #B6BDD0;
	--wd-ink-mute: #7A8398;
	--wd-brand-navy: #1F2D5C;
	--wd-brand-orange: #EC7A1A;
	--wd-brand-green: #62A93A;
	--wd-accent: #5B7CFF;
	--wd-accent-deep: #2A5BFF;
	--wd-accent-soft: rgba(91, 124, 255, .12);
	--wd-warm: #EC7A1A;
	--wd-good: #3EE0A1;
	--wd-line: rgba(255, 255, 255, .08);
	--wd-line-soft: rgba(255, 255, 255, .04);
	--wd-line-w: rgba(255, 255, 255, .08);
	--wd-line-w-strong: rgba(255, 255, 255, .16);
	--wd-font-display: 'Inter Tight', 'Inter', system-ui, -apple-system, sans-serif;
	--wd-font-body: 'Inter', system-ui, -apple-system, sans-serif;
	--wd-font-mono: 'JetBrains Mono', ui-monospace, monospace;
	--wd-radius-sm: 8px;
	--wd-radius-md: 12px;
	--wd-radius-lg: 16px;
	--wd-radius-xl: 24px;
	--wd-radius-pill: 999px;
}

/* ============================================================
 * GLOBAL BODY — koyu mod + mesh gradient + grain
 * ============================================================ */
html, body { margin: 0; padding: 0; }
body {
	color: var(--wd-ink);
	font-family: var(--wd-font-body);
	font-size: 15px;
	line-height: 1.6;
	letter-spacing: -.005em;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	background-color: var(--wd-bg);
	background-image:
		radial-gradient(1100px 700px at 88% -8%, rgba(91,124,255,.10), transparent 60%),
		radial-gradient(900px 800px at -8% 18%, rgba(31,45,92,.45), transparent 55%),
		radial-gradient(800px 600px at 50% 48%, rgba(236,122,26,.045), transparent 60%),
		radial-gradient(1000px 700px at 110% 78%, rgba(91,124,255,.08), transparent 60%),
		radial-gradient(700px 500px at 8% 102%, rgba(98,169,58,.04), transparent 60%);
	background-attachment: fixed;
	background-repeat: no-repeat;
}
body::before {
	content: ""; position: fixed; inset: 0;
	z-index: 0; pointer-events: none;
	opacity: .35; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.06 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
}
main, header, footer, .elementor, .elementor-section { position: relative; z-index: 1; }
h1, h2, h3, h4, h5, h6 {
	font-family: var(--wd-font-display);
	font-weight: 600; letter-spacing: -.025em; line-height: 1.1;
	color: var(--wd-ink); margin: 0 0 .5em;
}
p { margin: 0 0 1em; }
a { color: var(--wd-accent); text-decoration: none; transition: color .15s; }
a:hover { color: var(--wd-accent-deep); }
.alignwide { max-width: 1280px; margin-left: auto; margin-right: auto; }
.alignfull { width: 100vw; margin-left: calc(50% - 50vw); }
::selection { background: var(--wd-accent); color: #fff; }
::-moz-selection { background: var(--wd-accent); color: #fff; }
input[type="text"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="number"],
textarea, select {
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink); border-radius: var(--wd-radius-sm);
	padding: 10px 14px; font-family: var(--wd-font-body); font-size: 14px;
}
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--wd-accent); }
body.elementor-template-canvas { padding: 0 !important; margin: 0 !important; }


/* =========================================================
 * Reset & Base
 * ========================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
img, svg, video { max-width: 100%; height: auto; display: block; }

button { font: inherit; cursor: pointer; border: 0; background: transparent; color: inherit; }

ul, ol { padding: 0; margin: 0 0 1em; }
ul li, ol li { list-style: disc; margin-left: 1.5em; color: var(--wd-ink-soft); }
ul.unstyled, ol.unstyled, nav ul, nav ol { list-style: none; padding: 0; margin: 0; }
ul.unstyled li, nav ul li { list-style: none; margin: 0; }

/* Helper containers */
.wd-main { padding-top: 64px; /* for fixed nav */ min-height: 60vh; }
.wd-main--full { padding-top: 0; }
.wd-section { padding: 96px 32px; max-width: 1320px; margin: 0 auto; }
.wd-prose { max-width: 720px; margin: 0 auto; color: var(--wd-ink-soft); font-size: 16px; line-height: 1.75; }
.wd-prose h2, .wd-prose h3 { color: var(--wd-ink); margin-top: 1.5em; }
.wd-prose a { color: var(--wd-accent); border-bottom: 1px solid currentColor; }

/* =========================================================
 * Header (header.php) — default minimal nav
 * (The customer can customize this with Elementor Pro Theme Builder)
 * ========================================================= */
.wd-header {
	position: fixed; top: 0; left: 0; right: 0;
	z-index: 50;
	background: rgba(10, 15, 26, .6);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--wd-line-w);
	transition: background .25s;
}
.wd-header.solid { background: rgba(10, 15, 26, .92); }

/* Thin grid pattern in the header background — same DNA as .wd-hero-gridtex in Hero.
 * Drawn as a ::before overlay, visible in the center and fading at the edges. */
.wd-header::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
	background-size: 64px 64px;
	background-position: center center;
	-webkit-mask-image: radial-gradient(ellipse 60% 100% at 50% 50%, #000 0%, transparent 85%);
	mask-image: radial-gradient(ellipse 60% 100% at 50% 50%, #000 0%, transparent 85%);
	opacity: .7;
	z-index: 0;
}
/* Pattern is slightly more visible in the solid state (has a matte bg on top) */
.wd-header.solid::before { opacity: 1; }
/* Content should stay above the pattern */
.wd-header-inner { position: relative; z-index: 1; }

.wd-header-inner {
	/* Hero content max-width 1320 + section padding 32 = effective 1384 outer.
	 * Same pattern → at viewport > 1384 the logo shares the exact same left edge as the Hero h1. */
	max-width: 1384px;
	margin: 0 auto;
	padding: 0 32px;
	height: 64px;
	display: flex;
	align-items: center;
	gap: 24px;
}
/* Logo on the left (natural width), nav flex-centered, actions on the right (natural width) */
.wd-header-inner > .wd-header-brand   { flex: 0 0 auto; }
.wd-header-inner > .wd-header-nav     { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; }
.wd-header-inner > .wd-header-actions { flex: 0 0 auto; }

.wd-header-brand {
	display: flex; align-items: center; gap: 10px;
	color: var(--wd-ink);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: -.01em;
	text-decoration: none;
}
.wd-header-brand:hover { color: var(--wd-ink); }
.wd-brand-mark {
	width: 28px; height: 28px;
	border-radius: 50%;
	background: var(--wd-brand-navy);
	display: grid; place-items: center;
	position: relative;
	overflow: hidden;
	flex-shrink: 0;
	color: #fff;
	font-family: var(--wd-font-display);
	font-weight: 700;
	font-size: 14px;
}
.wd-brand-mark::before {
	content: "";
	position: absolute; top: -3px; right: -3px;
	width: 13px; height: 13px;
	background: var(--wd-brand-orange);
	border-radius: 50%;
}

.wd-header-nav {
	display: flex; gap: 28px;
	font-size: 13.5px;
	color: var(--wd-ink-soft);
}
.wd-header-nav a {
	color: var(--wd-ink-soft);
	transition: color .15s;
	line-height: 1.4;
}
.wd-header-nav .current_page_item a,
.wd-header-nav .current-menu-item a {
	color: var(--wd-ink);
}
.wd-header-nav > ul { display: flex; gap: 28px; list-style: none; padding: 0; margin: 0; align-items: center; }

/* ============================================================
 * Sub-menu (dropdown) — opens on hover over the parent item.
 * A 2-level menu, e.g. My Account, Support > Technical Appointment / GEO Analysis.
 * ============================================================ */
.wd-header-nav .menu-item-has-children {
	position: relative;
}
/* Chevron mark on the parent (visual hint) */
.wd-header-nav .menu-item-has-children > a::after {
	content: "▾";
	display: inline-block;
	margin-left: 6px;
	font-size: 9px;
	opacity: .6;
	transition: transform .2s ease, opacity .2s ease;
	vertical-align: middle;
}
.wd-header-nav .menu-item-has-children:hover > a::after {
	opacity: 1;
	transform: translateY(2px);
}
/* Sub-menu hidden by default */
.wd-header-nav .sub-menu {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
	position: absolute;
	top: calc(100% + 16px);
	left: 50%;
	transform: translateX(-50%) translateY(-6px);
	min-width: 220px;
	padding: 10px !important;
	background: rgba(10, 15, 26, .96);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 12px;
	box-shadow: 0 24px 60px rgba(0,0,0,.45), 0 4px 12px rgba(0,0,0,.18);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .2s ease, transform .25s cubic-bezier(.2,.7,.2,1), visibility .25s;
	z-index: 50;
	list-style: none;
}
.wd-header-nav .sub-menu::before {
	content: "";
	position: absolute;
	top: -16px;
	left: 0;
	right: 0;
	height: 16px;
	background: transparent;
}
.wd-header-nav .menu-item-has-children:hover > .sub-menu,
.wd-header-nav .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}
/* Flip animation disabled on sub-menu items — simple hover color change instead */
.wd-header-nav .sub-menu li {
	display: block !important;
}
.wd-header-nav .sub-menu a {
	display: block !important;
	padding: 10px 14px;
	border-radius: 8px;
	height: auto !important;
	overflow: visible !important;
	white-space: nowrap;
	font-size: 13.5px;
	color: var(--wd-ink-soft);
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.wd-header-nav .sub-menu a:hover {
	background: rgba(236, 122, 26, .08);
	color: var(--wd-warm);
}
/* The flip wrapper is not applied to links inside the sub-menu (overflow:hidden + height:1.4em cancelled).
 * If JS wraps it, hide the hover copy — only the original should be visible. */
.wd-header-nav .sub-menu a:has(.wd-menu-flip) {
	display: block !important;
	overflow: hidden !important;
	height: auto !important;
}
.wd-header-nav .sub-menu a .wd-menu-flip {
	transform: none !important;
	display: block !important;
}
.wd-header-nav .sub-menu a:hover .wd-menu-flip {
	transform: none !important;
}
/* Hide the hover copy in the sub-menu — prevents a duplicate issue */
.wd-header-nav .sub-menu a .wd-menu-flip-hover {
	display: none !important;
}

/* ============================================================
 * MENU ODOMETER HOVER — Aquest.it-style scrolling text.
 * JS wraps the link text in a .wd-menu-flip wrapper (2 lines: original + hover).
 * On hover, wrapper translateY(-100%) → the orange copy underneath becomes visible.
 * Desktop only — below 1100px the drawer opens instead, no hover.
 * ============================================================ */
@media (min-width: 1101px) {
	.wd-header-nav a:has(.wd-menu-flip) {
		display: inline-block;
		overflow: hidden;
		height: 1.4em;
		vertical-align: middle;
	}
	.wd-menu-flip {
		display: block;
		transition: transform .42s cubic-bezier(.65,.05,.2,1);
		will-change: transform;
	}
	.wd-menu-flip > span {
		display: block;
		line-height: 1.4;
	}
	.wd-menu-flip-hover {
		color: var(--wd-warm); /* #EC7A1A — the site's heading orange */
	}
	/* Wrapper contains 2 lines (original + hover copy), own height 2.8em.
	 * -50% moves it by half = 1 line shifts, bringing the hover line into view. */
	.wd-header-nav a:hover .wd-menu-flip,
	.wd-header-nav .current_page_item a .wd-menu-flip,
	.wd-header-nav .current-menu-item a .wd-menu-flip {
		transform: translateY(-50%);
	}
	/* Fallback for browsers that don't support :has(): no text shift, color change only */
	@supports not (selector(:has(*))) {
		.wd-header-nav a:hover { color: var(--wd-warm); }
	}
}

/* Hamburger toggle — hidden on desktop, visible on mobile */
.wd-nav-toggle {
	display: none;
	width: 44px; height: 44px;
	margin-left: auto;
	background: transparent;
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	padding: 0;
	cursor: pointer;
	align-items: center; justify-content: center;
	flex-direction: column;
	gap: 5px;
	flex-shrink: 0;
	transition: border-color .15s, background .15s;
}
.wd-nav-toggle:hover { border-color: var(--wd-accent); background: rgba(91,124,255,.08); }
.wd-nav-toggle-bar {
	width: 18px; height: 2px;
	background: var(--wd-ink, #F2F5FB);
	border-radius: 1px;
	transition: transform .25s, opacity .2s;
}
/* Turn into an X when open */
.wd-header.nav-open .wd-nav-toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.wd-header.nav-open .wd-nav-toggle-bar:nth-child(2) { opacity: 0; }
.wd-header.nav-open .wd-nav-toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Hamburger menu: 7 menu items + logo + actions collide at ~1000px.
 * We switch to the drawer below 1100px; full nav only on large screens. */
@media (max-width: 1100px) {
	/* Hamburger visible */
	.wd-nav-toggle { display: inline-flex; }

	/* Keep logo and actions aligned, move nav into the drawer */
	.wd-header-inner { gap: 12px; padding: 0 18px; }
	.wd-header-inner > .wd-header-actions { gap: 8px; }

	/* Shrink the "Free Analysis" button on mobile */
	.wd-header-actions .wd-btn-primary {
		padding: 8px 14px;
		font-size: 12.5px;
	}

	/* Nav drawer — fullscreen, opens below the header */
	.wd-header-nav {
		position: fixed;
		top: 64px; left: 0; right: 0;
		max-height: calc(100vh - 64px);
		overflow-y: auto;
		background: rgba(10, 15, 26, .98);
		backdrop-filter: blur(20px);
		border-top: 1px solid var(--wd-line-w);
		border-bottom: 1px solid var(--wd-line-w);
		padding: 24px 20px 40px;
		transform: translateY(-12px);
		opacity: 0;
		visibility: hidden;
		transition: transform .25s ease, opacity .2s ease, visibility .25s;
		z-index: 49;
	}
	.wd-header.nav-open .wd-header-nav {
		transform: translateY(0);
		opacity: 1;
		visibility: visible;
	}
	.wd-header-nav ul {
		flex-direction: column;
		gap: 0;
		align-items: stretch;
	}
	.wd-header-nav li { border-bottom: 1px solid var(--wd-line-w); }
	.wd-header-nav li:last-child { border-bottom: none; }
	.wd-header-nav a {
		display: block;
		padding: 16px 8px;
		font-size: 16px;
		color: var(--wd-ink, #F2F5FB);
		font-weight: 500;
	}

	/* Mobil — sub-menu inline (dropdown'a gerek yok, drawer alt alta) */
	.wd-header-nav .sub-menu {
		position: static !important;
		display: block !important;
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
		transform: none !important;
		background: transparent !important;
		backdrop-filter: none !important;
		border: none !important;
		box-shadow: none !important;
		padding: 0 0 0 16px !important;
		min-width: 0 !important;
		border-left: 2px solid rgba(236,122,26,.3);
		margin: 0 0 0 8px !important;
	}
	.wd-header-nav .sub-menu a {
		font-size: 14px;
		padding: 12px 8px;
		color: var(--wd-ink-soft) !important;
	}
	.wd-header-nav .menu-item-has-children > a::after {
		content: none !important; /* mobilde chevron'a gerek yok */
	}
}

/* =========================================================
 * Footer (footer.php) — default minimal
 * ========================================================= */
.wd-footer {
	border-top: 1px solid var(--wd-line);
	padding: 48px 32px 36px;
	color: var(--wd-ink-mute);
	font-size: 13px;
	background: rgba(15, 23, 41, .4);
}
.wd-footer-inner {
	max-width: 1320px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
}
.wd-footer a { color: var(--wd-ink-soft); }
.wd-footer a:hover { color: var(--wd-ink); }

/* =========================================================
 * Comments / WP defaults
 * ========================================================= */
.wp-block-quote, blockquote {
	border-left: 3px solid var(--wd-accent);
	padding: 8px 0 8px 20px;
	color: var(--wd-ink);
	font-style: italic;
	margin: 24px 0;
}

code, kbd, pre {
	font-family: var(--wd-font-mono);
	font-size: 13px;
	background: rgba(255,255,255,.06);
	padding: 2px 6px;
	border-radius: 4px;
	color: var(--wd-ink);
}
pre {
	padding: 16px;
	overflow-x: auto;
	line-height: 1.55;
}

/* Skip link */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: var(--wd-accent);
	color: #fff;
	padding: 10px 16px;
	border-radius: 6px;
	font-size: 13px;
}
.skip-link:focus { left: 16px; top: 16px; }

/* =========================================================
 * Onboarding (for the empty state of front-page.php)
 * ========================================================= */
.wd-onboarding { z-index: 2; position: relative; }

/* =====================================================
 * GLOBAL TOKEN OVERRIDES — for widget context
 * (finalizes the placeholders from style.css)
 * ===================================================== */
:root {
	--wd-accent:        #5B7CFF;
	--wd-accent-deep:   #2A5BFF;
	--wd-accent-soft:   rgba(91,124,255,.12);
	--wd-brand-navy:    #1F2D5C;
	--wd-brand-orange:  #EC7A1A;
	--wd-brand-green:   #62A93A;
	--wd-good:          #3EE0A1;
	--wd-line-w:        rgba(255,255,255,.08);
	--wd-line-w-strong: rgba(255,255,255,.16);
}

/* =====================================================
 * WD · SERVICES GRID — .wd-svc-section
 * ===================================================== */
.wd-svc-section {
	--wd-accent: #5B7CFF;
	position: relative;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Heading */
.wd-svc-head { margin-bottom: 56px; max-width: 780px; }
.wd-svc-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .1em;
	text-transform: uppercase;
	margin-bottom: 16px;
}
.wd-svc-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600;
	letter-spacing: -.03em;
	line-height: 1.05;
	margin: 0 0 14px;
	color: var(--wd-ink, #F2F5FB);
}
.wd-svc-h2 em { font-style: normal; color: var(--wd-accent); }
.wd-svc-sub {
	font-size: 17px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6;
	max-width: 640px;
	margin: 0;
}

/* Grid — column count modifiers */
.wd-svc-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 700px)  { .wd-cols-2 .wd-svc-grid, .wd-cols-3 .wd-svc-grid, .wd-cols-4 .wd-svc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .wd-cols-3 .wd-svc-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .wd-cols-4 .wd-svc-grid { grid-template-columns: repeat(4, 1fr); } }

/* Card — cinematic image cover */
.wd-svc-card {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .25s;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 28px;
	cursor: pointer;
	text-decoration: none;
	color: inherit;
}
.wd-svc-card:hover { border-color: var(--wd-line-w-strong); }

/* Aspect ratios */
.wd-asp-3-4 .wd-svc-card { aspect-ratio: 3 / 4; }
.wd-asp-4-5 .wd-svc-card { aspect-ratio: 4 / 5; }
.wd-asp-1-1 .wd-svc-card { aspect-ratio: 1 / 1; }
.wd-asp-4-3 .wd-svc-card { aspect-ratio: 4 / 3; }

.wd-svc-card .svc-bg {
	position: absolute; inset: 0; z-index: 0;
	transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .35s;
}
.wd-svc-card .svc-bg img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	filter: saturate(.85) contrast(1.05);
}
.wd-svc-card .svc-bg-fallback {
	position: absolute; inset: 0;
	background:
		linear-gradient(135deg, var(--wd-brand-navy) 0%, var(--wd-bg, #0A0F1A) 100%),
		radial-gradient(400px 200px at 30% 30%, rgba(91,124,255,.2), transparent 60%);
}
.wd-svc-card:hover .svc-bg { transform: scale(1.06); }

.wd-svc-card::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(180deg,
		rgba(10,15,26,.05) 0%,
		rgba(10,15,26,.15) 40%,
		rgba(10,15,26,.85) 78%,
		rgba(10,15,26,.96) 100%);
	pointer-events: none;
}

.wd-svc-card .svc-num {
	position: absolute; top: 24px; left: 24px; z-index: 3;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; color: #fff;
	background: rgba(255,255,255,.1);
	backdrop-filter: blur(8px);
	padding: 4px 9px; border-radius: 999px;
	border: 1px solid rgba(255,255,255,.18);
	letter-spacing: .06em;
}
.wd-svc-card .svc-meta {
	position: absolute; top: 24px; right: 24px; z-index: 3;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 10.5px;
	color: var(--wd-ink-soft, #B6BDD0);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.wd-svc-card .svc-body {
	position: relative; z-index: 2;
	display: flex; flex-direction: column; gap: 12px;
}
.wd-svc-card .svc-body h3 {
	color: #fff; font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 24px; line-height: 1.1; letter-spacing: -.02em;
	font-weight: 600; margin: 0;
}
.wd-svc-card .svc-tag {
	font-size: 14px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.5; margin: 0;
}
.wd-svc-card .svc-link {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	margin-top: 6px;
	letter-spacing: .02em;
	color: var(--wd-brand-green, #62A93A);
}
.wd-svc-card .svc-link .arr {
	display: inline-block;
	transition: transform .25s;
}
.wd-svc-card:hover .svc-link .arr { transform: translateX(4px); }

/* Empty state */
.wd-svc-empty {
	padding: 48px 32px;
	border: 1px dashed var(--wd-line-w-strong);
	border-radius: 14px;
	text-align: center;
	color: var(--wd-ink-mute, #7A8398);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px;
}

/* =====================================================
 * SHARED BUTTONS — used in all widgets
 * ===================================================== */
.wd-btn {
	display: inline-flex; align-items: center; gap: 8px;
	height: 40px; padding: 0 18px;
	border-radius: 999px;
	font-size: 13.5px; font-weight: 500; letter-spacing: -.005em;
	font-family: 'Inter', system-ui, sans-serif;
	text-decoration: none; cursor: pointer; white-space: nowrap;
	border: 1px solid transparent;
	transition: background .15s, transform .12s, color .15s;
}
.wd-btn:active { transform: translateY(1px); }
.wd-btn-primary {
	background: #fff; color: #0A0F1A;
}
.wd-btn-primary:hover { background: #E8EBF5; color: #0A0F1A; }
.wd-btn-ghost {
	background: rgba(255,255,255,.06);
	color: var(--wd-ink, #F2F5FB);
	border-color: var(--wd-line-w-strong);
	backdrop-filter: blur(10px);
}
.wd-btn-ghost:hover { background: rgba(255,255,255,.12); }
.wd-btn-accent {
	background: var(--wd-accent-deep);
	color: #fff;
}
.wd-btn-accent:hover { background: #3A6BFF; }
.wd-btn-lg { height: 52px; padding: 0 26px; font-size: 14.5px; }
.wd-btn-arrow {
	display: inline-block; font-size: 16px;
	transition: transform .25s cubic-bezier(.2,.7,.2,1);
}
.wd-btn:hover .wd-btn-arrow { transform: translateX(3px); }


/* =====================================================
 * WD · HERO — .wd-hero-section
 * ===================================================== */
.wd-hero-section {
	--wd-hero-accent: #5B7CFF;
	position: relative;
	min-height: 88vh;
	overflow: hidden;
	display: flex; align-items: flex-end;
	padding: 96px 32px 80px;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
}
.wd-hero-bg { position: absolute; inset: 0; z-index: 0; }
.wd-hero-bg img,
.wd-hero-bg video {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: 100% !important; height: 100% !important;
	object-fit: cover !important;
	filter: saturate(1.05) contrast(1.02);
}

/* Hero video: prevents stutter/flash on initial load.
 * 1. The parent div's background-image is visible as a poster (inline CSS)
 * 2. Video starts with opacity 0
 * 3. When the canplay event fires, JS adds the .is-ready class → opacity 1 fade-in
 * Result: the poster is visible instantly, and it transitions smoothly once the video buffer is ready.
 */
.wd-hero-bg .wd-hero-video {
	opacity: 0;
	transition: opacity .8s cubic-bezier(.2,.7,.2,1);
}
.wd-hero-bg .wd-hero-video.is-ready {
	opacity: 1;
}
.wd-hero-bg::after {
	content: ""; position: absolute; inset: 0;
	background:
		/* Left-reading gradient: darkens the text area strongly, keeps the right side video clear.
		 * 0% → almost black (.92), 20% → dark (.78), 45% → medium (.4), 70% → 0 */
		linear-gradient(90deg, rgba(2,4,10,.92) 0%, rgba(5,9,17,.78) 20%, rgba(8,12,22,.48) 38%, rgba(10,15,26,.18) 56%, rgba(10,15,26,0) 75%),
		linear-gradient(180deg, rgba(10,15,26,.45) 0%, rgba(10,15,26,0) 30%, rgba(10,15,26,.25) 60%, rgba(10,15,26,.7) 100%),
		radial-gradient(900px 600px at 25% 70%, rgba(31,45,92,.5), transparent 60%),
		radial-gradient(800px 500px at 80% 30%, rgba(91,124,255,.18), transparent 60%);
	pointer-events: none;
}
@media (max-width: 768px) {
	/* On mobile, a softer overlay across the whole area instead of the left gradient — content is centered */
	.wd-hero-bg::after {
		background:
			linear-gradient(180deg, rgba(8,12,22,.55) 0%, rgba(10,15,26,.35) 30%, rgba(10,15,26,.45) 60%, rgba(10,15,26,.85) 100%),
			radial-gradient(900px 600px at 50% 50%, rgba(31,45,92,.4), transparent 70%);
	}
}
.wd-hero-gridtex {
	position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background-image:
		linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
	background-size: 64px 64px;
	mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, transparent 0%, #000 80%);
}

/* ============================================================
 * ARCHIVE HERO — if enabled from the Customizer, a grid texture like the hero
 * The section stays at its original 1320px max-width (text alignment is not broken),
 * ONLY the pseudo-elements spread edge-to-edge at 100vw viewport width.
 * ============================================================ */
body.wd-archive-grid .wd-svchero-section {
	position: relative;
	isolation: isolate;
	/* max-width: 1320px and margin: 0 auto come from the base — WE ARE NOT CHANGING THESE */
}
body.wd-archive-grid .wd-svchero-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(50% - 50vw);   /* go from the section's center to the viewport's left edge */
	width: 100vw;             /* spread to 100vw */
	z-index: -1;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
	background-size: 72px 72px;
	mask-image: linear-gradient(to bottom, transparent 0%, #000 10%, #000 90%, transparent 100%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 10%, #000 90%, transparent 100%);
}
body.wd-archive-grid .wd-svchero-section::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(50% - 50vw);
	width: 100vw;
	z-index: -2;
	pointer-events: none;
	background:
		radial-gradient(900px 500px at 15% 30%, rgba(31,45,92,.32), transparent 60%),
		radial-gradient(800px 450px at 85% 70%, rgba(91,124,255,.14), transparent 60%);
}
/* In the light variant, the accent vignette is less opaque */
body.wd-archive-grid .wd-svchero-section.is-light::after {
	background:
		radial-gradient(900px 500px at 15% 30%, rgba(31,45,92,.18), transparent 60%),
		radial-gradient(800px 450px at 85% 70%, rgba(91,124,255,.08), transparent 60%);
}
body.wd-archive-grid .wd-svchero-section.is-light::before {
	background-image:
		linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
	background-size: 72px 72px;
}
.wd-hero-content {
	position: relative; z-index: 2;
	width: 100%;
	max-width: 1320px; margin: 0 auto;
}
.wd-hero-eyebrow {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 7px 14px;
	border: 1px solid rgba(255,255,255,.22); border-radius: 999px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-ink-soft, #B6BDD0);
	margin-bottom: 28px;
	backdrop-filter: blur(8px);
	background: rgba(255,255,255,.04);
	letter-spacing: .06em; text-transform: uppercase;
}
.wd-hero-eyebrow-dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--wd-good, #3EE0A1);
	box-shadow: 0 0 12px rgba(62,224,161,.6);
}
.wd-hero-h1 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(48px, 6.4vw, 96px);
	font-weight: 600; letter-spacing: -.035em; line-height: 1.05;
	margin: 0 0 24px; color: #fff;
	max-width: 920px;
	text-shadow: 0 2px 30px rgba(0,0,0,.25);
}
.wd-hero-h1 em {
	font-style: normal;
	position: relative;
	white-space: nowrap;
	/* Gradient fill: orange → amber → gold. Solid color inside the characters. */
	background: linear-gradient(135deg, #EC7A1A 0%, #FF9530 30%, #FFB347 60%, #FFCB6B 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent !important;
	/* Slight glow — supports the gradient's vibrancy without overdoing it */
	filter: drop-shadow(0 2px 24px rgba(236,122,26,.28));
}
/* The old blue underline bar was removed — the gradient fill provides enough emphasis. */
.wd-hero-h1 em::after {
	content: none;
	display: none;
}
/* ROTATING WORDS — the changing word strip under h1 */
.wd-hero-rotate {
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
	margin: 22px 0 14px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 500;
	letter-spacing: -.01em;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.3;
}
.wd-hero-rotate-prefix { color: var(--wd-ink-soft); }
.wd-hero-rotate-words {
	position: relative;
	display: inline-block;
	min-width: 1ch;
	overflow: hidden;
	vertical-align: bottom;
}
.wd-hero-rotate-word {
	display: inline-block;
	color: var(--wd-warm, #EC7A1A);
	font-weight: 600;
	opacity: 0;
	transform: translateY(110%);
	transition: opacity .4s ease, transform .5s cubic-bezier(.2,.7,.2,1);
	position: absolute;
	left: 0;
	white-space: nowrap;
}
.wd-hero-rotate-word.is-active {
	opacity: 1;
	transform: translateY(0);
	position: relative; /* determines the container's height */
}
.wd-hero-rotate-word.is-out {
	opacity: 0;
	transform: translateY(-110%);
	position: absolute;
}
@media (prefers-reduced-motion: reduce) {
	.wd-hero-rotate-word { transition: none; }
}

.wd-hero-lead {
	font-size: 18px; color: var(--wd-ink-soft, #B6BDD0);
	max-width: 620px; margin: 0 0 36px; line-height: 1.55;
	text-shadow: 0 1px 12px rgba(0,0,0,.4);
}
.wd-hero-ctas {
	display: flex; gap: 12px; align-items: center;
	margin-bottom: 48px; flex-wrap: wrap;
}
.wd-hero-trust {
	display: flex; align-items: center; gap: 36px;
	padding-top: 32px; border-top: 1px solid rgba(255,255,255,.1);
	flex-wrap: wrap; max-width: 920px;
}
.wd-trust-item { display: flex; flex-direction: column; gap: 2px; }
.wd-trust-num {
	font-family: 'Inter Tight', sans-serif; font-size: 22px;
	font-weight: 600; color: #fff; letter-spacing: -.02em;
}
.wd-trust-suffix-good { color: var(--wd-good, #3EE0A1); }
.wd-trust-suffix-mute { color: var(--wd-ink-mute, #7A8398); font-size: 16px; }
.wd-trust-suffix-ink  { color: #fff; }
.wd-trust-label {
	font-size: 12px; color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .02em;
}


/* =====================================================
 * WD · CASES SLIDER — .wd-case-section
 * ===================================================== */
/* Bypasses the Cases Slider and Process Horizontal Elementor parents (column boxed 1140px)
   — full viewport width. This hack works even on existing Elementor pages,
   no demo re-import needed. */
.elementor-widget-wd_cases_slider,
.elementor-widget-wd_cases_slider > .elementor-widget-container,
.elementor-widget-wd_process_horiz,
.elementor-widget-wd_process_horiz > .elementor-widget-container {
	width: 100vw !important;
	max-width: 100vw !important;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	padding: 0 !important;
	margin: 0 !important;
}
.wd-case-section {
	--wd-case-accent: #EC7A1A;
	position: relative;
	padding: 120px 0 96px;
	overflow: hidden;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	width: 100%;
	max-width: 100vw;
}
.wd-case-head {
	display: flex; justify-content: space-between; align-items: flex-end;
	max-width: 1320px; margin: 0 auto 48px;
	padding: 0 32px; flex-wrap: wrap; gap: 24px;
}
.wd-case-head-l { max-width: 780px; }
.wd-case-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-accent, #5B7CFF);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px;
}
.wd-case-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px); font-weight: 600;
	letter-spacing: -.03em; line-height: 1.05;
	margin: 0 0 14px;
}
.wd-case-h2 em { font-style: normal; color: var(--wd-case-accent); }
.wd-case-sub { font-size: 17px; color: var(--wd-ink-soft, #B6BDD0); line-height: 1.6; margin: 0; }

.wd-case-controls { display: flex; align-items: center; gap: 14px; }
.wd-case-counter {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px; color: var(--wd-ink-soft, #B6BDD0);
	min-width: 54px;
}
.wd-case-counter .cur { color: var(--wd-ink, #F2F5FB); font-weight: 500; }
.wd-case-counter .sep { color: var(--wd-ink-mute, #7A8398); margin: 0 4px; }
.wd-case-arrows { display: flex; gap: 8px; }
.wd-case-arrow {
	width: 48px; height: 48px; border-radius: 50%;
	background: rgba(255,255,255,.06);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink, #F2F5FB);
	display: grid; place-items: center; cursor: pointer;
	font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 18px;
	backdrop-filter: blur(8px);
	transition: background .15s, color .15s, border-color .15s;
}
.wd-case-arrow:hover { background: rgba(255,255,255,.12); border-color: var(--wd-accent, #5B7CFF); }
.wd-case-arrow:disabled { opacity: .35; cursor: not-allowed; color: var(--wd-ink-mute, #7A8398); }
.wd-case-arrow:disabled:hover { background: rgba(255,255,255,.06); border-color: var(--wd-line-w-strong); }

.wd-case-track-wrap {
	position: relative; overflow: hidden;
	/* Since the section is full-width, the wrap padding (usually 32px) now faces the viewport edge.
	   Inside the track wrap, slides start from the beginning of the viewport — the user sees the whole slide. */
	padding-left: 32px; padding-right: 32px;
	width: 100%;
	box-sizing: border-box;
}
.wd-case-track {
	display: flex; gap: 24px;
	transition: transform .65s cubic-bezier(.2,.7,.2,1);
	cursor: grab;
	will-change: transform;
}
.wd-case-track.dragging { cursor: grabbing; transition: none; }
.wd-case-track.dragging * { user-select: none; pointer-events: none; }
.wd-case-slide {
	flex: 0 0 calc(100% - 24px);
	position: relative;
	/* No aspect-ratio on mobile — so the content below doesn't get clipped when the title is long,
	 * content-driven height + min-height. 16/10 / 16/9 on tablet and above */
	min-height: 520px;
	border-radius: 20px; overflow: hidden;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
}
/* Slide width tiers:
 *   <768px:    1 full slide (mobile), no aspect-ratio
 *   768-1199:  1+wide peek (~80vw, old monks pattern — 2 don't fit on medium screens) + 16/10
 *   ≥1200px:   2 full + 1 peek (~47vw, the target layout in the screenshot) + 16/9
 * Track edge-to-edge: flush with the viewport, giving the "hugging the edge" behavior the user wants. */
@media (min-width: 768px)  {
	.wd-case-slide {
		flex: 0 0 calc(80vw - 36px); min-width: 620px;
		aspect-ratio: 16/10;
		min-height: 0;
	}
}
@media (min-width: 1200px) {
	.wd-case-slide {
		flex: 0 0 calc(47vw - 16px);
		max-width: 920px;
		min-width: 540px;
		aspect-ratio: 16/9;
	}
}
@media (min-width: 1600px) {
	.wd-case-slide {
		flex: 0 0 calc(46vw - 16px);
		max-width: 1100px;
	}
}

.wd-case-slide-bg { position: absolute; inset: 0; z-index: 0; }
.wd-case-slide-bg img {
	width: 100%; height: 100%;
	object-fit: cover;
	filter: saturate(.8) contrast(.95) brightness(.7);
}
.wd-case-slide-fallback {
	position: absolute; inset: 0;
	background: linear-gradient(135deg, var(--wd-brand-navy) 0%, var(--wd-bg, #0A0F1A) 100%);
}
/* Overlay — bottom 60% is noticeably dark, vertical tint on the left edge (title side) */
.wd-case-slide::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background:
		linear-gradient(180deg,
			rgba(10,15,26,.35) 0%,
			rgba(10,15,26,.45) 30%,
			rgba(10,15,26,.85) 65%,
			rgba(10,15,26,.97) 100%),
		linear-gradient(90deg, rgba(10,15,26,.55) 0%, rgba(10,15,26,.15) 55%, transparent 100%);
	pointer-events: none;
}
.wd-case-slide-content {
	position: relative; z-index: 2;
	height: 100%; padding: 28px 28px 32px;
	display: flex; flex-direction: column; justify-content: space-between;
	gap: 24px;
}
@media (min-width: 768px) {
	.wd-case-slide-content { padding: 40px 44px; gap: 0; }
}
.wd-case-slide-top {
	display: flex; justify-content: space-between; align-items: flex-start;
	gap: 24px;
}
.wd-case-chip {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; padding: 6px 12px; border-radius: 999px;
	background: rgba(10,15,26,.6); backdrop-filter: blur(12px);
	border: 1px solid rgba(255,255,255,.22);
	letter-spacing: .06em; text-transform: uppercase;
	color: #fff;
}
.wd-case-num {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px; color: rgba(255,255,255,.85);
	letter-spacing: .04em;
	text-shadow: 0 1px 8px rgba(0,0,0,.7);
}
.wd-case-slide-bottom {
	display: flex; flex-direction: column; gap: 20px;
	max-width: 640px;
}
.wd-case-slide-bottom h3 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(28px, 3.4vw, 44px); font-weight: 600;
	letter-spacing: -.03em; line-height: 1.05; margin: 0; color: #fff;
	text-shadow: 0 2px 18px rgba(0,0,0,.65), 0 1px 4px rgba(0,0,0,.5);
}
.wd-case-slide-bottom h3 em {
	font-style: normal;
	color: var(--wd-case-accent);
	text-shadow: 0 2px 18px rgba(0,0,0,.65);
}
.wd-case-metrics-row {
	display: flex; gap: 32px; flex-wrap: wrap;
	padding-top: 16px; border-top: 1px solid rgba(255,255,255,.15);
}
.wd-case-metric { display: flex; flex-direction: column; gap: 2px; }
.wd-case-metric-val {
	font-family: 'Inter Tight', sans-serif;
	font-size: 24px; font-weight: 600; letter-spacing: -.02em;
	color: #fff; line-height: 1;
	text-shadow: 0 2px 12px rgba(0,0,0,.7);
}
.wd-case-metric-val.pos { color: var(--wd-good, #3EE0A1); }
.wd-case-metric-lbl {
	font-size: 11.5px; color: var(--wd-ink-soft, #B6BDD0);
	text-transform: uppercase; letter-spacing: .08em;
	text-shadow: 0 1px 8px rgba(0,0,0,.7);
}
.wd-case-cta {
	display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
	margin-top: 8px;
}
.wd-case-quote-line {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-ink-soft, #B6BDD0);
	letter-spacing: .05em;
	text-shadow: 0 1px 8px rgba(0,0,0,.7);
}

.wd-case-dots {
	display: flex; justify-content: center; gap: 8px;
	margin-top: 32px;
}
.wd-case-dot {
	width: 32px; height: 3px;
	background: rgba(255,255,255,.16);
	border: 0; border-radius: 999px; padding: 0; cursor: pointer;
	transition: background .2s, width .25s;
}
.wd-case-dot.active {
	background: var(--wd-accent, #5B7CFF);
	width: 64px;
}


/* =====================================================
 * WD · PROCESS HORIZONTAL — .wd-proc-section
 * Sticky pin + horizontal scroll, with data-wd-horiz-scroll markup
 * ===================================================== */
.wd-proc-section {
	--wd-proc-accent: #5B7CFF;
	position: relative;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	border-top: 1px solid var(--wd-line-w);
}
.wd-proc-shell {
	height: 500vh;
	position: relative;
}
.wd-proc-pin {
	position: sticky; top: 0;
	height: 100vh; overflow: hidden;
	display: flex; flex-direction: column; justify-content: center;
}
.wd-proc-head {
	position: absolute; top: 0; left: 50%;
	transform: translateX(-50%);
	width: 100%; max-width: 1320px;
	padding: 80px 32px 0;
	z-index: 5;
	display: flex; justify-content: space-between; align-items: flex-end;
	gap: 24px; flex-wrap: wrap;
}
.wd-proc-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-proc-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px;
}
.wd-proc-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(28px, 3.6vw, 48px);
	font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
	margin: 0; color: var(--wd-ink, #F2F5FB);
}
.wd-proc-h2 em { font-style: normal; color: var(--wd-proc-accent); }
.wd-proc-progress {
	display: flex; align-items: center; gap: 12px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px; color: var(--wd-ink-soft, #B6BDD0);
}
.wd-proc-progress-bar {
	width: 140px; height: 2px;
	background: rgba(255,255,255,.1);
	border-radius: 2px; overflow: hidden; position: relative;
}
.wd-proc-progress-fill {
	position: absolute; left: 0; top: 0; bottom: 0;
	background: var(--wd-proc-accent);
	width: 0%;
	transition: width .15s linear;
}
.wd-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

.wd-proc-track {
	display: flex;
	align-items: flex-start; /* cards stick to the top edge, no overlap with head */
	gap: 32px;
	padding: 260px 8vw 80px; /* top 260px = head (eyebrow + h2 + progress + spacing) */
	height: 100%;
	will-change: transform;
}
.wd-proc-card {
	flex: 0 0 auto;
	width: min(72vw, 640px); height: 520px;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 20px;
	padding: 48px 40px;
	display: flex; flex-direction: column; gap: 24px;
	position: relative; overflow: hidden;
}
.wd-proc-card::before {
	content: ""; position: absolute;
	top: -20%; right: -20%;
	width: 60%; height: 60%;
	background: radial-gradient(circle, var(--wd-accent-soft) 0%, transparent 60%);
	pointer-events: none;
}
.wd-proc-num {
	font-family: 'Inter Tight', sans-serif;
	font-size: 200px; font-weight: 700;
	color: rgba(91,124,255,.06);
	position: absolute;
	bottom: -20px; right: 24px;
	line-height: 1; letter-spacing: -.05em;
	pointer-events: none;
}
.wd-proc-stage {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(91,124,255,.12);
	border: 1px solid rgba(91,124,255,.3);
	color: var(--wd-proc-accent);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
	width: fit-content;
}
.wd-proc-stage::before {
	content: ""; width: 5px; height: 5px;
	border-radius: 50%; background: currentColor;
}
.wd-proc-card h3 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 42px; font-weight: 600;
	letter-spacing: -.03em; line-height: 1;
	color: #fff; position: relative; margin: 0;
}
.wd-proc-card p {
	font-size: 16.5px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.55; max-width: 480px;
	position: relative; margin: 0;
}
.wd-proc-bullets {
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-direction: column; gap: 8px;
	font-size: 14px;
	color: var(--wd-ink-soft, #B6BDD0);
	position: relative;
}
.wd-proc-bullets li {
	display: flex; align-items: flex-start; gap: 10px;
}
.wd-proc-bullets li::before {
	content: "→";
	color: var(--wd-proc-accent);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-weight: 500; flex-shrink: 0; margin-top: 1px;
}
.wd-proc-meta {
	margin-top: auto;
	display: flex; align-items: center; gap: 20px;
	padding-top: 24px;
	border-top: 1px solid var(--wd-line-w);
	position: relative; flex-wrap: wrap;
}
.wd-proc-meta-item { display: flex; flex-direction: column; gap: 2px; }
.wd-proc-meta-item .v {
	font-family: 'Inter Tight', sans-serif;
	font-size: 18px; font-weight: 600;
	color: #fff; letter-spacing: -.01em;
}
.wd-proc-meta-item .l {
	font-size: 11px;
	color: var(--wd-ink-mute, #7A8398);
	text-transform: uppercase; letter-spacing: .06em;
}
.wd-proc-hint {
	position: absolute; bottom: 12px;
	left: 50%; transform: translateX(-50%);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .12em; text-transform: uppercase;
	z-index: 5;
	display: flex; align-items: center; gap: 10px;
	padding: 6px 14px;
	background: rgba(10,15,26,.5);
	backdrop-filter: blur(8px);
	border: 1px solid var(--wd-line-w);
	border-radius: 999px;
}

/* Process: adaptive card height and padding for small viewports (under 1080px) */
@media (max-height: 900px) {
	.wd-proc-track { padding-top: 220px !important; padding-bottom: 70px !important; }
	.wd-proc-card { height: 460px !important; padding: 36px 32px !important; }
	.wd-proc-card h3 { font-size: 36px !important; }
}
@media (max-height: 800px) {
	.wd-proc-track { padding-top: 180px !important; padding-bottom: 60px !important; }
	.wd-proc-card { height: 420px !important; gap: 16px !important; }
	.wd-proc-card h3 { font-size: 32px !important; }
}

/* On mobile (≤767px) the progress bar falls below the title and overlaps the card —
 * head stacks vertically on small screens, progress bar hidden (the card's STAGE badge already shows progress) */
@media (max-width: 767px) {
	.wd-proc-head {
		flex-direction: column;
		align-items: flex-start;
		padding: 60px 24px 0 !important;
		gap: 12px;
	}
	.wd-proc-progress { display: none; }
	.wd-proc-track { padding-top: 240px !important; padding-left: 5vw !important; padding-right: 5vw !important; }
	.wd-proc-card { width: min(82vw, 520px) !important; padding: 32px 28px !important; }
	.wd-proc-card h3 { font-size: 32px !important; }
	.wd-proc-card p { font-size: 15px !important; }
}
.wd-proc-hint::before, .wd-proc-hint::after {
	content: ""; width: 24px; height: 1px;
	background: var(--wd-ink-mute, #7A8398);
}


/* =====================================================
 * WD · CTA BLOCK — .wd-cta-section (conditional image)
 * ===================================================== */
.wd-cta-section {
	--wd-cta-accent: #5B7CFF;
	padding: 120px 0;
	position: relative; overflow: hidden;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
}

/* VARYANT A — gradient card (image yok) */
.wd-cta-card {
	max-width: 980px;
	margin: 0 32px;
	margin-left: auto; margin-right: auto;
	background: linear-gradient(180deg, var(--wd-bg-card, #131D33) 0%, var(--wd-bg-soft, #0F1729) 100%);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 20px;
	padding: 80px 64px;
	text-align: center;
	position: relative; overflow: hidden;
}
.wd-cta-card::before {
	content: ""; position: absolute;
	top: -200px; left: 50%; transform: translateX(-50%);
	width: 600px; height: 400px;
	background: radial-gradient(ellipse, rgba(91,124,255,.25), transparent 60%);
	pointer-events: none;
}
.wd-cta-card::after {
	content: ""; position: absolute;
	bottom: -100px; right: -100px;
	width: 300px; height: 300px;
	background: radial-gradient(circle, rgba(236,122,26,.12), transparent 60%);
	pointer-events: none;
}
.wd-cta-tag-text {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-cta-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 18px;
	position: relative;
}
.wd-cta-card .wd-cta-h2 {
	margin-bottom: 14px;
	position: relative;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
	color: #fff;
}
.wd-cta-card .wd-cta-body {
	color: var(--wd-ink-soft, #B6BDD0);
	margin-bottom: 32px;
	font-size: 17px;
	position: relative;
	max-width: 560px;
	margin-left: auto; margin-right: auto;
}
.wd-cta-card .wd-btn { position: relative; }

/* VARYANT B — cinematic image */
.wd-cta-card-image {
	max-width: 1320px;
	margin: 0 32px;
	margin-left: auto; margin-right: auto;
	position: relative;
	border-radius: 20px; overflow: hidden;
	border: 1px solid var(--wd-line-w-strong);
	min-height: 520px;
	display: flex; flex-direction: column;
	padding: 72px 64px;
}
.wd-cta-card-image.wd-cta-align-left { justify-content: flex-end; text-align: left; }
.wd-cta-card-image.wd-cta-align-center { justify-content: center; text-align: center; align-items: center; }
.wd-cta-bg { position: absolute; inset: 0; z-index: 0; }
.wd-cta-bg img {
	width: 100%; height: 100%; object-fit: cover;
	filter: saturate(1.05) contrast(1.02);
}
.wd-cta-card-image::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background:
		linear-gradient(180deg, rgba(10,15,26,.1) 0%, rgba(10,15,26,.22) 35%, rgba(10,15,26,.82) 72%, rgba(10,15,26,.97) 100%),
		linear-gradient(90deg, rgba(10,15,26,.55) 0%, rgba(10,15,26,.15) 50%, transparent 100%);
	pointer-events: none;
}
.wd-cta-card-image .wd-cta-content {
	position: relative; z-index: 2;
	max-width: 640px;
}
.wd-cta-img-tag {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 6px 12px;
	border: 1px solid rgba(255,255,255,.22);
	border-radius: 999px;
	font-size: 11px;
	color: var(--wd-ink-soft, #B6BDD0);
	margin-bottom: 24px;
	backdrop-filter: blur(8px);
	background: rgba(255,255,255,.05);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	letter-spacing: .08em; text-transform: uppercase;
}
.wd-cta-img-tag > span:first-child {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--wd-good, #3EE0A1);
	box-shadow: 0 0 10px rgba(62,224,161,.5);
	display: inline-block;
}
.wd-cta-card-image .wd-cta-h2 {
	margin-bottom: 16px;
	color: #fff;
	text-shadow: 0 2px 20px rgba(0,0,0,.3);
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
}
.wd-cta-card-image .wd-cta-body {
	color: var(--wd-ink-soft, #B6BDD0);
	margin-bottom: 32px;
	font-size: 17px;
	max-width: 520px;
	text-shadow: 0 1px 10px rgba(0,0,0,.4);
}


/* =====================================================
 * WD · FOOTER CTA BAR — .wd-foot-cta-bar
 * Vamtam-style large top CTA block
 * ===================================================== */
.wd-foot-cta-bar {
	--wd-foot-accent: #5B7CFF;
	padding: 80px 0;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	background: linear-gradient(180deg, transparent 0%, rgba(15,23,41,.4) 60%, rgba(15,23,41,.85) 100%);
}
.wd-foot-cta-bar--bordered { border-top: 1px solid var(--wd-line-w); }

.wd-foot-cta-grid {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
	display: grid; grid-template-columns: 1fr;
	gap: 32px; align-items: end;
}
@media (min-width: 900px) {
	.wd-foot-cta-grid { grid-template-columns: 7fr 5fr; }
}
.wd-foot-cta-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-foot-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 14px;
}
.wd-foot-cta-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(36px, 4.4vw, 64px);
	font-weight: 600; line-height: 1.05;
	letter-spacing: -.03em;
	color: #fff;
	max-width: 640px;
	margin: 0;
}
.wd-foot-cta-h2 em { font-style: normal; color: var(--wd-foot-accent); }

.wd-foot-cta-r {
	display: flex; flex-direction: column;
	gap: 18px; align-items: flex-start;
}
@media (min-width: 900px) { .wd-foot-cta-r { align-items: flex-end; } }
.wd-foot-cta-tagline {
	font-size: 15px;
	color: var(--wd-ink-soft, #B6BDD0);
	max-width: 380px;
	margin: 0;
}
@media (min-width: 900px) { .wd-foot-cta-tagline { text-align: right; } }
.wd-foot-cta-actions {
	display: flex; gap: 10px; flex-wrap: wrap;
}


/* =====================================================
 * WD · SERVICE DETAIL HERO — .wd-svchero-section
 * LOLO-style: large title on the left + video/image tile on the right + stats below
 * ===================================================== */
.wd-svchero-section {
	--wd-svchero-accent: #5B7CFF;
	padding: 140px 32px 96px;
	max-width: 1320px;
	margin: 0 auto;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	position: relative;
}
.wd-svchero-crumb {
	display: flex; align-items: center; gap: 12px;
	margin-bottom: 32px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .1em; text-transform: uppercase;
	flex-wrap: wrap;
}
.wd-svchero-crumb span { color: var(--wd-ink-soft, #B6BDD0); }
.wd-svchero-crumb .here { color: var(--wd-ink, #F2F5FB); }
.wd-svchero-crumb .sep { color: var(--wd-ink-mute, #7A8398); }

.wd-svchero-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	align-items: end;
}
@media (min-width: 1024px) {
	.wd-svchero-grid {
		grid-template-columns: 7fr 5fr;
		gap: 80px;
		align-items: center;
	}
}

.wd-svchero-pill {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-svchero-accent);
	letter-spacing: .1em; text-transform: uppercase;
	display: inline-flex; align-items: center; gap: 8px;
	margin-bottom: 24px;
	padding: 6px 12px;
	border: 1px solid rgba(91,124,255,.32);
	background: rgba(91,124,255,.08);
	border-radius: 999px;
}
.wd-svchero-pill::before {
	content: ""; width: 5px; height: 5px;
	border-radius: 50%; background: var(--wd-svchero-accent);
}

.wd-svchero-h1 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(56px, 8vw, 128px);
	font-weight: 600;
	letter-spacing: -.045em;
	line-height: 0.95;
	margin: 0;
	color: var(--wd-ink, #F2F5FB);
}
.wd-svchero-h1 em {
	font-style: normal;
	color: var(--wd-svchero-accent);
	position: relative;
	display: inline-block;
}
.wd-svchero-h1 em::after {
	content: ""; position: absolute;
	left: 0; right: 0; bottom: 8px;
	height: 14px;
	background: rgba(91,124,255,.12);
	z-index: -1;
	border-radius: 2px;
}

.wd-svchero-lead {
	font-size: 18px;
	color: var(--wd-ink-soft, #B6BDD0);
	max-width: 520px;
	line-height: 1.55;
	margin: 32px 0 0;
}

/* ============================================================
 * LIGHT HEADER VARIANT — .wd-svchero-section.is-light
 * Compact header for archive pages. Simple, clearly a heading, doesn't take up much space.
 * Usage: blog, services, case studies, shop archives.
 * ============================================================ */
.wd-svchero-section.is-light {
	padding: 110px 32px 36px;
	border-bottom: 1px solid var(--wd-line-w);
	margin-bottom: 8px;
}
.wd-svchero-section.is-light .wd-svchero-crumb {
	margin-bottom: 18px;
	font-size: 11px;
}
.wd-svchero-section.is-light .wd-svchero-h1 {
	font-size: clamp(32px, 4.4vw, 56px);
	letter-spacing: -.03em;
	line-height: 1.1;
	font-weight: 600;
}
.wd-svchero-section.is-light .wd-svchero-h1 em::after {
	display: none; /* Disable underline glow — too much for a compact header */
}
.wd-svchero-section.is-light .wd-svchero-lead {
	font-size: 15.5px;
	max-width: 640px;
	margin: 14px 0 0;
	line-height: 1.6;
}

.wd-svchero-r { position: relative; }
.wd-svchero-tile {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w-strong);
	box-shadow: 0 30px 80px -20px rgba(0,0,0,.5), 0 0 0 1px rgba(91,124,255,.12);
}
.wd-svchero-asp-4-5  { aspect-ratio: 4/5; }
.wd-svchero-asp-3-4  { aspect-ratio: 3/4; }
.wd-svchero-asp-1-1  { aspect-ratio: 1/1; }
.wd-svchero-asp-16-9 { aspect-ratio: 16/9; }

.wd-svchero-tile video,
.wd-svchero-tile img {
	position: absolute; inset: 0;
	width: 100%; height: 100%; object-fit: cover; display: block;
}
.wd-svchero-tile::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(180deg,
		transparent 0%,
		rgba(10,15,26,.3) 60%,
		rgba(10,15,26,.7) 100%);
	pointer-events: none;
}
.wd-svchero-tile-corner {
	position: absolute; top: 20px; left: 20px; z-index: 2;
	padding: 5px 11px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; color: #fff;
	background: rgba(0,0,0,.45);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 999px;
	letter-spacing: .08em; text-transform: uppercase;
}
.wd-svchero-tile-meta {
	position: absolute; bottom: 24px;
	left: 24px; right: 24px; z-index: 2;
	display: flex; justify-content: space-between; align-items: flex-end;
	color: #fff;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
}
.wd-svchero-tile-meta .meta-l { display: flex; align-items: center; gap: 10px; }
.wd-svchero-tile-meta .dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--wd-svchero-accent);
	box-shadow: 0 0 12px var(--wd-svchero-accent);
	animation: wd-svchero-pulse 1.8s ease-in-out infinite;
}
@keyframes wd-svchero-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%      { opacity: .6; transform: scale(.85); }
}

/* Bottom stats strip */
.wd-svchero-stats {
	margin-top: 96px;
	padding-top: 48px;
	border-top: 1px solid var(--wd-line-w);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}
@media (min-width: 900px) {
	.wd-svchero-stats { grid-template-columns: repeat(4, 1fr); }
}
.wd-svchero-stat {
	display: flex; flex-direction: column; gap: 6px;
}
.wd-svchero-stat .num {
	font-family: 'Inter Tight', sans-serif;
	font-size: 36px; font-weight: 600;
	letter-spacing: -.025em; line-height: 1;
	color: #fff;
}
.wd-svchero-stat .lbl {
	font-size: 12.5px;
	color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .04em;
	max-width: 160px;
	line-height: 1.4;
}


/* =====================================================
 * WD · CAPABILITIES — .wd-cap-section
 * Minimal border-only grid
 * ===================================================== */
.wd-cap-section {
	--wd-cap-accent: #5B7CFF;
	padding: 120px 32px;
	max-width: 1320px;
	margin: 0 auto;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	border-top: 1px solid var(--wd-line-w);
}
.wd-cap-head { margin-bottom: 64px; max-width: 780px; }
.wd-cap-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-cap-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 14px;
}
.wd-cap-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
	margin: 0 0 14px;
}
.wd-cap-h2 em { font-style: normal; color: var(--wd-cap-accent); }
.wd-cap-sub {
	font-size: 17px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.55;
	margin: 0;
}

.wd-cap-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-top: 1px solid var(--wd-line-w);
}
@media (min-width: 768px) {
	.wd-cap-cols-2 .wd-cap-grid { grid-template-columns: repeat(2, 1fr); }
	.wd-cap-cols-3 .wd-cap-grid { grid-template-columns: repeat(2, 1fr); }
	.wd-cap-cols-4 .wd-cap-grid { grid-template-columns: repeat(2, 1fr); }
	.wd-cap-grid > .wd-cap-item { border-bottom: 1px solid var(--wd-line-w); border-right: 1px solid var(--wd-line-w); }
	.wd-cap-cols-2 .wd-cap-grid > .wd-cap-item:nth-child(2n) { border-right: 0; }
}
@media (min-width: 1024px) {
	.wd-cap-cols-3 .wd-cap-grid { grid-template-columns: repeat(3, 1fr); }
	.wd-cap-cols-3 .wd-cap-grid > .wd-cap-item:nth-child(2n) { border-right: 1px solid var(--wd-line-w); }
	.wd-cap-cols-3 .wd-cap-grid > .wd-cap-item:nth-child(3n) { border-right: 0; }
	.wd-cap-cols-4 .wd-cap-grid { grid-template-columns: repeat(4, 1fr); }
	.wd-cap-cols-4 .wd-cap-grid > .wd-cap-item:nth-child(2n) { border-right: 1px solid var(--wd-line-w); }
	.wd-cap-cols-4 .wd-cap-grid > .wd-cap-item:nth-child(4n) { border-right: 0; }
}
.wd-cap-item {
	padding: 40px 36px;
	display: flex; flex-direction: column; gap: 14px;
	transition: background .2s;
}
.wd-cap-item:hover { background: rgba(255,255,255,.02); }
.wd-cap-num {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .06em;
}
.wd-cap-item h3 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 22px; font-weight: 600;
	letter-spacing: -.02em; line-height: 1.15;
	margin: 0;
}
.wd-cap-item p {
	font-size: 14.5px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6;
	margin: 0;
}


/* =====================================================
 * WD · FAQ — .wd-faq-section
 * ===================================================== */
.wd-faq-section {
	--wd-faq-accent: #5B7CFF;
	padding: 120px 32px;
	max-width: 1320px;
	margin: 0 auto;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
	border-top: 1px solid var(--wd-line-w);
}
.wd-faq-head { margin-bottom: 48px; max-width: 780px; }
.wd-faq-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-faq-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 14px;
}
.wd-faq-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
	margin: 0;
}
.wd-faq-h2 em { font-style: normal; color: var(--wd-faq-accent); }

.wd-faq-list { max-width: 820px; }
.wd-faq-layout-double .wd-faq-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	max-width: 100%;
}
@media (min-width: 768px) {
	.wd-faq-layout-double .wd-faq-list { grid-template-columns: repeat(2, 1fr); }
}
.wd-faq-list details {
	border-bottom: 1px solid var(--wd-line-w);
	padding: 24px 0;
	cursor: pointer;
}
.wd-faq-list details:first-of-type { border-top: 1px solid var(--wd-line-w); }
.wd-faq-layout-double .wd-faq-list details {
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	padding: 20px 22px;
}
.wd-faq-layout-double .wd-faq-list details:first-of-type { border-top: 1px solid var(--wd-line-w); }
.wd-faq-list summary {
	list-style: none;
	display: flex; align-items: flex-start; justify-content: space-between;
	gap: 20px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 19px; font-weight: 500;
	color: var(--wd-ink, #F2F5FB);
	letter-spacing: -.015em;
	line-height: 1.4;
}
.wd-faq-list summary::-webkit-details-marker { display: none; }
.wd-faq-list summary::after {
	content: "+";
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 22px;
	color: var(--wd-faq-accent);
	font-weight: 300;
	transition: transform .25s;
	flex-shrink: 0;
}
.wd-faq-list details[open] summary::after { content: "−"; }
.wd-faq-list details p {
	margin-top: 14px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.65;
	font-size: 15.5px;
	max-width: 680px;
}


/* =====================================================
 * WD · STATS STRIP — .wd-stats-strip
 * Standalone compact stats strip
 * ===================================================== */
.wd-stats-strip {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	font-family: 'Inter', sans-serif;
	color: var(--wd-ink, #F2F5FB);
}
.wd-stats-strip.wd-stats-divider {
	padding-top: 48px;
	border-top: 1px solid var(--wd-line-w);
}
@media (min-width: 700px)  { .wd-stats-cols-2.wd-stats-strip { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 700px)  { .wd-stats-cols-3.wd-stats-strip { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px)  { .wd-stats-cols-4.wd-stats-strip { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .wd-stats-cols-5.wd-stats-strip { grid-template-columns: repeat(5, 1fr); } }



/* ============================================================
 * SITE FOOTER (footer.php) — vamtam-style 4-column layout + large decorative brand mark + legal
 * ============================================================ */
.site-footer {
	position: relative;
	margin-top: 120px;
	padding-top: 1px;
	color: var(--wd-ink-soft);
	overflow: hidden;
	background: linear-gradient(180deg, transparent 0%, rgba(15,23,41,.6) 30%, rgba(15,23,41,.95) 100%);
}
.site-footer::before {
	content: ""; position: absolute;
	top: 0; left: 50%; transform: translateX(-50%);
	width: 60%; height: 1px;
	background: linear-gradient(90deg, transparent, var(--wd-line-w-strong), transparent);
}
.site-footer-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

/* 4-column grid */
.foot-cols {
	padding: 64px 0 80px;
	display: grid; grid-template-columns: 1fr;
	gap: 48px;
}
@media (min-width: 700px)  { .foot-cols { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .foot-cols { grid-template-columns: 2.2fr 1fr 1fr 1fr; gap: 64px; } }

.foot-col { display: flex; flex-direction: column; gap: 18px; }
.foot-col h4 {
	font-family: var(--wd-font-mono);
	font-size: 11.5px;
	color: var(--wd-ink-mute);
	letter-spacing: .12em; text-transform: uppercase;
	font-weight: 500; margin: 0 0 6px;
}
.foot-col ul {
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-direction: column; gap: 11px;
}
.foot-col li { list-style: none; margin: 0; }
.foot-col li a {
	font-size: 14px;
	color: var(--wd-ink-soft);
	transition: color .15s;
}
.foot-col li a:hover { color: var(--wd-ink); }

/* Brand col */
.foot-brand { display: flex; flex-direction: column; gap: 18px; max-width: 380px; }
.foot-brand-mark {
	display: flex; align-items: center; gap: 10px;
	color: var(--wd-ink); font-weight: 600;
	font-size: 15px; letter-spacing: -.01em;
	text-decoration: none;
}
.foot-brand p {
	font-size: 14.5px;
	color: var(--wd-ink-soft);
	line-height: 1.6; margin: 0;
}

/* Newsletter */
.foot-newsletter {
	display: flex; gap: 6px; margin-top: 8px;
}
.foot-newsletter input {
	flex: 1; height: 42px;
	border: 1px solid var(--wd-line-w-strong);
	background: rgba(255,255,255,.04);
	border-radius: 8px; padding: 0 14px;
	color: var(--wd-ink);
	font-family: var(--wd-font-body); font-size: 13.5px;
	outline: none; margin: 0;
}
.foot-newsletter input::placeholder { color: var(--wd-ink-mute); }
.foot-newsletter input:focus { border-color: var(--wd-accent); background: rgba(255,255,255,.06); }
.foot-newsletter button {
	height: 42px; padding: 0 16px;
	background: var(--wd-accent-deep);
	color: #fff; border: 0;
	border-radius: 8px;
	font-size: 13px; font-weight: 500;
	cursor: pointer;
	font-family: var(--wd-font-body);
	transition: background .15s;
}
.foot-newsletter button:hover { background: #3A6BFF; }

/* Social icon row */
.foot-social { display: flex; gap: 8px; margin-top: 6px; }
.soc-btn {
	width: 38px; height: 38px;
	border: 1px solid var(--wd-line-w-strong);
	background: rgba(255,255,255,.03);
	border-radius: 50%;
	display: grid; place-items: center;
	color: var(--wd-ink-soft);
	text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}
.soc-btn:hover {
	background: rgba(255,255,255,.08);
	color: var(--wd-ink);
	border-color: var(--wd-accent);
}
.soc-btn svg { width: 16px; height: 16px; }

/* Large decorative brand name */
.foot-mark {
	padding-top: 24px;
	font-family: var(--wd-font-display);
	font-size: clamp(72px, 16vw, 260px);
	font-weight: 700;
	letter-spacing: -.06em;
	line-height: 0.86;
	color: transparent;
	-webkit-text-stroke: 1px rgba(91,124,255,.18);
	user-select: none;
	pointer-events: none;
	overflow: hidden;
	margin-bottom: -3vw;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
}
.foot-mark-track {
	display: flex;
	gap: 2ch;
	white-space: nowrap;
	animation: wd-foot-marquee 40s linear infinite;
	width: max-content;
}
.foot-mark-item { display: inline-block; }
@keyframes wd-foot-marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}
.foot-mark-track:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
	.foot-mark-track { animation: none; }
}

/* Payment logos row (iyzico requirement) */
.foot-payments {
	border-top: 1px solid var(--wd-line-w);
	background: rgba(0,0,0,.15);
	padding: 16px 0;
}
.foot-payments-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px 20px;
}
.foot-payments-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wd-paper, #FAFAF7);
	letter-spacing: 0.01em;
}
.foot-payments-lock {
	width: 16px;
	height: 16px;
	color: #EC7A1A;
	flex-shrink: 0;
}
.foot-payments-list {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.foot-pay {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 32px;
	border-radius: 6px;
	background: #fff;
	border: 1px solid rgba(255,255,255,0.85);
	padding: 5px 7px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0,0,0,0.18);
}
.foot-pay svg { display: block; width: 100%; height: 100%; }
.foot-payments-note {
	font-size: 13px;
	color: var(--wd-ink-mute, rgba(255,255,255,0.62));
	letter-spacing: 0.005em;
}
.foot-payments-note a {
	color: var(--wd-paper, #FAFAF7);
	text-decoration: none;
	font-weight: 600;
	border-bottom: 1px solid rgba(255,255,255,0.18);
	padding-bottom: 1px;
	transition: border-color .15s ease;
}
.foot-payments-note a:hover { border-color: #EC7A1A; }
@media (max-width: 720px) {
	.foot-payments-inner { gap: 10px 14px; }
	.foot-pay { width: 44px; height: 28px; }
	.foot-payments-note { font-size: 12px; }
}

/* Bottom legal strip */
.foot-legal {
	border-top: 1px solid var(--wd-line-w);
	padding: 22px 0;
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	background: rgba(0,0,0,.2);
}
.foot-legal-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
	display: flex; justify-content: space-between;
	align-items: center; gap: 18px;
	flex-wrap: wrap;
}
.foot-legal a {
	color: var(--wd-ink-mute);
	transition: color .15s;
}
.foot-legal a:hover { color: var(--wd-ink-soft); }
.foot-legal-l {
	display: flex; align-items: center;
	gap: 18px; flex-wrap: wrap;
	font-family: var(--wd-font-mono);
}
.foot-legal-r {
	display: flex; align-items: center;
	gap: 16px; flex-wrap: wrap;
}
.foot-legal-r .sep { color: var(--wd-line-w-strong); }
.foot-status {
	display: inline-flex; align-items: center; gap: 7px;
	color: var(--wd-good);
	font-family: var(--wd-font-mono);
}
.foot-status::before {
	content: "";
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--wd-good);
	box-shadow: 0 0 0 3px rgba(62,224,161,.2);
}
/* Status color variants selected from Customizer */
.foot-status.is-warn        { color: #FFC107; }
.foot-status.is-warn::before { background: #FFC107; box-shadow: 0 0 0 3px rgba(255,193,7,.25); }
.foot-status.is-down        { color: #E04848; }
.foot-status.is-down::before { background: #E04848; box-shadow: 0 0 0 3px rgba(224,72,72,.25); }

/* Old .wd-footer minimal is no longer used — hide as fallback */
.wd-footer:not(.site-footer) { display: none; }


/* ============================================================
 * WD MANIFESTO — minimal centered single-sentence paragraph
 * ============================================================ */
.wd-manifesto {
	--wd-manifesto-accent: #5B7CFF;
	position: relative;
	padding: 140px 32px;
	max-width: 1320px;
	margin: 0 auto;
	text-align: center;
	color: var(--wd-ink);
	font-family: var(--wd-font-body);
	border-top: 1px solid var(--wd-line-w);
	overflow: hidden;
}

/* Ultra-large outline backdrop — scrolls continuously horizontal like the footer marquee */
.wd-manifesto-backdrop-wrap {
	position: absolute;
	left: 0; right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
	width: 100%;
	user-select: none;
}
.wd-manifesto-backdrop-track {
	display: inline-flex;
	gap: 2ch;
	align-items: center;
	white-space: nowrap;
	width: max-content;
	animation: wd-manifesto-marquee 40s linear infinite;
	will-change: transform;
}
.wd-manifesto-backdrop-word,
.wd-manifesto-backdrop-sep {
	display: inline-block;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 700;
	font-size: clamp(140px, 22vw, 320px);
	letter-spacing: -.04em;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(255,255,255,.08);
	text-stroke: 1.5px rgba(255,255,255,.08);
}
.wd-manifesto-backdrop-sep {
	-webkit-text-stroke: 1.5px rgba(255,255,255,.05);
	color: transparent;
}
@keyframes wd-manifesto-marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.wd-manifesto-backdrop-track { animation: none; }
}

/* Keep the manifesto's content elements ABOVE the backdrop */
.wd-manifesto > .wd-manifesto-eyebrow,
.wd-manifesto > .wd-manifesto-body,
.wd-manifesto > .wd-manifesto-sub {
	position: relative;
	z-index: 1;
}

/* ============================================================
 * LIGHT VARIANT — Cream background + dark text (editorial break)
 * Rhythm breaker between sections — Stripe/Anthropic pattern.
 * ============================================================ */
.wd-manifesto.is-light {
	background: #F4F2EC;
	color: #1A1A1A;
	max-width: none;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	border-top: 1px solid rgba(0,0,0,.08);
	border-bottom: 1px solid rgba(0,0,0,.08);
	padding-left: 32px;
	padding-right: 32px;
}
.wd-manifesto.is-light .wd-manifesto-eyebrow {
	color: rgba(0,0,0,.55);
}
.wd-manifesto.is-light .wd-manifesto-body {
	color: #1A1A1A;
}
.wd-manifesto.is-light .wd-manifesto-body strong {
	color: #000;
}
.wd-manifesto.is-light .wd-manifesto-body em {
	color: var(--wd-accent-deep, #2A5BFF) !important;
}
.wd-manifesto.is-light .wd-manifesto-sub {
	color: rgba(0,0,0,.55);
}
/* Backdrop word on light background — dark outline */
.wd-manifesto.is-light .wd-manifesto-backdrop-word,
.wd-manifesto.is-light .wd-manifesto-backdrop-sep {
	-webkit-text-stroke-color: rgba(0,0,0,.08);
	text-stroke-color: rgba(0,0,0,.08);
}
.wd-manifesto.is-light .wd-manifesto-backdrop-sep {
	-webkit-text-stroke-color: rgba(0,0,0,.05);
}
/* Spotlight disabled in light mode (not needed, cream is already simple) */
.wd-manifesto.is-light.has-spotlight::after {
	display: none;
}
.wd-manifesto-eyebrow {
	font-family: var(--wd-font-mono);
	font-size: 11.5px;
	color: var(--wd-ink-mute);
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 24px;
}
.wd-manifesto-body {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.4vw, 44px);
	max-width: 880px;
	margin: 0 auto 32px;
	line-height: 1.2;
	letter-spacing: -.02em;
	color: var(--wd-ink-soft);
	font-weight: 400;
}
.wd-manifesto-body strong { color: #fff; font-weight: 600; }
.wd-manifesto-body em {
	color: var(--wd-manifesto-accent);
	font-style: normal;
	font-weight: 600;
}
.wd-manifesto-sub {
	font-size: 14px;
	color: var(--wd-ink-mute);
	font-family: var(--wd-font-mono);
	letter-spacing: .06em;
}


/* ============================================================
 * UNIFORM ALIGNMENT — the left edge of all WD widgets sits on the same vertical line.
 *
 * Two strategies:
 * (A) For static widgets, the outer section: 1320px boxed & centered + 32px inner pad.
 *     (svc, cta, foot-cta-bar, faq, cap, manifesto, svchero)
 * (B) For sticky/scroll widgets (Cases Slider, Process Horizontal) the section
 *     stays viewport-stretched; the inner head/inner-content is 1320px boxed.
 *     Because sticky/horizontal-scroll mechanisms need the full viewport width.
 *
 * Both strategies produce the same left edge (head 1320 boxed & centered).
 * ============================================================ */

/* Strategy A: 1320 boxed at section level */
.wd-svc-section,
.wd-cta-section,
.wd-foot-cta-bar,
.wd-faq-section,
.wd-cap-section,
.wd-manifesto,
.wd-svchero-section,
.wd-contact-section {
	max-width: 1320px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 32px !important;
	padding-right: 32px !important;
	box-sizing: border-box;
	width: auto !important;
}

/* Strategy B: Cases and Process are viewport-stretched; head/inner-content is 1320 boxed on its own */
.wd-case-section,
.wd-proc-section {
	width: 100%;
	max-width: 100vw;
}
.wd-case-head,
.wd-proc-head {
	/* These heads already have a 1320 max-width internally — the overrides below should not apply */
}

/* Reset the head/grids' own max-width and padding inside Strategy A
   (a section-level container already exists, no need to box again inside) */
.wd-svc-head, .wd-svc-grid,
.wd-cap-head, .wd-cap-grid,
.wd-faq-head, .wd-faq-list,
.wd-foot-cta-grid {
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Cases track-wrap — the section is already viewport-stretched (Strategy B), track-wrap
   uses the full viewport. Padding gives 32px of space on both sides. */
.wd-case-track-wrap {
	padding-left: 32px;
	padding-right: 32px;
	box-sizing: border-box;
}

/* Process Horizontal head — keep the original absolute + left:50% + translateX rule
   (revert the previous override). Since the section is already 1320px boxed, the head
   already appears correctly aligned. */


/* ============================================================
 * SCROLL-TRIGGERED ZOOM-IN REVEAL — widget titles grow from small to large
 * with a fade-in as they enter the viewport, using the modern CSS
 * `animation-timeline: view()` (Chrome 115+, Edge 115+, Safari 18+). In
 * unsupported browsers, `animation-fill-mode: both` keeps the final state
 * (opacity:1, scale:1) visible — the page still looks correct in the fallback.
 * ============================================================ */
@media (prefers-reduced-motion: no-preference) {
	@keyframes wd-reveal-zoom {
		from {
			opacity: 0;
			transform: scale(0.85) translateY(40px);
			filter: blur(4px);
		}
		to {
			opacity: 1;
			transform: scale(1) translateY(0);
			filter: blur(0);
		}
	}

	/* Old animation-timeline reveal disabled — all h2s now use the JS-driven
	 * emphatic reveal (below). animation-timeline remains only for sub/eyebrow
	 * and cards (a bonus in modern browsers, a no-op in older ones). */


	/* Eyebrows and subs also get a light fade-up (different range to give a delayed feel) */
	.wd-svc-eyebrow,
	.wd-case-eyebrow,
	.wd-proc-eyebrow,
	.wd-cap-eyebrow,
	.wd-faq-eyebrow,
	.wd-foot-cta-eyebrow,
	.wd-manifesto-eyebrow,
	.wd-svc-sub,
	.wd-case-sub,
	.wd-cap-head p,
	.wd-manifesto-sub,
	.wd-manifesto-body {
		animation: wd-fade-up linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 50%;
	}
	@keyframes wd-fade-up {
		from { opacity: 0; transform: translateY(20px); }
		to   { opacity: 1; transform: translateY(0); }
	}

	/* Service and scope cards — successive stagger reveal */
	.wd-svc-card,
	.wd-cap-item {
		animation: wd-card-up linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 80%;
	}
	@keyframes wd-card-up {
		from { opacity: 0; transform: translateY(60px) scale(0.96); }
		to   { opacity: 1; transform: translateY(0) scale(1); }
	}
}

/* ============================================================
 * ALL WIDGET TITLES — JS-driven emphatic reveal
 * Letter-spread + glow flash via IntersectionObserver.
 * Targets: .wd-svc-h2, .wd-case-h2, .wd-proc-h2, .wd-cap-h2,
 * .wd-faq-h2, .wd-foot-cta-h2, .wd-testi-h2, .wd-svchero-h1,
 * .wd-manifesto-body, .wd-cta-card h2 (from the JS targets list).
 * Class-only selector → applies to whichever element JS adds it to.
 * ============================================================ */
@media (prefers-reduced-motion: no-preference) {
	.wd-emph-init {
		opacity: 0;
		transform: scale(0.78) translateY(60px);
		filter: blur(14px);
		letter-spacing: 0.14em;
		text-shadow: 0 0 0 transparent;
		transition:
			opacity 1.1s cubic-bezier(.2,.7,.2,1),
			transform 1.1s cubic-bezier(.2,.7,.2,1),
			filter 1.1s cubic-bezier(.2,.7,.2,1),
			letter-spacing 1.1s cubic-bezier(.2,.7,.2,1),
			text-shadow .8s ease-out;
		will-change: opacity, transform, filter, letter-spacing;
	}
	.wd-emph-revealed {
		opacity: 1;
		transform: scale(1) translateY(0);
		filter: blur(0);
		letter-spacing: -.03em;
	}
	.wd-emph-flash {
		text-shadow: 0 0 32px rgba(91,124,255,.65);
	}
}


/* ============================================================
 * WD CONTACT BLOCK — form on the left + map on the right
 * ============================================================ */
.wd-contact-section {
	--wd-contact-accent: #5B7CFF;
	padding: 96px 32px;
	max-width: 1320px;
	margin: 0 auto;
	color: var(--wd-ink);
	font-family: var(--wd-font-body);
}
.wd-contact-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	align-items: start;
}
@media (min-width: 900px) {
	.wd-contact-grid { grid-template-columns: 6fr 5fr; gap: 64px; }
}

.wd-contact-eyebrow {
	font-family: var(--wd-font-mono);
	font-size: 11.5px;
	color: var(--wd-contact-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 14px;
}
.wd-contact-h2 {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 600;
	letter-spacing: -.025em;
	line-height: 1.1;
	color: var(--wd-ink);
	margin: 0 0 14px;
}
.wd-contact-h2 em { font-style: normal; color: var(--wd-contact-accent); }
.wd-contact-sub {
	font-size: 16px;
	color: var(--wd-ink-soft);
	line-height: 1.55;
	margin: 0 0 28px;
}

/* Success / error messages */
.wd-contact-success,
.wd-contact-error {
	padding: 14px 18px;
	border-radius: 10px;
	font-size: 14px;
	margin-bottom: 22px;
	border: 1px solid;
}
.wd-contact-success {
	background: rgba(62,224,161,.08);
	border-color: rgba(62,224,161,.3);
	color: var(--wd-good);
}
.wd-contact-error {
	background: rgba(209,75,62,.08);
	border-color: rgba(209,75,62,.35);
	color: #ff8d83;
}

/* Form */
.wd-contact-form {
	display: flex; flex-direction: column; gap: 18px;
}
.wd-form-row {
	display: grid; grid-template-columns: 1fr;
	gap: 18px;
}
@media (min-width: 600px) {
	.wd-form-row { grid-template-columns: 1fr 1fr; }
}
.wd-contact-form label {
	display: flex; flex-direction: column; gap: 8px;
}
.wd-contact-form label > span {
	font-size: 12.5px;
	font-family: var(--wd-font-mono);
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
}
.wd-contact-form input[type="text"],
.wd-contact-form input[type="email"],
.wd-contact-form input[type="tel"],
.wd-contact-form input[type="url"],
.wd-contact-form textarea {
	width: 100%;
	height: 46px;
	padding: 0 14px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 10px;
	color: var(--wd-ink);
	font-family: var(--wd-font-body);
	font-size: 14.5px;
	transition: border-color .15s, background .15s;
}
.wd-contact-form textarea {
	height: auto;
	min-height: 140px;
	padding: 14px;
	line-height: 1.55;
	resize: vertical;
}
.wd-contact-form input:focus,
.wd-contact-form textarea:focus {
	outline: none;
	border-color: var(--wd-contact-accent);
	background: rgba(255,255,255,.06);
}
.wd-form-full label { width: 100%; }

/* Privacy Policy consent checkbox */
.wd-form-kvkk {
	display: flex;
	flex-direction: row !important;
	align-items: flex-start;
	gap: 10px;
	font-size: 13.5px;
	color: var(--wd-ink-soft);
	line-height: 1.55;
	cursor: pointer;
}
.wd-form-kvkk input[type="checkbox"] {
	width: 18px; height: 18px;
	margin-top: 2px;
	accent-color: var(--wd-contact-accent);
	flex-shrink: 0;
	cursor: pointer;
}
.wd-form-kvkk a {
	color: var(--wd-contact-accent);
	text-decoration: underline;
}

.wd-contact-form button {
	align-self: flex-start;
	margin-top: 8px;
}

/* Right map column */
.wd-contact-map-col { display: flex; flex-direction: column; gap: 14px; }
.wd-contact-map-title {
	font-family: var(--wd-font-display);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -.015em;
	color: var(--wd-ink);
	margin: 0;
}
.wd-contact-address {
	font-style: normal;
	font-size: 14px;
	color: var(--wd-ink-soft);
	line-height: 1.65;
	margin: 0 0 8px;
}
.wd-contact-map {
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid var(--wd-line-w);
	background: var(--wd-bg-card);
}
.wd-contact-map iframe {
	display: block;
	width: 100%;
	height: 420px;
	border: 0;
	/* Optional contrast filter to match the dark theme:
	filter: invert(90%) hue-rotate(180deg); — enable if desired */
}

/* ============================================================
 * BLOG — Dixor-style vertical card + sidebar
 * Full-width image on top, content below, meta row with icons
 * ============================================================ */
.wd-blog-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
}
@media (min-width: 900px) {
	.wd-blog-layout { grid-template-columns: 8fr 4fr; gap: 64px; }
}

.wd-blog-list { display: flex; flex-direction: column; gap: 48px; }

.wd-blog-card {
	display: flex;
	flex-direction: column;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 16px;
	overflow: hidden;
	transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .3s, box-shadow .3s;
}
.wd-blog-card:hover {
	transform: translateY(-4px);
	border-color: var(--wd-line-w-strong);
	box-shadow: 0 24px 48px -16px rgba(0,0,0,.4);
}

.wd-blog-card-cover {
	display: block;
	aspect-ratio: 16/9;
	overflow: hidden;
	background: var(--wd-bg);
	border-bottom: 1px solid var(--wd-line-w);
	position: relative;
}
.wd-blog-card-cover img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.wd-blog-card:hover .wd-blog-card-cover img { transform: scale(1.04); }
.wd-blog-card-fallback {
	width: 100%; height: 100%;
	background: linear-gradient(135deg, var(--wd-brand-navy), var(--wd-bg));
}

.wd-blog-card-body {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 32px;
}
@media (min-width: 1024px) {
	.wd-blog-card-body { padding: 36px 40px 40px; }
}

.wd-blog-card-meta {
	display: flex; align-items: center; gap: 24px;
	flex-wrap: wrap;
	font-family: var(--wd-font-mono);
	font-size: 12px;
	color: var(--wd-ink-mute);
	letter-spacing: .02em;
}
.wd-blog-card-meta .wd-meta-item {
	display: inline-flex; align-items: center; gap: 8px;
}
.wd-blog-card-meta .wd-meta-item svg {
	width: 16px; height: 16px;
	color: var(--wd-accent);
	flex-shrink: 0;
}
.wd-blog-card-meta .wd-meta-cat a {
	color: var(--wd-ink-soft);
	text-decoration: none;
	transition: color .15s;
}
.wd-blog-card-meta .wd-meta-cat a:hover { color: var(--wd-accent); }

.wd-blog-card-title {
	font-family: var(--wd-font-display);
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1.25;
	margin: 0;
}
.wd-blog-card-title a {
	color: var(--wd-ink);
	text-decoration: none;
	transition: color .2s;
}
.wd-blog-card-title a:hover { color: var(--wd-accent); }

.wd-blog-card-excerpt {
	font-size: 15px;
	color: var(--wd-ink-soft);
	line-height: 1.7;
	margin: 0;
}

.wd-blog-card-link {
	display: inline-flex; align-items: center; gap: 10px;
	align-self: flex-start;
	margin-top: 8px;
	padding: 11px 22px;
	font-family: var(--wd-font-mono);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wd-ink);
	text-decoration: none;
	background: rgba(255, 255, 255, .035);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 999px;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	transition: background .25s ease, border-color .25s ease, color .25s ease, transform .2s ease;
}
.wd-blog-card-link:hover {
	background: var(--wd-accent);
	border-color: var(--wd-accent);
	color: #fff;
	transform: translateY(-1px);
}
.wd-blog-card-link .arr {
	display: inline-block;
	transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.wd-blog-card:hover .wd-blog-card-link .arr,
.wd-blog-card-link:hover .arr { transform: translateX(6px); }

/* Pagination */
.wd-blog-pagination { margin-top: 48px; }
.wd-blog-pagination ul { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0; }
.wd-blog-pagination li { list-style: none; margin: 0; }
.wd-blog-pagination a,
.wd-blog-pagination span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px; padding: 0 12px;
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 8px;
	font-family: var(--wd-font-mono); font-size: 13px;
	color: var(--wd-ink-soft); text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}
.wd-blog-pagination a:hover { background: rgba(255,255,255,.06); color: var(--wd-ink); }
.wd-blog-pagination .current { background: var(--wd-accent); border-color: var(--wd-accent); color: #fff; }

/* ===== SIDEBAR ===== */
.wd-blog-sidebar { display: flex; flex-direction: column; gap: 24px; }
.wd-side-card {
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 12px;
	padding: 24px;
}
.wd-side-title {
	font-family: var(--wd-font-mono);
	font-size: 11.5px; color: var(--wd-ink-mute);
	letter-spacing: .12em; text-transform: uppercase;
	font-weight: 500; margin: 0 0 16px;
}
.wd-side-search { display: flex; gap: 6px; }
.wd-side-search input {
	flex: 1; height: 40px; padding: 0 14px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 8px; color: var(--wd-ink);
	font-family: var(--wd-font-body); font-size: 13.5px; outline: none;
}
.wd-side-search input:focus { border-color: var(--wd-accent); background: rgba(255,255,255,.06); }
.wd-side-search button {
	width: 40px; height: 40px;
	background: var(--wd-accent-deep);
	border: 0; border-radius: 8px;
	color: #fff; cursor: pointer;
	display: inline-grid; place-items: center;
}
.wd-side-search button svg { width: 16px; height: 16px; }

.wd-side-recent { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.wd-side-recent li { list-style: none; margin: 0; }
.wd-side-recent-item { display: flex; gap: 12px; align-items: flex-start; text-decoration: none; color: inherit; }
.wd-side-recent-thumb {
	flex: 0 0 64px; height: 64px;
	border-radius: 8px; overflow: hidden;
	background: var(--wd-bg-soft);
}
.wd-side-recent-thumb img { width: 100%; height: 100%; object-fit: cover; }
.wd-side-recent-fallback {
	display: block; width: 100%; height: 100%;
	background: linear-gradient(135deg, var(--wd-brand-navy), var(--wd-bg-soft));
}
.wd-side-recent-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.wd-side-recent-date {
	font-family: var(--wd-font-mono);
	font-size: 10.5px; color: var(--wd-ink-mute); letter-spacing: .06em;
}
.wd-side-recent-title {
	font-size: 13.5px; font-weight: 500;
	color: var(--wd-ink-soft); line-height: 1.35;
	transition: color .15s;
}
.wd-side-recent-item:hover .wd-side-recent-title { color: var(--wd-ink); }

.wd-side-cats { list-style: none; padding: 0; margin: 0; }
.wd-side-cats li { list-style: none; margin: 0; }
.wd-side-cats a {
	display: flex; align-items: center; justify-content: space-between;
	padding: 10px 0;
	border-bottom: 1px solid var(--wd-line-w);
	color: var(--wd-ink-soft); text-decoration: none;
	font-size: 14px; transition: color .15s;
}
.wd-side-cats li:last-child a { border-bottom: 0; }
.wd-side-cats a:hover { color: var(--wd-ink); }
.wd-side-count {
	font-family: var(--wd-font-mono);
	font-size: 11px; color: var(--wd-ink-mute);
	background: rgba(255,255,255,.04);
	padding: 2px 8px; border-radius: 999px;
}

.wd-side-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.wd-side-tags a {
	display: inline-block;
	padding: 6px 11px; font-size: 12.5px;
	color: var(--wd-ink-soft);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w);
	border-radius: 999px; text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}
.wd-side-tags a:hover { color: var(--wd-accent); border-color: var(--wd-accent); background: rgba(91,124,255,.08); }

.wd-side-cta {
	background: linear-gradient(135deg, var(--wd-brand-navy) 0%, var(--wd-bg-card) 100%);
	border-color: var(--wd-accent);
}
.wd-side-cta-eyebrow {
	font-family: var(--wd-font-mono);
	font-size: 11.5px; color: var(--wd-accent);
	letter-spacing: .12em; text-transform: uppercase;
	margin-bottom: 12px;
}
.wd-side-cta-title {
	font-family: var(--wd-font-display);
	font-size: 22px; font-weight: 600;
	letter-spacing: -.02em; line-height: 1.2;
	color: #fff; margin: 0 0 8px;
}
.wd-side-cta-body { font-size: 13.5px; color: var(--wd-ink-soft); line-height: 1.55; margin: 0 0 16px; }

/* ===== POST DETAIL ===== */
.wd-post-meta {
	display: flex; align-items: center; gap: 10px;
	margin-top: 16px;
	font-family: var(--wd-font-mono);
	font-size: 12px; color: var(--wd-ink-mute);
	letter-spacing: .04em; flex-wrap: wrap;
}
.wd-post-meta .sep { color: var(--wd-line-w-strong); }
.wd-post-cover { max-width: 1320px; margin: 32px auto 0; padding: 0 32px; }
.wd-post-cover img {
	width: 100%; height: auto; max-height: 600px;
	object-fit: cover; border-radius: 16px; display: block;
}
.wd-post-tags { margin-top: 48px; display: flex; flex-wrap: wrap; gap: 8px; }
.wd-post-tags a {
	padding: 8px 14px; font-size: 13px;
	color: var(--wd-accent);
	background: rgba(91,124,255,.08);
	border: 1px solid rgba(91,124,255,.25);
	border-radius: 999px; text-decoration: none;
}
.wd-post-nav {
	margin-top: 48px; padding-top: 32px;
	border-top: 1px solid var(--wd-line-w);
	display: grid; grid-template-columns: 1fr; gap: 18px;
}
@media (min-width: 600px) { .wd-post-nav { grid-template-columns: 1fr 1fr; } }
.wd-post-nav-link {
	display: flex; flex-direction: column; gap: 6px;
	padding: 18px;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	text-decoration: none;
	transition: border-color .15s;
}
.wd-post-nav-link:hover { border-color: var(--wd-accent); }
.wd-post-nav-link--next { text-align: right; }
.wd-post-nav-dir {
	font-family: var(--wd-font-mono);
	font-size: 11px; color: var(--wd-ink-mute);
	letter-spacing: .08em; text-transform: uppercase;
}
.wd-post-nav-title { font-size: 14.5px; font-weight: 500; color: var(--wd-ink-soft); }


/* ============================================================
 * WOOCOMMERCE — Integro'dan ilham, kendi stilimizle
 * ============================================================ */
.wd-shop-section {
	padding: 48px 32px 120px;
	max-width: 1320px;
	margin: 0 auto;
}

/* Product grid — override the WC default float/width.
 * Default WC CSS: ul.products li.product { width: 22.05%; float: left; margin: 0 3.8% 2.99em 0; }
 * This float/width must be overridden for the grid layout; otherwise cards get squeezed to 22% width. */
.wd-shop-grid,
.wd-shop ul.products,
.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important;
	grid-template-columns: 1fr;
	grid-auto-flow: dense; /* don't let WC's hidden items leave empty grid slots */
	gap: 24px;
	list-style: none;
	padding: 0; margin: 0;
}
@media (min-width: 600px)  { .wd-shop-grid, .wd-shop ul.products, .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(2, 1fr) !important; } }
@media (min-width: 1024px) { .wd-shop-grid, .wd-shop ul.products, .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
/* 4-column layout disabled at 1280px+ — max 3 columns (product cards look wider and more elegant) */

/* WC default li.product: float:left + width:22.05% + margin:3.8%
 * Reset all of it — let it behave as a grid item. */
.wd-shop ul.products li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	list-style: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	clear: none !important;
}

/* WC sometimes adds a non-product / empty <li> (loop separator / placeholder / hidden item).
 * Multi-layer filter + explicit grid position reset:
 *   1. no .product class             → hide
 *   2. .product but completely empty → hide
 *   3. .product but no title inside  → hide
 *   4. Force grid-column/row auto on all grid items (an item may be pinning its own position) */
.wd-shop ul.products,
.woocommerce ul.products,
.woocommerce-page ul.products {
	justify-content: start !important;
	justify-items: stretch !important;
	align-content: start !important;
}

/* ⚡ ROOT CAUSE: WC's default CSS adds `ul.products::before` and `::after` pseudo-elements
 * (`content: " "; display: table`) for clearfix (for the old float layout).
 * In CSS Grid, this pseudo-element behaves like a grid item and **occupies slot 1**.
 * Result: products shift one cell to the right, making the left side look visually empty.
 * Even dense flow doesn't skip the pseudo-element (it has text content).
 * Fix: disable it entirely. */
.wd-shop ul.products::before,
.wd-shop ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
.woocommerce .products ul::before,
.woocommerce .products ul::after {
	display: none !important;
	content: none !important;
}
.wd-shop ul.products > *,
.woocommerce ul.products > *,
.woocommerce-page ul.products > * {
	grid-column: auto !important;
	grid-row: auto !important;
}
.wd-shop ul.products > li:not(.product),
.woocommerce ul.products > li:not(.product),
.woocommerce-page ul.products > li:not(.product),
.wd-shop ul.products li.product:empty,
.woocommerce ul.products li.product:empty,
.wd-shop ul.products > li.product:not(:has(.woocommerce-loop-product__title)),
.woocommerce ul.products > li.product:not(:has(.woocommerce-loop-product__title)),
/* first-child special safeguard — definitely hide if the first slot has a non-product or empty item */
.wd-shop ul.products > li:first-child:empty,
.woocommerce ul.products > li:first-child:empty,
.wd-shop ul.products > :first-child:not(.product),
.woocommerce ul.products > :first-child:not(.product) {
	display: none !important;
}

/* Image fallback gradient — keep the product card from looking empty when there's no featured image */
.woocommerce ul.products li.product img[src*="placeholder"],
.woocommerce ul.products li.product img:not([src]),
.woocommerce ul.products li.product img[src=""] {
	background: linear-gradient(135deg, var(--wd-brand-navy, #1F2D5C), var(--wd-bg-card, #131D33));
	min-height: 200px;
}

/* Product card — image-cover + hover overlay */
.wd-shop ul.products li.product,
.wd-product-card {
	position: relative;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 14px;
	overflow: hidden;
	transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .25s, box-shadow .25s;
	display: flex; flex-direction: column;
}
.wd-shop ul.products li.product:hover,
.wd-product-card:hover {
	border-color: var(--wd-line-w-strong);
	box-shadow: 0 20px 40px -20px rgba(0,0,0,.4);
	transform: translateY(-4px);
}

/* Product thumb — in WC's default markup, <a class="woocommerce-LoopProduct-link">
 * contains both the img and the title+price. So apply aspect-ratio only to the img,
 * not the wrapper. The img occupies space with its own aspect ratio; title+price flows below. */
.wd-shop ul.products li.product > a.woocommerce-LoopProduct-link,
.wd-shop ul.products li.product > a.woocommerce-loop-product__link {
	display: block;
	text-decoration: none;
	color: inherit;
}
.wd-shop ul.products li.product img,
.wd-shop ul.products li.product img.attachment-woocommerce_thumbnail,
.wd-product-thumb img {
	display: block;
	width: 100% !important;
	height: auto !important;
	max-width: none !important;
	aspect-ratio: 4/5;
	object-fit: cover;
	margin: 0 !important;
	background: var(--wd-bg-soft);
	transition: transform .8s cubic-bezier(.2,.7,.2,1);
}
.wd-shop ul.products li.product:hover img,
.wd-product-card:hover .wd-product-thumb img { transform: scale(1.04); }

.wd-product-thumb {
	position: relative;
	aspect-ratio: 4/5;
	overflow: hidden;
	background: var(--wd-bg-soft);
}
.wd-product-thumb::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(10,15,26,.6) 100%);
	pointer-events: none;
}

/* Sale badge — small pill (top-left corner).
 * !important is aggressive here because WC + WP block + Elementor can override from 4 different CSS levels,
 * so we override the default widefull bar appearance. */
.wd-shop ul.products li.product .onsale,
.wd-shop .onsale,
.woocommerce ul.products li.product .onsale,
.woocommerce .onsale,
.wc-block-grid__product-onsale,
.wp-block-woocommerce-product-sale-badge,
.wd-product-badge {
	position: absolute !important;
	top: 14px !important;
	left: 14px !important;
	right: auto !important;
	bottom: auto !important;
	z-index: 3 !important;
	padding: 5px 11px !important;
	font-family: var(--wd-font-mono) !important;
	font-size: 10.5px !important;
	font-weight: 600 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	color: #fff !important;
	background: var(--wd-warm) !important;
	border-radius: 999px !important;
	margin: 0 !important;
	min-height: 0 !important;
	min-width: 0 !important;
	max-width: max-content !important;
	width: auto !important;
	height: auto !important;
	line-height: 1 !important;
	display: inline-block !important;
	text-align: center !important;
	transform: none !important;
	box-shadow: 0 4px 12px rgba(236,122,26,.32);
}

/* Product title + price */
.wd-shop ul.products li.product .woocommerce-loop-product__title,
.wd-product-title {
	font-family: var(--wd-font-display);
	font-size: 17px !important;
	font-weight: 600 !important;
	letter-spacing: -.015em;
	line-height: 1.3;
	color: var(--wd-ink) !important;
	margin: 0 0 8px !important;
	padding: 0 !important;
}
.wd-shop ul.products li.product .price,
.wd-product-price {
	display: block;
	font-family: var(--wd-font-mono);
	font-size: 16px;
	font-weight: 600;
	color: var(--wd-accent) !important;
	margin: 0;
}
.wd-product-price del { color: var(--wd-ink-mute); font-weight: 400; margin-right: 8px; opacity: .6; }
.wd-product-price ins { background: none; color: var(--wd-good); text-decoration: none; }

/* Card body */
.wd-product-body,
.wd-shop ul.products li.product > a:not(:has(img)) ~ * {
	padding: 18px 18px 22px;
}
.wd-shop ul.products li.product .woocommerce-loop-product__link {
	display: block;
	text-decoration: none;
	color: inherit;
}
.wd-shop ul.products li.product .woocommerce-loop-product__title { padding: 18px 18px 4px !important; }
.wd-shop ul.products li.product .price { padding: 0 18px 18px; }
.wd-shop ul.products li.product .button {
	display: block;
	margin: 0 18px 18px;
	padding: 11px 16px;
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border-radius: 8px;
	text-align: center;
	font-family: var(--wd-font-body);
	font-size: 13.5px;
	font-weight: 500;
	text-decoration: none;
	transition: background .15s;
}
.wd-shop ul.products li.product .button:hover {
	background: #3A6BFF !important;
}
.wd-shop ul.products li.product .added_to_cart {
	display: inline-block; margin: 0 18px 18px;
	color: var(--wd-good);
	font-size: 13px;
}

/* Star rating */
.wd-shop ul.products li.product .star-rating {
	margin: 0 18px 8px !important;
	font-size: 11px !important;
	color: var(--wd-warm);
}

/* Shop page header */
.woocommerce-products-header { margin-bottom: 32px; padding: 0 32px; max-width: 1320px; margin-left: auto; margin-right: auto; }
.woocommerce-products-header__title.page-title {
	font-family: var(--wd-font-display);
	font-size: clamp(36px, 4.4vw, 56px);
	font-weight: 600;
	letter-spacing: -.03em;
	color: var(--wd-ink);
	margin: 0;
}

/* Result count + ordering */
.woocommerce-result-count,
.woocommerce-ordering {
	font-size: 13.5px;
	color: var(--wd-ink-soft);
	font-family: var(--wd-font-mono);
}
.woocommerce-ordering select {
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 8px;
	color: var(--wd-ink);
	padding: 8px 12px;
	font-family: var(--wd-font-body);
}

/* Add to cart on product page */
.woocommerce div.product .summary {
	color: var(--wd-ink-soft);
}
.woocommerce div.product .product_title {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.6vw, 48px);
	font-weight: 600;
	letter-spacing: -.025em;
	color: var(--wd-ink);
}
.woocommerce div.product p.price {
	font-family: var(--wd-font-mono);
	font-size: 28px;
	color: var(--wd-accent) !important;
	font-weight: 600;
}
.woocommerce div.product .quantity .qty {
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink);
	border-radius: 8px;
	padding: 10px;
}
.woocommerce button.button,
.woocommerce a.button,
.woocommerce-page button.button,
.woocommerce-page a.button {
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border-radius: 8px;
	font-family: var(--wd-font-body);
	font-weight: 500;
	padding: 12px 22px;
	transition: background .15s;
}
.woocommerce button.button:hover,
.woocommerce a.button:hover { background: #3A6BFF !important; }
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce-page button.button.alt {
	background: #fff !important;
	color: #0A0F1A !important;
}

/* WooCommerce notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	background: var(--wd-bg-card);
	border-radius: 10px;
	padding: 16px 20px;
	color: var(--wd-ink) !important;
	border-left: 3px solid var(--wd-accent);
	position: relative;
	list-style: none !important;
}
.woocommerce-message { border-left-color: var(--wd-good); }
.woocommerce-error { border-left-color: #D14B3E; }

/* WC default icon font (`woocommerce`) ::before overlaps the text — hide it */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before,
.woocommerce-noreviews::before {
	display: none !important;
	content: none !important;
}
/* Buttons inside notices like "Return to cart" */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	float: right;
	margin-left: 16px;
}


/* ============================================================
 * SINGLE PRODUCT — Detail page (gallery + summary + tabs)
 * ============================================================ */
.single-product .wd-shop-section {
	padding: 64px 32px 120px;
}

/* Hero header for single product (breadcrumb + title minimal) */
.single-product .wd-svchero-section {
	padding-top: 140px;
	padding-bottom: 32px;
}

/* 2-column layout: gallery left, summary right */
.woocommerce div.product {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
}
@media (min-width: 900px) {
	.woocommerce div.product { grid-template-columns: minmax(0, 420px) 1fr; gap: 56px; }
}
@media (min-width: 1280px) {
	.woocommerce div.product { grid-template-columns: minmax(0, 480px) 1fr; gap: 72px; }
}

/* Gallery left */
.woocommerce div.product .woocommerce-product-gallery {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	position: relative;
}
.woocommerce div.product .woocommerce-product-gallery__wrapper {
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--wd-line-w);
	background: var(--wd-bg-card);
}
.woocommerce div.product .woocommerce-product-gallery__image {
	background: var(--wd-bg-soft);
}
.woocommerce div.product .woocommerce-product-gallery__image img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 4/5;
	object-fit: cover;
	display: block;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin-top: 14px;
	padding: 0 !important;
	list-style: none;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li {
	list-style: none;
	margin: 0;
	width: auto !important;
	float: none !important;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs img {
	border-radius: 8px;
	border: 1px solid var(--wd-line-w);
	opacity: .55;
	transition: opacity .2s, border-color .2s, transform .25s;
	cursor: pointer;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs img:hover,
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
	opacity: 1;
	border-color: var(--wd-accent);
}
/* Zoom trigger */
.woocommerce-product-gallery__trigger {
	background: rgba(10,15,26,.7) !important;
	border-radius: 999px;
	padding: 10px 14px !important;
	color: #fff !important;
	font-size: 13px !important;
	border: 1px solid var(--wd-line-w-strong) !important;
	backdrop-filter: blur(8px);
	top: 14px !important;
	right: 14px !important;
}
/* Onsale badge — single */
.woocommerce span.onsale {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 3;
	padding: 6px 13px;
	font-family: var(--wd-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	background: var(--wd-warm);
	color: #fff;
	border-radius: 999px;
	min-height: auto;
	min-width: auto;
	line-height: 1;
	margin: 0;
}

/* Summary right — sticky scroll disabled.
 * With sticky enabled, it overlapped the tabs + related products area;
 * let it stay in normal flow (gallery scrolls up, summary stays in its natural place). */
.woocommerce div.product .summary {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	color: var(--wd-ink-soft);
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-self: start;
}

/* Category eyebrow above title */
.woocommerce div.product .summary .posted_in,
.single-product .wd-product-eyebrow {
	font-family: var(--wd-font-mono);
	font-size: 11.5px;
	color: var(--wd-ink-mute);
	letter-spacing: .12em;
	text-transform: uppercase;
	margin: 0;
}

.woocommerce div.product .product_title {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.6vw, 44px) !important;
	font-weight: 600;
	letter-spacing: -.025em;
	line-height: 1.15;
	color: var(--wd-ink);
	margin: 0 !important;
}

/* Price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	display: flex !important;
	align-items: baseline;
	gap: 12px;
	font-family: var(--wd-font-display) !important;
	font-size: 32px !important;
	font-weight: 600 !important;
	color: var(--wd-ink) !important;
	margin: 0 !important;
	letter-spacing: -.01em;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
	color: var(--wd-ink-mute) !important;
	font-size: 22px;
	font-weight: 400;
	opacity: .65;
	text-decoration: line-through;
}
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
	background: none !important;
	color: var(--wd-good) !important;
	text-decoration: none !important;
}

/* Short description */
.woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-product-details__short-description {
	font-size: 16px;
	line-height: 1.7;
	color: var(--wd-ink-soft);
	padding: 22px 0;
	border-top: 1px solid var(--wd-line-w);
	border-bottom: 1px solid var(--wd-line-w);
	margin: 0;
}
.woocommerce-product-details__short-description p { margin: 0 0 8px; }
.woocommerce-product-details__short-description p:last-child { margin-bottom: 0; }

/* Stock */
.woocommerce div.product .stock {
	font-family: var(--wd-font-mono);
	font-size: 12px !important;
	letter-spacing: .04em;
	color: var(--wd-good) !important;
}
.woocommerce div.product .stock.out-of-stock { color: #D14B3E !important; }

/* Cart form */
.woocommerce div.product form.cart {
	display: flex !important;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin: 0 !important;
}
.woocommerce div.product .quantity {
	margin: 0 !important;
}
.woocommerce div.product .quantity .qty {
	width: 84px !important;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink);
	border-radius: 10px;
	padding: 14px 12px !important;
	font-family: var(--wd-font-mono);
	font-size: 15px;
	text-align: center;
	height: auto;
}
.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart button.single_add_to_cart_button {
	flex: 1;
	min-width: 200px;
	padding: 15px 28px !important;
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	font-family: var(--wd-font-body);
	font-size: 14px !important;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-radius: 10px;
	border: none;
	cursor: pointer;
	transition: background .2s, transform .15s;
}
.woocommerce div.product form.cart .button:hover,
.woocommerce div.product form.cart button.single_add_to_cart_button:hover {
	background: #3A6BFF !important;
	transform: translateY(-1px);
}

/* Meta (category + tag) */
.woocommerce div.product .product_meta {
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-family: var(--wd-font-mono);
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	padding-top: 12px;
	border-top: 1px solid var(--wd-line-w);
	margin: 0;
}
.woocommerce div.product .product_meta > span {
	display: flex;
	gap: 8px;
	align-items: center;
}
.woocommerce div.product .product_meta a {
	color: var(--wd-ink-soft);
	border-bottom: 1px dashed var(--wd-line-w-strong);
	transition: color .15s, border-color .15s;
}
.woocommerce div.product .product_meta a:hover {
	color: var(--wd-accent);
	border-bottom-color: var(--wd-accent);
}
.woocommerce div.product .sku_wrapper { font-size: 11.5px; opacity: .7; }

/* Tabs — full width below grid */
.woocommerce div.product .woocommerce-tabs {
	grid-column: 1 / -1;
	margin-top: 32px;
	padding-top: 48px;
	border-top: 1px solid var(--wd-line-w);
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex !important;
	gap: 0;
	padding: 0 !important;
	margin: 0 0 32px !important;
	border-bottom: 1px solid var(--wd-line-w);
	background: transparent !important;
	list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 16px 24px !important;
	font-family: var(--wd-font-mono);
	font-size: 12.5px !important;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wd-ink-mute) !important;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color .15s, border-color .15s;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--wd-ink) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--wd-ink) !important;
	border-bottom-color: var(--wd-accent);
}
.woocommerce div.product .woocommerce-Tabs-panel {
	padding: 0 !important;
	color: var(--wd-ink-soft);
	line-height: 1.75;
	font-size: 15.5px;
	max-width: 880px;
}
.woocommerce div.product .woocommerce-Tabs-panel h2 {
	display: none; /* WC duplicates panel title */
}
.woocommerce div.product .woocommerce-Tabs-panel h3 {
	font-family: var(--wd-font-display);
	font-size: 22px;
	font-weight: 600;
	color: var(--wd-ink);
	margin: 24px 0 12px;
}
.woocommerce div.product .woocommerce-Tabs-panel ul {
	padding-left: 0;
	list-style: none;
}
.woocommerce div.product .woocommerce-Tabs-panel ul li {
	position: relative;
	padding: 6px 0 6px 24px;
}
.woocommerce div.product .woocommerce-Tabs-panel ul li::before {
	content: "→";
	position: absolute;
	left: 0;
	color: var(--wd-accent);
	font-family: var(--wd-font-mono);
}

/* Reviews tab */
.woocommerce #reviews .commentlist {
	padding: 0;
	list-style: none;
}
.woocommerce #reviews .comment {
	padding: 20px 0;
	border-bottom: 1px solid var(--wd-line-w);
}
.woocommerce #review_form_wrapper {
	margin-top: 32px;
	padding: 24px;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 12px;
}
.woocommerce #review_form #respond textarea,
.woocommerce #review_form #respond input[type="text"],
.woocommerce #review_form #respond input[type="email"] {
	background: rgba(255,255,255,.03);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink);
	border-radius: 8px;
	padding: 12px;
	width: 100%;
	font-family: var(--wd-font-body);
}

/* Related products — full width below tabs */
.woocommerce .related,
.woocommerce .upsells {
	grid-column: 1 / -1;
	margin-top: 64px;
	padding-top: 48px;
	border-top: 1px solid var(--wd-line-w);
}
.woocommerce .related > h2,
.woocommerce .upsells > h2 {
	font-family: var(--wd-font-display);
	font-size: clamp(24px, 2.8vw, 36px);
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink);
	margin: 0 0 32px;
}

/* (mobile guard no longer needed since sticky was removed) */


/* ============================================================
 * CASES ARCHIVE GRID — /cases/ page
 * 2-up card layout: cover + sector chip + headline + 3 metrics + quote
 * ============================================================ */
.wd-cases-archive-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
}
@media (min-width: 900px) {
	.wd-cases-archive-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
}

.wd-case-archive-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 18px;
	overflow: hidden;
	transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .25s, box-shadow .25s;
}
.wd-case-archive-card:hover {
	transform: translateY(-5px);
	border-color: var(--wd-line-w-strong);
	box-shadow: 0 28px 56px -20px rgba(0,0,0,.45);
}

.wd-case-archive-cover {
	display: block;
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--wd-bg);
	border-bottom: 1px solid var(--wd-line-w);
}
.wd-case-archive-cover img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.wd-case-archive-card:hover .wd-case-archive-cover img { transform: scale(1.05); }
.wd-case-archive-fallback {
	width: 100%; height: 100%;
	background: linear-gradient(135deg, var(--wd-brand-navy, #1F2D5C), var(--wd-bg));
}

.wd-case-archive-body {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 32px;
}
@media (min-width: 1024px) {
	.wd-case-archive-body { padding: 36px 40px 40px; }
}

.wd-case-archive-chip {
	display: inline-flex; align-self: flex-start;
	padding: 5px 12px;
	font-family: var(--wd-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wd-accent);
	background: var(--wd-accent-soft);
	border: 1px solid rgba(91,124,255,.25);
	border-radius: 999px;
}

.wd-case-archive-title {
	font-family: var(--wd-font-display);
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1.22;
	margin: 0;
}
.wd-case-archive-title a {
	color: var(--wd-ink); text-decoration: none;
	transition: color .2s;
}
.wd-case-archive-title a:hover { color: var(--wd-accent); }
.wd-case-archive-title em {
	font-style: normal;
	color: var(--wd-accent);
}

.wd-case-archive-metrics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin: 4px 0;
	padding: 16px 0;
	border-top: 1px solid var(--wd-line-w);
	border-bottom: 1px solid var(--wd-line-w);
}
.wd-case-archive-metric {
	display: flex; flex-direction: column; gap: 4px;
}
.wd-case-archive-metric .val {
	font-family: var(--wd-font-display);
	font-size: clamp(20px, 2vw, 26px);
	font-weight: 600;
	color: var(--wd-ink);
	letter-spacing: -.02em;
	line-height: 1;
}
.wd-case-archive-metric.is-good .val { color: var(--wd-good); }
.wd-case-archive-metric .lbl {
	font-family: var(--wd-font-mono);
	font-size: 10.5px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wd-ink-mute);
}

.wd-case-archive-quote {
	font-size: 15px;
	line-height: 1.7;
	color: var(--wd-ink-soft);
	font-style: italic;
	margin: 0;
	padding-left: 12px;
	border-left: 2px solid var(--wd-accent);
}

.wd-case-archive-link {
	display: inline-flex; align-items: center; gap: 8px;
	align-self: flex-start;
	margin-top: 4px;
	font-family: var(--wd-font-mono);
	font-size: 13px;
	font-weight: 500;
	color: var(--wd-accent);
	text-decoration: none;
	padding: 10px 0;
	border-bottom: 1px solid transparent;
	transition: border-color .2s;
}
.wd-case-archive-link:hover { border-bottom-color: var(--wd-accent); }
.wd-case-archive-link .arr {
	display: inline-block;
	transition: transform .25s cubic-bezier(.2,.7,.2,1);
}
.wd-case-archive-card:hover .wd-case-archive-link .arr,
.wd-case-archive-link:hover .arr { transform: translateX(6px); }


/* ============================================================
 * TESTIMONIALS SLIDER — New widget
 * Left title + right rating summary + 2-up card slider + arrows/progress
 * ============================================================ */
/* Testimonials section — viewport-escape hack
 * Same pattern as cases/services: zero side padding on the section, inner blocks
 * get max-width 1320 + padding 0 32px → left edges align perfectly. */
.wd-testi-section {
	position: relative;
	padding: 120px 0 96px;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
}
.wd-testi-section > .wd-testi-head,
.wd-testi-section > .wd-testi-slider {
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 32px;
	padding-right: 32px;
	box-sizing: border-box;
}

/* Head — same as cases/services: max-width 780 left title + right rating summary */
.wd-testi-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 56px;
}
.wd-testi-head-left {
	max-width: 780px;
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Eyebrow — same as services/cases */
.wd-testi-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .1em;
	text-transform: uppercase;
	margin-bottom: 16px;
}

/* H2 — identical style to cases and services */
.wd-testi-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif !important;
	font-size: clamp(32px, 3.8vw, 52px) !important;
	font-weight: 600 !important;
	letter-spacing: -.03em !important;
	line-height: 1.05 !important;
	color: var(--wd-ink, #F2F5FB) !important;
	margin: 0 0 14px !important;
}
.wd-testi-h2 em {
	font-style: normal;
	color: var(--wd-accent);
}

.wd-testi-rating {
	display: flex; align-items: center; gap: 16px;
	flex-shrink: 0;
}
.wd-testi-rating-circle {
	width: 96px; height: 96px;
	border-radius: 50%;
	border: 1.5px solid var(--wd-line-w-strong);
	display: grid; place-items: center;
	font-family: var(--wd-font-display);
	font-size: 32px;
	font-weight: 600;
	color: var(--wd-ink);
	letter-spacing: -.02em;
}
.wd-testi-rating-meta { display: flex; flex-direction: column; gap: 4px; }
.wd-testi-rating-stars {
	display: inline-flex; gap: 2px;
	color: var(--wd-accent);
	font-size: 14px;
	letter-spacing: 1px;
}
.wd-testi-rating-count {
	font-family: var(--wd-font-mono);
	font-size: 12.5px;
	color: var(--wd-ink-soft);
}
.wd-testi-rating-count strong {
	color: var(--wd-ink);
	font-weight: 600;
}

/* Slider track */
.wd-testi-slider {
	position: relative;
	overflow: hidden;
	cursor: grab;
}
.wd-testi-slider:active { cursor: grabbing; }
.wd-testi-track {
	display: flex;
	gap: 28px;
	transition: transform .6s cubic-bezier(.2,.7,.2,1);
	will-change: transform;
}

/* Card */
.wd-testi-card {
	flex: 0 0 calc(50% - 14px);
	min-width: 0;
	background:
		radial-gradient(120% 80% at 100% 100%, rgba(91,124,255,.22) 0%, transparent 60%),
		var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 20px;
	padding: 36px 36px 32px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-height: 380px;
}
@media (max-width: 899px) {
	.wd-testi-card { flex: 0 0 100%; padding: 28px; min-height: 320px; }
}

.wd-testi-card-rating {
	display: inline-flex; align-items: center; gap: 10px;
	font-family: var(--wd-font-display);
	font-size: 16px;
	font-weight: 600;
	color: var(--wd-ink);
}
.wd-testi-card-stars {
	display: inline-flex; gap: 2px;
	color: var(--wd-accent);
	font-size: 13px;
	letter-spacing: 1px;
}

.wd-testi-card-quote {
	flex: 1;
	font-size: 17px;
	line-height: 1.7;
	color: var(--wd-ink-soft);
	margin: 0;
}

.wd-testi-card-person {
	display: flex; align-items: center; gap: 14px;
	padding-top: 18px;
	border-top: 1px solid var(--wd-line-w);
}
.wd-testi-card-avatar {
	width: 52px; height: 52px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--wd-bg-soft);
	border: 1px solid var(--wd-line-w);
	flex-shrink: 0;
}
.wd-testi-card-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wd-testi-card-avatar-fallback {
	width: 100%; height: 100%;
	display: grid; place-items: center;
	font-family: var(--wd-font-display);
	font-size: 18px;
	font-weight: 600;
	color: var(--wd-ink);
	background: linear-gradient(135deg, var(--wd-accent-deep), var(--wd-accent));
}
.wd-testi-card-info { display: flex; flex-direction: column; gap: 2px; }
.wd-testi-card-name {
	font-family: var(--wd-font-display);
	font-size: 15.5px;
	font-weight: 600;
	color: var(--wd-ink);
	letter-spacing: -.01em;
}
.wd-testi-card-role {
	font-family: var(--wd-font-mono);
	font-size: 12px;
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
}

/* Controls */
.wd-testi-controls {
	display: flex; align-items: center; gap: 20px;
	margin-top: 32px;
}
.wd-testi-btn {
	width: 48px; height: 48px;
	border-radius: 12px;
	border: 1px solid var(--wd-line-w-strong);
	background: transparent;
	color: var(--wd-ink);
	cursor: pointer;
	display: grid; place-items: center;
	font-size: 16px;
	transition: background .15s, border-color .15s;
}
.wd-testi-btn:hover {
	background: rgba(255,255,255,.04);
	border-color: var(--wd-accent);
	color: var(--wd-accent);
}
.wd-testi-btn:disabled { opacity: .35; cursor: not-allowed; }
.wd-testi-progress {
	flex: 1;
	height: 2px;
	background: var(--wd-line-w-strong);
	border-radius: 2px;
	overflow: hidden;
	position: relative;
}
.wd-testi-progress-bar {
	position: absolute;
	left: 0; top: 0; bottom: 0;
	background: var(--wd-accent);
	border-radius: 2px;
	transition: width .5s cubic-bezier(.2,.7,.2,1);
}


/* ============================================================
 * HEADER CART — thin cart icon + count badge + mini-cart dropdown
 * ============================================================ */
.wd-header-actions {
	display: flex;
	align-items: center;
	gap: 16px;
}

.wd-cart {
	position: relative;
}

.wd-cart-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px; height: 42px;
	border-radius: 50%;
	color: var(--wd-ink);
	text-decoration: none;
	transition: background .2s, color .2s;
}
.wd-cart-toggle:hover {
	background: rgba(255,255,255,.06);
	color: var(--wd-accent);
}
.wd-cart-toggle svg {
	width: 20px; height: 20px;
}

.wd-cart-count {
	position: absolute;
	top: -2px;
	right: -2px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--wd-accent-deep);
	color: #fff;
	font-family: var(--wd-font-mono);
	font-size: 10.5px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--wd-bg);
	line-height: 1;
	letter-spacing: 0;
	transition: transform .2s cubic-bezier(.4,2,.6,1);
}
.wd-cart-count.is-empty { display: none; }
.wd-header.solid .wd-cart-count { border-color: #0A0F1A; }

/* Cart-toggle animation when count changes */
.wd-cart-count.is-bumped { transform: scale(1.35); }

/* Mini-cart dropdown */
.wd-cart-dropdown {
	position: absolute;
	top: calc(100% + 14px);
	right: 0;
	width: 380px;
	max-width: 92vw;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 16px;
	padding: 22px;
	box-shadow: 0 24px 56px -16px rgba(0,0,0,.55);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity .25s, transform .25s, visibility .25s;
	z-index: 999;
}
.wd-cart-dropdown::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 14px;
	width: 12px; height: 12px;
	background: var(--wd-bg-card);
	border-top: 1px solid var(--wd-line-w-strong);
	border-left: 1px solid var(--wd-line-w-strong);
	transform: rotate(45deg);
}
.wd-cart.is-open .wd-cart-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Mobile: dropdown should fit the viewport — fixed positioning with 12px left-right gap */
@media (max-width: 768px) {
	.wd-cart-dropdown {
		position: fixed;
		top: 72px;
		right: 12px;
		left: 12px;
		width: auto;
		max-width: none;
		padding: 18px;
	}
	.wd-cart-dropdown::before {
		right: 48px;
	}
	/* Product names can be long → allow wrapping */
	.wd-cart-dropdown .woocommerce-mini-cart-item > a:not(.remove) {
		white-space: normal !important;
		word-break: break-word;
		overflow-wrap: break-word;
	}
}

/* Mini-cart content */
.wd-cart-dropdown .woocommerce-mini-cart {
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
	max-height: 360px;
	overflow-y: auto;
}
.wd-cart-dropdown .woocommerce-mini-cart::-webkit-scrollbar { width: 4px; }
.wd-cart-dropdown .woocommerce-mini-cart::-webkit-scrollbar-thumb { background: var(--wd-line-w-strong); border-radius: 2px; }

.wd-cart-dropdown .woocommerce-mini-cart__empty-message {
	margin: 0;
	padding: 24px 0;
	text-align: center;
	color: var(--wd-ink-mute);
	font-family: var(--wd-font-mono);
	font-size: 13px;
	letter-spacing: .04em;
}

.wd-cart-dropdown .woocommerce-mini-cart-item {
	display: grid !important;
	grid-template-columns: 48px 1fr auto;
	gap: 14px;
	padding: 14px 0 !important;
	margin: 0 !important;
	border-bottom: 1px solid var(--wd-line-w) !important;
	align-items: start;
	list-style: none !important;
}
.wd-cart-dropdown .woocommerce-mini-cart-item::before,
.wd-cart-dropdown .woocommerce-mini-cart-item::after { display: none !important; }
.wd-cart-dropdown .woocommerce-mini-cart-item:last-child { border-bottom: none !important; }

.wd-cart-dropdown .woocommerce-mini-cart-item > a:not(.remove) {
	grid-column: 2;
	grid-row: 1;
	color: var(--wd-ink) !important;
	font-family: var(--wd-font-display);
	font-size: 13.5px !important;
	font-weight: 500;
	line-height: 1.35;
	text-decoration: none !important;
	padding: 0 !important;
	letter-spacing: -.01em;
	display: block;
}
.wd-cart-dropdown .woocommerce-mini-cart-item > a:not(.remove):hover { color: var(--wd-accent) !important; }

/* Thumbnail (WC injects via title link) */
.wd-cart-dropdown .woocommerce-mini-cart-item img {
	grid-column: 1;
	grid-row: 1 / span 2;
	width: 48px !important;
	height: 48px !important;
	margin: 0 !important;
	border-radius: 8px;
	object-fit: cover;
	float: none !important;
	border: 1px solid var(--wd-line-w);
}

.wd-cart-dropdown .quantity {
	grid-column: 2;
	grid-row: 2;
	font-family: var(--wd-font-mono);
	font-size: 12px;
	color: var(--wd-ink-soft);
	margin-top: 4px;
	display: block;
}
.wd-cart-dropdown .quantity .amount {
	color: var(--wd-accent);
	font-weight: 600;
}

.wd-cart-dropdown a.remove {
	grid-column: 3;
	grid-row: 1;
	position: static !important;
	width: 22px; height: 22px;
	display: inline-flex !important;
	align-items: center; justify-content: center;
	border-radius: 50%;
	background: transparent !important;
	color: var(--wd-ink-mute) !important;
	font-size: 14px !important;
	line-height: 1 !important;
	text-decoration: none !important;
	transition: background .15s, color .15s;
}
.wd-cart-dropdown a.remove:hover {
	background: rgba(209,75,62,.15) !important;
	color: #D14B3E !important;
}

/* Mini-cart total + buttons */
.wd-cart-dropdown .woocommerce-mini-cart__total {
	display: flex !important;
	justify-content: space-between;
	align-items: baseline;
	padding: 14px 0 !important;
	margin: 0 0 14px !important;
	border-top: 1px solid var(--wd-line-w) !important;
	font-family: var(--wd-font-mono);
	font-size: 12.5px !important;
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
	text-transform: uppercase;
}
.wd-cart-dropdown .woocommerce-mini-cart__total strong,
.wd-cart-dropdown .woocommerce-mini-cart__total .amount {
	color: var(--wd-ink) !important;
	font-family: var(--wd-font-display);
	font-size: 18px !important;
	font-weight: 600 !important;
	letter-spacing: -.01em;
	text-transform: none;
}

.wd-cart-dropdown .woocommerce-mini-cart__buttons {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 0 !important;
	padding: 0 !important;
}
.wd-cart-dropdown .woocommerce-mini-cart__buttons .button {
	display: block !important;
	text-align: center;
	padding: 12px 14px !important;
	margin: 0 !important;
	font-size: 12.5px !important;
	border-radius: 10px !important;
	font-family: var(--wd-font-body) !important;
	font-weight: 500 !important;
	letter-spacing: .04em !important;
	text-transform: uppercase !important;
}
.wd-cart-dropdown .woocommerce-mini-cart__buttons .button.wc-forward {
	background: rgba(255,255,255,.06) !important;
	color: var(--wd-ink) !important;
	border: 1px solid var(--wd-line-w-strong) !important;
}
.wd-cart-dropdown .woocommerce-mini-cart__buttons .button.checkout {
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border: 1px solid var(--wd-accent-deep) !important;
}
.wd-cart-dropdown .woocommerce-mini-cart__buttons .button:hover {
	transform: translateY(-1px);
}

/* Cart toggle visibility on mobile */
@media (max-width: 768px) {
	.wd-cart-dropdown {
		width: 320px;
		right: -8px;
	}
}


/* ============================================================
 * CHECKOUT — Order summary card layout fix
 * Product description was overflowing in the order summary → hide + compact grid.
 * ============================================================ */
.woocommerce-checkout #order_review,
.woocommerce form.checkout #order_review {
	background: linear-gradient(180deg, var(--wd-bg-card), rgba(31,45,92,.4));
	border: 1px solid rgba(236,122,26,.22);
	border-radius: 20px;
	padding: 36px 40px;
	box-shadow:
		0 24px 60px rgba(0,0,0,.32),
		0 4px 24px rgba(236,122,26,.08),
		inset 0 1px 0 rgba(255,179,71,.06);
	position: relative;
	overflow: hidden;
}
.woocommerce-checkout #order_review::after,
.woocommerce form.checkout #order_review::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, #EC7A1A, #FFB347, #FFCB6B);
	pointer-events: none;
}
/* Total amount in copper accent */
.woocommerce-checkout-review-order-table tfoot .order-total .amount,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	color: var(--wd-warm) !important;
	font-weight: 700 !important;
	font-family: var(--wd-font-display);
	text-shadow: 0 0 24px rgba(236,122,26,.3);
}
.woocommerce-checkout #order_review_heading,
.woocommerce form.checkout #order_review_heading {
	font-family: var(--wd-font-display);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink);
	margin: 0 0 20px;
	padding: 0;
	border: none;
}

/* Order review table */
.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	margin: 0 !important;
}
.woocommerce-checkout-review-order-table thead { display: none; }

.woocommerce-checkout-review-order-table .cart_item {
	border-bottom: 1px solid rgba(236,122,26,.08);  /* copper-toned divider */
}
.woocommerce-checkout-review-order-table .cart_item td {
	padding: 18px 16px !important;  /* increase side padding — keep it off the edge */
	border: none !important;
	background: transparent !important;
	vertical-align: middle;
}
.woocommerce-checkout-review-order-table .cart_item:hover td {
	background: rgba(236,122,26,.03) !important;  /* slight warmth on hover */
}
.woocommerce-checkout-review-order-table .cart_item td:first-child {
	padding-left: 18px !important;
}
.woocommerce-checkout-review-order-table .cart_item td:last-child {
	padding-right: 18px !important;
}

/* Product row: thumbnail + name + qty chip — flex aligned */
.wd-co-item-row {
	display: flex;
	align-items: center;
	gap: 14px;
}
.wd-co-item-thumb {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid rgba(236,122,26,.18);
	flex-shrink: 0;
	box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
.wd-co-item-text {
	flex: 1;
	min-width: 0;
	line-height: 1.4;
}
.wd-co-item-text a {
	color: var(--wd-ink) !important;
	text-decoration: none;
}
/* Quantity chip — copper accent, inline next to the name */
.wd-co-item-qty {
	display: inline-block;
	margin-left: 10px;
	padding: 2px 10px;
	font-family: var(--wd-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .03em;
	color: var(--wd-warm);
	background: rgba(236,122,26,.10);
	border: 1px solid rgba(236,122,26,.22);
	border-radius: 999px;
	vertical-align: middle;
	white-space: nowrap;
}
/* Mobile — shrink thumbnail slightly, tighten gap */
@media (max-width: 600px) {
	.wd-co-item-thumb { width: 40px; height: 40px; }
	.wd-co-item-row { gap: 10px; }
	.wd-co-item-qty { margin-left: 6px; padding: 1px 8px; font-size: 10px; }
}
/* Subtotal, Tax, Total rows (tfoot) — add horizontal padding */
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
	padding: 16px !important;
	border-top: 1px solid rgba(236,122,26,.10) !important;
	border-bottom: none !important;
}
.woocommerce-checkout-review-order-table tfoot th:first-child,
.woocommerce-checkout-review-order-table tfoot td:first-child {
	padding-left: 18px !important;  /* same side spacing as items */
}
.woocommerce-checkout-review-order-table tfoot th:last-child,
.woocommerce-checkout-review-order-table tfoot td:last-child {
	padding-right: 18px !important;
}
/* A bit more breathing room on the total row */
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	padding-top: 22px !important;
	padding-bottom: 8px !important;
}

/* Product cell: image + name stacked vertically, description hidden */
.woocommerce-checkout-review-order-table .product-name {
	font-family: var(--wd-font-display);
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--wd-ink) !important;
	line-height: 1.4;
	padding-right: 12px !important;
	word-break: normal;
}
.woocommerce-checkout-review-order-table .product-name strong.product-quantity {
	display: inline-block;
	margin-left: 6px;
	font-family: var(--wd-font-mono);
	font-size: 11px;
	font-weight: 600;
	color: var(--wd-accent);
	background: var(--wd-accent-soft);
	padding: 2px 8px;
	border-radius: 999px;
}

/* WC sometimes injects short_description or custom dl/p — hide all of them */
.woocommerce-checkout-review-order-table .product-name dl,
.woocommerce-checkout-review-order-table .product-name p,
.woocommerce-checkout-review-order-table .product-name > div:not(.variation),
.woocommerce-checkout-review-order-table .product-name .description,
.woocommerce-checkout-review-order-table .product-name .wc-item-meta,
.woocommerce-checkout-review-order-table .product-name .woocommerce-Price-amount + .description,
.woocommerce-mini-cart-item .description,
.woocommerce-mini-cart-item p {
	display: none !important;
}

/* ============================================================
 * CLASSIC CHECKOUT — 2-column grid layout
 * Container: pin the form to a 1200px max-width, centered on the page.
 * Left: customer_details (billing + extra info stacked + billing type)
 * Right: order_review (sticky) — fills the space on the right side.
 * ============================================================ */

/* The form was staying narrow on the left of the page — center it + set max-width.
 * The form's own max-width is already supplied by the parent (wd-shop-section). */
form.checkout.woocommerce-checkout {
	max-width: none;
	margin-inline: 0;
	width: 100%;
	box-sizing: border-box;
}

/* Checkout page overall atmosphere — soften the title + coupon bar */
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout main h1.entry-title,
body.woocommerce-checkout main .page-title {
	max-width: none;
	margin: 0 0 8px !important;
	font-family: var(--wd-font-display);
	letter-spacing: -.025em;
}

/* Top info strip — Secure payment · SSL · Data privacy */
body.woocommerce-checkout main::before {
	content: "";
	display: block;
	max-width: 1760px;
	height: 1px;
	margin: 0 auto 32px;
}
form.checkout.woocommerce-checkout > .woocommerce-info,
form.checkout.woocommerce-checkout > .woocommerce-form-coupon-toggle {
	max-width: 720px;
	margin-inline: 0 !important;
	margin-bottom: 32px !important;
	background: linear-gradient(135deg, rgba(42,91,255,.06), rgba(42,91,255,.02)) !important;
	border: 1px solid rgba(42,91,255,.25) !important;
	border-radius: 12px !important;
	padding: 18px 22px !important;
}

/* Section headings — Billing details, Additional info */
form.checkout #customer_details h3,
form.checkout #order_review_heading {
	font-family: var(--wd-font-display);
	font-size: 26px !important;
	font-weight: 600 !important;
	letter-spacing: -.025em;
	color: var(--wd-ink);
	margin: 0 0 24px !important;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--wd-line-w);
	position: relative;
}
form.checkout #customer_details h3::before,
form.checkout #order_review_heading::before {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 48px;
	height: 2px;
	background: linear-gradient(90deg, #EC7A1A, #FFB347);
	border-radius: 2px;
}

/* Form inputs — more modern */
form.checkout .input-text,
form.checkout select,
form.checkout textarea {
	padding: 14px 16px !important;
	border-radius: 10px !important;
	border: 1px solid var(--wd-line-w) !important;
	background: rgba(255,255,255,.02) !important;
	color: var(--wd-ink) !important;
	font-size: 14px !important;
	transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
form.checkout .input-text:focus,
form.checkout select:focus,
form.checkout textarea:focus {
	outline: none;
	border-color: var(--wd-accent) !important;
	background: rgba(42,91,255,.04) !important;
	box-shadow: 0 0 0 3px rgba(42,91,255,.12);
}
form.checkout label {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wd-muted);
	margin-bottom: 6px !important;
	display: block;
}

/* ============================================================
 * CART — More compact, balanced cart page layout
 * Uses the same edge-to-edge wrap as checkout, but the content max-width
 * is pinned to 1400px — so when the cart holds few items the page still
 * looks visually balanced, without a giant gap in the middle.
 * ============================================================ */
body.woocommerce-cart .wd-page-wc-wrap {
	max-width: 1400px;
	margin-inline: auto;
}

@media (min-width: 992px) {
	/* Shortcode cart layout */
	body.woocommerce-cart .wd-page-wc-wrap .woocommerce {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 360px;
		column-gap: 48px;
		align-items: start;
	}
	body.woocommerce-cart .woocommerce-notices-wrapper {
		grid-column: 1 / -1;
	}
	body.woocommerce-cart .woocommerce-cart-form {
		grid-column: 1;
		min-width: 0;
	}
	body.woocommerce-cart .cart-collaterals {
		grid-column: 2;
		width: 100% !important;
		max-width: 100% !important;
		float: none !important;
		position: sticky;
		top: 96px;
	}
	body.woocommerce-cart .cart-collaterals .cart_totals,
	body.woocommerce-cart .cart-collaterals .shipping-calculator-form,
	body.woocommerce-cart .cart-collaterals > * {
		width: 100% !important;
		max-width: 100% !important;
		float: none !important;
	}

	/* Block cart layout (Gutenberg) — convert the sidebar-layout flex to grid.
	 * Independent of the existing block cart CSS (4555+), guaranteed under .wd-page-wc-wrap. */
	body.woocommerce-cart .wd-page-wc-wrap .wp-block-woocommerce-cart,
	body.woocommerce-cart .wd-page-wc-wrap .wp-block-woocommerce-filled-cart-block {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 360px;
		column-gap: 48px;
		align-items: start;
	}
	body.woocommerce-cart .wd-page-wc-wrap .wc-block-components-sidebar-layout {
		display: contents;
	}
	body.woocommerce-cart .wd-page-wc-wrap .wp-block-woocommerce-cart-items-block,
	body.woocommerce-cart .wd-page-wc-wrap .wc-block-cart__main {
		grid-column: 1;
		min-width: 0;
	}
	body.woocommerce-cart .wd-page-wc-wrap .wp-block-woocommerce-cart-totals-block,
	body.woocommerce-cart .wd-page-wc-wrap .wc-block-cart__sidebar {
		grid-column: 2;
		position: sticky;
		top: 96px;
	}
}

/* Block cart items header row: PRODUCT | TOTAL — in our grid layout
 * the TOTAL heading ended up floating in empty space. Just hide the "Total" header. */
body.woocommerce-cart .wc-block-cart-items__header-total,
body.woocommerce-cart .wc-block-cart-items .wc-block-cart-items__header-total {
	display: none !important;
}
/* General header row — keep the "Product" heading looking good if it ends up alone */
body.woocommerce-cart .wc-block-cart-items__header {
	font-family: var(--wd-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wd-muted);
}

/* Cart totals card — same premium look as the checkout order_review */
/* "Cart" / "Checkout" heading — copper/orange gradient text + soft glow + background decor.
 * Shared by both the cart and checkout pages (.wd-page-wc-wrap wraps both). */
body.woocommerce-cart .wd-page-wc-title,
body.woocommerce-checkout .wd-page-wc-title {
	background: linear-gradient(135deg, #EC7A1A 0%, #FF9530 30%, #FFB347 60%, #FFCB6B 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent !important;
	filter: drop-shadow(0 4px 32px rgba(236,122,26,.35));
	position: relative;
	display: inline-block;
	z-index: 1;
}
body.woocommerce-cart .wd-page-wc-title::before,
body.woocommerce-checkout .wd-page-wc-title::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -10%;
	right: -10%;
	height: 240px;
	background:
		radial-gradient(ellipse 60% 50% at 50% 50%, rgba(236,122,26,.18), transparent 70%),
		radial-gradient(ellipse 30% 40% at 20% 30%, rgba(255,179,71,.12), transparent 60%);
	transform: translateY(-50%);
	z-index: -1;
	pointer-events: none;
	filter: blur(20px);
}

body.woocommerce-cart .cart_totals,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block {
	background: linear-gradient(180deg, var(--wd-bg-card), rgba(31,45,92,.4));
	border: 1px solid rgba(236,122,26,.22);
	border-radius: 20px;
	padding: 32px 36px;
	box-shadow:
		0 24px 60px rgba(0,0,0,.32),
		0 4px 24px rgba(236,122,26,.08),
		inset 0 1px 0 rgba(255,179,71,.06);
	position: relative;
	overflow: hidden;
}
body.woocommerce-cart .cart_totals::after,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, #EC7A1A, #FFB347, #FFCB6B);
	pointer-events: none;
}
body.woocommerce-cart .cart_totals h2 {
	font-family: var(--wd-font-display);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wd-muted);
	margin: 0 0 20px;
}
body.woocommerce-cart .cart_totals table.shop_table {
	border: none;
	width: 100%;
}
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
	padding: 14px 4px !important;
	border: none !important;
	background: transparent !important;
}
/* Amount in the total row is copper-orange, with a subtle glow */
body.woocommerce-cart .cart_totals .order-total .amount,
body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-formatted-money-amount,
body.woocommerce-cart .wc-block-components-totals-item__value {
	color: var(--wd-warm) !important;
	font-weight: 700;
	font-family: var(--wd-font-display);
	letter-spacing: -.01em;
	text-shadow: 0 0 24px rgba(236,122,26,.3);
}
body.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
	margin-top: 20px;
	padding: 0;
}

/* "Proceed to Checkout" CTA button — copper gradient + subtle elegant glow */
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button,
body.woocommerce-cart .wc-block-cart__submit-button,
body.woocommerce-cart .wp-block-button__link {
	width: 100%;
	background: linear-gradient(135deg, #EC7A1A 0%, #F5994C 50%, #FFB347 100%) !important;
	background-size: 200% 100% !important;
	background-position: 0 0 !important;
	color: #fff !important;
	padding: 18px 24px !important;
	font-family: var(--wd-font-display);
	font-size: 14px !important;
	font-weight: 600 !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-radius: 999px;  /* full pill — the soft rounded look from the reference */
	border: none;
	box-shadow:
		0 6px 18px rgba(236,122,26,.22),
		0 1px 4px rgba(236,122,26,.1),
		inset 0 1px 0 rgba(255,255,255,.22);
	transition: background-position .35s ease, box-shadow .2s ease, transform .12s ease;
	text-align: center;
	display: block;
	text-decoration: none;
	position: relative;
	overflow: hidden;
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover,
body.woocommerce-cart .wc-block-cart__submit-button:hover {
	background-position: 100% 0 !important;
	box-shadow:
		0 10px 28px rgba(236,122,26,.32),
		0 2px 6px rgba(236,122,26,.16),
		inset 0 1px 0 rgba(255,255,255,.28);
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:active {
	transform: translateY(1px);
}

/* SHIPPING OPTIONS — removed (user request)
 * Shortcode cart: shipping-calculator-form inside cart_totals
 * Block cart: wp-block-woocommerce-cart-shipping-block + rates control */
body.woocommerce-cart .shipping-calculator-form,
body.woocommerce-cart .woocommerce-shipping-calculator,
body.woocommerce-cart .wp-block-woocommerce-cart-shipping-block,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block,
body.woocommerce-cart .wc-block-components-shipping-rates-control,
body.woocommerce-cart .wc-block-cart__shipping,
body.woocommerce-cart .wc-block-components-totals-shipping,
body.woocommerce-cart tr.shipping,
body.woocommerce-cart .cart_totals .shipping,
body.woocommerce-cart .woocommerce-shipping-totals,
body.woocommerce-cart .woocommerce-shipping-destination,
body.woocommerce-cart .woocommerce-shipping-methods {
	display: none !important;
}

/* Cart items table — more modern, less thumbnail clutter */
body.woocommerce-cart table.shop_table.cart {
	border: 1px solid var(--wd-line-w);
	border-radius: 16px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	background: var(--wd-bg-card);
}
body.woocommerce-cart table.shop_table.cart thead th {
	padding: 16px 20px;
	font-family: var(--wd-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wd-muted);
	border-bottom: 1px solid var(--wd-line-w);
	background: transparent;
}
body.woocommerce-cart table.shop_table.cart tbody td {
	padding: 20px;
	border-bottom: 1px solid var(--wd-line-w);
	background: transparent;
	vertical-align: middle;
}
body.woocommerce-cart table.shop_table.cart tbody tr:last-child td {
	border-bottom: none;
}
body.woocommerce-cart table.shop_table.cart td.product-thumbnail {
	width: 100px;
}
body.woocommerce-cart table.shop_table.cart td.product-thumbnail img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 12px;
}

/* Checkout / Cart / My-Account pages use the page.php template —
 * normally that wraps content in a narrow prose wrapper with inline max-width:820px.
 * For these pages, page.php conditionally applies the .wd-page-wc-wrap class,
 * and here we give that class a wide layout. */
.wd-page-wc-wrap {
	max-width: 100%;
	width: 100%;
	margin: 0;
	padding: 64px clamp(20px, 3vw, 64px) 120px;
	box-sizing: border-box;
}
.wd-page-wc-title {
	font-family: var(--wd-font-display);
	font-size: clamp(36px, 4.4vw, 64px);
	font-weight: 600;
	letter-spacing: -.03em;
	line-height: 1.05;
	margin: 0 0 32px;
	color: var(--wd-ink);
}
.wd-prose--wide {
	max-width: none;
	width: 100%;
}

@media (min-width: 992px) {
	form.checkout.woocommerce-checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 64px;
		align-items: start;
	}
	form.checkout > #customer_details {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}
	/* Hide the standalone heading — we print it instead via ::before inside #order_review.
	   Otherwise the heading sits alone at the top of row 1, leaving a long gap below it. */
	form.checkout > #order_review_heading {
		display: none !important;
	}
	form.checkout > #order_review {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: 96px;
	}
	/* Move the "Your Order" heading inside the #order_review box */
	form.checkout > #order_review::before {
		content: "Your Order";
		display: block;
		font-family: var(--wd-font-display);
		font-size: 22px;
		font-weight: 600;
		letter-spacing: -.02em;
		color: var(--wd-ink);
		margin: 0 0 20px;
	}
	/* Stack billing and additional info vertically in the left column */
	form.checkout #customer_details .col2-set,
	form.checkout #customer_details > .col2-set {
		display: block !important;
	}
	form.checkout #customer_details .col-1,
	form.checkout #customer_details .col-2 {
		width: 100% !important;
		float: none !important;
		max-width: none !important;
		margin: 0 0 24px !important;
	}
}

/* Mobile: heading is always visible */
@media (max-width: 991px) {
	form.checkout > #order_review::before {
		display: none;
	}
}

/* ============================================================
 * BILLING TYPE — Billing type (Individual/Corporate) + National ID/Tax ID
 * ============================================================ */
.wd-billing-type {
	margin: 24px 0;
	padding: 20px;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 12px;
}
.wd-billing-type h3 {
	font-family: var(--wd-font-display);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -.01em;
	color: var(--wd-ink);
	margin: 0 0 14px;
}
.wd-billing-type-radios {
	display: flex !important;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0 0 16px !important;
}
.wd-billing-radio {
	flex: 1 1 auto;
	min-width: 180px;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	background: rgba(255,255,255,.02);
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	cursor: pointer;
	transition: border-color .15s ease, background .15s ease;
}
.wd-billing-radio:hover {
	border-color: var(--wd-accent);
	background: var(--wd-accent-soft);
}
.wd-billing-radio input[type="radio"] {
	margin: 0;
	accent-color: var(--wd-accent);
	cursor: pointer;
}
.wd-billing-radio input[type="radio"]:checked + span {
	color: var(--wd-accent);
	font-weight: 600;
}
.wd-billing-radio span {
	font-family: var(--wd-font-display);
	font-size: 14px;
	color: var(--wd-ink);
}
.wd-billing-type label .wd-help {
	display: inline-block;
	margin-left: 6px;
	font-size: 11px;
	color: var(--wd-muted);
	font-weight: 400;
}
.wd-billing-type input[type="text"] {
	width: 100%;
	padding: 12px 14px;
	background: rgba(255,255,255,.02);
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	color: var(--wd-ink);
	font-family: var(--wd-font-mono);
	font-size: 14px;
	letter-spacing: .02em;
	box-sizing: border-box;
}
.wd-billing-type input[type="text"]:focus {
	outline: none;
	border-color: var(--wd-accent);
	background: rgba(42,91,255,.06);
	box-shadow: 0 0 0 3px rgba(42,91,255,.12);
}
.wd-billing-type p[hidden],
.wd-billing-type div[hidden] {
	display: none !important;
}

/* Keep the Individual and Corporate field groups contained within their box, no overflow.
 * In WC's default, .form-row-first/last use float:left/right 48% — which overflows.
 * Here we use flex/grid, overriding the float. */
.wd-billing-type .wd-billing-type-bireysel-row,
.wd-billing-type .wd-billing-type-kurumsal-grid {
	margin-top: 4px;
}
.wd-billing-type .wd-billing-type-bireysel-row {
	display: block;
}
.wd-billing-type .wd-billing-type-kurumsal-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
@media (max-width: 600px) {
	.wd-billing-type .wd-billing-type-kurumsal-grid {
		grid-template-columns: 1fr;
	}
}
.wd-billing-type .wd-billing-type-bireysel-row p.form-row,
.wd-billing-type .wd-billing-type-kurumsal-grid p.form-row {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}


/* ============================================================
 * BLOCK CHECKOUT (WC 9+) — New Gutenberg-based checkout layout.
 * The product's short description was breaking the order summary layout → disabled.
 * ============================================================ */

/* Checkout 2-col layout — form flexibly wide, sidebar fixed ~340px.
 * WC's actual layout container is `.wc-block-components-sidebar-layout` (flex inside).
 * Converting this to grid is more correct than overriding the TOP wrapper.
 * Also gives block children an explicit grid-column and width override. */
.wc-block-components-sidebar-layout,
.wp-block-woocommerce-checkout > .wc-block-components-sidebar-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 285px !important;
	gap: 48px !important;
	width: 100% !important;
	margin: 0 !important;
	align-items: start !important;
}
@media (min-width: 1400px) {
	.wc-block-components-sidebar-layout {
		grid-template-columns: minmax(0, 1fr) 315px !important;
		gap: 56px !important;
	}
}
@media (max-width: 1024px) {
	.wc-block-components-sidebar-layout {
		grid-template-columns: 1fr !important;
		gap: 32px !important;
	}
}
/* Mobile: tighten container padding + sidebar flows below the form */
@media (max-width: 767px) {
	.wc-block-components-sidebar-layout,
	.wp-block-woocommerce-checkout > .wc-block-components-sidebar-layout {
		gap: 24px !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.wp-block-woocommerce-checkout { padding: 16px !important; }
}

/* ============================================================
 * BLOCK CART (WC 9+) — Cart block mobile + desktop layout
 * WC cart block's actual container: `.wp-block-woocommerce-filled-cart-block`
 * (with cart-items-block + cart-totals-block inside via flex). The
 * selector list is kept broad to catch all variations.
 * ============================================================ */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-filled-cart-block {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

/* Outer flex/grid container — covers both new and old class names */
.wp-block-woocommerce-filled-cart-block,
.wc-block-cart,
.wp-block-woocommerce-cart .wc-block-components-sidebar-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 320px !important;
	gap: 48px !important;
	align-items: start !important;
	width: 100% !important;
	margin: 0 !important;
}

/* Left column — cart items */
.wp-block-woocommerce-cart-items-block,
.wc-block-cart__main,
.wc-block-cart .wc-block-components-main {
	grid-column: 1 !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	flex: none !important;
}

/* Right column — totals/summary */
.wp-block-woocommerce-cart-totals-block,
.wc-block-cart__sidebar,
.wc-block-cart .wc-block-components-sidebar {
	grid-column: 2 !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	flex: none !important;
}

/* Tablet and mobile — single column */
@media (max-width: 1024px) {
	.wp-block-woocommerce-filled-cart-block,
	.wc-block-cart,
	.wp-block-woocommerce-cart .wc-block-components-sidebar-layout {
		grid-template-columns: 1fr !important;
		gap: 32px !important;
	}
	.wp-block-woocommerce-cart-items-block,
	.wp-block-woocommerce-cart-totals-block,
	.wc-block-cart__main,
	.wc-block-cart__sidebar {
		grid-column: 1 !important;
		width: 100% !important;
	}
}
@media (max-width: 767px) {
	.wp-block-woocommerce-cart { padding: 16px !important; }
	.wp-block-woocommerce-filled-cart-block,
	.wc-block-cart,
	.wp-block-woocommerce-cart .wc-block-components-sidebar-layout { gap: 24px !important; }
}

/* Same coverage for the checkout block (WC9 actual classes) */
.wp-block-woocommerce-checkout-fields-block,
.wp-block-woocommerce-checkout-totals-block {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	flex: none !important;
	box-sizing: border-box !important;
}
@media (max-width: 1024px) {
	.wp-block-woocommerce-checkout-fields-block,
	.wp-block-woocommerce-checkout-totals-block {
		grid-column: 1 !important;
	}
}

/* Cart product row — image + name + price + trash alignment */
.wc-block-cart-items {
	width: 100% !important;
	border-collapse: collapse;
}
/* Cart row — simple FLEX, not GRID. Grid auto-placement behaved unpredictably
   with TR/TD; flex is safer. */
.wc-block-cart-items__row,
.wc-block-cart-item {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;
	gap: 16px !important;
	padding: 20px 0 !important;
	border-bottom: 1px solid var(--wd-line-w);
	width: 100% !important;
}
.wc-block-cart-item__image,
.wc-block-cart-items__row .wc-block-cart-item__image {
	flex: 0 0 88px !important;
	width: 88px !important;
	height: 88px !important;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--wd-line-w);
	display: block !important; /* td override */
}
.wc-block-cart-item__image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}
.wc-block-cart-item__product {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: block !important;
}
.wc-block-cart-item__total {
	flex: 0 0 auto !important;
	font-family: var(--wd-font-mono);
	font-weight: 600;
	color: var(--wd-accent) !important;
	white-space: nowrap;
	display: block !important;
	text-align: right;
	min-width: 80px;
}

/* Content of the __product td — stacked vertically via flex column inside __wrap */
.wc-block-cart-item__wrap {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	align-items: flex-start !important;
}

/* Duplicate price — __prices on the left and __total on the right print the same value;
   hide __prices so it doesn't overlap the product name */
.wc-block-cart-item__product .wc-block-cart-item__prices,
.wc-block-cart-item__product .wc-block-components-product-price {
	display: none !important;
}

/* __quantity and __remove-link are children of __product, NOT items of the parent grid —
   reset the grid placement overrides so they flow normally */
.wc-block-cart-item__quantity {
	grid-column: auto !important;
	grid-row: auto !important;
	margin-top: 4px !important;
}
.wc-block-cart-item__remove-link {
	grid-column: auto !important;
	grid-row: auto !important;
	background: transparent !important;
	border: none !important;
	padding: 4px !important;
	cursor: pointer;
	color: var(--wd-ink-mute) !important;
	transition: color .15s;
}
.wc-block-cart-item__remove-link:hover {
	color: var(--wd-warm) !important;
}
.wc-block-cart-item__remove-link svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* Description text (workshop description), small and plain */
.wc-block-components-product-metadata {
	font-size: 13px;
	color: var(--wd-ink-mute);
	line-height: 1.5;
}
.wc-block-components-product-metadata p { margin: 0; }
.wc-block-components-product-name {
	font-family: var(--wd-font-display);
	font-size: 15px;
	font-weight: 500;
	color: var(--wd-ink) !important;
	line-height: 1.4;
}

/* More compact cart item on mobile */
@media (max-width: 480px) {
	.wc-block-cart-items__row,
	.wc-block-cart-item {
		grid-template-columns: 64px minmax(0, 1fr) auto !important;
		column-gap: 12px !important;
		padding: 16px 0 !important;
	}
	.wc-block-cart-item__image { width: 64px !important; height: 64px !important; }
	.wc-block-components-product-name { font-size: 14px; }
	.wc-block-cart-item__total { font-size: 14px; }
}

/* Cart summary sidebar — card look */
.wp-block-woocommerce-cart-order-summary-block,
.wc-block-components-totals-wrapper {
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 16px;
	padding: 24px !important;
	box-sizing: border-box;
}
.wc-block-components-totals-coupon {
	background: transparent !important;
	border: none !important;
}
.wc-block-components-totals-coupon__button {
	color: var(--wd-accent) !important;
	background: transparent !important;
	border: none !important;
}

/* Proceed to checkout button (cart) */
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button,
.wc-block-cart__submit-container .wc-block-components-button {
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border-radius: 12px !important;
	padding: 16px 28px !important;
	font-family: var(--wd-font-body) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	width: 100% !important;
	border: none !important;
}
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button:hover {
	background: #3A6BFF !important;
}

/* Left: main form content */
.wc-block-components-sidebar-layout > .wc-block-components-main,
.wc-block-components-main {
	flex: none !important;
	grid-column: 1 !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	padding: 0 !important;
}

/* Right: sidebar (order summary) */
.wc-block-components-sidebar-layout > .wc-block-components-sidebar,
.wc-block-components-sidebar {
	flex: none !important;
	grid-column: 2 !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	padding: 0 !important;
}
@media (max-width: 1024px) {
	.wc-block-components-main,
	.wc-block-components-sidebar {
		grid-column: 1 !important;
	}
}

/* Order summary panel card */
.wp-block-woocommerce-checkout-order-summary-block {
	background: var(--wd-bg-card) !important;
	border: 1px solid var(--wd-line-w) !important;
	border-radius: 16px !important;
	padding: 28px !important;
	color: var(--wd-ink) !important;
}

.wc-block-components-checkout-order-summary__title,
.wc-block-components-totals-item__label {
	font-family: var(--wd-font-display);
	color: var(--wd-ink) !important;
	letter-spacing: -.01em;
}
.wc-block-components-checkout-order-summary__title {
	font-size: 18px !important;
	font-weight: 600 !important;
	margin: 0 0 18px !important;
}

/* Product card — explicit 2-col grid (image + content), price overlaid top-right
 * minmax(0, 1fr) prevents the description column from collapsing to min-content. */
.wc-block-components-order-summary-item {
	display: grid !important;
	grid-template-columns: 48px minmax(0, 1fr) !important;
	column-gap: 14px !important;
	row-gap: 4px !important;
	padding: 14px 0 !important;
	border-bottom: 1px solid var(--wd-line-w);
	align-items: start !important;
	word-break: normal !important;
}
.wc-block-components-order-summary-item:last-of-type { border-bottom: none; }

.wc-block-components-order-summary-item__image {
	grid-column: 1 !important;
	grid-row: 1 / span 3 !important;
	width: 48px !important;
	height: 48px !important;
	border-radius: 8px !important;
	overflow: hidden !important;
	border: 1px solid var(--wd-line-w);
	margin: 0 !important;
}
.wc-block-components-order-summary-item__image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	border-radius: 0 !important;
}

.wc-block-components-order-summary-item__description {
	grid-column: 2 !important;
	grid-row: 1 !important;
	min-width: 0 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}

.wc-block-components-order-summary-item__total-price {
	grid-column: 2 !important;
	grid-row: 2 !important;
	text-align: left !important;
	font-family: var(--wd-font-mono) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: var(--wd-accent) !important;
	white-space: nowrap;
	margin-top: 4px !important;
}

.wc-block-components-product-name {
	font-family: var(--wd-font-display) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--wd-ink) !important;
	line-height: 1.4 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}

/* Quantity badge */
.wc-block-components-order-summary-item__quantity {
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border: 2px solid var(--wd-bg-card) !important;
}

/* DESCRIPTION + INDIVIDUAL-PRICES + SALE BADGE — all of these break the layout, hide them */
.wc-block-components-product-metadata__description,
.wc-block-components-product-details,
.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-sale-badge,
.wc-block-components-order-summary-item-detail,
.wc-block-components-product-metadata > p:not(.wc-block-components-product-name),
.wc-block-components-order-summary-item__description .wc-block-components-product-price,
.wc-block-components-order-summary-item__description .wc-block-components-product-metadata {
	display: none !important;
}

/* Totals — subtotals */
.wc-block-components-totals-item {
	font-family: var(--wd-font-body) !important;
	color: var(--wd-ink-soft) !important;
	padding: 10px 0 !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-family: var(--wd-font-display) !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: var(--wd-ink) !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--wd-accent) !important;
}

/* Left column — form sections */
.wp-block-woocommerce-checkout .wc-block-components-checkout-step {
	background: transparent !important;
	border: none !important;
	padding: 0 0 32px !important;
}
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__heading {
	font-family: var(--wd-font-display) !important;
	font-size: 20px !important;
	font-weight: 600 !important;
	color: var(--wd-ink) !important;
	letter-spacing: -.015em;
	margin: 0 0 16px !important;
}
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__description {
	color: var(--wd-ink-soft) !important;
	font-size: 14px !important;
}

/* Floating label inputs (block checkout standard) */
.wc-block-components-text-input,
.wc-block-components-select,
.wc-block-components-country-input,
.wc-block-components-state-input {
	background: rgba(255,255,255,.03) !important;
	border: 1px solid var(--wd-line-w-strong) !important;
	border-radius: 10px !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}
.wc-block-components-text-input input,
.wc-block-components-select select {
	width: 100% !important;
	box-sizing: border-box !important;
}
/* Form-row container — sometimes a 2-col layout, single col on mobile */
.wc-block-components-address-form,
.wc-block-components-address-form > * {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}
@media (max-width: 767px) {
	.wc-block-components-address-form {
		grid-template-columns: 1fr !important;
		display: grid !important;
		gap: 12px !important;
	}
	.wc-block-components-address-form > * {
		grid-column: 1 !important;
	}
}

/* Form section container — flex/align reset, children should not shrink
 * The steps in the checkout block form and the blocks inside them sometimes
 * collapse to intrinsic width when combined with `align-items: flex-start`. */
.wp-block-woocommerce-checkout-contact-information-block,
.wp-block-woocommerce-checkout-billing-address-block,
.wp-block-woocommerce-checkout-shipping-address-block,
.wp-block-woocommerce-checkout-shipping-method-block,
.wp-block-woocommerce-checkout-payment-block,
.wp-block-woocommerce-checkout-actions-block,
.wc-block-components-checkout-step,
.wc-block-components-checkout-step__content {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
	display: block !important;
}

/* All input wrappers should flex freely on mobile */
@media (max-width: 1024px) {
	.wc-block-components-text-input,
	.wc-block-components-select,
	.wc-block-components-country-input,
	.wc-block-components-state-input,
	.wc-block-components-quantity-selector,
	.wd-otp-panel {
		width: 100% !important;
		max-width: 100% !important;
		flex: 1 1 100% !important;
	}
}
.wc-block-components-text-input input,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-select select {
	background: transparent !important;
	color: var(--wd-ink) !important;
	border: none !important;
	font-family: var(--wd-font-body);
}
.wc-block-components-text-input label,
.wc-block-components-select label {
	color: var(--wd-ink-mute) !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-select.is-active label,
.wc-block-components-text-input:focus-within label,
.wc-block-components-select:focus-within label {
	color: var(--wd-accent) !important;
}
.wc-block-components-text-input.is-active,
.wc-block-components-select.is-active,
.wc-block-components-text-input:focus-within,
.wc-block-components-select:focus-within {
	border-color: var(--wd-accent) !important;
}

/* Place order button (block) */
.wc-block-components-checkout-place-order-button {
	background: var(--wd-accent-deep) !important;
	color: #fff !important;
	border-radius: 12px !important;
	padding: 16px 28px !important;
	font-family: var(--wd-font-body) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	width: 100% !important;
}
.wc-block-components-checkout-place-order-button:hover {
	background: #3A6BFF !important;
}
.wc-block-components-checkout-place-order-button[disabled],
.wc-block-components-checkout-place-order-button.is-disabled {
	opacity: .5 !important;
	cursor: not-allowed !important;
}

/* Notice (mandatory email confirmation warning) */
.wc-block-components-notice-banner,
.wc-block-components-validation-error {
	background: var(--wd-bg-card) !important;
	border-radius: 10px !important;
	color: var(--wd-ink-soft) !important;
}
.wc-block-components-notice-banner.is-info {
	border-left: 4px solid var(--wd-accent) !important;
}
.wc-block-components-notice-banner.is-error {
	border-left: 4px solid #D14B3E !important;
}


/* ============================================================
 * WD E-MAIL OTP PANEL — Pre-payment verification panel
 * Injected into both block and classic checkout via JS.
 * ============================================================ */
.wd-otp-panel {
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 12px;
	padding: 18px 20px;
	margin: 16px 0 24px;
	font-family: var(--wd-font-body);
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}
@media (max-width: 767px) {
	.wd-otp-panel { padding: 14px 16px; }
	.wd-otp-head { gap: 10px; }
	.wd-otp-head .wd-otp-icon { width: 28px; height: 28px; }
	.wd-otp-title { font-size: 14px; }
	.wd-otp-sub { font-size: 12px; }
}
.wd-otp-panel.is-verified {
	border-color: var(--wd-good);
	background: rgba(62,224,161,.06);
}

/* Floating fallback — the wp_body_open path (if the_content or render_block didn't run).
 * Sits like a sticky banner in the top-right corner of the page; the user always sees the verification. */
.wd-otp-panel.is-floating {
	position: fixed;
	top: 90px;
	right: 20px;
	width: 420px;
	max-width: calc(100vw - 40px);
	z-index: 95;
	box-shadow: 0 24px 56px -16px rgba(0,0,0,.6);
	margin: 0;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-accent);
}
@media (max-width: 768px) {
	.wd-otp-panel.is-floating {
		top: auto;
		bottom: 12px;
		right: 12px;
		left: 12px;
		width: auto;
	}
}

.wd-otp-head {
	display: flex; align-items: center; gap: 12px;
	margin-bottom: 12px;
}
.wd-otp-head .wd-otp-icon {
	width: 32px; height: 32px;
	border-radius: 50%;
	background: var(--wd-accent-soft);
	color: var(--wd-accent);
	display: grid; place-items: center;
	flex-shrink: 0;
}
.wd-otp-panel.is-verified .wd-otp-icon {
	background: rgba(62,224,161,.18);
	color: var(--wd-good);
}
.wd-otp-head .wd-otp-icon svg { width: 16px; height: 16px; }
.wd-otp-title {
	font-family: var(--wd-font-display);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--wd-ink);
	line-height: 1.3;
	margin: 0;
}
.wd-otp-sub {
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	margin: 2px 0 0;
	line-height: 1.4;
}

.wd-otp-body { display: flex; flex-direction: column; gap: 10px; }
.wd-otp-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.wd-otp-input {
	flex: 1;
	min-width: 120px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink);
	border-radius: 8px;
	padding: 11px 14px;
	font-family: var(--wd-font-mono);
	font-size: 15px;
	letter-spacing: .25em;
	text-align: center;
}
.wd-otp-input:focus { outline: none; border-color: var(--wd-accent); }
.wd-otp-btn {
	background: var(--wd-accent-deep);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 11px 18px;
	font-family: var(--wd-font-body);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .04em;
	cursor: pointer;
	transition: background .15s;
	white-space: nowrap;
}
.wd-otp-btn:hover:not(:disabled) { background: #3A6BFF; }
.wd-otp-btn:disabled { opacity: .55; cursor: not-allowed; }
.wd-otp-btn.is-secondary {
	background: transparent;
	color: var(--wd-ink-soft);
	border: 1px solid var(--wd-line-w-strong);
}
.wd-otp-msg {
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	line-height: 1.5;
	margin: 0;
}
.wd-otp-msg.is-error { color: #D14B3E; }
.wd-otp-msg.is-success { color: var(--wd-good); }
.wd-otp-spinner {
	display: inline-block;
	width: 14px; height: 14px;
	border: 2px solid transparent;
	border-top-color: currentColor;
	border-radius: 50%;
	animation: wd-otp-spin .8s linear infinite;
	margin-right: 6px;
	vertical-align: middle;
}
@keyframes wd-otp-spin { to { transform: rotate(360deg); } }

/* Price column right-aligned */
.woocommerce-checkout-review-order-table .product-total {
	text-align: right;
	font-family: var(--wd-font-mono) !important;
	font-size: 14px !important;
	color: var(--wd-ink) !important;
	white-space: nowrap;
	padding-left: 12px !important;
}

/* Cart subtotal / shipping / total rows */
.woocommerce-checkout-review-order-table .cart-subtotal th,
.woocommerce-checkout-review-order-table .shipping th,
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .cart-subtotal td,
.woocommerce-checkout-review-order-table .shipping td,
.woocommerce-checkout-review-order-table .order-total td {
	padding: 14px 0 !important;
	border: none !important;
	background: transparent !important;
	font-family: var(--wd-font-body) !important;
	font-size: 14px !important;
	color: var(--wd-ink-soft) !important;
	font-weight: 400 !important;
}
.woocommerce-checkout-review-order-table .cart-subtotal,
.woocommerce-checkout-review-order-table .shipping {
	border-top: 1px solid var(--wd-line-w);
}
.woocommerce-checkout-review-order-table .order-total {
	border-top: 1px solid var(--wd-line-w-strong) !important;
}
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
	font-family: var(--wd-font-display) !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: var(--wd-ink) !important;
}
.woocommerce-checkout-review-order-table .order-total .amount {
	color: var(--wd-accent) !important;
}

/* Coupon section */
.checkout_coupon,
.woocommerce-form-coupon {
	background: var(--wd-bg-soft) !important;
	border: 1px solid var(--wd-line-w) !important;
	border-radius: 10px !important;
	padding: 16px !important;
	margin: 0 0 14px !important;
}

/* Checkout form inputs (left side) */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row .select2-selection {
	background: rgba(255,255,255,.03) !important;
	border: 1px solid var(--wd-line-w-strong) !important;
	color: var(--wd-ink) !important;
	border-radius: 10px !important;
	padding: 14px !important;
	font-family: var(--wd-font-body);
	font-size: 14.5px;
	min-height: 50px;
}
.woocommerce-checkout .form-row label {
	font-family: var(--wd-font-mono);
	font-size: 11.5px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wd-ink-soft);
	margin-bottom: 6px;
	display: block;
}
.woocommerce-checkout h3 {
	font-family: var(--wd-font-display);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink);
	margin: 0 0 20px;
}

/* Payment methods box */
.woocommerce-checkout #payment {
	background: transparent !important;
	border-radius: 0;
}
.woocommerce-checkout #payment ul.payment_methods {
	background: var(--wd-bg-soft) !important;
	border: 1px solid var(--wd-line-w) !important;
	border-radius: 12px !important;
	padding: 16px !important;
	margin: 0 0 18px !important;
	list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
	background: transparent !important;
	border: none !important;
	padding: 8px 0 !important;
	list-style: none !important;
}
/* In some WC themes a bullet or ::before dot is placed on the <li> */
.woocommerce-checkout #payment ul.payment_methods li::before,
.woocommerce-checkout #payment ul.payment_methods li::marker {
	content: none !important;
	display: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--wd-font-display);
	font-weight: 500;
	color: var(--wd-ink);
	cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
	accent-color: var(--wd-accent);
	margin: 0;
	cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box {
	background: transparent !important;
	color: var(--wd-ink-soft) !important;
	padding: 10px 0 !important;
	position: relative;
}
/* WC's default has a CSS triangle (arrow) above the payment_box — hide it */
.woocommerce-checkout #payment ul.payment_methods li .payment_box::before,
.woocommerce-checkout #payment ul.payment_methods li .payment_box::after {
	content: none !important;
	display: none !important;
	border: none !important;
	background: transparent !important;
}
.woocommerce-checkout #payment #place_order {
	width: 100%;
	background: linear-gradient(135deg, #EC7A1A 0%, #F5994C 50%, #FFB347 100%) !important;
	background-size: 200% 100% !important;
	background-position: 0 0 !important;
	color: #fff !important;
	padding: 20px 28px !important;
	font-family: var(--wd-font-display);
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-radius: 999px;  /* pill — consistent with the cart */
	border: none;
	cursor: pointer;
	margin-top: 18px;
	box-shadow:
		0 6px 18px rgba(236,122,26,.22),
		0 1px 4px rgba(236,122,26,.1),
		inset 0 1px 0 rgba(255,255,255,.22);
	transition: background-position .35s ease, box-shadow .2s ease, transform .12s ease;
	position: relative;
}
.woocommerce-checkout #payment #place_order:hover {
	background-position: 100% 0 !important;
	box-shadow:
		0 10px 28px rgba(236,122,26,.32),
		0 2px 6px rgba(236,122,26,.16),
		inset 0 1px 0 rgba(255,255,255,.28);
}
.woocommerce-checkout #payment #place_order:active {
	transform: translateY(1px);
}

/* Trust signals — automatically printed below place_order */
.woocommerce-checkout #payment::after {
	content: "🔒 Secure SSL-encrypted checkout · GDPR compliant · Instant delivery";
	display: block;
	margin-top: 16px;
	padding: 12px 16px;
	background: rgba(62,224,161,.06);
	border: 1px solid rgba(62,224,161,.25);
	border-radius: 10px;
	font-size: 12px;
	font-weight: 500;
	color: var(--wd-ink-soft);
	text-align: center;
	letter-spacing: .02em;
	line-height: 1.5;
}


/* ============================================================
 * EMAIL CONFIRMATION SCREEN — Custom thank-you + confirmation pages
 * ============================================================ */
.wd-email-confirm-wrap {
	max-width: 640px;
	margin: 140px auto 120px;
	padding: 48px 32px;
	text-align: center;
}
.wd-email-confirm-wrap .icon {
	width: 72px; height: 72px;
	border-radius: 50%;
	display: inline-grid; place-items: center;
	background: var(--wd-accent-soft);
	color: var(--wd-accent);
	margin: 0 auto 24px;
}
.wd-email-confirm-wrap .icon svg { width: 32px; height: 32px; }
.wd-email-confirm-wrap.is-success .icon { background: rgba(62,224,161,.15); color: var(--wd-good); }
.wd-email-confirm-wrap.is-error   .icon { background: rgba(209,75,62,.15); color: #D14B3E; }
.wd-email-confirm-wrap h1 {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.4vw, 40px);
	font-weight: 600;
	letter-spacing: -.025em;
	color: var(--wd-ink);
	margin: 0 0 14px;
}
.wd-email-confirm-wrap p {
	font-size: 16px;
	line-height: 1.7;
	color: var(--wd-ink-soft);
	margin: 0 0 12px;
}
.wd-email-confirm-wrap p strong { color: var(--wd-ink); }
.wd-email-confirm-wrap .wd-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 24px;
	padding: 14px 28px;
	background: var(--wd-accent-deep);
	color: #fff;
	border-radius: 12px;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
}


/* ============================================================
 * WD PRICING BLOCK — multi-tier pricing cards
 * Standard / Premium / Enterprise etc. (1-4 tiers supported)
 * ============================================================ */
.wd-pricing-section {
	position: relative;
	padding: 96px 0 120px;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
}
.wd-pricing-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

.wd-pricing-head { max-width: 780px; margin-bottom: 56px; }
.wd-pricing-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px; display: inline-block;
}
.wd-pricing-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em;
	line-height: 1.05; margin: 0 0 14px;
	color: var(--wd-ink, #F2F5FB);
}
.wd-pricing-h2 em { font-style: normal; color: var(--wd-accent); }
.wd-pricing-sub {
	font-size: 17px; color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6; margin: 0; max-width: 640px;
}

/* Tier grid */
.wd-pricing-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}
@media (min-width: 720px)  { .wd-pricing-grid.wd-pricing-cols-2 { grid-template-columns: repeat(2, 1fr); gap: 28px; } }
@media (min-width: 720px)  { .wd-pricing-grid.wd-pricing-cols-3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .wd-pricing-grid.wd-pricing-cols-3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 720px)  { .wd-pricing-grid.wd-pricing-cols-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .wd-pricing-grid.wd-pricing-cols-4 { grid-template-columns: repeat(4, 1fr); } }

/* Tier card */
.wd-pricing-card {
	position: relative;
	display: flex; flex-direction: column; gap: 18px;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 18px;
	padding: 32px;
	transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .25s, box-shadow .25s;
}
.wd-pricing-card:hover {
	transform: translateY(-4px);
	border-color: var(--wd-line-w-strong);
	box-shadow: 0 28px 56px -20px rgba(0,0,0,.45);
}
.wd-pricing-card.is-featured {
	background:
		radial-gradient(120% 80% at 100% 0%, rgba(91,124,255,.18) 0%, transparent 65%),
		var(--wd-bg-card);
	border-color: var(--wd-accent);
}

.wd-pricing-badge {
	position: absolute; top: -12px; right: 24px;
	padding: 6px 12px;
	background: var(--wd-accent); color: #fff;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; font-weight: 600;
	letter-spacing: .08em; text-transform: uppercase;
	border-radius: 999px; z-index: 2;
}

.wd-pricing-card-head { display: flex; flex-direction: column; gap: 6px; }
.wd-pricing-name {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 22px; font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink, #F2F5FB);
	margin: 0;
}
.wd-pricing-tagline {
	font-size: 14px; color: var(--wd-ink-mute, #7A8398);
	line-height: 1.5; margin: 0;
}

.wd-pricing-price {
	display: flex; align-items: baseline; gap: 4px;
	padding: 14px 0;
	border-top: 1px solid var(--wd-line-w);
	border-bottom: 1px solid var(--wd-line-w);
}
.wd-pricing-amount {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(36px, 4vw, 48px);
	font-weight: 600; letter-spacing: -.03em;
	color: var(--wd-ink, #F2F5FB); line-height: 1;
}
.wd-pricing-card.is-featured .wd-pricing-amount { color: var(--wd-accent); }
.wd-pricing-currency {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 20px; font-weight: 500;
	color: var(--wd-ink-soft, #B6BDD0); margin-left: 4px;
}
.wd-pricing-period {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px; color: var(--wd-ink-mute, #7A8398);
	margin-left: 8px; letter-spacing: .02em;
}
.wd-pricing-note {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; color: var(--wd-ink-mute, #7A8398);
	letter-spacing: .06em; margin: -8px 0 0;
}

.wd-pricing-features {
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-direction: column; gap: 10px;
	flex: 1;
}
.wd-pricing-features li {
	display: flex; align-items: flex-start; gap: 10px;
	font-size: 14.5px; line-height: 1.5;
	color: var(--wd-ink-soft, #B6BDD0);
}
.wd-pricing-check {
	width: 16px; height: 16px;
	color: var(--wd-good, #3EE0A1);
	flex-shrink: 0; margin-top: 3px;
}
.wd-pricing-card.is-featured .wd-pricing-check { color: var(--wd-accent); }

.wd-pricing-cta {
	display: inline-flex; align-items: center; justify-content: center;
	gap: 8px; margin-top: 8px;
	padding: 14px 22px; border-radius: 12px;
	font-family: 'Inter', sans-serif;
	font-size: 14px; font-weight: 500;
	letter-spacing: .04em; text-transform: uppercase;
	text-decoration: none;
	transition: background .15s, transform .15s, border-color .15s;
	background: rgba(255,255,255,.06);
	color: var(--wd-ink);
	border: 1px solid var(--wd-line-w-strong);
}
.wd-pricing-cta:hover { background: rgba(255,255,255,.12); transform: translateY(-1px); }
.wd-pricing-card.is-featured .wd-pricing-cta {
	background: var(--wd-accent-deep); color: #fff;
	border-color: var(--wd-accent-deep);
}
.wd-pricing-card.is-featured .wd-pricing-cta:hover { background: #3A6BFF; }
.wd-pricing-cta .arr { display: inline-block; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.wd-pricing-cta:hover .arr { transform: translateX(4px); }


/* ============================================================
 * WD WORKSHOP CALENDAR — workshop calendar widget
 * ============================================================ */
.wd-wshcal-section {
	position: relative;
	padding: 96px 0 120px;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
}
.wd-wshcal-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

.wd-wshcal-head { max-width: 780px; margin-bottom: 48px; }
.wd-wshcal-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px; display: inline-block;
}
.wd-wshcal-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em;
	line-height: 1.05; margin: 0 0 14px;
	color: var(--wd-ink, #F2F5FB);
}
.wd-wshcal-h2 em { font-style: normal; color: var(--wd-accent); }
.wd-wshcal-sub {
	font-size: 17px; color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6; margin: 0; max-width: 640px;
}

/* Calendar row list */
.wd-wshcal-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.wd-wshcal-row {
	display: grid;
	grid-template-columns: 96px 1fr auto;
	gap: 24px;
	align-items: center;
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 16px;
	padding: 22px 24px;
	transition: transform .25s cubic-bezier(.2,.7,.2,1), border-color .2s, box-shadow .25s;
}
.wd-wshcal-row:hover {
	transform: translateX(4px);
	border-color: var(--wd-line-w-strong);
	box-shadow: 0 18px 36px -16px rgba(0,0,0,.45);
}
@media (max-width: 768px) {
	.wd-wshcal-row {
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

/* Date block (left) */
.wd-wshcal-date {
	display: flex; flex-direction: column;
	text-align: center;
	padding: 8px 0;
	border-right: 1px solid var(--wd-line-w);
}
@media (max-width: 768px) {
	.wd-wshcal-date { border-right: none; border-bottom: 1px solid var(--wd-line-w); padding-bottom: 14px; }
}
.wd-wshcal-date .day {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 36px; font-weight: 600;
	letter-spacing: -.03em;
	color: var(--wd-ink, #F2F5FB);
	line-height: 1;
}
.wd-wshcal-date .month {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px; letter-spacing: .12em;
	color: var(--wd-accent);
	margin-top: 4px;
}
.wd-wshcal-date .time {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	color: var(--wd-ink-mute);
	margin-top: 6px;
}

/* Content block (middle) */
.wd-wshcal-body { min-width: 0; }
.wd-wshcal-meta {
	display: flex; align-items: center; gap: 8px;
	margin-bottom: 8px;
	flex-wrap: wrap;
}
.wd-wshcal-chip {
	display: inline-flex; align-items: center; gap: 5px;
	padding: 4px 10px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .04em;
	border-radius: 999px;
	border: 1px solid var(--wd-line-w-strong);
	color: var(--wd-ink-soft);
}
.wd-wshcal-chip.online {
	background: var(--wd-accent-soft);
	color: var(--wd-accent);
	border-color: rgba(91,124,255,.3);
}
.wd-wshcal-chip.fiziksel {
	background: rgba(236,122,26,.12);
	color: var(--wd-warm);
	border-color: rgba(236,122,26,.3);
}
.wd-wshcal-tag {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
}
.wd-wshcal-tag::before { content: "·"; margin-right: 6px; }
/* Multi-session (program) tag — accent-colored, more prominent */
.wd-wshcal-tag.wd-wshcal-tag-series {
	color: var(--wd-accent, #5B7CFF);
	font-weight: 600;
}
.wd-wshcal-tag.wd-wshcal-tag-series::before { content: ""; margin-right: 0; }
/* Sold-out tag */
.wd-wshcal-tag.wd-wshcal-tag-full {
	color: #D14B3E;
	font-weight: 600;
}
.wd-wshcal-tag.wd-wshcal-tag-full::before { content: ""; margin-right: 0; }
/* Series summary (e.g. "4 sessions · First: Mar 23 Sat 14:00") */
.wd-wshcal-series-summary {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	color: var(--wd-accent, #5B7CFF);
	margin: 0 0 8px;
	letter-spacing: .02em;
}
.wd-wshcal-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -.015em;
	line-height: 1.3;
	margin: 0 0 6px;
}
.wd-wshcal-title a {
	color: var(--wd-ink, #F2F5FB);
	text-decoration: none;
	transition: color .15s;
}
.wd-wshcal-title a:hover { color: var(--wd-accent); }
.wd-wshcal-excerpt {
	font-size: 14px;
	color: var(--wd-ink-soft);
	line-height: 1.5;
	margin: 0;
}

/* Action block (right) */
.wd-wshcal-action {
	display: flex; flex-direction: column;
	align-items: flex-end;
	gap: 8px;
}
@media (max-width: 768px) {
	.wd-wshcal-action { align-items: stretch; }
}
.wd-wshcal-price {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 600;
	color: var(--wd-accent);
	white-space: nowrap;
}
.wd-wshcal-price del {
	color: var(--wd-ink-mute);
	font-size: 14px;
	opacity: .6;
	margin-right: 6px;
}
.wd-wshcal-cta {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 10px 18px;
	background: var(--wd-accent-deep);
	color: #fff;
	border-radius: 10px;
	text-decoration: none;
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	transition: background .15s, transform .15s;
	white-space: nowrap;
}
.wd-wshcal-cta:hover { background: #3A6BFF; transform: translateY(-1px); }
.wd-wshcal-cta.is-soft {
	background: transparent;
	color: var(--wd-ink);
	border: 1px solid var(--wd-line-w-strong);
}
.wd-wshcal-cta.is-soft:hover { background: rgba(255,255,255,.06); }
.wd-wshcal-cta .arr { display: inline-block; transition: transform .25s; }
.wd-wshcal-cta:hover .arr { transform: translateX(3px); }

.wd-wshcal-empty {
	padding: 40px 0;
	text-align: center;
	color: var(--wd-ink-mute);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px;
	letter-spacing: .04em;
}


/* ============================================================
 * MY ACCOUNT — "My Workshops" tab
 * ============================================================ */
.wd-myaccount-workshops {
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', sans-serif;
}
.wd-myaccount-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 28px;
	font-weight: 600;
	letter-spacing: -.02em;
	margin: 0 0 24px;
	color: var(--wd-ink, #F2F5FB);
}
.wd-myaccount-empty {
	padding: 32px;
	background: var(--wd-bg-card);
	border: 1px dashed var(--wd-line-w-strong);
	border-radius: 12px;
	color: var(--wd-ink-soft);
	text-align: center;
}

.wd-wsh-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
}
@media (min-width: 720px) {
	.wd-wsh-cards { grid-template-columns: repeat(2, 1fr); }
}

.wd-wsh-card {
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
	border-radius: 14px;
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	transition: border-color .2s;
}
.wd-wsh-card:hover { border-color: var(--wd-line-w-strong); }
.wd-wsh-card.is-expired { opacity: .65; }

.wd-wsh-card-head { display: flex; flex-direction: column; gap: 8px; }
.wd-wsh-card-head > div { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.wd-wsh-chip {
	display: inline-flex; align-items: center; gap: 5px;
	padding: 4px 10px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .04em;
	border-radius: 999px;
	border: 1px solid var(--wd-line-w-strong);
}
.wd-wsh-chip.online   { background: var(--wd-accent-soft); color: var(--wd-accent); border-color: rgba(91,124,255,.3); }
.wd-wsh-chip.fiziksel { background: rgba(236,122,26,.12); color: var(--wd-warm); border-color: rgba(236,122,26,.3); }
.wd-wsh-date {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px; color: var(--wd-ink-mute);
}
.wd-wsh-card-head h3 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -.015em;
	color: var(--wd-ink);
	margin: 0;
	line-height: 1.3;
}

/* ============================================================
 * SINGLE WORKSHOP — Workshop detail page
 * (single-wd_workshop.php)
 * ============================================================ */
.wd-workshop-single .wd-wshs-hero-meta {
	display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
	margin: 0 0 18px;
}
.wd-wshs-tag {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-ink-soft);
	letter-spacing: .04em;
	padding: 5px 10px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w);
	border-radius: 999px;
}
.wd-wshs-tag.wd-wshs-tag-series {
	color: var(--wd-accent, #5B7CFF);
	border-color: rgba(91,124,255,.35);
	background: rgba(91,124,255,.08);
	font-weight: 600;
}
.wd-wshs-tag.wd-wshs-tag-full {
	color: #D14B3E;
	border-color: rgba(209,75,62,.35);
	background: rgba(209,75,62,.08);
	font-weight: 600;
}
.wd-wshs-tag.wd-wshs-tag-warn {
	color: #FFB347;
	border-color: rgba(255,179,71,.35);
	background: rgba(255,179,71,.08);
	font-weight: 600;
}

/* Grid: left content (1fr) + right sticky purchase card (340px) */
.wd-wshs-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 48px;
	align-items: start;
}
@media (max-width: 1024px) {
	.wd-wshs-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* Session schedule */
.wd-wshs-schedule {
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 20px;
	padding: 32px;
	margin-bottom: 32px;
}
.wd-wshs-schedule-head { margin-bottom: 20px; }
.wd-wshs-schedule-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .12em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 8px;
}
.wd-wshs-schedule-head h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(22px, 2vw, 28px);
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink);
	margin: 0 0 10px;
}
.wd-wshs-schedule-sub {
	color: var(--wd-ink-soft);
	font-size: 14.5px;
	line-height: 1.55;
	margin: 0;
}

.wd-wshs-sessions {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex; flex-direction: column;
	gap: 0;
	counter-reset: wsh-session;
}
.wd-wshs-session {
	display: grid;
	grid-template-columns: 56px minmax(0,1fr) auto;
	gap: 16px;
	align-items: center;
	padding: 18px 0;
	border-bottom: 1px solid var(--wd-line-w);
	position: relative;
}
.wd-wshs-session:last-child { border-bottom: none; }
.wd-wshs-session-num {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 18px;
	font-weight: 600;
	color: var(--wd-accent);
	width: 48px; height: 48px;
	border-radius: 50%;
	background: rgba(91,124,255,.1);
	display: grid; place-items: center;
	border: 1px solid rgba(91,124,255,.25);
}
.wd-wshs-session.is-past .wd-wshs-session-num {
	color: var(--wd-ink-mute);
	background: rgba(255,255,255,.04);
	border-color: var(--wd-line-w);
}
.wd-wshs-session-when {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 14px;
	color: var(--wd-ink);
	display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
}
.wd-wshs-session-when .sep { color: var(--wd-ink-mute); }
.wd-wshs-session-when .day { color: var(--wd-accent); font-weight: 500; }
.wd-wshs-session-when .dur { color: var(--wd-ink-soft); }
.wd-wshs-session-label {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	color: var(--wd-ink-soft);
	margin-top: 4px;
}
.wd-wshs-session.is-past .wd-wshs-session-when,
.wd-wshs-session.is-past .wd-wshs-session-label { opacity: .55; }
.wd-wshs-session-badge {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 10.5px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wd-ink-mute);
	background: rgba(255,255,255,.05);
	padding: 4px 10px;
	border-radius: 999px;
}

/* Content (post_content) within the workshop page */
.wd-wshs-content { max-width: 760px; }

/* Sticky purchase card */
.wd-wshs-aside { position: sticky; top: 96px; }
@media (max-width: 1024px) {
	.wd-wshs-aside { position: static; }
}
.wd-wshs-buy-card {
	background: var(--wd-bg-card, #131D33);
	border: 1px solid var(--wd-line-w);
	border-radius: 20px;
	padding: 28px;
}
.wd-wshs-buy-price {
	font-family: 'Inter Tight', sans-serif;
	font-size: 32px;
	font-weight: 700;
	color: var(--wd-ink);
	margin: 0 0 6px;
	letter-spacing: -.02em;
}
.wd-wshs-buy-price .woocommerce-Price-amount { color: var(--wd-accent); }
.wd-wshs-buy-note {
	font-size: 13px;
	color: var(--wd-ink-soft);
	margin: 0 0 18px;
	line-height: 1.5;
}
.wd-wshs-buy-cta {
	display: flex; align-items: center; justify-content: center; gap: 8px;
	width: 100%;
	background: var(--wd-accent, #5B7CFF);
	color: #fff;
	border: none;
	border-radius: 12px;
	padding: 16px 24px;
	font-family: 'Inter Tight', sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .02em;
	text-decoration: none;
	transition: background .15s, transform .15s;
	cursor: pointer;
}
.wd-wshs-buy-cta:hover { background: #3A6BFF; transform: translateY(-2px); color: #fff; }
.wd-wshs-buy-cta.is-disabled {
	background: rgba(255,255,255,.06);
	color: var(--wd-ink-mute);
	cursor: not-allowed;
	transform: none;
}
.wd-wshs-buy-cta .arr { transition: transform .2s; }
.wd-wshs-buy-cta:hover .arr { transform: translateX(4px); }

.wd-wshs-buy-stock {
	margin: 12px 0 0;
	color: #FFB347;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	text-align: center;
}

.wd-wshs-buy-included {
	list-style: none;
	padding: 18px 0 0;
	margin: 18px 0 0;
	border-top: 1px solid var(--wd-line-w);
	display: flex; flex-direction: column; gap: 10px;
}
.wd-wshs-buy-included li {
	font-size: 13.5px;
	color: var(--wd-ink-soft);
	line-height: 1.4;
}

/* Mobile — compact session card */
@media (max-width: 600px) {
	.wd-wshs-schedule { padding: 22px 18px; }
	.wd-wshs-session {
		grid-template-columns: 40px minmax(0,1fr);
		gap: 12px;
		padding: 14px 0;
	}
	.wd-wshs-session-num { width: 36px; height: 36px; font-size: 14px; }
	.wd-wshs-session-badge { grid-column: 2; justify-self: start; }
	.wd-wshs-session-when { font-size: 13px; }
	.wd-wshs-buy-card { padding: 22px; }
	.wd-wshs-buy-price { font-size: 26px; }
}

/* My Account — multi-session list (on the user's workshop card) */
.wd-wsh-sessions-list-public {
	list-style: none;
	padding: 12px 0 0;
	margin: 8px 0 0;
	border-top: 1px solid var(--wd-line-w);
	display: flex; flex-direction: column; gap: 6px;
}
.wd-wsh-sessions-list-public li {
	display: flex; align-items: center; gap: 10px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12.5px;
	color: var(--wd-ink-soft);
}
.wd-wsh-sessions-list-public li .dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--wd-accent);
	flex-shrink: 0;
}
.wd-wsh-sessions-list-public li.is-past .dot { background: var(--wd-ink-mute); }
.wd-wsh-sessions-list-public li.is-past .date,
.wd-wsh-sessions-list-public li.is-past .label { opacity: .6; }
.wd-wsh-sessions-list-public li .label {
	font-family: 'Inter', sans-serif;
	color: var(--wd-ink-mute);
}
.wd-wsh-sessions-list-public li .badge {
	margin-left: auto;
	background: rgba(255,255,255,.06);
	color: var(--wd-ink-mute);
	font-size: 10.5px;
	padding: 2px 8px;
	border-radius: 999px;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.wd-wsh-card-body { display: flex; flex-direction: column; gap: 10px; }
.wd-wsh-asset {
	display: flex; align-items: center; gap: 10px;
	padding: 12px 14px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--wd-line-w);
	border-radius: 10px;
	color: var(--wd-ink);
	text-decoration: none;
	font-size: 14px;
	transition: background .15s, border-color .15s;
}
.wd-wsh-asset:hover { background: rgba(255,255,255,.08); border-color: var(--wd-accent); color: var(--wd-ink); }
.wd-wsh-asset svg { color: var(--wd-accent); flex-shrink: 0; }
.wd-wsh-asset.is-disabled,
.wd-wsh-asset.is-pending {
	background: transparent;
	color: var(--wd-ink-mute);
	cursor: default;
}
.wd-wsh-asset.is-disabled:hover,
.wd-wsh-asset.is-pending:hover { background: transparent; border-color: var(--wd-line-w); }
.wd-wsh-asset.is-disabled svg { color: #D14B3E; }
.wd-wsh-asset.is-pending  svg { color: var(--wd-warm); }

.wd-wsh-vimeo {
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.wd-wsh-vimeo a {
	display: flex; align-items: center; gap: 10px;
	color: var(--wd-ink); text-decoration: none;
	font-size: 14px;
}
.wd-wsh-vimeo a:hover { color: var(--wd-accent); }
.wd-wsh-pass {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-ink-mute);
}
.wd-wsh-pass code {
	background: rgba(91,124,255,.12);
	color: var(--wd-accent);
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 11px;
	margin-left: 4px;
}
.wd-wsh-meta {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-good);
	margin: 4px 0 0;
	letter-spacing: .04em;
}


/* ============================================================
 * UNIFIED EM ACCENT — the <em> highlight across all widget headings,
 * unified to the orange tone (--wd-warm #EC7A1A) used in the cases heading.
 * Before: a mix of blue (--wd-accent) + orange. Now a consistent brand accent.
 * ============================================================ */
.wd-hero-h1 em,
.wd-svc-h2 em,
.wd-case-h2 em,
.wd-proc-h2 em,
.wd-cap-h2 em,
.wd-faq-h2 em,
.wd-foot-cta-h2 em,
.wd-testi-h2 em,
.wd-svchero-h1 em,
.wd-cta-section h2 em,
.wd-cta-card h2 em,
.wd-cta-card-image h2 em,
.wd-manifesto-body em,
.wd-pricing-h2 em,
.wd-wshcal-h2 em {
	color: var(--wd-warm, #EC7A1A) !important;
	font-style: normal;
}


/* ============================================================
 * SERVICES BENTO — Apple Vision Pro-style asymmetric grid
 * 6 services → 4-col × 3-row, each card a different size.
 * Triggered when `.wd-layout-bento .wd-svc-grid` is active.
 *
 * Layout (desktop ≥1100px, 4 col × 3 row):
 *   ┌──────────────┬──────┬──────┐
 *   │              │  B2  │  B3  │
 *   │   B1 (2×2)   ├──────┴──────┤
 *   │              │   B4 (2×1)  │
 *   ├──────┬───────┴─────────────┤
 *   │  B5  │       B6 (3×1)      │
 *   └──────┴─────────────────────┘
 *
 * B1: col 1-2, row 1-2 (large featured)
 * B2: col 3,   row 1
 * B3: col 4,   row 1
 * B4: col 3-4, row 2 (horizontal)
 * B5: col 1,   row 3
 * B6: col 2-4, row 3 (wide horizontal)
 *
 * Mobile < 700px: single column.
 * Tablet 700-1099px: 2 columns, auto flow.
 * ============================================================ */
.wd-layout-bento .wd-svc-grid {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: 20px;
}
@media (min-width: 700px) {
	.wd-layout-bento .wd-svc-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 22px;
	}
}
@media (min-width: 1100px) {
	.wd-layout-bento .wd-svc-grid {
		grid-template-columns: repeat(4, 1fr) !important;
		grid-template-rows: minmax(220px, 1fr) minmax(220px, 1fr) minmax(220px, 1fr);
		gap: 24px;
	}
	.wd-layout-bento .wd-bento-1 { grid-column: 1 / 3; grid-row: 1 / 3; }
	.wd-layout-bento .wd-bento-2 { grid-column: 3 / 4; grid-row: 1 / 2; }
	.wd-layout-bento .wd-bento-3 { grid-column: 4 / 5; grid-row: 1 / 2; }
	.wd-layout-bento .wd-bento-4 { grid-column: 3 / 5; grid-row: 2 / 3; }
	.wd-layout-bento .wd-bento-5 { grid-column: 1 / 2; grid-row: 3 / 4; }
	.wd-layout-bento .wd-bento-6 { grid-column: 2 / 5; grid-row: 3 / 4; }
}

/* Card aspect-ratio is disabled in bento — the grid area height determines it */
.wd-layout-bento .wd-svc-card {
	aspect-ratio: auto !important;
	height: 100%;
	min-height: 220px;
}
@media (min-width: 1100px) {
	.wd-layout-bento .wd-bento-1 { min-height: 480px; }
	.wd-layout-bento .wd-bento-2,
	.wd-layout-bento .wd-bento-3,
	.wd-layout-bento .wd-bento-5 { min-height: 220px; }
	.wd-layout-bento .wd-bento-4,
	.wd-layout-bento .wd-bento-6 { min-height: 220px; }
}

/* Featured card (B1) content is larger */
.wd-layout-bento .wd-bento-1 .svc-body h3 {
	font-size: clamp(22px, 2.2vw, 32px);
}


/* ============================================================
 * SECTION NUMBERS — 01. 02. ... next to hero/section eyebrows
 * Site-wide via CSS counter. Counting order follows the order seen in the DOM.
 * Only active on the homepage (.home / front-page) and key widgets.
 * ============================================================ */
.home .wd-main,
body.page-template-front-page .wd-main,
.front-page .wd-main {
	counter-reset: wd-section;
}
/* Counting targets: the main widgets on the homepage — based on eyebrow presence */
.home .wd-svc-eyebrow,
.home .wd-case-eyebrow,
.home .wd-proc-eyebrow,
.home .wd-testi-eyebrow,
.home .wd-faq-eyebrow,
.home .wd-foot-cta-eyebrow,
.home .wd-cta-section .wd-cta-tag,
.home .wd-manifesto-eyebrow {
	counter-increment: wd-section;
	position: relative;
	display: inline-flex !important;
	align-items: center;
	gap: 14px;
}
.home .wd-svc-eyebrow::before,
.home .wd-case-eyebrow::before,
.home .wd-proc-eyebrow::before,
.home .wd-testi-eyebrow::before,
.home .wd-faq-eyebrow::before,
.home .wd-foot-cta-eyebrow::before,
.home .wd-cta-section .wd-cta-tag::before,
.home .wd-manifesto-eyebrow::before {
	content: counter(wd-section, decimal-leading-zero) ".";
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	color: var(--wd-warm, #EC7A1A);
	letter-spacing: .08em;
	padding-right: 12px;
	border-right: 1px solid var(--wd-line-w-strong);
}


/* ============================================================
 * HERO GRADIENT ORBS — large blurry colored circles, slow drift
 * Linear/Cursor/Vercel hero modern tech aesthetic.
 * ============================================================ */
.wd-hero-orbs {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 0;
	mix-blend-mode: screen;
}
.wd-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	opacity: .42;
	will-change: transform;
}
.wd-orb-1 {
	width: 520px; height: 520px;
	background: radial-gradient(circle, var(--wd-accent, #5B7CFF) 0%, transparent 70%);
	top: -120px;
	left: -80px;
	animation: wd-orb-drift-1 22s ease-in-out infinite alternate;
}
.wd-orb-2 {
	width: 600px; height: 600px;
	background: radial-gradient(circle, var(--wd-warm, #EC7A1A) 0%, transparent 65%);
	bottom: -180px;
	right: -120px;
	opacity: .35;
	animation: wd-orb-drift-2 28s ease-in-out infinite alternate;
}
.wd-orb-3 {
	width: 380px; height: 380px;
	background: radial-gradient(circle, var(--wd-accent-deep, #2A5BFF) 0%, transparent 70%);
	top: 40%;
	left: 55%;
	opacity: .28;
	animation: wd-orb-drift-3 32s ease-in-out infinite alternate;
}
@keyframes wd-orb-drift-1 {
	0%   { transform: translate(0, 0) scale(1); }
	100% { transform: translate(120px, 80px) scale(1.15); }
}
@keyframes wd-orb-drift-2 {
	0%   { transform: translate(0, 0) scale(1); }
	100% { transform: translate(-100px, -60px) scale(.9); }
}
@keyframes wd-orb-drift-3 {
	0%   { transform: translate(0, 0) scale(1); }
	100% { transform: translate(-80px, 60px) scale(1.1); }
}
/* ============================================================
 * HERO — On-load reveal cascade
 * Eyebrow → H1 → Rotate → Lead → CTA → Trust slide in from below, in sequence.
 * Works without a <body> class too — the animation fires once on first render.
 * ============================================================ */
@keyframes wd-hero-rise {
	from {
		opacity: 0;
		transform: translateY(28px);
		filter: blur(6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}
}
.wd-hero-eyebrow,
.wd-hero-h1,
.wd-hero-rotate,
.wd-hero-lead,
.wd-hero-ctas,
.wd-hero-trust {
	opacity: 0;
	animation: wd-hero-rise .9s cubic-bezier(.2,.7,.2,1) forwards;
	will-change: transform, opacity, filter;
}
.wd-hero-eyebrow { animation-delay: .08s; }
.wd-hero-h1     { animation-delay: .22s; animation-duration: 1.1s; }
.wd-hero-rotate { animation-delay: .42s; }
.wd-hero-lead   { animation-delay: .55s; }
.wd-hero-ctas   { animation-delay: .68s; }
.wd-hero-trust  { animation-delay: .82s; }

/* If the H1 has 2 lines, stagger line by line too (CSS-only, we don't rely on spans —
 * the H1 already contains the words, and line-height + delays are already read globally). */
.wd-hero-h1 > em,
.wd-hero-h1 > b,
.wd-hero-h1 > strong {
	display: inline-block;
}

@media (prefers-reduced-motion: reduce) {
	.wd-hero-eyebrow,
	.wd-hero-h1,
	.wd-hero-rotate,
	.wd-hero-lead,
	.wd-hero-ctas,
	.wd-hero-trust {
		opacity: 1;
		animation: none;
		transform: none;
		filter: none;
	}
	.wd-orb { animation: none; }
}
/* Keep hero content above the orbs */
.wd-hero-section .wd-hero-content { position: relative; z-index: 3; }
.wd-hero-section .wd-hero-gridtex { z-index: 1; }
.wd-hero-section .wd-hero-orbs    { z-index: 0; }


/* ============================================================
 * STICKY CTA BAR — bottom-right floating button on scroll
 * A direct CTA for lead conversion, not tied to being near the footer.
 * ============================================================ */
.wd-sticky-cta {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 90;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	background: var(--wd-accent-deep, #2A5BFF);
	color: #fff;
	text-decoration: none;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .04em;
	border-radius: 999px;
	box-shadow: 0 12px 32px -8px rgba(42,91,255,.5), 0 4px 12px rgba(0,0,0,.4);
	opacity: 0;
	transform: translateY(20px);
	pointer-events: none;
	transition: opacity .35s cubic-bezier(.2,.7,.2,1), transform .35s cubic-bezier(.2,.7,.2,1), background .2s;
}
.wd-sticky-cta.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.wd-sticky-cta:hover {
	background: #3A6BFF;
	transform: translateY(-2px);
	color: #fff;
}
.wd-sticky-cta svg {
	width: 18px; height: 18px;
	flex-shrink: 0;
}
.wd-sticky-cta .arr {
	display: inline-block;
	transition: transform .25s;
}
.wd-sticky-cta:hover .arr { transform: translateX(3px); }
@media (max-width: 640px) {
	.wd-sticky-cta {
		right: 12px;
		bottom: 12px;
		padding: 12px 16px;
		font-size: 13px;
	}
	.wd-sticky-cta .wd-sticky-cta-label-long { display: none; }
}


/* ============================================================
 * BRAND MARQUEE — scrolling strip of brands we work with
 * Comes from the Partner CPT or a manual text list.
 * ============================================================ */
.wd-brand-marquee {
	position: relative;
	padding: 48px 0;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	overflow: hidden;
	border-top: 1px solid var(--wd-line-w);
	border-bottom: 1px solid var(--wd-line-w);
	background: rgba(255,255,255,.015);
}
.wd-brand-marquee-head {
	max-width: 1320px;
	margin: 0 auto 24px;
	padding: 0 32px;
}
.wd-brand-marquee-eyebrow {
	display: inline-block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .1em;
	text-transform: uppercase;
}

.wd-brand-marquee-track-wrap {
	overflow: hidden;
	/* Fade edges */
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.wd-brand-marquee-track {
	display: inline-flex;
	gap: 48px;
	align-items: center;
	white-space: nowrap;
	animation: wd-brand-marquee-scroll var(--wd-marquee-speed, 40s) linear infinite;
	will-change: transform;
}
@keyframes wd-brand-marquee-scroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}
.wd-brand-marquee:hover .wd-brand-marquee-track {
	animation-play-state: paused;
}

.wd-brand-marquee-item {
	display: inline-flex;
	align-items: center;
	gap: 48px;
}
.wd-brand-marquee-item img {
	max-height: 36px;
	width: auto;
	opacity: .7;
	filter: grayscale(1);
	transition: opacity .25s, filter .25s;
}
.wd-brand-marquee-item:hover img {
	opacity: 1;
	filter: grayscale(0);
}
.wd-brand-name {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(20px, 2vw, 28px);
	font-weight: 600;
	letter-spacing: -.02em;
	color: var(--wd-ink-soft, #B6BDD0);
	transition: color .25s;
}
.wd-brand-marquee-item:hover .wd-brand-name {
	color: var(--wd-ink);
}
.wd-brand-marquee-sep {
	font-family: 'Inter Tight', sans-serif;
	font-size: clamp(20px, 2vw, 28px);
	color: var(--wd-line-w-strong);
	font-weight: 300;
}
@media (prefers-reduced-motion: reduce) {
	.wd-brand-marquee-track { animation: none; }
}


/* ============================================================
 * CASE ARCHIVE HOVER PREVIEW — bottom panel slide-up
 * Hovering the card reveals a hidden panel: meta chips + a large CTA
 * Modern UX pattern (Linear/Vercel hover popovers).
 * ============================================================ */
.wd-case-archive-hover {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 20px;
	background:
		linear-gradient(180deg, transparent, rgba(10,15,26,.92) 40%);
	transform: translateY(100%);
	opacity: 0;
	transition: transform .4s cubic-bezier(.2,.7,.2,1), opacity .3s ease;
	pointer-events: none;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.wd-case-archive-card:hover .wd-case-archive-hover {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}

.wd-case-archive-hover-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.wd-case-archive-chip-mini {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	background: rgba(255,255,255,.1);
	color: var(--wd-ink);
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 999px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: .02em;
	white-space: nowrap;
}

.wd-case-archive-hover-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	background: var(--wd-accent-deep);
	color: #fff !important;
	border-radius: 999px;
	text-decoration: none;
	font-family: 'Inter', sans-serif;
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	transition: background .15s, transform .15s;
	white-space: nowrap;
	flex-shrink: 0;
}
.wd-case-archive-hover-cta:hover {
	background: #3A6BFF;
	transform: translateY(-1px);
}
.wd-case-archive-hover-cta .arr {
	display: inline-block;
	transition: transform .25s;
}
.wd-case-archive-hover-cta:hover .arr { transform: translateX(3px); }

/* Subtle glow + accent border on the card in hover state */
.wd-case-archive-card:hover {
	border-color: rgba(91,124,255,.4) !important;
	box-shadow: 0 28px 56px -20px rgba(91,124,255,.25), 0 28px 56px -20px rgba(0,0,0,.45) !important;
}

/* Mobile: no hover → the always-visible panel becomes a more compact bottom bar */
@media (max-width: 768px), (hover: none) {
	.wd-case-archive-hover {
		position: static;
		transform: none;
		opacity: 1;
		pointer-events: auto;
		padding: 12px 16px;
		background: rgba(10,15,26,.6);
		margin-top: 4px;
		flex-wrap: wrap;
	}
}


/* ============================================================
 * WD TERMINAL BLOCK — Mac-style terminal window + line reveal
 * Signals "we're powered by an AI engine / technical depth" for the brand.
 * ============================================================ */
.wd-terminal-section {
	position: relative;
	padding: 96px 0 120px;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
}
.wd-terminal-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

.wd-terminal-head { max-width: 780px; margin-bottom: 48px; }
.wd-terminal-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px; display: inline-block;
}
.wd-terminal-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 3.8vw, 52px);
	font-weight: 600; letter-spacing: -.03em;
	line-height: 1.05; margin: 0 0 14px;
	color: var(--wd-ink, #F2F5FB);
}
.wd-terminal-h2 em { font-style: normal; color: var(--wd-warm) !important; }
.wd-terminal-sub {
	font-size: 17px; color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6; margin: 0; max-width: 640px;
}

/* Terminal window */
.wd-terminal {
	max-width: 920px;
	margin: 0 auto;
	background: #0E1422;
	border: 1px solid var(--wd-line-w-strong);
	border-radius: 14px;
	overflow: hidden;
	box-shadow:
		0 32px 64px -24px rgba(0,0,0,.6),
		0 0 0 1px rgba(91,124,255,.06) inset;
	font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
}

/* Window chrome (traffic lights) */
.wd-terminal-chrome {
	display: flex; align-items: center; gap: 8px;
	padding: 12px 16px;
	background: rgba(255,255,255,.03);
	border-bottom: 1px solid var(--wd-line-w);
	position: relative;
}
.wd-terminal-dot {
	width: 12px; height: 12px;
	border-radius: 50%;
	display: inline-block;
}
.wd-terminal-dot.is-red    { background: #FF5F57; }
.wd-terminal-dot.is-yellow { background: #FEBC2E; }
.wd-terminal-dot.is-green  { background: #28C840; }
.wd-terminal-title {
	flex: 1;
	text-align: center;
	font-size: 11.5px;
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
	/* Balance out the space taken by the 3 dots on the right */
	margin-right: 52px;
}

/* Body */
.wd-terminal-body {
	padding: 20px 24px 24px;
	min-height: 280px;
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--wd-ink-soft, #B6BDD0);
}

/* Line types */
.wd-terminal-line {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 2px 0;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .35s ease, transform .35s cubic-bezier(.2,.7,.2,1);
}
.wd-terminal-line.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.wd-terminal-prompt,
.wd-terminal-icon {
	flex-shrink: 0;
	width: 18px;
	font-weight: 600;
	display: inline-block;
	text-align: center;
}
.wd-terminal-line.is-command .wd-terminal-prompt { color: var(--wd-accent); }
.wd-terminal-line.is-command .wd-terminal-text   { color: var(--wd-ink); font-weight: 500; }
.wd-terminal-line.is-output  .wd-terminal-text   { color: var(--wd-ink-soft); }
.wd-terminal-line.is-success .wd-terminal-icon   { color: var(--wd-good); }
.wd-terminal-line.is-success .wd-terminal-text   { color: var(--wd-ink); }
.wd-terminal-line.is-warning .wd-terminal-icon   { color: var(--wd-warm); }
.wd-terminal-line.is-warning .wd-terminal-text   { color: var(--wd-ink-soft); }
.wd-terminal-line.is-error   .wd-terminal-icon   { color: #FF5F57; }
.wd-terminal-line.is-error   .wd-terminal-text   { color: var(--wd-ink-soft); }
.wd-terminal-line.is-comment .wd-terminal-icon,
.wd-terminal-line.is-comment .wd-terminal-text {
	color: var(--wd-ink-mute);
	font-style: italic;
}

/* Blink cursor */
.wd-terminal-cursor {
	display: inline-block;
	width: 8px;
	height: 16px;
	background: var(--wd-accent);
	vertical-align: middle;
	animation: wd-terminal-blink 1s steps(2, end) infinite;
	margin-top: 3px;
}
@keyframes wd-terminal-blink {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0; }
}
[data-wd-line-cursor] {
	/* The cursor line is always visible */
	opacity: 1 !important;
	transform: none !important;
	margin-top: 6px;
}

@media (max-width: 640px) {
	.wd-terminal-body { padding: 16px 14px; font-size: 12.5px; }
	.wd-terminal-title { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.wd-terminal-line { opacity: 1; transform: none; }
	.wd-terminal-cursor { animation: none; }
}


/* ============================================================
 * CUSTOM CURSOR RING — Awwwards-style cursor
 * Never rendered on touch + reduced-motion (JS guard).
 * The standard cursor keeps showing — the ring is layered on top of it.
 * ============================================================ */
.wd-cursor-ring {
	position: fixed;
	top: 0; left: 0;
	width: 28px; height: 28px;
	border: 1.5px solid var(--wd-accent, #5B7CFF);
	border-radius: 50%;
	pointer-events: none;
	z-index: 9999;
	transform: translate3d(-100px, -100px, 0);
	transition: width .2s cubic-bezier(.2,.7,.2,1),
		height .2s cubic-bezier(.2,.7,.2,1),
		background-color .2s,
		border-color .2s,
		opacity .25s;
	mix-blend-mode: difference;
	will-change: transform;
}
.wd-cursor-ring.is-hover {
	width: 48px; height: 48px;
	border-color: var(--wd-warm, #EC7A1A);
	background: rgba(236,122,26,.08);
	margin: -10px 0 0 -10px;
}
.wd-cursor-ring.is-out {
	opacity: 0;
}


/* ============================================================
 * SPOTLIGHT EFFECT — Hero / Manifesto / Service Hero
 * Radial gradient overlay at the mouse position.
 * CSS variables: --wd-spot-x, --wd-spot-y (updated by JS).
 * ============================================================ */
.wd-hero-section.has-spotlight,
.wd-manifesto.has-spotlight,
.wd-svchero-section.has-spotlight {
	--wd-spot-x: 50%;
	--wd-spot-y: 50%;
}
.wd-hero-section.has-spotlight::after,
.wd-manifesto.has-spotlight::after,
.wd-svchero-section.has-spotlight::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(circle 420px at var(--wd-spot-x) var(--wd-spot-y),
		rgba(91,124,255,.15) 0%,
		rgba(91,124,255,.06) 30%,
		transparent 70%);
	transition: background-position .15s ease-out;
	z-index: 1;
	mix-blend-mode: screen;
}
.wd-hero-section.has-spotlight { position: relative; }
.wd-manifesto.has-spotlight     { position: relative; }
.wd-svchero-section.has-spotlight { position: relative; }

/* Keep the spotlight behind the content */
.wd-hero-content,
.wd-manifesto > .wd-manifesto-eyebrow,
.wd-manifesto > .wd-manifesto-body,
.wd-manifesto > .wd-manifesto-sub,
.wd-svchero-crumb,
.wd-svchero-h1,
.wd-svchero-lead {
	position: relative;
	z-index: 2;
}

@media (hover: none), (pointer: coarse) {
	.wd-cursor-ring { display: none !important; }
	.wd-hero-section.has-spotlight::after,
	.wd-manifesto.has-spotlight::after,
	.wd-svchero-section.has-spotlight::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.wd-cursor-ring { display: none !important; }
}


/* ============================================================
 * PROCESS CONNECTOR — SVG path drawn on scroll between steps
 * A horizontal, slightly-curved line with an accent dot at each end.
 * JS: the line is drawn as data-wd-path's dashoffset animates to 0.
 * ============================================================ */
.wd-proc-connector {
	position: relative;
	flex: 0 0 90px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--wd-accent, #5B7CFF);
	opacity: .8;
	align-self: center;
}
.wd-proc-connector svg {
	width: 100%;
	height: 20px;
	display: block;
	overflow: visible;
}
.wd-proc-connector svg path {
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	filter: drop-shadow(0 0 6px rgba(91,124,255,.35));
}
.wd-proc-connector-dot {
	position: absolute;
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--wd-accent, #5B7CFF);
	top: 50%;
	transform: translateY(-50%);
	box-shadow: 0 0 10px rgba(91,124,255,.6);
}
.wd-proc-connector-dot-start { left: 0; }
.wd-proc-connector-dot-end   { right: 0; background: var(--wd-warm, #EC7A1A); box-shadow: 0 0 10px rgba(236,122,26,.6); }

/* Dot pulse animation */
.wd-proc-connector-dot {
	animation: wd-proc-connector-pulse 2.4s ease-in-out infinite;
}
.wd-proc-connector-dot-end { animation-delay: 1.2s; }
@keyframes wd-proc-connector-pulse {
	0%, 100% { opacity: 1; transform: translateY(-50%) scale(1); }
	50%      { opacity: .5; transform: translateY(-50%) scale(.7); }
}

@media (prefers-reduced-motion: reduce) {
	.wd-proc-connector-dot { animation: none; }
}

/* Mobile: connector hidden (horizontal track isn't scrolled) */
@media (max-width: 768px) {
	.wd-proc-connector { display: none; }
}


/* ============================================================
 * SERVICES PINNED — Apple product-page-style scrollytelling
 * Left sticky visual + right vertical service list. The active one changes on scroll.
 * ============================================================ */
.wd-svp-section {
	position: relative;
	padding: 96px 0 120px;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
}
.wd-svp-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

.wd-svp-head { max-width: 780px; margin-bottom: 56px; }
.wd-svp-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px; color: var(--wd-accent);
	letter-spacing: .1em; text-transform: uppercase;
	margin-bottom: 16px; display: inline-block;
}
.wd-svp-sub {
	font-size: 17px; color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6; margin: 14px 0 0; max-width: 640px;
}

/* 2-col layout: left sticky visual, right scroll list */
.wd-svp-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
}
@media (min-width: 1024px) {
	.wd-svp-grid {
		grid-template-columns: 5fr 6fr;
		gap: 80px;
	}
}

/* Left column: grid item — not sticky itself, its inner element is sticky.
   This way the grid item matches the parent column's height (stretch),
   while the inner element stays viewport-relative sticky; no gap forms below. */
.wd-svp-visual {
	position: relative;
	aspect-ratio: 3/4;
	border-radius: 20px;
	overflow: hidden;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w);
}
/* Inner default (mobile): container for the slides */
.wd-svp-visual-inner {
	position: relative;
	width: 100%;
	height: 100%;
}
/* Desktop override — sticky scroll behavior.
   IMPORTANT: this block must come AFTER the previous global rule so it overrides it. */
@media (min-width: 1024px) {
	.wd-svp-visual {
		/* On desktop the grid item is full-height (default stretch) — a container for the sticky child.
		   Override the aspect-ratio from mobile; move border/bg to the inner element. */
		aspect-ratio: auto;
		border: none;
		background: transparent;
		border-radius: 0;
		overflow: visible;
	}
	.wd-svp-visual-inner {
		position: sticky;
		top: 100px;
		/* 3:4 ratio is fixed — cover images were produced at the same ratio.
		   max-height is constrained relative to the viewport so it doesn't overflow on very tall screens. */
		aspect-ratio: 3/4;
		width: 100%;
		height: auto;
		max-height: calc(100vh - 140px);
		border-radius: 20px;
		overflow: hidden;
		background: var(--wd-bg-card);
		border: 1px solid var(--wd-line-w, rgba(255,255,255,.06));
	}
}
.wd-svp-visual-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity .6s cubic-bezier(.2,.7,.2,1);
	display: flex;
	align-items: flex-end;
	padding: 32px;
}
.wd-svp-visual-slide.is-active {
	opacity: 1;
	z-index: 2;
}
.wd-svp-visual-slide img {
	position: absolute;
	inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
}
.wd-svp-visual-slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10,15,26,.05) 0%, rgba(10,15,26,.55) 100%);
	pointer-events: none;
}
/* Slides should always fully fill the sticky inner element — guaranteed even after wrap changes */
.wd-svp-visual-inner .wd-svp-visual-slide {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
}
.wd-svp-visual-inner .wd-svp-visual-slide img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	/* contain: the image is NEVER cropped. If the aspect ratio doesn't match, letterbox bars appear,
	   but the container background is dark navy = the bars are invisible. This is safer than
	   cover — covers can have different ratios, so nothing gets lost. */
	object-fit: contain !important;
	object-position: center center !important;
}
.wd-svp-visual-fallback {
	position: absolute; inset: 0;
	background: linear-gradient(135deg, var(--wd-brand-navy, #1F2D5C), var(--wd-bg));
}
.wd-svp-visual-num {
	position: absolute;
	top: 24px;
	left: 28px;
	z-index: 3;
	font-family: 'Inter Tight', sans-serif;
	font-size: clamp(56px, 8vw, 96px);
	font-weight: 700;
	line-height: 1;
	color: rgba(255,255,255,.18);
	letter-spacing: -.04em;
}
.wd-svp-visual-tag {
	position: absolute;
	bottom: 28px;
	left: 28px;
	z-index: 3;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	color: var(--wd-accent);
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 5px 11px;
	background: var(--wd-accent-soft);
	border: 1px solid rgba(91,124,255,.3);
	border-radius: 999px;
}

/* Right column: service list */
.wd-svp-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.wd-svp-item {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 20px;
	padding: 32px 0;
	border-bottom: 1px solid var(--wd-line-w);
	transition: opacity .4s ease;
	opacity: .45;
}
.wd-svp-item:first-child { padding-top: 0; }
.wd-svp-item.is-active {
	opacity: 1;
}
.wd-svp-item-num {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 14px;
	color: var(--wd-ink-mute);
	letter-spacing: .04em;
	font-weight: 500;
	transition: color .3s;
}
.wd-svp-item.is-active .wd-svp-item-num {
	color: var(--wd-warm);
}
.wd-svp-item-body { display: flex; flex-direction: column; gap: 10px; }
.wd-svp-item h3 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(22px, 2.4vw, 28px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1.2;
	margin: 0;
}
.wd-svp-item h3 a {
	color: var(--wd-ink);
	text-decoration: none;
	transition: color .2s;
}
.wd-svp-item.is-active h3 a,
.wd-svp-item h3 a:hover { color: var(--wd-warm); }
.wd-svp-item p {
	font-size: 15.5px;
	color: var(--wd-ink-soft);
	line-height: 1.6;
	margin: 0;
}
.wd-svp-item-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	color: var(--wd-accent);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12.5px;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	align-self: flex-start;
	transition: color .2s;
}
.wd-svp-item-link:hover { color: var(--wd-warm); }
.wd-svp-item-link .arr { transition: transform .25s; }
.wd-svp-item-link:hover .arr { transform: translateX(4px); }

@media (max-width: 1023px) {
	/* Mobile: visual sits in normal flow, scrollytelling disabled */
	.wd-svp-visual { aspect-ratio: 16/10; max-height: none; }
	.wd-svp-item { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.wd-svp-visual-slide { transition: none; }
	.wd-svp-item { transition: none; opacity: 1; }
}


/* ============================================================
 * EVOLUTION STORY — Big Bang → AI 9-scene scrollytelling
 * Track: 9 × 80vh = 720vh tall, with a sticky pin (100vh) inside.
 * On scroll, image + text cross-fade, with a counter + progress bottom-right.
 * ============================================================ */
.wd-evo-section {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	overflow-x: clip;
	background: #050810;
}

/* Top heading — sits in normal flow before the track */
.wd-evo-head {
	max-width: 880px;
	margin: 0 auto;
	padding: 96px 32px 48px;
	text-align: center;
}
.wd-evo-eyebrow {
	display: inline-block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.wd-evo-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 4.4vw, 64px);
	font-weight: 600;
	letter-spacing: -.03em;
	line-height: 1.05;
	margin: 0;
	color: var(--wd-ink);
}
.wd-evo-h2 em { font-style: normal; color: var(--wd-warm); }

/* Track — a long area (number of scenes × 80vh). The .wd-evo-pin inside it is sticky. */
.wd-evo-track {
	position: relative;
	height: var(--wd-evo-track-height, 720vh);
}
.wd-evo-pin {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
}

/* Image stack — absolute, only the active one has opacity 1 */
.wd-evo-stage {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.wd-evo-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 1s cubic-bezier(.4,0,.2,1);
}
.wd-evo-slide.is-active {
	opacity: 1;
	z-index: 2;
}
.wd-evo-slide {
	/* Explicit width/height on the slide parent — the child img's height:100% calculation
	   relies on this. In some browsers, `inset:0` left `bottom/right` as `auto`
	   in the computed style → the image rendered at its natural height. */
	width: 100%;
	height: 100%;
}
.wd-evo-slide img,
.wd-evo-slide video.wd-evo-video {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center;
	transform: scale(1.02);
	transition: transform 14s linear;
}
/* Don't apply Ken Burns to video — the video is already in motion with its own content */
.wd-evo-slide video.wd-evo-video {
	transform: scale(1.02) !important;
	transition: none !important;
}
/* Ken Burns — slow scale+drift on the active scene, so it feels alive rather than static */
.wd-evo-slide.is-active img {
	transform: scale(1.12) translate(-1%, 1.5%);
}
.wd-evo-slide-fallback {
	width: 100%; height: 100%;
	background: linear-gradient(135deg, var(--wd-brand-navy, #1F2D5C), #050810);
}
/* Vignette — radial dark edges, center slightly lighter (for text) */
.wd-evo-slide-overlay {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 80% 70% at 50% 50%, rgba(5,8,16,.25) 0%, rgba(5,8,16,.55) 60%, rgba(5,8,16,.9) 100%);
	pointer-events: none;
}

/* Edge glow — soft accent-colored edge highlight */
.wd-evo-edge {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		radial-gradient(ellipse 60% 30% at 0% 50%, rgba(91,124,255,.18) 0%, transparent 60%),
		radial-gradient(ellipse 60% 30% at 100% 50%, rgba(236,122,26,.15) 0%, transparent 60%);
	mix-blend-mode: screen;
	animation: wd-evo-edge-pulse 8s ease-in-out infinite alternate;
}
@keyframes wd-evo-edge-pulse {
	0%   { opacity: .7; }
	100% { opacity: 1; }
}

/* Giant outline scene number — manifesto backdrop pattern, changes per scene */
.wd-evo-backnum-stack {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	overflow: hidden;
}
.wd-evo-backnum {
	position: absolute;
	right: 6%;
	bottom: -8%;
	font-family: 'Inter Tight', sans-serif;
	font-weight: 700;
	font-size: clamp(280px, 38vw, 560px);
	letter-spacing: -.05em;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 2px rgba(255,255,255,.08);
	text-stroke: 2px rgba(255,255,255,.08);
	opacity: 0;
	transform: translateX(40px);
	transition: opacity .8s cubic-bezier(.4,0,.2,1), transform 1.2s cubic-bezier(.2,.7,.2,1);
	user-select: none;
}
.wd-evo-backnum.is-active {
	opacity: 1;
	transform: translateX(0);
}
@media (max-width: 768px) {
	.wd-evo-backnum {
		font-size: clamp(180px, 50vw, 320px);
		right: -10%;
		bottom: -12%;
	}
}

/* Content layer — centered */
.wd-evo-content {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	padding: 0 32px;
}
.wd-evo-text {
	max-width: 820px;
	position: absolute;
	text-align: center;
	opacity: 0;
	transform: scale(1.35);
	filter: blur(8px);
	transition:
		opacity .7s cubic-bezier(.4,0,.2,1),
		transform 1s cubic-bezier(.2,.7,.2,1),
		filter .9s cubic-bezier(.4,0,.2,1);
	will-change: transform, opacity, filter;
}
.wd-evo-text.is-active {
	opacity: 1;
	transform: scale(1);
	filter: blur(0);
}
.wd-evo-text-eyebrow {
	display: inline-block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 13px;
	color: var(--wd-warm);
	letter-spacing: .18em;
	text-transform: uppercase;
	margin-bottom: 20px;
	padding: 6px 14px;
	background: rgba(5,8,16,.5);
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 999px;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}
.wd-evo-text-title {
	font-family: 'Inter Tight', sans-serif;
	font-size: clamp(48px, 7vw, 96px);
	font-weight: 600;
	letter-spacing: -.04em;
	line-height: .98;
	margin: 0 0 22px;
	color: #fff;
	text-shadow: 0 4px 48px rgba(0,0,0,.85), 0 2px 12px rgba(0,0,0,.6);
}
.wd-evo-text-body {
	font-size: clamp(17px, 1.7vw, 22px);
	color: rgba(255,255,255,.92);
	line-height: 1.5;
	margin: 0 auto;
	max-width: 600px;
	text-shadow: 0 2px 18px rgba(0,0,0,.7);
}

/* Counter + progress (top-right sticky) */
.wd-evo-counter {
	position: absolute;
	top: 32px;
	right: 32px;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 4px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 14px;
	color: rgba(255,255,255,.9);
	letter-spacing: .08em;
	background: rgba(5,8,16,.5);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 999px;
	padding: 10px 18px;
	backdrop-filter: blur(12px);
}
.wd-evo-counter-cur { color: var(--wd-warm); font-weight: 600; }
.wd-evo-counter-sep { color: rgba(255,255,255,.4); margin: 0 2px; }
.wd-evo-counter-total { color: rgba(255,255,255,.6); }
.wd-evo-progress {
	width: 80px;
	height: 2px;
	background: rgba(255,255,255,.18);
	border-radius: 2px;
	overflow: hidden;
	margin-left: 12px;
}
.wd-evo-progress-fill {
	height: 100%;
	width: 0%;
	background: var(--wd-warm);
	transition: width .25s linear;
}

/* ============================================================
 * EVO STORY — STYLE VARIANTS (A / B / C / D)
 * Same HTML, different presentation. Default is D (Apple/Minimal — matches the hero).
 * ============================================================ */

/* ───── D · MINIMAL/APPLE (default, matches the hero) ─────
 * Bottom-left: small eyebrow chip + GIANT title + body
 * Bottom-right: counter (already there, but we move it to the bottom position)
 * No frame, plain power. */
.wd-evo-style-d .wd-evo-content {
	align-items: flex-end;
	justify-content: flex-start;
	padding: 0 clamp(24px, 6vw, 96px) clamp(80px, 12vh, 140px);
}
.wd-evo-style-d .wd-evo-text {
	text-align: left;
	max-width: 1100px;
	transform: translateY(40px);
	filter: none;
}
.wd-evo-style-d .wd-evo-text.is-active {
	transform: translateY(0);
}
.wd-evo-style-d .wd-evo-text-title {
	font-size: clamp(56px, 9vw, 140px);
	line-height: .92;
	letter-spacing: -.045em;
	margin-bottom: 18px;
}
.wd-evo-style-d .wd-evo-text-body {
	max-width: 540px;
	margin: 0;
	font-size: clamp(16px, 1.4vw, 20px);
}
.wd-evo-style-d .wd-evo-counter {
	top: auto;
	bottom: clamp(80px, 12vh, 140px);
	right: clamp(24px, 6vw, 96px);
	padding: 12px 20px;
}
.wd-evo-style-d .wd-evo-backnum {
	opacity: 0 !important; /* giant outline number — not used in the Apple style, hide it */
}

/* ───── A · CINEMA STRIP ─────
 * Top+bottom 64px black letterbox bars. Meta on a single line in the bottom bar:
 * [eyebrow] | title · body. Cinematic trailer feel. */
.wd-evo-style-a .wd-evo-pin {
	overflow: hidden;
}
.wd-evo-style-a .wd-evo-pin::before,
.wd-evo-style-a .wd-evo-pin::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 64px;
	background: #000;
	z-index: 5;
	pointer-events: none;
}
.wd-evo-style-a .wd-evo-pin::before { top: 0; }
.wd-evo-style-a .wd-evo-pin::after  { bottom: 0; }
.wd-evo-style-a .wd-evo-content {
	align-items: flex-end;
	justify-content: flex-start;
	padding: 0 clamp(24px, 4vw, 48px) 24px;
}
.wd-evo-style-a .wd-evo-text {
	text-align: left;
	max-width: none;
	width: 100%;
	transform: translateY(20px);
	filter: none;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 18px;
}
.wd-evo-style-a .wd-evo-text.is-active {
	transform: translateY(0);
}
.wd-evo-style-a .wd-evo-text-eyebrow {
	margin-bottom: 0;
	font-size: 12px;
	flex-shrink: 0;
}
.wd-evo-style-a .wd-evo-text-title {
	font-size: clamp(22px, 2.4vw, 32px);
	margin: 0;
	line-height: 1.1;
	flex-shrink: 0;
	letter-spacing: -.01em;
}
.wd-evo-style-a .wd-evo-text-title::after {
	content: " · ";
	color: rgba(255,255,255,.4);
	margin: 0 10px;
}
.wd-evo-style-a .wd-evo-text-body {
	font-size: clamp(14px, 1.1vw, 16px);
	margin: 0;
	max-width: none;
	color: rgba(255,255,255,.8);
	flex: 1;
	min-width: 200px;
}
.wd-evo-style-a .wd-evo-counter {
	top: auto;
	bottom: 14px;
	right: 24px;
	padding: 8px 14px;
	font-size: 12px;
}
.wd-evo-style-a .wd-evo-backnum {
	opacity: 0 !important;
}

/* ───── B · MAGAZINE / SPLIT ─────
 * Left 60% video, right 40% editorial content panel.
 * Vertical timeline on the right (1-9 dots). */
.wd-evo-style-b .wd-evo-pin {
	display: grid;
	grid-template-columns: 60% 40%;
	gap: 0;
}
.wd-evo-style-b .wd-evo-stage {
	position: relative;
	grid-column: 1;
}
.wd-evo-style-b .wd-evo-content {
	position: relative;
	inset: auto;
	grid-column: 2;
	background: linear-gradient(180deg, var(--wd-bg-card), rgba(5,8,16,.95));
	border-left: 1px solid var(--wd-line-w-strong);
	align-items: center;
	justify-content: flex-start;
	padding: 80px clamp(40px, 5vw, 80px);
}
.wd-evo-style-b .wd-evo-text {
	text-align: left;
	max-width: 480px;
	position: absolute;
	transform: translateY(30px);
	filter: none;
}
.wd-evo-style-b .wd-evo-text.is-active {
	transform: translateY(0);
}
.wd-evo-style-b .wd-evo-text-title {
	font-size: clamp(36px, 3.5vw, 56px);
	line-height: 1;
	margin-bottom: 20px;
	text-shadow: none;
}
.wd-evo-style-b .wd-evo-text-body {
	font-size: 16px;
	color: var(--wd-ink-soft);
	max-width: none;
	margin: 0;
	text-shadow: none;
}
/* In the magazine style, keep the counter small in the top-right, on the video side */
.wd-evo-style-b .wd-evo-counter {
	top: 24px;
	right: calc(40% + 24px);
}
.wd-evo-style-b .wd-evo-backnum {
	opacity: 0 !important;
}
@media (max-width: 900px) {
	.wd-evo-style-b .wd-evo-pin {
		grid-template-columns: 1fr;
	}
	.wd-evo-style-b .wd-evo-content {
		grid-column: 1;
		border-left: none;
		border-top: 1px solid var(--wd-line-w-strong);
		padding: 32px 24px;
	}
	.wd-evo-style-b .wd-evo-counter {
		right: 24px;
	}
}

/* ───── E · ORIGINAL SCENE (centered + zoom-blur cinematic reveal) ─────
 * First version: scene dead-centered, scale zooms out from 1.35 to 1, blur from 8px to 0.
 * A large "01-09" outline number (backnum) shows in the background.
 * This is the style you see in the "Beginning" scene in the screenshot. */
.wd-evo-style-e .wd-evo-content {
	align-items: center;
	justify-content: center;
	padding: 0 32px;
}
.wd-evo-style-e .wd-evo-text {
	text-align: center;
	max-width: 820px;
	transform: scale(1.35);
	filter: blur(8px);
}
.wd-evo-style-e .wd-evo-text.is-active {
	transform: scale(1);
	filter: blur(0);
}
.wd-evo-style-e .wd-evo-text-title {
	font-size: clamp(48px, 7vw, 96px);
	line-height: .98;
	letter-spacing: -.04em;
	margin: 0 0 22px;
	text-shadow: 0 4px 48px rgba(0,0,0,.85), 0 2px 12px rgba(0,0,0,.6);
}
.wd-evo-style-e .wd-evo-text-body {
	font-size: clamp(17px, 1.7vw, 22px);
	max-width: 600px;
	margin: 0 auto;
	text-align: center;
}
.wd-evo-style-e .wd-evo-text-eyebrow {
	margin-bottom: 20px;
}
/* Show the large backnum outline number clearly (it was hidden in D/A/B/C) */
.wd-evo-style-e .wd-evo-backnum {
	opacity: 0;
}
.wd-evo-style-e .wd-evo-backnum.is-active {
	opacity: 1;
}
/* Counter stays in the top-right (original position) */
.wd-evo-style-e .wd-evo-counter {
	top: 32px;
	right: 32px;
	bottom: auto;
}

/* ───── C · GLASS OVERLAY ─────
 * Full-bleed video arka, ortada frosted glass panel + border.
 * iOS/premium app feel. */
.wd-evo-style-c .wd-evo-content {
	align-items: center;
	justify-content: center;
	padding: 0 24px;
}
.wd-evo-style-c .wd-evo-text {
	text-align: left;
	max-width: 640px;
	width: min(640px, 90vw);
	padding: 40px 44px;
	background: rgba(15, 23, 41, .55);
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 24px;
	backdrop-filter: blur(20px) saturate(140%);
	-webkit-backdrop-filter: blur(20px) saturate(140%);
	box-shadow: 0 24px 60px rgba(0,0,0,.4);
	transform: scale(.96);
	filter: none;
}
.wd-evo-style-c .wd-evo-text.is-active {
	transform: scale(1);
}
.wd-evo-style-c .wd-evo-text-title {
	font-size: clamp(36px, 4.5vw, 64px);
	line-height: 1;
	text-shadow: none;
	margin-bottom: 18px;
}
.wd-evo-style-c .wd-evo-text-body {
	max-width: none;
	margin: 0;
	text-shadow: none;
}
.wd-evo-style-c .wd-evo-backnum {
	opacity: 0 !important;
}

/* Final CTA — after the track */
.wd-evo-final {
	position: relative;
	z-index: 1;
	padding: 96px 32px 120px;
	max-width: 880px;
	margin: 0 auto;
	text-align: center;
	background: #050810;
}
.wd-evo-final-h2 {
	font-family: 'Inter Tight', sans-serif;
	font-size: clamp(32px, 4.4vw, 56px);
	font-weight: 600;
	letter-spacing: -.03em;
	line-height: 1.1;
	margin: 0 0 18px;
	color: var(--wd-ink);
}
.wd-evo-final-h2 em { font-style: normal; color: var(--wd-warm); }
.wd-evo-final-body {
	font-size: 18px;
	color: var(--wd-ink-soft);
	line-height: 1.6;
	margin: 0 0 28px;
}
.wd-evo-final-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 32px;
	background: var(--wd-accent-deep);
	color: #fff;
	border-radius: 999px;
	text-decoration: none;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: background .2s, transform .15s;
}
.wd-evo-final-cta:hover {
	background: #3A6BFF;
	transform: translateY(-2px);
	color: #fff;
}
.wd-evo-final-cta .arr { display: inline-block; transition: transform .25s; }
.wd-evo-final-cta:hover .arr { transform: translateX(4px); }

/* Mobile: track height shrinks + counter is centered */
@media (max-width: 768px) {
	.wd-evo-text {
		left: 24px;
		bottom: 48px;
		right: 24px;
	}
	.wd-evo-counter {
		top: 24px;
		right: 24px;
		padding: 8px 14px;
		font-size: 12px;
	}
	.wd-evo-progress { width: 50px; }
}

@media (prefers-reduced-motion: reduce) {
	.wd-evo-slide, .wd-evo-text { transition: none; }
}

/* ============================================================
 * LAST RESORT — WC CART/CHECKOUT MOBILE BULLETPROOF
 * At the very end of the stylesheet (maximum cascade priority).
 * If the rules above get overridden by WC's core CSS,
 * this block has the final say. Guaranteed stacking via flex-direction:column.
 * ============================================================ */
@media (max-width: 1024px) {
	/* Cart block — force all container variants into a single column */
	.wp-block-woocommerce-cart,
	.wp-block-woocommerce-filled-cart-block,
	.wp-block-woocommerce-cart .wc-block-components-sidebar-layout,
	.wc-block-cart {
		display: flex !important;
		flex-direction: column !important;
		gap: 24px !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	/* Cart direct children full width */
	.wp-block-woocommerce-cart > *,
	.wp-block-woocommerce-filled-cart-block > *,
	.wp-block-woocommerce-cart .wc-block-components-sidebar-layout > *,
	.wc-block-cart > * {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		flex: none !important;
		grid-column: 1 / -1 !important;
	}

	/* Checkout block — same strategy */
	.wp-block-woocommerce-checkout,
	.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout {
		display: flex !important;
		flex-direction: column !important;
		gap: 24px !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	.wp-block-woocommerce-checkout > *,
	.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > * {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		flex: none !important;
		grid-column: 1 / -1 !important;
	}

	/* All checkout steps and input wrappers inside the form, full width */
	.wp-block-woocommerce-checkout [class*="wp-block-woocommerce-checkout-"],
	.wp-block-woocommerce-checkout [class*="wc-block-components-checkout-step"] {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		display: block !important;
	}

	/* Input wrappers should not shrink inside the form */
	.wp-block-woocommerce-checkout .wc-block-components-text-input,
	.wp-block-woocommerce-checkout .wc-block-components-select,
	.wp-block-woocommerce-checkout .wc-block-components-country-input,
	.wp-block-woocommerce-checkout .wc-block-components-state-input {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		flex: 1 1 100% !important;
	}

	/* OTP panel also full width inside checkout */
	.wp-block-woocommerce-checkout .wd-otp-panel,
	.wp-block-woocommerce-cart .wd-otp-panel {
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* Cart item layout fix — image, name, price, trash arranged sensibly (flex-based) */
@media (max-width: 1024px) {
	.wc-block-cart-items {
		width: 100% !important;
		display: block !important;
	}
	.wc-block-cart-items__row,
	.wc-block-cart-item {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: flex-start !important;
		gap: 16px !important;
		padding: 16px 0 !important;
		border-bottom: 1px solid var(--wd-line-w);
		width: 100% !important;
	}
	.wc-block-cart-item__image {
		flex: 0 0 88px !important;
		width: 88px !important;
		height: 88px !important;
		display: block !important;
	}
	.wc-block-cart-item__product {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		display: block !important;
	}
	.wc-block-cart-item__total {
		flex: 0 0 auto !important;
		text-align: right !important;
		white-space: nowrap !important;
		display: block !important;
	}
}
@media (max-width: 480px) {
	.wc-block-cart-items__row,
	.wc-block-cart-item {
		grid-template-columns: 64px minmax(0, 1fr) auto !important;
		column-gap: 12px !important;
	}
	.wc-block-cart-item__image {
		width: 64px !important;
		height: 64px !important;
	}
}

/* =========================================================================
 * PURCHASE OPTIONS (Bridge page)
 * page-satin-alma-secenekleri.php + inc/elementor-widgets/offer-grid.php
 * ========================================================================= */

.wd-offers-page {
	background: var(--wd-surface);
	color: var(--wd-ink);
	padding-bottom: 0;
}

/* ---- HERO ---- */
.wd-offers-hero {
	padding: 64px 32px 48px;
	background: linear-gradient(180deg, rgba(91,124,255,.05) 0%, transparent 100%);
	border-bottom: 1px solid rgba(255,255,255,.06);
}
.wd-offers-hero-inner {
	max-width: 1180px;
	margin: 0 auto;
}
.wd-offers-crumb {
	display: flex;
	gap: 8px;
	align-items: center;
	color: var(--wd-ink-mute);
	font-size: 13px;
	margin-bottom: 28px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.wd-offers-crumb a { color: var(--wd-ink-mute); }
.wd-offers-crumb a:hover { color: var(--wd-accent); }
.wd-offers-crumb .sep { opacity: .4; }
.wd-offers-crumb .here { color: var(--wd-ink-soft); }

.wd-offers-eyebrow {
	display: inline-block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: .04em;
	color: var(--wd-accent);
	margin-bottom: 14px;
}

.wd-offers-h1 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(36px, 5vw, 56px);
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: -.02em;
	margin: 0 0 18px;
	max-width: 760px;
	color: var(--wd-ink);
}
.wd-offers-h1 em {
	color: var(--wd-accent);
	font-style: italic;
}

.wd-offers-lead {
	font-size: 17px;
	line-height: 1.6;
	color: var(--wd-ink-soft);
	max-width: 680px;
	margin: 0 0 32px;
}

/* Scarcity badge — below the hero */
.wd-offers-scarcity {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 14px 20px;
	background: rgba(236,122,26,.08);
	border: 1px solid rgba(236,122,26,.25);
	border-radius: 12px;
	max-width: 460px;
}
.wd-offers-scarcity-icon {
	font-size: 18px;
	color: var(--wd-warm);
	flex-shrink: 0;
}
.wd-offers-scarcity-text {
	flex: 1;
	min-width: 0;
}
.wd-offers-scarcity-label {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--wd-ink-soft);
	margin-bottom: 6px;
}
.wd-offers-scarcity-bar {
	display: block;
	height: 4px;
	background: rgba(255,255,255,.06);
	border-radius: 2px;
	overflow: hidden;
}
.wd-offers-scarcity-bar span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--wd-warm) 0%, #FF9A4D 100%);
	border-radius: 2px;
	transition: width .4s ease;
}

/* ---- CARDS GRID ---- */
.wd-offers-grid-section {
	padding: 56px 32px;
}
.wd-offers-grid-inner {
	max-width: 1320px;
	margin: 0 auto;
}
.wd-offers-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 56px 36px;  /* vertical: 56px (roomy for the highlight ribbon + glow) — horizontal: 36px */
}
@media (max-width: 900px) {
	.wd-offers-grid { grid-template-columns: 1fr; gap: 44px; }
}

.wd-offer-card {
	--wd-offer-accent: var(--wd-accent);
	position: relative;
	background: var(--wd-surface-2);
	border: 1px solid rgba(255,255,255,.06);
	border-radius: 18px;
	padding: 0; /* so the media is full width, content padding goes to the block below */
	display: flex;
	flex-direction: column;
	gap: 0;
	overflow: hidden;
	transition: border-color .2s, transform .25s, box-shadow .25s;
	/* Stagger fade-in default state */
	opacity: 0;
	transform: translateY(16px);
}
.wd-offer-card.is-in-view {
	opacity: 1;
	transform: translateY(0);
	transition: opacity .5s ease, transform .5s ease, border-color .2s, box-shadow .25s;
}

/* Accent strip (3px color line at the top of the card) */
.wd-offer-accent-strip {
	display: block;
	height: 3px;
	background: var(--wd-offer-accent);
	flex-shrink: 0;
	border-top-left-radius: 18px;
	border-top-right-radius: 18px;
}
/* Hide the accent strip on highlight cards — the highlight border already does the job */
.wd-offer-card.is-highlight .wd-offer-accent-strip { display: none; }

/* Tier badge (top-left) */
.wd-offer-tier {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px 5px 8px;
	background: rgba(11, 18, 32, .85);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid var(--wd-offer-accent);
	border-radius: 999px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .06em;
	color: #fff;
	box-shadow: 0 4px 14px -4px rgba(0,0,0,.4);
}
.wd-offer-tier-icon { font-size: 12px; line-height: 1; }
.wd-offer-tier-populer  { border-color: #7C5BFF; }
.wd-offer-tier-yeni     { border-color: #62A93A; }
.wd-offer-tier-son-sans { border-color: #EC7A1A; }
.wd-offer-tier-onerilen { border-color: #5B7CFF; }

/* MEDIA AREA — image or large fallback text */
.wd-offer-media {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: linear-gradient(135deg, var(--wd-surface) 0%, var(--wd-surface-2) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	/* Round the top corners — so that when the parent has overflow:visible on highlight cards,
	   the image still follows the card's rounded corners */
	border-top-left-radius: 17px;
	border-top-right-radius: 17px;
}
.wd-offer-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s ease;
}
.wd-offer-card:hover .wd-offer-media img {
	transform: scale(1.04);
}
.wd-offer-media.has-fallback {
	background:
		radial-gradient(circle at top right, color-mix(in srgb, var(--wd-offer-accent) 25%, transparent), transparent 60%),
		linear-gradient(135deg, var(--wd-surface) 0%, var(--wd-surface-2) 100%);
}
.wd-offer-media-fallback {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: clamp(36px, 5vw, 56px);
	font-weight: 700;
	letter-spacing: .04em;
	color: color-mix(in srgb, var(--wd-offer-accent) 70%, white);
	opacity: .65;
	text-align: center;
	line-height: 1;
	user-select: none;
	pointer-events: none;
}
/* Icon — small overlay in the bottom-right of the media */
.wd-offer-media .wd-offer-icon {
	position: absolute;
	bottom: 14px;
	right: 14px;
	font-size: 28px;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: rgba(11, 18, 32, .8);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 18px -4px rgba(0,0,0,.5);
}

/* Content blocks — padding after the media */
.wd-offer-card-head,
.wd-offer-bullets,
.wd-offer-cta,
.wd-offer-stock,
.wd-offer-stat,
.wd-offer-proof {
	margin-left: 32px;
	margin-right: 32px;
}
.wd-offer-card-head { margin-top: 24px; padding-right: 90px; }
.wd-offer-bullets   { margin-top: 22px; }
.wd-offer-stock     { margin-top: 18px; }
.wd-offer-cta       { margin-top: 22px; }
.wd-offer-stat      { margin-top: 14px; }
.wd-offer-proof     { margin-top: 18px; padding-top: 16px; }

/* Keep the card's last content from touching the border — padding-bottom excluding the image area */
.wd-offer-card { padding-bottom: 28px; }
/* If the card's last child is .wd-offer-card-head (special case), add extra bottom spacing */
.wd-offer-card > :last-child { margin-bottom: 0; }

/* Percentage badge — a striking gradient pill in the top-right of the card (over the media) */
.wd-offer-badge {
	position: absolute;
	top: 14px;
	right: 14px;
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
	padding: 8px 14px;
	background: linear-gradient(135deg, var(--wd-warm) 0%, #FF9A4D 100%);
	color: #fff;
	border-radius: 999px;
	box-shadow: 0 6px 18px -6px rgba(236,122,26,.5), 0 0 0 1px rgba(255,255,255,.08);
	z-index: 3;
}
.wd-offer-badge-percent {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1;
}
.wd-offer-badge-suffix {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .06em;
	opacity: .9;
	line-height: 1;
}
.wd-offer-card.is-recommended .wd-offer-badge {
	background: linear-gradient(135deg, var(--wd-accent) 0%, var(--wd-accent-deep) 100%);
	box-shadow: 0 6px 18px -6px rgba(91,124,255,.5), 0 0 0 1px rgba(255,255,255,.08);
}

/* STOCK INDICATOR */
.wd-offer-stock {
	background: rgba(236,122,26,.06);
	border: 1px solid rgba(236,122,26,.15);
	border-radius: 10px;
	padding: 10px 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.wd-offer-stock-head {
	display: flex;
	align-items: center;
	gap: 8px;
}
.wd-offer-stock-icon { font-size: 14px; color: var(--wd-warm); }
.wd-offer-stock-label {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	font-weight: 500;
	color: var(--wd-ink-soft);
}
.wd-offer-stock-bar {
	display: block;
	height: 4px;
	background: rgba(255,255,255,.06);
	border-radius: 2px;
	overflow: hidden;
}
.wd-offer-stock-bar span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--wd-warm) 0%, #FF9A4D 100%);
	border-radius: 2px;
	transition: width .5s ease;
}

/* ============================================================
 * OFFER CARD HIGHLIGHT — flashy border for big discounts
 * Three themes: red, bordeaux, gold
 * Each has: an animated glow border + a giant ribbon badge + attention in the top-right corner
 * ============================================================ */
.wd-offer-card.is-highlight {
	position: relative;
	overflow: visible !important;
	z-index: 2;
}

/* Base of the ribbon badge — slightly overflows the top of the card */
.wd-offer-highlight-ribbon {
	position: absolute;
	top: -14px;
	left: 50%;
	transform: translateX(-50%);
	padding: 6px 18px;
	border-radius: 999px;
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #fff;
	white-space: nowrap;
	z-index: 5;
	box-shadow: 0 6px 18px rgba(0,0,0,0.35), 0 0 0 2px rgba(255,255,255,0.08);
	animation: wd-ribbon-pulse 2.4s ease-in-out infinite;
}

@keyframes wd-ribbon-pulse {
	0%, 100% { transform: translateX(-50%) translateY(0) scale(1); }
	50%      { transform: translateX(-50%) translateY(-2px) scale(1.04); }
}

@keyframes wd-highlight-border-glow {
	0%, 100% { box-shadow: 0 0 0 1px var(--hl-color-edge), 0 0 24px 0 var(--hl-color-glow), 0 14px 50px rgba(0,0,0,0.3); }
	50%      { box-shadow: 0 0 0 2px var(--hl-color-edge), 0 0 36px 6px var(--hl-color-glow), 0 14px 50px rgba(0,0,0,0.35); }
}

/* --- RED --- */
.wd-offer-card.is-highlight-red {
	--hl-color-edge: #FF3D3D;
	--hl-color-glow: rgba(255, 61, 61, 0.45);
	border-color: #FF3D3D !important;
	animation: wd-highlight-border-glow 3s ease-in-out infinite;
	background: linear-gradient(180deg, rgba(255, 61, 61, 0.10), rgba(31, 45, 92, 0.4)) !important;
}
.wd-offer-card.is-highlight-red .wd-offer-highlight-ribbon {
	background: linear-gradient(135deg, #FF3D3D 0%, #C8181D 100%);
}

/* --- BORDEAUX (premium) --- */
.wd-offer-card.is-highlight-bordeaux {
	--hl-color-edge: #8B1A2D;
	--hl-color-glow: rgba(139, 26, 45, 0.5);
	border-color: #B0263D !important;
	animation: wd-highlight-border-glow 3.4s ease-in-out infinite;
	background: linear-gradient(180deg, rgba(176, 38, 61, 0.12), rgba(31, 22, 35, 0.5)) !important;
}
.wd-offer-card.is-highlight-bordeaux .wd-offer-highlight-ribbon {
	background: linear-gradient(135deg, #B0263D 0%, #6B0F22 100%);
	box-shadow: 0 6px 18px rgba(139, 26, 45, 0.5), 0 0 0 2px rgba(255, 215, 175, 0.12);
}

/* --- GOLD (VIP) --- */
.wd-offer-card.is-highlight-gold {
	--hl-color-edge: #D4A540;
	--hl-color-glow: rgba(212, 165, 64, 0.5);
	border-color: #D4A540 !important;
	animation: wd-highlight-border-glow 3s ease-in-out infinite;
	background: linear-gradient(180deg, rgba(212, 165, 64, 0.12), rgba(31, 45, 92, 0.4)) !important;
}
.wd-offer-card.is-highlight-gold .wd-offer-highlight-ribbon {
	background: linear-gradient(135deg, #F5C84B 0%, #B07F1F 100%);
	color: #1a0e00;
	text-shadow: 0 1px 0 rgba(255,255,255,0.3);
}

/* Percentage badge is larger on highlight cards */
.wd-offer-card.is-highlight .wd-offer-percent {
	transform: scale(1.08);
	transition: transform .3s ease;
}
.wd-offer-card.is-highlight:hover .wd-offer-percent {
	transform: scale(1.15);
}

/* Almost gone (>70% full) → bar becomes a more prominent red-orange + label color */
.wd-offer-stock.is-almost-full .wd-offer-stock-bar span {
	background: linear-gradient(90deg, #FF5C3C 0%, #FF8A4D 100%);
	box-shadow: 0 0 8px rgba(255, 92, 60, 0.5);
}
.wd-offer-stock.is-almost-full .wd-offer-stock-label {
	color: #FF8A4D;
	font-weight: 700;
}

/* MINI STAT RIBBON */
.wd-offer-stat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	align-self: flex-start;
	background: color-mix(in srgb, var(--wd-offer-accent) 12%, transparent);
	border: 1px solid color-mix(in srgb, var(--wd-offer-accent) 30%, transparent);
	border-radius: 999px;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-offer-accent);
	font-weight: 500;
}
.wd-offer-stat svg { flex-shrink: 0; }

/* HOVER — tilt + glow */
.wd-offer-card {
	transform-style: preserve-3d;
}
.wd-offer-card:hover {
	border-color: color-mix(in srgb, var(--wd-offer-accent) 40%, rgba(255,255,255,.06));
	box-shadow: 0 18px 50px -16px rgba(0,0,0,.5),
				0 0 0 1px color-mix(in srgb, var(--wd-offer-accent) 25%, transparent),
				0 0 40px -12px color-mix(in srgb, var(--wd-offer-accent) 50%, transparent);
}
.wd-offer-card.is-in-view:hover {
	transform: translateY(-4px);
}

/* Tie the bullets' check color to the accent */
.wd-offer-bullets .check {
	color: var(--wd-offer-accent);
}

/* Take the CTA's accent color */
.wd-offer-cta {
	background: color-mix(in srgb, var(--wd-offer-accent) 12%, transparent);
	border-color: color-mix(in srgb, var(--wd-offer-accent) 30%, transparent);
	color: var(--wd-offer-accent);
}
.wd-offer-cta:hover {
	background: var(--wd-offer-accent);
	border-color: var(--wd-offer-accent);
	color: #fff;
}

/* MOBILE */
@media (max-width: 600px) {
	.wd-offer-badge { top: 12px; right: 12px; padding: 6px 12px; }
	.wd-offer-badge-percent { font-size: 14px; }
	.wd-offer-tier { top: 10px; left: 10px; padding: 4px 9px 4px 7px; font-size: 9.5px; }
	.wd-offer-media .wd-offer-icon { width: 40px; height: 40px; font-size: 22px; bottom: 10px; right: 10px; }
	.wd-offer-media-fallback { font-size: 32px; }
	.wd-offer-card-head,
	.wd-offer-bullets,
	.wd-offer-cta,
	.wd-offer-stock,
	.wd-offer-stat,
	.wd-offer-proof { margin-left: 22px; margin-right: 22px; }
	.wd-offer-card-head { padding-right: 80px; }
}

/* Legacy padding-right override, kept for backward compatibility */
.wd-offer-card-head { padding-right: 90px; }
.wd-offer-card:hover {
	border-color: rgba(91,124,255,.3);
}
.wd-offer-card.is-recommended {
	border-color: var(--wd-accent);
	box-shadow: 0 0 0 1px var(--wd-accent), 0 12px 40px -8px rgba(91,124,255,.4);
	transform: translateY(-2px);
}

.wd-offer-recommend-badge {
	position: absolute;
	top: -12px;
	left: 24px;
	background: var(--wd-accent);
	color: #fff;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 600;
	font-size: 12px;
	padding: 6px 12px;
	border-radius: 999px;
	letter-spacing: .02em;
	box-shadow: 0 4px 12px -2px rgba(42,91,255,.5);
	animation: wd-offer-pop .3s cubic-bezier(.34,1.56,.64,1);
}
@keyframes wd-offer-pop {
	0%   { opacity: 0; transform: translateY(-4px) scale(.9); }
	100% { opacity: 1; transform: translateY(0) scale(1); }
}

.wd-offer-card-head {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.wd-offer-icon {
	font-size: 28px;
	line-height: 1;
	margin-bottom: 4px;
}
.wd-offer-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: .08em;
	color: var(--wd-accent);
	font-weight: 500;
}
.wd-offer-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--wd-ink);
	margin: 0;
}
.wd-offer-body {
	font-size: 15px;
	line-height: 1.55;
	color: var(--wd-ink-soft);
	margin: 0;
}

.wd-offer-bullets {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.wd-offer-bullets li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14.5px;
	color: var(--wd-ink-soft);
	line-height: 1.5;
}
.wd-offer-bullets .check {
	color: var(--wd-accent);
	flex-shrink: 0;
	margin-top: 2px;
}

.wd-offer-cta {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 20px;
	background: rgba(91,124,255,.1);
	border: 1px solid rgba(91,124,255,.25);
	border-radius: 12px;
	color: var(--wd-accent);
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 600;
	font-size: 15px;
	transition: background .2s, border-color .2s, transform .15s;
	text-decoration: none;
}
.wd-offer-cta:hover {
	background: var(--wd-accent);
	border-color: var(--wd-accent);
	color: #fff;
	transform: translateY(-1px);
}
.wd-offer-cta .arr {
	transition: transform .2s;
}
.wd-offer-cta:hover .arr {
	transform: translateX(3px);
}
.wd-offer-card.is-recommended .wd-offer-cta {
	background: var(--wd-accent);
	color: #fff;
	border-color: var(--wd-accent);
}

.wd-offer-proof {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin-top: 18px;
	padding: 14px 16px;
	background: rgba(255,255,255,0.025);
	border: 1px solid rgba(255,255,255,0.06);
	border-left: 3px solid var(--wd-warm);
	border-radius: 6px;
}
.wd-offer-proof-bar {
	display: none; /* replaced by the left strip in the border */
}
.wd-offer-proof p {
	font-size: 13px;
	font-style: normal;
	color: rgba(255,255,255,0.62);
	margin: 0;
	line-height: 1.55;
	font-family: var(--wd-sans, 'Inter', system-ui, sans-serif);
}

/* ---- MINI SEGMENTER ---- */
.wd-offers-segmenter {
	padding: 56px 32px;
	background: linear-gradient(180deg, transparent 0%, rgba(91,124,255,.04) 100%);
	border-top: 1px solid rgba(255,255,255,.05);
}
.wd-offers-segmenter-inner {
	max-width: 880px;
	margin: 0 auto;
}
.wd-offers-segmenter-head {
	text-align: center;
	margin-bottom: 32px;
}
.wd-offers-segmenter-head h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 600;
	letter-spacing: -.015em;
	line-height: 1.2;
	margin: 10px 0 12px;
	color: var(--wd-ink);
}
.wd-offers-segmenter-sub {
	color: var(--wd-ink-mute);
	font-size: 15px;
	margin: 0;
}

.wd-offers-segmenter-form {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.wd-chip-group {
	border: none;
	padding: 0;
	margin: 0;
}
.wd-chip-group legend {
	display: block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wd-ink-mute);
	margin-bottom: 10px;
}
.wd-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.wd-chip {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	padding: 10px 16px;
	background: var(--wd-surface-2);
	color: var(--wd-ink-soft);
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 999px;
	cursor: pointer;
	transition: all .15s ease;
}
.wd-chip:hover {
	border-color: rgba(91,124,255,.4);
	color: var(--wd-ink);
}
.wd-chip.is-active {
	background: var(--wd-accent);
	border-color: var(--wd-accent);
	color: #fff;
}

.wd-offers-segmenter-actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
}
.wd-offers-segmenter-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 26px;
	background: var(--wd-accent);
	color: #fff;
	border: none;
	border-radius: 12px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: background .15s, transform .15s, box-shadow .2s;
	box-shadow: 0 6px 20px -6px rgba(42,91,255,.5);
}
.wd-offers-segmenter-cta:hover {
	background: var(--wd-accent-deep);
	transform: translateY(-1px);
	box-shadow: 0 10px 28px -8px rgba(42,91,255,.6);
}
.wd-offers-segmenter-cta .arr { transition: transform .2s; }
.wd-offers-segmenter-cta:hover .arr { transform: translateX(3px); }

.wd-offers-segmenter-hint {
	font-size: 13px;
	color: var(--wd-ink-mute);
	margin: 0;
	min-height: 1.4em;
	transition: color .15s;
}
.wd-offers-segmenter-hint.is-success { color: #62A93A; }
.wd-offers-segmenter-hint.is-error   { color: var(--wd-warm); }

/* ---- OUTRO ---- */
.wd-offers-outro {
	padding: 32px 32px 64px;
	text-align: center;
}
.wd-offers-outro-inner {
	max-width: 880px;
	margin: 0 auto;
}
.wd-offers-outro p {
	color: var(--wd-ink-mute);
	font-size: 14px;
	margin: 0;
}
.wd-offers-outro a {
	color: var(--wd-accent);
	font-weight: 500;
	margin-left: 6px;
}

/* Mobile settings */
@media (max-width: 600px) {
	.wd-offers-hero       { padding: 40px 20px 32px; }
	.wd-offers-grid-section { padding: 36px 20px; }
	.wd-offers-segmenter  { padding: 40px 20px; }
	.wd-offers-outro      { padding: 24px 20px 48px; }
	.wd-offer-card        { padding: 24px; gap: 18px; }
	.wd-offers-h1         { font-size: 32px; }
	.wd-offers-scarcity   { max-width: 100%; }
}

/* =========================================================================
 * WELCOME FLOATING WIDGET (1-hour automatic coupon)
 * inc/offers.php → render_welcome_highlight() + page template inline JS
 * 2 states: data-wd-welcome-state="expanded" | "collapsed"
 * ========================================================================= */

.wd-welcome-float {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 9990;
	animation: wd-welcome-in .35s cubic-bezier(.34,1.56,.64,1);
}
@keyframes wd-welcome-in {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* State toggles */
.wd-welcome-float[data-wd-welcome-state="collapsed"] .wd-welcome-panel { display: none; }
.wd-welcome-float[data-wd-welcome-state="expanded"]  .wd-welcome-chip  { display: none; }

/* ---- MINI CHIP (collapsed) ---- */
.wd-welcome-chip {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	background: linear-gradient(135deg, var(--wd-warm) 0%, #FF9A4D 100%);
	color: #fff;
	border: none;
	border-radius: 999px;
	box-shadow: 0 10px 28px -10px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.08);
	cursor: pointer;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 500;
	transition: transform .15s, box-shadow .2s, filter .15s;
}
.wd-welcome-chip:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 36px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.15);
	filter: brightness(1.06);
}
.wd-welcome-float.is-upgraded .wd-welcome-chip {
	background: linear-gradient(135deg, var(--wd-accent) 0%, var(--wd-accent-deep) 100%);
}
.wd-welcome-chip-icon { font-size: 18px; line-height: 1; }
.wd-welcome-chip-body {
	display: flex;
	flex-direction: column;
	gap: 0;
	text-align: left;
	line-height: 1.1;
}
.wd-welcome-chip-percent {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: .02em;
}
.wd-welcome-chip-timer {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 10.5px;
	opacity: .85;
	margin-top: 1px;
}
.wd-welcome-chip-arrow {
	font-size: 11px;
	opacity: .75;
	margin-left: 2px;
}

/* ---- EXPANDED PANEL ---- */
.wd-welcome-panel {
	position: relative;
	width: 340px;
	max-width: calc(100vw - 40px);
	padding: 22px 24px;
	background: var(--wd-surface-2);
	border: 1px solid rgba(236,122,26,.4);
	border-radius: 16px;
	box-shadow: 0 18px 50px -12px rgba(0,0,0,.55), 0 0 0 1px rgba(236,122,26,.18);
	overflow: hidden;
}
.wd-welcome-float.is-upgraded .wd-welcome-panel {
	border-color: var(--wd-accent);
	box-shadow: 0 18px 50px -12px rgba(0,0,0,.55), 0 0 0 1px var(--wd-accent), 0 0 36px -10px rgba(91,124,255,.35);
}

.wd-welcome-collapse {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.1);
	color: var(--wd-ink-soft);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s, color .15s;
	padding: 0;
}
.wd-welcome-collapse:hover {
	background: rgba(255,255,255,.12);
	color: var(--wd-ink);
}

.wd-welcome-inner {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}
.wd-welcome-icon {
	font-size: 28px;
	line-height: 1;
	flex-shrink: 0;
	padding-top: 2px;
}
.wd-welcome-content {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.wd-welcome-head { display: flex; flex-direction: column; gap: 4px; }
.wd-welcome-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 10.5px;
	letter-spacing: .04em;
	color: var(--wd-warm);
	font-weight: 500;
}
.wd-welcome-float.is-upgraded .wd-welcome-eyebrow { color: var(--wd-accent); }

.wd-welcome-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--wd-ink);
	margin: 0;
	display: flex;
	gap: 6px;
	align-items: baseline;
	flex-wrap: wrap;
}
.wd-welcome-percent {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 22px;
	font-weight: 600;
	color: var(--wd-warm);
	transition: color .3s;
}
.wd-welcome-float.is-upgraded .wd-welcome-percent { color: var(--wd-accent); }

.wd-welcome-sub {
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	margin: 0;
	line-height: 1.45;
}

.wd-welcome-code-box {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: rgba(255,255,255,.04);
	border: 1px dashed rgba(255,255,255,.18);
	border-radius: 8px;
}
.wd-welcome-code-label {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 9px;
	letter-spacing: .1em;
	color: var(--wd-ink-mute);
}
.wd-welcome-code {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 14px;
	font-weight: 600;
	color: var(--wd-ink);
	letter-spacing: .04em;
	user-select: all;
}

.wd-welcome-actions {
	display: flex;
	gap: 6px;
}
.wd-welcome-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 8px 12px;
	background: rgba(255,255,255,.05);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 7px;
	color: var(--wd-ink-soft);
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 500;
	font-size: 12.5px;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s, transform .15s;
	text-decoration: none;
	flex: 1;
	justify-content: center;
}
.wd-welcome-btn:hover {
	background: rgba(255,255,255,.1);
	border-color: rgba(255,255,255,.2);
	color: var(--wd-ink);
}
.wd-welcome-btn.is-primary {
	background: var(--wd-warm);
	border-color: var(--wd-warm);
	color: #fff;
}
.wd-welcome-btn.is-primary:hover {
	background: #FF9A4D;
	border-color: #FF9A4D;
	color: #fff;
	transform: translateY(-1px);
}
.wd-welcome-float.is-upgraded .wd-welcome-btn.is-primary {
	background: var(--wd-accent);
	border-color: var(--wd-accent);
}
.wd-welcome-float.is-upgraded .wd-welcome-btn.is-primary:hover {
	background: var(--wd-accent-deep);
}
.wd-welcome-btn .arr { transition: transform .15s; }
.wd-welcome-btn.is-primary:hover .arr { transform: translateX(2px); }

.wd-welcome-footer {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	padding-top: 10px;
	border-top: 1px solid rgba(255,255,255,.06);
}
.wd-welcome-timer {
	display: inline-flex;
	gap: 5px;
	align-items: center;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-warm);
	font-weight: 500;
}
.wd-welcome-float.is-upgraded .wd-welcome-timer { color: var(--wd-accent); }
.wd-welcome-timer-icon { font-size: 12px; }
.wd-welcome-upgrade-hint {
	font-size: 11.5px;
	color: var(--wd-ink-mute);
	font-style: italic;
}

/* Upgrade CTA — a shiny button pointing to the segmenter (inside the panel) */
.wd-welcome-upgrade-cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 10px;
	background: linear-gradient(135deg, var(--wd-accent) 0%, var(--wd-accent-deep) 100%);
	color: #fff;
	border-radius: 999px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 600;
	box-shadow: 0 3px 10px -3px rgba(91,124,255,.5);
	transition: transform .15s, filter .15s;
	text-decoration: none;
	cursor: pointer;
}
.wd-welcome-upgrade-cta:hover {
	color: #fff;
	transform: translateY(-1px);
	filter: brightness(1.08);
}
.wd-welcome-upgrade-arrow {
	font-size: 12px;
	font-weight: 700;
	animation: wd-bounce-down 1.4s ease-in-out infinite;
}
@keyframes wd-bounce-down {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(2px); }
}
.wd-welcome-float.is-upgraded .wd-welcome-upgrade-cta {
	display: none !important;
}

/* Brief flash highlight when scrolling to the segmenter */
.wd-offers-segmenter.is-flash {
	animation: wd-segmenter-flash 1.4s ease-out;
}
@keyframes wd-segmenter-flash {
	0%   { box-shadow: inset 0 0 0 3px rgba(91,124,255,0); }
	25%  { box-shadow: inset 0 0 0 3px rgba(91,124,255,.5); }
	100% { box-shadow: inset 0 0 0 3px rgba(91,124,255,0); }
}

/* The segmenter is now in the primary position — spacing on the anchor for scroll-margin */
#wd-segmenter-title { scroll-margin-top: 24px; }

/* The segmenter section is now ABOVE the cards — use a top border instead of a bottom one */
.wd-offers-segmenter {
	border-top: 1px solid rgba(255,255,255,.05);
}

/* Toast — appears after "Apply now" via a ?coupon_applied=X redirect.
   bottom: sits 90px up so it doesn't collide with the floating widget. */
.wd-welcome-toast {
	position: fixed;
	bottom: 90px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 9999;
	padding: 14px 22px;
	background: var(--wd-accent);
	color: #fff;
	border-radius: 12px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 500;
	font-size: 14.5px;
	box-shadow: 0 14px 40px -10px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.1);
	animation: wd-toast-in .3s cubic-bezier(.34,1.56,.64,1);
}
.wd-welcome-toast.is-out {
	animation: wd-toast-out .6s ease forwards;
}
@keyframes wd-toast-in {
	from { opacity: 0; transform: translate(-50%, 16px); }
	to   { opacity: 1; transform: translate(-50%, 0); }
}
@keyframes wd-toast-out {
	from { opacity: 1; transform: translate(-50%, 0); }
	to   { opacity: 0; transform: translate(-50%, 16px); }
}

/* Floating widget on mobile */
@media (max-width: 600px) {
	.wd-welcome-float        { bottom: 12px; right: 12px; }
	.wd-welcome-float[data-wd-welcome-state="expanded"] {
		left: 12px; /* full width when expanded on mobile, for a bottom-sheet feel */
	}
	.wd-welcome-float[data-wd-welcome-state="expanded"] .wd-welcome-panel {
		width: auto;
		max-width: 100%;
		padding: 18px 20px;
	}
	.wd-welcome-icon         { font-size: 24px; }
	.wd-welcome-title        { font-size: 16px; }
	.wd-welcome-percent      { font-size: 20px; }
	.wd-welcome-footer       { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* =========================================================================
 * DRILL-DOWN MODAL (sector selection)
 * inc/offers.php → render_drilldown_modal() + page template inline JS
 * ========================================================================= */

.wd-drilldown-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	animation: wd-drilldown-fade .2s ease-out;
}
.wd-drilldown-modal[hidden] { display: none; }
@keyframes wd-drilldown-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.wd-drilldown-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(5, 8, 16, .82);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	cursor: pointer;
}

.wd-drilldown-dialog {
	position: relative;
	background: var(--wd-surface-2);
	border: 1px solid var(--wd-accent);
	border-radius: 20px;
	padding: 36px 32px;
	max-width: 520px;
	width: 100%;
	box-shadow: 0 20px 60px -10px rgba(0,0,0,.6), 0 0 0 1px var(--wd-accent), 0 0 60px -10px rgba(91,124,255,.4);
	animation: wd-drilldown-pop .25s cubic-bezier(.34,1.56,.64,1);
	max-height: 90vh;
	overflow-y: auto;
}
@keyframes wd-drilldown-pop {
	from { opacity: 0; transform: translateY(12px) scale(.95); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.wd-drilldown-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.1);
	color: var(--wd-ink-soft);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s, color .15s;
}
.wd-drilldown-close:hover {
	background: rgba(255,255,255,.12);
	color: var(--wd-ink);
}

.wd-drilldown-eyebrow {
	display: block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: .04em;
	color: var(--wd-accent);
	margin-bottom: 10px;
}

.wd-drilldown-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -.015em;
	color: var(--wd-ink);
	margin: 0 0 8px;
}

.wd-drilldown-sub {
	font-size: 14px;
	color: var(--wd-ink-mute);
	margin: 0 0 24px;
	line-height: 1.55;
}

.wd-drilldown-chips {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
}

.wd-drilldown-chip {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	background: rgba(91,124,255,.08);
	border: 1px solid rgba(91,124,255,.2);
	border-radius: 12px;
	color: var(--wd-ink);
	text-decoration: none;
	transition: all .15s;
}
.wd-drilldown-chip:hover {
	background: var(--wd-accent);
	border-color: var(--wd-accent);
	color: #fff;
	transform: translateX(2px);
}
.wd-drilldown-chip-icon {
	font-size: 26px;
	line-height: 1;
	flex-shrink: 0;
}
.wd-drilldown-chip-body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.wd-drilldown-chip-label {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -.005em;
}
.wd-drilldown-chip-percent {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	color: var(--wd-warm);
	font-weight: 500;
}
.wd-drilldown-chip:hover .wd-drilldown-chip-percent {
	color: #fff;
	opacity: .9;
}
.wd-drilldown-chip-arrow {
	font-size: 18px;
	font-weight: 600;
	color: var(--wd-accent);
	transition: transform .15s;
}
.wd-drilldown-chip:hover .wd-drilldown-chip-arrow {
	color: #fff;
	transform: translateX(3px);
}

.wd-drilldown-empty {
	color: var(--wd-ink-mute);
	font-size: 14px;
	line-height: 1.6;
	padding: 16px;
	background: rgba(236,122,26,.08);
	border: 1px dashed rgba(236,122,26,.3);
	border-radius: 10px;
	margin: 0;
}
.wd-drilldown-empty small {
	color: var(--wd-ink-mute);
	opacity: .8;
}

.wd-drilldown-footnote {
	font-size: 12.5px;
	color: var(--wd-ink-mute);
	margin: 0;
	text-align: center;
	padding-top: 16px;
	border-top: 1px solid rgba(255,255,255,.06);
}
.wd-drilldown-footnote a { color: var(--wd-accent); font-weight: 500; }

@media (max-width: 600px) {
	.wd-drilldown-dialog { padding: 28px 22px; border-radius: 16px; }
	.wd-drilldown-title  { font-size: 20px; }
	.wd-drilldown-chip   { padding: 12px 14px; gap: 12px; }
	.wd-drilldown-chip-icon { font-size: 22px; }
	.wd-drilldown-chip-label { font-size: 14px; }
}

/* =========================================================================
 * PITCH MODAL — "Tell us about your project" form
 * inc/pitch.php → render_modal() + page template inline JS + AJAX
 * ========================================================================= */

.wd-pitch-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	animation: wd-pitch-fade .2s ease-out;
}
.wd-pitch-modal[hidden] { display: none; }
@keyframes wd-pitch-fade { from { opacity: 0; } to { opacity: 1; } }

.wd-pitch-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(5, 8, 16, .82);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	cursor: pointer;
}

.wd-pitch-dialog {
	position: relative;
	background: var(--wd-surface-2);
	border: 1px solid var(--wd-accent);
	border-radius: 20px;
	padding: 36px 32px 32px;
	max-width: 560px;
	width: 100%;
	box-shadow: 0 20px 60px -10px rgba(0,0,0,.6), 0 0 0 1px var(--wd-accent), 0 0 60px -10px rgba(91,124,255,.4);
	animation: wd-pitch-pop .25s cubic-bezier(.34,1.56,.64,1);
	max-height: 90vh;
	overflow-y: auto;
}
@keyframes wd-pitch-pop {
	from { opacity: 0; transform: translateY(12px) scale(.95); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.wd-pitch-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.1);
	color: var(--wd-ink-soft);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s, color .15s;
}
.wd-pitch-close:hover { background: rgba(255,255,255,.12); color: var(--wd-ink); }

.wd-pitch-eyebrow {
	display: block;
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: .04em;
	color: var(--wd-accent);
	margin-bottom: 10px;
}
.wd-pitch-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -.015em;
	color: var(--wd-ink);
	margin: 0 0 8px;
}
.wd-pitch-sub {
	font-size: 14px;
	color: var(--wd-ink-mute);
	margin: 0 0 24px;
	line-height: 1.55;
}

.wd-pitch-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.wd-pitch-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.wd-pitch-field label {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wd-ink-mute);
}
.wd-pitch-field input[type="text"],
.wd-pitch-field input[type="email"],
.wd-pitch-field textarea {
	background: rgba(255,255,255,.04);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 10px;
	color: var(--wd-ink);
	font-family: 'Inter', sans-serif;
	font-size: 14.5px;
	padding: 12px 14px;
	width: 100%;
	box-sizing: border-box;
	transition: border-color .15s, background .15s;
}
.wd-pitch-field input:focus,
.wd-pitch-field textarea:focus {
	outline: none;
	border-color: var(--wd-accent);
	background: rgba(91,124,255,.05);
}
.wd-pitch-field textarea {
	resize: vertical;
	min-height: 110px;
	line-height: 1.5;
}
.wd-pitch-field.wd-pitch-kvkk label {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--wd-ink-soft);
	display: flex;
	gap: 8px;
	align-items: flex-start;
	cursor: pointer;
	line-height: 1.5;
}
.wd-pitch-field.wd-pitch-kvkk input { margin-top: 3px; accent-color: var(--wd-accent); }

/* Honeypot — invisible to bots */
.wd-pitch-honey {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.wd-pitch-actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	margin-top: 8px;
}
.wd-pitch-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 26px;
	background: var(--wd-accent);
	color: #fff;
	border: none;
	border-radius: 12px;
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: background .15s, transform .15s, box-shadow .2s;
	box-shadow: 0 6px 20px -6px rgba(42,91,255,.5);
}
.wd-pitch-submit:hover:not(:disabled) {
	background: var(--wd-accent-deep);
	transform: translateY(-1px);
	box-shadow: 0 10px 28px -8px rgba(42,91,255,.6);
}
.wd-pitch-submit:disabled { opacity: .55; cursor: not-allowed; }
.wd-pitch-submit .arr { transition: transform .15s; }
.wd-pitch-submit:hover .arr { transform: translateX(3px); }

.wd-pitch-msg {
	font-size: 13px;
	color: var(--wd-ink-mute);
	margin: 0;
	min-height: 1.4em;
	text-align: center;
}
.wd-pitch-msg.is-error { color: var(--wd-warm); }
.wd-pitch-msg.is-success { color: #62A93A; }

/* Thank-you state */
.wd-pitch-thanks {
	text-align: center;
	padding: 16px 0;
}
.wd-pitch-thanks[hidden] { display: none; }
.wd-pitch-thanks-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 16px;
	border-radius: 50%;
	background: rgba(98,169,58,.15);
	border: 2px solid #62A93A;
	color: #62A93A;
	font-size: 32px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: wd-pitch-pop .35s cubic-bezier(.34,1.56,.64,1);
}
.wd-pitch-thanks p {
	color: var(--wd-ink-soft);
	font-size: 14.5px;
	line-height: 1.6;
	margin: 0 0 24px;
}

@media (max-width: 600px) {
	.wd-pitch-dialog { padding: 28px 22px; border-radius: 16px; }
	.wd-pitch-title  { font-size: 20px; }
}

/* =========================================================================
 * STORY BLOCK (Pinned Story) — a generic version of services-pinned
 * inc/elementor-widgets/pinned-story.php + shared widgets.js JS
 * Stays in sync with the existing JS via the same [data-wd-pinned] data attribute.
 * ========================================================================= */

.wd-story-section {
	position: relative;
	padding: 96px 0 120px;
	color: var(--wd-ink, #F2F5FB);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.wd-story-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 32px;
}

.wd-story-head { max-width: 820px; margin-bottom: 56px; }
.wd-story-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11.5px;
	color: var(--wd-accent);
	letter-spacing: .1em;
	text-transform: uppercase;
	margin-bottom: 16px;
	display: inline-block;
}
.wd-story-h2 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(32px, 4.5vw, 56px);
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -.02em;
	margin: 0 0 14px;
	color: var(--wd-ink);
}
.wd-story-h2 em { color: var(--wd-accent); font-style: italic; }
.wd-story-sub {
	font-size: 17px;
	color: var(--wd-ink-soft, #B6BDD0);
	line-height: 1.6;
	margin: 0;
	max-width: 680px;
}

/* Grid */
.wd-story-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
}
@media (min-width: 1024px) {
	.wd-story-grid {
		grid-template-columns: 5fr 6fr;
		gap: 80px;
	}
}

/* Left column: grid item — not sticky itself, its inner element is sticky */
.wd-story-visual {
	position: relative;
	aspect-ratio: 4/5;
	border-radius: 20px;
	overflow: hidden;
	background: var(--wd-bg-card);
	border: 1px solid var(--wd-line-w, rgba(255,255,255,.06));
}
.wd-story-visual-inner {
	position: relative;
	width: 100%;
	height: 100%;
}
@media (min-width: 1024px) {
	.wd-story-visual {
		aspect-ratio: auto;
		border: none;
		background: transparent;
		border-radius: 0;
		overflow: visible;
	}
	.wd-story-visual-inner {
		position: sticky;
		top: 100px;
		height: calc(100vh - 140px);
		min-height: 560px;
		max-height: 820px;
		width: auto;
		border-radius: 20px;
		overflow: hidden;
		background: var(--wd-bg-card);
		border: 1px solid var(--wd-line-w, rgba(255,255,255,.06));
	}
}

.wd-story-visual-slide {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	opacity: 0;
	transition: opacity .6s cubic-bezier(.2,.7,.2,1);
	display: flex;
	align-items: center;
	justify-content: center;
}
.wd-story-visual-slide.is-active {
	opacity: 1;
	z-index: 2;
}
.wd-story-visual-slide img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}
.wd-story-visual-slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10,15,26,.05) 0%, rgba(10,15,26,.45) 100%);
	pointer-events: none;
}
.wd-story-visual-fallback {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: clamp(40px, 6vw, 88px);
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--wd-accent);
	opacity: .35;
	text-align: center;
	line-height: 1;
	user-select: none;
	pointer-events: none;
	padding: 32px;
}

/* Right column: chapter list */
.wd-story-list {
	display: flex;
	flex-direction: column;
	gap: 80px;
}
.wd-story-item {
	opacity: .4;
	transition: opacity .35s ease;
	padding: 12px 0;
}
.wd-story-item.is-active {
	opacity: 1;
}
.wd-story-item-eyebrow {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 12px;
	color: var(--wd-accent);
	letter-spacing: .08em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 14px;
}
.wd-story-item-title {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-size: clamp(24px, 2.8vw, 34px);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -.015em;
	color: var(--wd-ink);
	margin: 0 0 16px;
}
.wd-story-item-body {
	font-size: 16px;
	color: var(--wd-ink-soft);
	line-height: 1.7;
}
.wd-story-item-body p { margin: 0 0 14px; }
.wd-story-item-body p:last-child { margin-bottom: 0; }
.wd-story-item-body strong { color: var(--wd-ink); }
.wd-story-item-body a { color: var(--wd-accent); }
.wd-story-item-body ul,
.wd-story-item-body ol { padding-left: 22px; margin: 0 0 14px; }
.wd-story-item-body li { margin-bottom: 6px; }

@media (max-width: 600px) {
	.wd-story-section { padding: 64px 0 80px; }
	.wd-story-inner   { padding: 0 20px; }
	.wd-story-head    { margin-bottom: 36px; }
	.wd-story-list    { gap: 48px; }
	.wd-story-item-title { font-size: 22px; }
	.wd-story-item-body  { font-size: 15px; }
}

/* =========================================================================
 * WC REGISTRATION FORM — Privacy Policy + Membership Terms consent checkboxes
 * inc/integrations.php → woocommerce_register_form hook
 * ========================================================================= */
.wd-register-consent {
	margin: 14px 0 !important;
}
.wd-consent-label {
	display: flex !important;
	align-items: flex-start !important;
	gap: 10px !important;
	cursor: pointer;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: var(--wd-ink-soft, #B6BDD0);
	font-weight: 400 !important;
	margin: 0 !important;
}
.wd-consent-label input[type="checkbox"] {
	margin: 3px 0 0 !important;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	accent-color: var(--wd-accent);
	cursor: pointer;
}
.wd-consent-label span { flex: 1; min-width: 0; }
.wd-consent-label a {
	color: var(--wd-accent);
	text-decoration: underline;
	font-weight: 500;
}
.wd-consent-label a:hover {
	color: var(--wd-accent-deep);
}
.wd-consent-label abbr.required {
	color: var(--wd-warm, #EC7A1A);
	text-decoration: none;
	margin-left: 2px;
	font-weight: 700;
	cursor: help;
}

/* ============================================================
 * SHOP — CATEGORY-GROUPED RENDER
 * On the shop page, products appear grouped under each category
 * in its own section. In the copper accent language, matching the existing grid.
 * ============================================================ */
.wd-shop-cat-block {
	margin: 0 0 80px;
	position: relative;
}
.wd-shop-cat-block:last-child {
	margin-bottom: 40px;
}
.wd-shop-cat-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin: 0 0 32px;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(236,122,26,.15);
	position: relative;
	flex-wrap: wrap;
}
.wd-shop-cat-head::after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 80px;
	height: 2px;
	background: linear-gradient(90deg, #EC7A1A, #FFB347);
	border-radius: 2px;
}
.wd-shop-cat-head-text {
	flex: 1;
	min-width: 240px;
}
.wd-shop-cat-title {
	font-family: var(--wd-font-display);
	font-size: clamp(28px, 3.4vw, 40px);
	font-weight: 600;
	letter-spacing: -.025em;
	line-height: 1.05;
	margin: 0 0 10px;
	color: var(--wd-ink);
}
.wd-shop-cat-title a {
	color: inherit;
	text-decoration: none;
	background: linear-gradient(135deg, #EC7A1A 0%, #FF9530 30%, #FFB347 60%, #FFCB6B 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: filter .2s ease;
}
.wd-shop-cat-title a:hover {
	filter: drop-shadow(0 2px 16px rgba(236,122,26,.4));
}
.wd-shop-cat-desc {
	font-size: 15px;
	line-height: 1.55;
	color: var(--wd-ink-soft);
	margin: 0;
	max-width: 640px;
}
.wd-shop-cat-more {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	background: rgba(236,122,26,.08);
	border: 1px solid rgba(236,122,26,.3);
	border-radius: 999px;
	color: var(--wd-warm);
	font-family: var(--wd-font-mono);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background .2s ease, border-color .2s ease, transform .12s ease;
	flex-shrink: 0;
}
.wd-shop-cat-more:hover {
	background: rgba(236,122,26,.16);
	border-color: rgba(236,122,26,.5);
	transform: translateY(-1px);
}
.wd-shop-cat-more .arr {
	font-size: 14px;
	transition: transform .2s ease;
}
.wd-shop-cat-more:hover .arr {
	transform: translateX(3px);
}
/* Grid: the theme's existing .wd-shop ul.products rules apply automatically */
.wd-shop-cat-grid {
	margin: 0;
}
@media (max-width: 700px) {
	.wd-shop-cat-block { margin-bottom: 56px; }
	.wd-shop-cat-head { gap: 16px; }
	.wd-shop-cat-more { padding: 10px 18px; font-size: 11px; }
}

/* ============================================================
 * MEGA MENU — top-level primary nav items that have a submenu
 * Rendered by WD_Mega_Menu_Walker.
 * <li.wd-menu-item.has-mega> <a.wd-menu-link/> <div.wd-mega-panel>...
 * ============================================================ */

/* The walker uses an SVG caret, so disable the old ::after chevron (avoid a double arrow) */
.wd-header-nav .wd-menu-item.has-mega > a::after { display: none !important; }

.wd-header-nav .wd-menu-item.has-mega {
	position: relative;
}
.wd-header-nav .wd-menu-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.wd-header-nav .wd-menu-caret {
	display: inline-flex;
	align-items: center;
	opacity: 0.6;
	transition: transform .2s ease, opacity .2s ease;
}
.wd-header-nav .wd-menu-caret svg {
	stroke: currentColor;
	stroke-width: 1.8;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.wd-header-nav .wd-menu-item.has-mega:hover .wd-menu-caret,
.wd-header-nav .wd-menu-item.has-mega:focus-within .wd-menu-caret {
	opacity: 1;
	transform: translateY(2px);
}

.wd-mega-panel {
	position: absolute;
	top: calc(100% + 14px);
	left: 50%;
	transform: translateX(-50%) translateY(-8px);
	min-width: 680px;
	max-width: 90vw;
	padding: 14px;
	background: rgba(10, 15, 26, 0.96);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid var(--wd-line-w-strong, rgba(236,122,26,0.25));
	border-radius: 16px;
	box-shadow: 0 30px 70px rgba(0,0,0,0.5), 0 6px 16px rgba(0,0,0,0.25);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .22s ease, transform .25s cubic-bezier(.2,.7,.2,1), visibility .25s;
	z-index: 60;
}
/* Hover bridge — keeps hover from being lost in the gap between the link and the panel */
.wd-mega-panel::before {
	content: "";
	position: absolute;
	top: -18px;
	left: 0;
	right: 0;
	height: 18px;
	background: transparent;
}
.wd-header-nav .wd-menu-item.has-mega:hover > .wd-mega-panel,
.wd-header-nav .wd-menu-item.has-mega:focus-within > .wd-mega-panel {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}
.wd-header-nav .wd-menu-item.has-mega:hover > .wd-menu-link,
.wd-header-nav .wd-menu-item.has-mega:focus-within > .wd-menu-link {
	color: var(--wd-warm, #EC7A1A);
}

/* Grid: 3 columns on desktop, 2 on tablet */
.wd-mega-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
}

/* Single card */
.wd-mega-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-radius: 10px;
	text-decoration: none !important;
	color: var(--wd-paper, #FAFAF7) !important;
	transition: background .15s ease, transform .15s ease;
	position: relative;
	min-height: 76px;
}
.wd-mega-item:hover,
.wd-mega-item:focus-visible {
	background: rgba(236, 122, 26, 0.1);
	transform: translateY(-1px);
	outline: none;
}
.wd-mega-item:hover .wd-mega-item-arr {
	opacity: 1;
	transform: translateX(2px);
}

.wd-mega-img-wrap {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 10px;
	overflow: hidden;
	background: rgba(255,255,255,0.04);
	display: grid;
	place-items: center;
	border: 1px solid rgba(255,255,255,0.06);
}
.wd-mega-img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wd-mega-img-fallback {
	font-family: 'Inter Tight', Georgia, serif;
	font-size: 22px;
	font-weight: 700;
	color: var(--wd-warm, #EC7A1A);
	background: linear-gradient(135deg, rgba(236,122,26,0.18), rgba(31,45,92,0.18));
	width: 100%;
	height: 100%;
	display: grid;
	place-items: center;
}

.wd-mega-item-body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
	position: relative;
	padding-right: 18px;
}
.wd-mega-item-title {
	display: block;
	font-family: 'Inter Tight', Georgia, serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--wd-paper, #FAFAF7);
	letter-spacing: -0.005em;
}
.wd-mega-item-desc {
	display: block;
	font-family: var(--serif, Georgia, serif);
	font-size: 12px;
	line-height: 1.45;
	color: rgba(255,255,255,0.55);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.wd-mega-item-arr {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--sans, sans-serif);
	font-size: 16px;
	color: var(--wd-warm, #EC7A1A);
	opacity: 0;
	transition: opacity .15s ease, transform .15s ease;
}

/* --- Mobile (≤1100px) — placed inline inside the existing drawer --- */
@media (max-width: 1100px) {
	.wd-mega-panel {
		position: static;
		min-width: 0;
		max-width: 100%;
		padding: 8px 0 6px;
		background: transparent;
		backdrop-filter: none;
		border: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		border-radius: 0;
	}
	.wd-mega-panel::before { display: none; }
	.wd-mega-grid {
		grid-template-columns: 1fr;
		gap: 2px;
	}
	.wd-mega-item {
		padding: 10px 14px;
		min-height: 0;
		border-radius: 8px;
	}
	.wd-mega-img-wrap {
		width: 44px;
		height: 44px;
		border-radius: 8px;
	}
	.wd-mega-img-fallback { font-size: 18px; }
	.wd-mega-item-title { font-size: 14.5px; }
	.wd-mega-item-desc { display: none; }
	.wd-mega-item-arr { display: none; }
	.wd-header-nav .wd-menu-caret { display: none; }
}

@media (max-width: 760px) {
	.wd-mega-grid { grid-template-columns: 1fr; }
}


/* =========================================================================
   SINGLE CATALOG — proposition, purchase options, price bands, proof strips
   1.2.0. Replaces the 1.1.0 .wd-svc-* service styles: the /services/ tree was
   folded into /solutions/, so these components now serve BOTH the licensed
   products and the quoted engagements in one catalog.

   Design intent: the buyer scans for two things, price and evidence. Price is
   therefore the loudest element in a card after the title, and the proof strip
   uses product NAMES rather than logos so it reads as a shipped-work list
   instead of a badge wall.
   ====================================================================== */

/* --- Proposition: the one sentence that has to land on its own --- */
.wd-sol-onerme {
	max-width: 900px;
	margin: 0 auto;
	padding: 72px 32px 8px;
	text-align: center;
}
.wd-sol-onerme__text {
	margin: 0;
	font-family: 'Inter Tight', Georgia, serif;
	font-size: clamp(22px, 3vw, 36px);
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.015em;
	color: var(--wd-paper, #FAFAF7);
}
.wd-sol-onerme__text::before,
.wd-sol-onerme__text::after {
	content: '';
	display: block;
	width: 48px;
	height: 3px;
	border-radius: 2px;
	background: #EC7A1A;
	margin: 0 auto 26px;
}
.wd-sol-onerme__text::after { margin: 26px auto 0; }

/* --- Purchase option cards (multi-tier solutions) --- */
.wd-sol-optgrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 14px;
	margin: 8px 0 18px;
}
.wd-sol-optcard {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 18px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.03);
}
.wd-sol-optcard.has-badge { border-color: rgba(236, 122, 26, 0.55); }
.wd-sol-optcard__badge {
	position: absolute;
	top: -10px;
	left: 18px;
	padding: 3px 10px;
	border-radius: 999px;
	background: #EC7A1A;
	color: #12100E;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.wd-sol-optcard__label {
	margin: 0;
	font-family: 'Inter Tight', Georgia, serif;
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.01em;
}
.wd-sol-optcard__price {
	font-family: 'Inter Tight', Georgia, serif;
	font-size: 23px;
	font-weight: 700;
	color: #EC7A1A;
	line-height: 1.2;
}
.wd-sol-optcard .wd-sol-btn { margin-top: auto; }

/* --- Free-text price band (quoted engagements, no cart) --- */
.wd-sol-hero-price--band {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
}
.wd-sol-band__amount {
	font-family: 'Inter Tight', Georgia, serif;
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 700;
	color: #EC7A1A;
	letter-spacing: -0.01em;
}
.wd-sol-band__note {
	font-size: 14px;
	color: var(--wd-mute-light, rgba(255, 255, 255, 0.55));
}

/* --- Proof strips (solution -> solution, both directions) --- */
.wd-proof {
	max-width: 820px;
	margin: 64px auto;
	padding: 26px 28px;
	border: 1px solid rgba(255, 255, 255, 0.10);
	border-left: 3px solid #EC7A1A;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.03);
}
.wd-proof--reverse { border-left-color: #5B7CFF; }
.wd-proof__label {
	margin: 0 0 14px;
	font-size: 13px;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--wd-mute-light, rgba(255, 255, 255, 0.58));
}
.wd-proof__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.wd-proof__item a {
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
	padding: 9px 14px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 999px;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--wd-paper, #FAFAF7);
	text-decoration: none;
	transition: border-color .18s ease, background-color .18s ease;
}
.wd-proof__item a:hover,
.wd-proof__item a:focus-visible {
	border-color: #EC7A1A;
	background: rgba(236, 122, 26, 0.10);
}
.wd-proof--reverse .wd-proof__item a:hover,
.wd-proof--reverse .wd-proof__item a:focus-visible {
	border-color: #5B7CFF;
	background: rgba(91, 124, 255, 0.10);
}
.wd-proof__price { font-weight: 700; font-size: 13px; color: #EC7A1A; }
.wd-proof--reverse .wd-proof__price { color: #5B7CFF; }

@media (max-width: 760px) {
	.wd-proof { margin: 44px 20px; padding: 20px; }
	.wd-sol-onerme { padding: 52px 22px 4px; }
	.wd-sol-optgrid { grid-template-columns: 1fr; }
}
