:root {
	--bg: #faf7f8;
	--ink: #140f18;
	--muted: #6b5f6a;
	--accent: #93003c;
	--accent2: #f97316;
	--card: #ffffff;
	--line: #eadfe6;
	--radius: 18px;
	--font: "Cairo", "Segoe UI", Tahoma, sans-serif;
}
* { box-sizing: border-box; }
body.layouts-page {
	margin: 0;
	font-family: var(--font);
	background:
		radial-gradient(900px 420px at 10% -10%, rgba(147,0,60,.10), transparent 60%),
		radial-gradient(700px 380px at 100% 0%, rgba(249,115,22,.10), transparent 55%),
		var(--bg);
	color: var(--ink);
	min-height: 100vh;
}
a { color: var(--accent); text-decoration: none; }
.lp-hero {
	padding: 48px 20px 28px;
}
.lp-hero__inner {
	max-width: min(1560px, 100%);
	margin: 0 auto;
}
.lp-eyebrow {
	display: inline-block;
	margin: 0 0 10px;
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(147,0,60,.08);
	color: var(--accent);
	font-weight: 800;
	font-size: 13px;
}
.lp-hero h1 {
	margin: 0 0 10px;
	font-size: clamp(1.8rem, 4vw, 2.6rem);
	font-weight: 800;
	letter-spacing: -.02em;
}
.lp-lead {
	margin: 0 0 22px;
	max-width: 46rem;
	color: var(--muted);
	font-size: 1.05rem;
	line-height: 1.75;
}
.lp-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.lp-stats > div {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 14px 18px;
	min-width: 140px;
	box-shadow: 0 8px 24px rgba(20,15,24,.04);
}
.lp-stats strong {
	display: block;
	font-size: 1.6rem;
	font-weight: 800;
	color: var(--accent);
	line-height: 1.1;
}
.lp-stats span {
	color: var(--muted);
	font-size: 13px;
	font-weight: 700;
}
.lp-cats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 22px;
}
.lp-cat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid var(--line);
	background: var(--card);
	color: #4b4453;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	transition: border-color .15s, background .15s, color .15s;
}
.lp-cat span {
	min-width: 20px;
	padding: 1px 7px;
	border-radius: 999px;
	background: #f3f0f2;
	font-size: 12px;
}
.lp-cat.is-active,
.lp-cat:hover {
	border-color: var(--accent);
	background: #fff4f8;
	color: var(--accent);
}
.lp-cat.is-active span { background: var(--accent); color: #fff; }
.lp-section { margin-bottom: 28px; }
.lp-section__title {
	margin: 0 0 14px;
	font-size: 1.25rem;
	font-weight: 800;
}
.lp-main {
	max-width: min(1560px, 100%);
	margin: 0 auto;
	padding: 8px 20px 48px;
}
.lp-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}
.lp-card {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(20,15,24,.05);
	display: flex;
	flex-direction: column;
}
.lp-card__preview {
	min-height: 168px;
	background: #fff;
	border-bottom: 1px solid var(--line);
	display: flex;
	align-items: stretch;
}
.lp-card__preview > .wsb-mock {
	flex: 1;
	min-height: 168px;
}
.lp-card__body {
	padding: 16px 16px 18px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}
.lp-card__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}
.lp-card__top h2 {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 800;
}
.lp-pulls {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
	padding: 4px 9px;
	border-radius: 999px;
	background: #fff4f8;
	color: var(--accent);
	font-size: 12px;
	font-weight: 700;
}
.lp-pulls strong { font-size: 14px; }
.lp-card__body p {
	margin: 0;
	color: var(--muted);
	font-size: 13.5px;
	line-height: 1.65;
}
.lp-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: auto;
	padding-top: 6px;
}
.lp-pill {
	display: inline-block;
	padding: 3px 9px;
	border-radius: 999px;
	background: #f3f0f2;
	color: #4b4453;
	font-size: 11px;
	font-weight: 700;
}
.lp-pill--id {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	background: #f8fafc;
	color: #64748b;
}
.lp-how {
	margin-top: 36px;
	padding: 22px 24px;
	border-radius: var(--radius);
	background: #fff;
	border: 1px solid var(--line);
}
.lp-how h2 { margin: 0 0 10px; font-size: 1.15rem; }
.lp-how ol { margin: 0; padding-inline-start: 1.2rem; line-height: 1.9; color: var(--muted); }
.lp-note { margin: 14px 0 0; color: var(--muted); font-size: 13px; }
.lp-note code {
	display: inline-block;
	padding: 2px 6px;
	border-radius: 6px;
	background: #f8fafc;
	font-size: 12px;
	direction: ltr;
}
.lp-foot {
	display: flex;
	justify-content: center;
	gap: 10px;
	padding: 20px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
}

/* Shared mini-mocks */
.wsb-mock {
	font-family: var(--font);
	padding: 14px 12px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}
.wsb-mock strong, .wsb-mock em, .wsb-mock p, .wsb-mock span { margin: 0; }
.wsb-mock em { font-style: normal; }
.wsb-mock__headline {
	font-size: 16px;
	font-weight: 800;
	color: #140f18;
	line-height: 1.35;
}
.wsb-mock__headline span {
	color: #93003c;
	border-bottom: 2px solid #f97316;
}
.wsb-mock__btn,
.wsb-mock__cta-btn {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 9px;
	background: #93003c;
	color: #fff !important;
	font-size: 11px;
	font-weight: 800;
}
.wsb-mock__ico {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-grid;
	place-items: center;
	font-size: 13px;
	flex-shrink: 0;
}
.wsb-mock__ico--a { background: linear-gradient(135deg, #93003c, #f97316); color: #fff; }
.wsb-mock__ico--b { background: linear-gradient(135deg, #0f766e, #14b8a6); color: #fff; }
.wsb-mock__ico--c { background: linear-gradient(135deg, #b45309, #fbbf24); color: #fff; }

.wsb-mock--hero { background: linear-gradient(165deg, #fff8fb, #fce7f0 70%, #fff); }
.wsb-mock--hero p { font-size: 11px; color: #6b5f6a; max-width: 220px; line-height: 1.45; }

.wsb-mock--hero-dark { background: linear-gradient(160deg, #1a0f14, #2d1520 55%, #140f18); color: #fff; }
.wsb-mock--hero-dark .wsb-mock__headline { color: #fff; }
.wsb-mock--hero-dark .wsb-mock__headline span { color: #fbbf24; border-color: #f97316; }
.wsb-mock--hero-dark p { color: #c4b5bc; font-size: 11px; }
.wsb-mock--hero-dark .wsb-mock__btn { background: #f97316; }

.wsb-mock--trio,
.wsb-mock--split,
.wsb-mock--steps,
.wsb-mock--flip,
.wsb-mock--count,
.wsb-mock--stats,
.wsb-mock--price,
.wsb-mock--contact {
	flex-direction: row;
	align-items: stretch;
	gap: 8px;
	background: #fff;
}
.wsb-mock__col,
.wsb-mock__pane,
.wsb-mock__tile,
.wsb-mock__step,
.wsb-mock__flipcard,
.wsb-mock__tick,
.wsb-mock__stat,
.wsb-mock__plan {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-width: 0;
	flex: 1;
	border-radius: 12px;
	padding: 10px 6px;
	box-sizing: border-box;
}
.wsb-mock__col {
	background: #fafafa;
	border: 1px solid #eee;
}
.wsb-mock__col strong,
.wsb-mock__tile strong,
.wsb-mock__step strong,
.wsb-mock__flipcard strong,
.wsb-mock__plan strong {
	font-size: 11px;
	font-weight: 800;
	color: #140f18;
	line-height: 1.3;
}
.wsb-mock__col em,
.wsb-mock__pane em,
.wsb-mock__flipcard em,
.wsb-mock__tick em,
.wsb-mock__stat em,
.wsb-mock__plan em {
	font-size: 9px;
	font-weight: 700;
	color: #93003c;
}

.wsb-mock__pane--a { background: linear-gradient(160deg, #fff8fb, #fce7f0); }
.wsb-mock__pane--b { background: #f8fafc; border: 1px dashed #e5e7eb; }
.wsb-mock__pane--map {
	background: linear-gradient(160deg, #e0f2fe, #bae6fd);
	gap: 6px;
}
.wsb-mock__pin { font-size: 26px; line-height: 1; }

.wsb-mock--quad {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 7px;
	background: #f8fafc;
}
.wsb-mock__tile { min-height: 58px; border: 1px solid transparent; }
.wsb-mock__tile--a { background: #fff4f8; border-color: #f3d5e2; }
.wsb-mock__tile--b { background: #ecfdf5; border-color: #a7f3d0; }
.wsb-mock__tile--c { background: #fff7ed; border-color: #fed7aa; }
.wsb-mock__tile--d { background: #eef2ff; border-color: #c7d2fe; }

.wsb-mock--steps { background: #fffafc; padding: 16px 10px; }
.wsb-mock__step span {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-grid;
	place-items: center;
	font-size: 12px;
	font-weight: 800;
	background: #93003c;
	color: #fff;
}
.wsb-mock__step-line {
	flex: 0 0 12px;
	align-self: center;
	height: 3px;
	border-radius: 99px;
	background: linear-gradient(90deg, #f9a8c4, #f97316);
}

.wsb-mock--list {
	align-items: stretch;
	gap: 7px;
	background: #fff;
	padding: 14px 16px;
}
.wsb-mock__li {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 10px;
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	text-align: start;
}
.wsb-mock__li span {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: inline-grid;
	place-items: center;
	background: #16a34a;
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	flex-shrink: 0;
}
.wsb-mock__li strong { font-size: 11px; font-weight: 800; color: #14532d; }

.wsb-mock--flip { background: #140f18; padding: 12px 10px; }
.wsb-mock__flipcard { min-height: 72px; color: #fff; }
.wsb-mock__flipcard strong { color: #fff; font-size: 13px; }
.wsb-mock__flipcard em { color: rgba(255,255,255,.75); }
.wsb-mock__flipcard--a { background: linear-gradient(145deg, #93003c, #f97316); }
.wsb-mock__flipcard--b { background: linear-gradient(145deg, #0f766e, #14b8a6); }
.wsb-mock__flipcard--c { background: linear-gradient(145deg, #1d4ed8, #60a5fa); }

.wsb-mock--cta {
	background: linear-gradient(135deg, #93003c, #c0265a 55%, #f97316);
	color: #fff;
}
.wsb-mock--cta strong { font-size: 14px; font-weight: 800; max-width: 240px; color: #fff; }
.wsb-mock__cta-btn { background: #fff; color: #93003c !important; }

.wsb-mock--cta-pro {
	background:
		radial-gradient(circle at 80% 20%, rgba(249,115,22,.45), transparent 40%),
		linear-gradient(135deg, #140f18, #93003c 70%);
	color: #fff;
	gap: 8px;
}
.wsb-mock--cta-pro > em {
	font-size: 10px;
	font-weight: 800;
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(255,255,255,.15);
	color: #fbbf24;
}
.wsb-mock--cta-pro strong { font-size: 14px; font-weight: 800; color: #fff; max-width: 220px; }

.wsb-mock--count { background: linear-gradient(160deg, #fff7ed, #ffedd5); }
.wsb-mock__tick {
	background: #140f18;
	min-width: 52px;
	padding: 10px 6px;
}
.wsb-mock__tick strong { font-size: 16px; font-weight: 800; color: #fbbf24; }
.wsb-mock__tick em { color: #c4b5bc; }

.wsb-mock--stats { background: #fff; }
.wsb-mock__stat {
	background: #fff4f8;
	border: 1px solid #f9a8c4;
	padding: 12px 6px;
}
.wsb-mock__stat strong { font-size: 15px; font-weight: 800; color: #93003c; }

.wsb-mock--quotes,
.wsb-mock--quote { background: linear-gradient(165deg, #fffbeb, #fef3c7); }
.wsb-mock__bubble,
.wsb-mock__gold {
	padding: 8px 10px;
	max-width: 240px;
}
.wsb-mock__bubble p,
.wsb-mock__gold p {
	font-size: 13px;
	font-weight: 700;
	color: #78350f;
	line-height: 1.5;
}
.wsb-mock__bubble em,
.wsb-mock__gold em { font-size: 10px; color: #a16207; margin-top: 4px; display: block; }

.wsb-mock--faq {
	align-items: stretch;
	gap: 6px;
	background: #fff;
	padding: 12px 14px;
}
.wsb-mock__faq-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 10px;
	background: #f8fafc;
	border: 1px solid #e5e7eb;
	text-align: start;
}
.wsb-mock__faq-row strong { font-size: 11px; font-weight: 700; color: #334155; }
.wsb-mock__faq-row span { color: #93003c; font-weight: 800; }
.wsb-mock__faq-row.is-open { background: #fff4f8; border-color: #f9a8c4; }

.wsb-mock--tabs {
	align-items: stretch;
	gap: 0;
	background: #f1f5f9;
	padding: 10px;
}
.wsb-mock__tabbar {
	display: flex;
	gap: 4px;
	padding: 0 4px;
}
.wsb-mock__tabbar span {
	padding: 6px 10px;
	border-radius: 8px 8px 0 0;
	font-size: 11px;
	font-weight: 800;
	background: #cbd5e1;
	color: #475569;
}
.wsb-mock__tabbar span.is-on { background: #fff; color: #93003c; }
.wsb-mock__tabpane {
	background: #fff;
	border-radius: 0 12px 12px 12px;
	padding: 16px 12px;
	border: 1px solid #e2e8f0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.wsb-mock__tabpane strong { font-size: 12px; font-weight: 800; }
.wsb-mock__tabpane em { font-size: 10px; color: #64748b; }

.wsb-mock--price {
	align-items: flex-end;
	background: #f8fafc;
	padding: 14px 10px;
}
.wsb-mock__plan {
	background: #fff;
	border: 1px solid #e5e7eb;
	min-height: 78px;
}
.wsb-mock__plan strong { font-size: 18px; color: #140f18; }
.wsb-mock__plan.is-hot {
	min-height: 108px;
	background: linear-gradient(180deg, #fff4f8, #fce7f0);
	border-color: #93003c;
	box-shadow: 0 8px 18px rgba(147,0,60,.15);
	gap: 6px;
}
.wsb-mock__plan.is-hot em { color: #93003c; }

.wsb-mock--contact { background: #fff; padding: 10px; }

@media (max-width: 640px) {
	.wsb-mock--trio,
	.wsb-mock--split,
	.wsb-mock--contact,
	.wsb-mock--flip,
	.wsb-mock--stats,
	.wsb-mock--count,
	.wsb-mock--price,
	.wsb-mock--steps { flex-direction: column; }
	.wsb-mock__step-line { width: 3px; height: 12px; flex-basis: auto; }
	.lp-stats > div { flex: 1; }
}

/* Epic layout mocks */
.wsb-mock--epic-gala {
	flex-direction: row;
	align-items: stretch;
	gap: 10px;
	background: radial-gradient(circle at 20% 20%, #2a1520, #07060b 60%);
	padding: 12px;
}
.wsb-mock__gala-l, .wsb-mock__gala-r {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: 0;
}
.wsb-mock--epic-gala .wsb-mock__headline { color: #f8fafc; font-size: 14px; }
.wsb-mock--epic-gala .wsb-mock__headline span { color: #fbbf24; border-color: #f97316; }
.wsb-mock__stars { color: #fbbf24; font-size: 12px; letter-spacing: 2px; }
.wsb-mock--epic-gala .wsb-mock__btn { background: #fbbf24; color: #140f18 !important; }
.wsb-mock__gala-r { flex-direction: row; flex-wrap: wrap; gap: 6px; }
.wsb-mock--epic-gates {
	flex-direction: row;
	gap: 8px;
	background: #0c0a10;
	padding: 12px;
}
.wsb-mock--epic-pressure {
	flex-direction: row;
	gap: 8px;
	background: #140f18;
	padding: 12px;
}
.wsb-mock__pane--press {
	flex: 1.3;
	background: linear-gradient(145deg, #2a1020, #93003c);
	border-radius: 14px;
	padding: 14px 10px;
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
}
.wsb-mock__pane--press em { color: #fbbf24; font-size: 10px; font-weight: 800; }
.wsb-mock__pane--press strong { color: #fff; font-size: 13px; }
.wsb-mock--epic-orbit {
	flex-direction: row;
	gap: 8px;
	background: linear-gradient(165deg, #fff8fb, #faf7f8);
	padding: 12px;
}
.wsb-mock--epic-deck {
	align-items: stretch;
	gap: 8px;
	background: #0b1220;
	padding: 12px;
}
.wsb-mock--epic-deck .wsb-mock__tabbar span { background: #1e293b; color: #94a3b8; }
.wsb-mock--epic-deck .wsb-mock__tabbar span.is-on { background: #22d3ee; color: #0b1220; }
.wsb-mock__bars {
	display: flex;
	align-items: flex-end;
	gap: 6px;
	height: 48px;
	padding: 0 8px;
}
.wsb-mock__bars i {
	flex: 1;
	height: var(--v, 50%);
	border-radius: 6px 6px 2px 2px;
	background: linear-gradient(180deg, #a855f7, #22d3ee);
	font-style: normal;
}
.wsb-mock--epic-deck .wsb-mock__faq-row {
	background: #111827;
	border-color: #334155;
}
.wsb-mock--epic-deck .wsb-mock__faq-row strong { color: #e2e8f0; }

/* Pricing epic mocks */
.wsb-mock--price-neon {
	background: radial-gradient(circle at 30% 20%, #1e1b4b, #07060f 65%);
	color: #e0e7ff; gap: 10px;
}
.wsb-mock--price-neon em { font-size: 10px; font-weight: 800; color: #22d3ee; padding: 3px 10px; border-radius: 999px; border: 1px solid rgba(34,211,238,.4); }
.wsb-mock__plans3 { display: flex; gap: 6px; width: 100%; padding: 0 8px; }
.wsb-mock__plans3 span { flex: 1; height: 64px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(34,211,238,.25); }
.wsb-mock__plans3 span.is-hot { height: 84px; background: linear-gradient(180deg, rgba(168,85,247,.35), rgba(34,211,238,.2)); border-color: #22d3ee; box-shadow: 0 0 18px rgba(34,211,238,.35); }
.wsb-mock--price-neon strong { font-size: 12px; color: #f8fafc; }
.wsb-mock--price-menu {
	align-items: stretch; gap: 7px; background: #1a1210; padding: 14px 16px;
}
.wsb-mock--price-menu .wsb-mock__li {
	display: flex; justify-content: space-between; align-items: center;
	padding: 8px 10px; border-radius: 10px; background: rgba(251,191,36,.08);
	border: 1px solid rgba(251,191,36,.25); text-align: start;
}
.wsb-mock--price-menu .wsb-mock__li strong { color: #fde68a; font-size: 11px; }
.wsb-mock--price-menu .wsb-mock__li em { color: #fbbf24; font-size: 12px; font-weight: 800; }
.wsb-mock--price-menu .wsb-mock__li.is-hot { background: rgba(147,0,60,.35); border-color: #f97316; }
.wsb-mock--price-stripe {
	flex-direction: row; gap: 8px; background: #0a1628; padding: 12px;
}
.wsb-mock--price-stripe .wsb-mock__pane--a {
	flex: 1.2; background: linear-gradient(145deg, #1e293b, #312e81); border-radius: 14px;
	padding: 12px; color: #fff; display: flex; flex-direction: column; gap: 6px; align-items: center; justify-content: center;
}
.wsb-mock--price-stripe .wsb-mock__pane--a strong { color: #fff; font-size: 12px; }
.wsb-mock--price-stripe .wsb-mock__pane--a em { color: #a5b4fc; font-size: 14px; font-weight: 800; }
.wsb-mock--price-stripe .wsb-mock__btn { background: #635bff; }
.wsb-mock--price-glass {
	flex-direction: row; align-items: flex-end; gap: 7px;
	background: linear-gradient(160deg, #ede9fe, #cffafe); padding: 14px 10px;
}
.wsb-mock--price-glass .wsb-mock__plan {
	background: rgba(255,255,255,.55); border: 1px solid rgba(124,58,237,.2); min-height: 72px;
}
.wsb-mock--price-glass .wsb-mock__plan.is-hot {
	min-height: 100px; background: rgba(255,255,255,.85); border-color: #7c3aed;
	box-shadow: 0 10px 24px rgba(124,58,237,.2);
}
.wsb-mock--price-glass .wsb-mock__plan em { color: #7c3aed; }
.wsb-mock--price-atelier {
	flex-direction: row; gap: 8px; background: #fffaf8; padding: 12px;
}
.wsb-mock__list-mini { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.wsb-mock__list-mini b {
	display: block; height: 18px; border-radius: 8px; background: #ffe4e6; border: 1px solid #fecdd3;
	font-size: 0; color: transparent;
}
.wsb-mock__list-mini b.hot { background: #fff4f8; border-color: #93003c; height: 24px; }

.wsb-mock--price-auction { flex-direction: row; gap: 8px; background: #05040a; padding: 12px; }
.wsb-mock--price-duel { flex-direction: row; align-items: center; gap: 8px; background: #120a12; padding: 12px; }
.wsb-mock--price-duel .duel-a { background: linear-gradient(145deg,#7f1d1d,#ef4444); color:#fff; border:0; min-height:90px; }
.wsb-mock--price-duel .duel-b { background: linear-gradient(145deg,#1e3a8a,#3b82f6); color:#fff; border:0; min-height:90px; }
.wsb-mock--price-duel .duel-a strong, .wsb-mock--price-duel .duel-b strong,
.wsb-mock--price-duel .duel-a em, .wsb-mock--price-duel .duel-b em { color:#fff; }
.wsb-mock__vs { font-weight:900; color:#fbbf24; font-size:14px; }
.wsb-mock--price-radar { flex-direction: row; gap: 8px; background: #0b1020; padding: 12px; align-items: stretch; }
.wsb-mock--price-radar .wsb-mock__bars { flex: 1.2; }
.wsb-mock--price-speak { align-items: stretch; gap: 7px; background: #0c0a09; padding: 12px 14px; }
.wsb-mock--price-speak .wsb-mock__li { background: rgba(168,162,158,.12); border-color: rgba(168,162,158,.3); }
.wsb-mock--price-speak .wsb-mock__li strong { color:#e7e5e4; }
.wsb-mock--price-speak .wsb-mock__li em { color:#a8a29e; }
.wsb-mock--price-speak .wsb-mock__bubble p { color:#d6d3d1; }
.wsb-mock--price-journey { flex-direction: row; background: #faf5ff; padding: 16px; }
.wsb-mock--price-journey .wsb-mock__step span { background:#7c3aed; }
.wsb-mock--price-journey .wsb-mock__step-line { background: linear-gradient(90deg,#7c3aed,#f97316); }

.wsb-mock--flip-cyber { flex-direction: row; gap: 8px; background: #06070f; padding: 12px; }
.wsb-mock--flip-duo { flex-direction: row; gap: 10px; background: #140f18; padding: 12px; }
.wsb-mock--flip-duo .wsb-mock__flipcard { min-height: 88px; }
.wsb-mock--flip-quad {
	display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px;
	background: #faf7f8; padding: 12px;
}
.wsb-mock--flip-quad span {
	display: grid; place-items: center; height: 48px; border-radius: 12px;
	background: #fff; border: 1px solid #f3d5e2; font-size: 20px;
}
.wsb-mock--flip-quad span:nth-child(2) { border-color: #99f6e4; }
.wsb-mock--flip-quad span:nth-child(3) { border-color: #fecdd3; }
.wsb-mock--flip-quad span:nth-child(4) { border-color: #a7f3d0; }
.wsb-mock--flip-vault { flex-direction: row; gap: 10px; background: #1a0f14; padding: 12px; align-items: center; }
.wsb-mock--flip-vault .wsb-mock__flipcard { flex: 1.4; min-height: 90px; background: linear-gradient(145deg,#78350f,#fbbf24); }
.wsb-mock--flip-faq { flex-direction: row; gap: 8px; background: #0f172a; padding: 12px; }
.wsb-mock--flip-faq .wsb-mock__flipcard {
	flex: 1; min-height: 72px; border-radius: 12px;
	background: linear-gradient(145deg,#1e293b,#334155); color: #fff;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
}
.wsb-mock--flip-faq .wsb-mock__flipcard strong { color: #38bdf8; font-size: 22px; }
.wsb-mock--flip-faq .wsb-mock__flipcard em { color: #cbd5e1; font-size: 11px; }

.wsb-mock--price-storm {
	gap: 10px; background: #000; padding: 14px; align-items: stretch;
	box-shadow: inset 0 0 40px rgba(239,68,68,.25);
}
.wsb-mock--price-storm .wsb-mock__storm-head {
	display: flex; justify-content: space-between; align-items: center;
	padding: 8px 10px; border: 1px solid rgba(239,68,68,.55);
	background: linear-gradient(90deg, rgba(239,68,68,.2), transparent 55%);
}
.wsb-mock--price-storm .wsb-mock__storm-head strong {
	color: #fecaca; font-size: 13px; letter-spacing: .02em;
	text-shadow: 1px 0 #ef4444, -1px 0 #fbbf24;
}
.wsb-mock--price-storm .wsb-mock__storm-head em {
	color: #fbbf24; font-size: 12px; font-weight: 800; font-style: normal;
}
.wsb-mock--price-storm .wsb-mock__plans3 span {
	background: #111; border: 1px solid #333; border-radius: 0; min-height: 54px;
}
.wsb-mock--price-storm .wsb-mock__plans3 span.is-hot {
	background: linear-gradient(160deg,#7f1d1d,#ef4444); border-color: #fbbf24;
	transform: scale(1.06); box-shadow: 0 0 18px rgba(239,68,68,.55);
}

.wsb-mock--price-throne {
	gap: 8px; background: radial-gradient(circle at 50% 0%, #3f2a10, #0c0a09 62%);
	padding: 12px 14px; align-items: center;
}
.wsb-mock--price-throne .wsb-mock__crown {
	font-size: 22px; line-height: 1; color: #fbbf24;
	filter: drop-shadow(0 0 8px rgba(251,191,36,.6));
}
.wsb-mock--price-throne .wsb-mock__stars { color: #fde68a; font-size: 11px; letter-spacing: 2px; }
.wsb-mock--price-throne .wsb-mock__plans3 { width: 100%; }
.wsb-mock--price-throne .wsb-mock__plans3 span {
	min-height: 48px; border-radius: 10px 10px 4px 4px;
	background: linear-gradient(180deg,#292524,#1c1917);
	border: 1px solid #a16207; position: relative;
}
.wsb-mock--price-throne .wsb-mock__plans3 span.is-hot {
	background: linear-gradient(180deg,#b45309,#fbbf24); border-color: #fde68a;
	box-shadow: 0 8px 20px rgba(251,191,36,.35);
}
.wsb-mock--price-throne .wsb-mock__stripe {
	display: block; width: 72%; height: 6px; border-radius: 999px;
	background: linear-gradient(90deg,#635bff,#a78bfa,#635bff);
	margin-top: 2px;
}

.wsb-mock--price-nebula {
	flex-direction: row; gap: 8px; padding: 12px;
	background:
		radial-gradient(circle at 20% 20%, rgba(56,189,248,.35), transparent 40%),
		radial-gradient(circle at 80% 30%, rgba(168,85,247,.4), transparent 42%),
		radial-gradient(circle at 50% 90%, rgba(34,197,94,.28), transparent 40%),
		#070b18;
}
.wsb-mock--price-nebula .wsb-mock__plan {
	flex: 1; min-height: 92px; border: 0; color: #fff;
	display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
	backdrop-filter: blur(6px);
}
.wsb-mock--price-nebula .wsb-mock__plan em,
.wsb-mock--price-nebula .wsb-mock__plan strong { color: #fff; }
.wsb-mock--price-nebula .neb-a { background: linear-gradient(160deg,rgba(14,165,233,.55),rgba(15,23,42,.85)); border: 1px solid rgba(56,189,248,.5); }
.wsb-mock--price-nebula .neb-b { background: linear-gradient(160deg,rgba(168,85,247,.55),rgba(15,23,42,.85)); border: 1px solid rgba(216,180,254,.55); transform: translateY(-6px); }
.wsb-mock--price-nebula .neb-c { background: linear-gradient(160deg,rgba(34,197,94,.45),rgba(15,23,42,.85)); border: 1px solid rgba(74,222,128,.5); }

.wsb-mock--price-paywall {
	gap: 8px; padding: 0 12px 12px; align-items: stretch;
	background: #14080c;
}
.wsb-mock--price-paywall .wsb-mock__curtain {
	height: 18px; margin: 0 -12px 4px;
	background: repeating-linear-gradient(90deg,#7f1d1d 0 14px,#991b1b 14px 28px);
	box-shadow: 0 8px 16px rgba(127,29,29,.45);
}
.wsb-mock--price-paywall .wsb-mock__li {
	background: rgba(255,255,255,.06); border-color: rgba(251,113,133,.35);
}
.wsb-mock--price-paywall .wsb-mock__li strong { color: #fecdd3; }
.wsb-mock--price-paywall .wsb-mock__li em { color: #4ade80; }
.wsb-mock--price-paywall .wsb-mock__plan.is-hot {
	background: linear-gradient(145deg,#4c0519,#be123c); border: 0; color: #fff;
}
.wsb-mock--price-paywall .wsb-mock__plan.is-hot em,
.wsb-mock--price-paywall .wsb-mock__plan.is-hot strong { color: #fff; }
.wsb-mock--price-paywall .wsb-mock__btn {
	align-self: center; background: linear-gradient(90deg,#fbbf24,#f97316); color: #111;
}

.wsb-mock--price-metro {
	gap: 8px; padding: 12px 14px; align-items: stretch;
	background: linear-gradient(180deg,#f8fafc,#e2e8f0);
}
.wsb-mock--price-metro .wsb-mock__metro-line {
	display: flex; align-items: center; justify-content: space-between;
	position: relative; height: 18px; margin-bottom: 2px;
}
.wsb-mock--price-metro .wsb-mock__metro-line::before {
	content: ""; position: absolute; left: 6px; right: 6px; top: 50%;
	height: 3px; background: linear-gradient(90deg,#0ea5e9,#f97316,#22c55e);
	transform: translateY(-50%); border-radius: 999px;
}
.wsb-mock--price-metro .wsb-mock__metro-line i {
	position: relative; z-index: 1; width: 12px; height: 12px; border-radius: 50%;
	background: #fff; border: 2px solid #0ea5e9; display: block;
}
.wsb-mock--price-metro .wsb-mock__metro-line i:nth-child(2) { border-color: #f97316; }
.wsb-mock--price-metro .wsb-mock__metro-line i:nth-child(3) { border-color: #22c55e; }
.wsb-mock--price-metro .wsb-mock__metro-line i.on {
	background: #f97316; box-shadow: 0 0 0 4px rgba(249,115,22,.25);
}
.wsb-mock--price-metro .wsb-mock__li {
	background: #fff; border-color: #cbd5e1;
}
.wsb-mock--price-metro .wsb-mock__li strong { color: #0f172a; }
.wsb-mock--price-metro .wsb-mock__li em { color: #ea580c; font-weight: 800; }
.wsb-mock--price-metro .wsb-mock__stat {
	background: #0f172a; color: #fff; border-radius: 10px; padding: 8px;
	display: flex; flex-direction: column; align-items: center;
}
.wsb-mock--price-metro .wsb-mock__stat strong { color: #38bdf8; font-size: 18px; }
.wsb-mock--price-metro .wsb-mock__stat em { color: #94a3b8; font-size: 10px; }
.wsb-mock--price-metro .wsb-mock__btn {
	align-self: center; background: #0ea5e9;
}

.wsb-mock--flip-tarot {
	flex-direction: row; gap: 8px; padding: 12px;
	background:
		radial-gradient(circle at 50% 0%, rgba(192,132,252,.35), transparent 45%),
		#0a0612;
}
.wsb-mock--flip-tarot .wsb-mock__flipcard {
	flex: 1; min-height: 96px; border-radius: 6px;
	background: linear-gradient(165deg,#1e1033,#2e1065);
	border: 1px solid rgba(192,132,252,.45);
	box-shadow: inset 0 0 0 1px rgba(251,191,36,.15);
}
.wsb-mock--flip-tarot .wsb-mock__flipcard.is-hot {
	background: linear-gradient(165deg,#78350f,#fbbf24);
	border-color: #fde68a;
	transform: translateY(-6px) rotate(-2deg);
	box-shadow: 0 10px 22px rgba(251,191,36,.35);
}
.wsb-mock--flip-tarot .wsb-mock__flipcard strong { font-size: 22px; }
.wsb-mock--flip-tarot .wsb-mock__flipcard em { color: #e9d5ff; font-size: 11px; }
.wsb-mock--flip-tarot .wsb-mock__flipcard.is-hot em { color: #1c1917; }

.wsb-mock--flip-rift {
	flex-direction: row; align-items: center; gap: 8px; padding: 12px;
	background: linear-gradient(90deg,#1a0505 0 46%, #030712 54% 100%);
}
.wsb-mock--flip-rift .wsb-mock__flipcard {
	flex: 1; min-height: 100px; border-radius: 4px;
	clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
}
.wsb-mock--flip-rift .duel-a {
	background: linear-gradient(145deg,#7f1d1d,#ef4444);
}
.wsb-mock--flip-rift .duel-b {
	background: linear-gradient(145deg,#0e7490,#22d3ee);
	clip-path: polygon(0 0, 92% 0, 100% 100%, 8% 100%);
}
.wsb-mock--flip-rift .wsb-mock__vs {
	color: #a855f7; font-size: 18px;
	text-shadow: 0 0 12px rgba(168,85,247,.8);
}

.wsb-mock--flip-alchemy {
	flex-direction: row; gap: 8px; padding: 12px;
	background:
		radial-gradient(circle at 20% 80%, rgba(52,211,153,.25), transparent 40%),
		radial-gradient(circle at 80% 20%, rgba(251,113,133,.25), transparent 40%),
		#0c1220;
}
.wsb-mock--flip-alchemy .wsb-mock__flipcard {
	flex: 1; min-height: 92px; border-radius: 40% 40% 28% 28% / 45% 45% 30% 30%;
	background: linear-gradient(160deg,rgba(52,211,153,.35),rgba(15,23,42,.9));
	border: 1px solid rgba(52,211,153,.45);
}
.wsb-mock--flip-alchemy .wsb-mock__flipcard.is-hot {
	border-radius: 18px;
	background: linear-gradient(160deg,rgba(125,211,252,.4),rgba(99,102,241,.55));
	border-color: rgba(165,180,252,.6);
	transform: scale(1.05);
}
.wsb-mock--flip-alchemy .wsb-mock__flipcard:last-child {
	border-radius: 12px;
	clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
	background: linear-gradient(160deg,rgba(251,113,133,.5),rgba(249,115,22,.45));
	border: 0;
	min-height: 100px;
}

.wsb-mock--flip-mirror {
	flex-direction: row; align-items: center; gap: 8px; padding: 12px;
	background: #120a14;
}
.wsb-mock--flip-mirror .wsb-mock__flipcard {
	flex: 1; min-height: 88px; border-radius: 8px;
	background: linear-gradient(145deg,#1e293b,#334155);
	border: 1px solid rgba(148,163,184,.35);
}
.wsb-mock--flip-mirror .wsb-mock__flipcard.is-hot {
	background: linear-gradient(145deg,#78350f,#fbbf24);
	border-color: #fde68a;
	border-radius: 40px 40px 12px 12px;
}
.wsb-mock--flip-mirror .wsb-mock__stars {
	writing-mode: vertical-rl; letter-spacing: 3px; color: #fbbf24;
}

.wsb-mock--flip-stars {
	display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px;
	padding: 12px;
	background:
		radial-gradient(circle at 30% 30%, rgba(56,189,248,.3), transparent 35%),
		radial-gradient(circle at 70% 70%, rgba(168,85,247,.3), transparent 35%),
		#050816;
}
.wsb-mock--flip-stars span {
	display: grid; place-items: center; height: 48px; border-radius: 12px;
	font-size: 20px; color: #e0f2fe;
	background: rgba(15,23,42,.85);
	border: 1px solid rgba(56,189,248,.4);
}
.wsb-mock--flip-stars span:nth-child(2) { border-color: rgba(168,85,247,.5); color: #f3e8ff; }
.wsb-mock--flip-stars span:nth-child(3) { border-color: rgba(74,222,128,.5); color: #dcfce7; }
.wsb-mock--flip-stars span:nth-child(4) { border-color: rgba(251,191,36,.5); color: #fef3c7; }

.wsb-mock--gal-cinema {
	display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 1fr 1fr;
	gap: 6px; padding: 14px 12px 22px; position: relative;
	background: #07060b;
}
.wsb-mock--gal-cinema span {
	display: block; border-radius: 6px; min-height: 36px;
	background: linear-gradient(145deg,#292524,#44403c);
	border: 2px solid #1c1917;
	box-shadow: inset 0 0 0 1px rgba(251,191,36,.25);
}
.wsb-mock--gal-cinema .a { grid-column: 1; grid-row: 1 / span 2; min-height: 78px; background: linear-gradient(160deg,#78350f,#fbbf24); }
.wsb-mock--gal-cinema .b { background: linear-gradient(145deg,#3f1d2e,#93003c); }
.wsb-mock--gal-cinema .c { background: linear-gradient(145deg,#1e3a5f,#38bdf8); }
.wsb-mock--gal-cinema .d { grid-column: 2 / span 2; background: linear-gradient(145deg,#14532d,#4ade80); }
.wsb-mock--gal-cinema em {
	position: absolute; bottom: 4px; left: 0; right: 0; text-align: center;
	font-size: 9px; letter-spacing: 3px; color: #fbbf24; font-style: normal; font-weight: 800;
}

.wsb-mock--gal-honey {
	display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 14px;
	background: #050816;
}
.wsb-mock--gal-honey i {
	display: block; height: 42px;
	clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
	background: rgba(34,211,238,.2);
	border: 0;
	box-shadow: 0 0 0 1px rgba(34,211,238,.45) inset;
}
.wsb-mock--gal-honey i.hot {
	background: linear-gradient(160deg,rgba(34,211,238,.55),rgba(168,85,247,.45));
	transform: scale(1.08);
}

.wsb-mock--gal-scatter {
	position: relative; height: 120px; padding: 8px; background: #faf5f0;
}
.wsb-mock--gal-scatter span {
	position: absolute; width: 48px; height: 56px; background: #fff;
	border: 1px solid #e7e5e4; border-bottom-width: 10px;
	box-shadow: 0 6px 14px rgba(28,25,23,.12);
}
.wsb-mock--gal-scatter .p1 { top: 12px; right: 18px; transform: rotate(-8deg); background: linear-gradient(#fff 70%, #fecdd3); }
.wsb-mock--gal-scatter .p2 { top: 28px; right: 58px; transform: rotate(6deg); background: linear-gradient(#fff 70%, #fde68a); }
.wsb-mock--gal-scatter .p3 { top: 18px; left: 42px; transform: rotate(-3deg); background: linear-gradient(#fff 70%, #bbf7d0); }
.wsb-mock--gal-scatter .p4 { top: 40px; left: 14px; transform: rotate(10deg); background: linear-gradient(#fff 70%, #bfdbfe); }

.wsb-mock--gal-metro {
	display: grid !important; grid-template-columns: 1.5fr 1fr 1fr; grid-template-rows: 48px 48px;
	gap: 7px; padding: 12px; background: #0f172a;
}
.wsb-mock--gal-metro span {
	display: block; border-radius: 8px 8px 4px 4px;
	background: linear-gradient(145deg,#1e293b,#334155);
	border: 1px solid rgba(245,158,11,.4);
	position: relative;
}
.wsb-mock--gal-metro span::after {
	content: ""; position: absolute; top: 6px; left: -4px; right: -4px; height: 4px;
	background: repeating-linear-gradient(90deg,#f59e0b 0 6px, transparent 6px 10px);
}
.wsb-mock--gal-metro .wide { grid-column: 1 / span 2; background: linear-gradient(145deg,#0e7490,#38bdf8); }
.wsb-mock--gal-metro .tall { grid-row: 1 / span 2; grid-column: 3; background: linear-gradient(145deg,#9a3412,#f59e0b); }

.wsb-mock--gal-circles {
	display: flex !important; flex-direction: row; flex-wrap: wrap; justify-content: center;
	gap: 10px; padding: 16px; background: #140f18;
}
.wsb-mock--gal-circles i {
	display: block; width: 44px; height: 44px; border-radius: 50%;
	background: linear-gradient(145deg,#292524,#44403c);
	box-shadow: 0 0 0 3px rgba(197,160,89,.35), 0 0 0 6px rgba(20,15,24,.9);
}
.wsb-mock--gal-circles i.hot {
	width: 54px; height: 54px;
	background: linear-gradient(145deg,#78350f,#c5a059);
	box-shadow: 0 0 0 3px rgba(251,191,36,.55), 0 0 18px rgba(197,160,89,.45);
}

.wsb-mock__ibox {
	flex: 1; min-height: 88px; border-radius: 12px; padding: 10px 8px;
	display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
	background: linear-gradient(160deg,rgba(255,255,255,.08),rgba(0,0,0,.35)), #292524;
	color: #fff; box-sizing: border-box;
}
.wsb-mock__ibox em { font-size: 10px; color: rgba(255,255,255,.7); font-style: normal; }
.wsb-mock__ibox strong { font-size: 12px; color: #fff; }

.wsb-mock--ibox-cinema {
	flex-direction: row; gap: 8px; padding: 12px; background: #07060b;
}
.wsb-mock--ibox-cinema .wsb-mock__ibox {
	background: linear-gradient(180deg,transparent 35%,rgba(0,0,0,.85)), linear-gradient(145deg,#44403c,#1c1917);
	border: 1px solid rgba(251,191,36,.25);
}
.wsb-mock--ibox-cinema .hot {
	background: linear-gradient(180deg,transparent 30%,rgba(0,0,0,.8)), linear-gradient(145deg,#93003c,#f97316);
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(249,115,22,.3);
}

.wsb-mock--ibox-neon {
	flex-direction: row; gap: 8px; padding: 12px; background: #050816;
}
.wsb-mock--ibox-neon .a { border: 1px solid #22d3ee; box-shadow: 0 0 14px rgba(34,211,238,.45); background: #0b1224; }
.wsb-mock--ibox-neon .b { border: 1px solid #f97316; clip-path: polygon(8% 0,100% 0,92% 100%,0 100%); background: #1a0f08; }
.wsb-mock--ibox-neon .c { border: 1px solid #a855f7; box-shadow: 0 0 14px rgba(168,85,247,.4); background: #14081f; border-radius: 40%; }

.wsb-mock--ibox-polaroid {
	position: relative; height: 118px; padding: 8px; background: #faf5f0;
}
.wsb-mock--ibox-polaroid span {
	position: absolute; width: 52px; height: 62px; background: #fff;
	border: 1px solid #e7e5e4; border-bottom-width: 12px;
	box-shadow: 0 8px 16px rgba(28,25,23,.12);
}
.wsb-mock--ibox-polaroid .p1 { top: 14px; right: 16px; transform: rotate(-7deg); background: linear-gradient(#ddd6fe 68%, #fff); }
.wsb-mock--ibox-polaroid .p2 { top: 28px; right: 56px; transform: rotate(5deg); background: linear-gradient(#fde68a 68%, #fff); z-index: 2; }
.wsb-mock--ibox-polaroid .p3 { top: 20px; left: 22px; transform: rotate(-3deg); background: linear-gradient(#fecdd3 68%, #fff); }

.wsb-mock--ibox-split {
	flex-direction: row; gap: 10px; padding: 12px; background: #0c0a09;
}
.wsb-mock--ibox-split .before {
	background: linear-gradient(90deg,#1e293b 45%, #334155); border-radius: 6px;
}
.wsb-mock--ibox-split .after {
	background: linear-gradient(90deg,#fbbf24 40%, #78350f); border-radius: 40px 12px 12px 40px;
}
.wsb-mock--ibox-split .wsb-mock__ibox em { font-size: 14px; font-weight: 800; color: #fff; }

.wsb-mock--ibox-gold {
	flex-direction: row; gap: 8px; padding: 12px; background: #140f18;
}
.wsb-mock--ibox-gold .wsb-mock__ibox {
	align-items: center; justify-content: center;
	background: linear-gradient(145deg,#292524,#1c1917);
	border: 1px solid rgba(197,160,89,.45);
}
.wsb-mock--ibox-gold .wsb-mock__ibox strong { font-size: 22px; }
.wsb-mock--ibox-gold .hot {
	background: linear-gradient(145deg,#78350f,#c5a059);
	box-shadow: 0 0 18px rgba(197,160,89,.45);
	transform: scale(1.06);
}

.wsb-mock__ix {
	flex: 1; min-height: 86px; border-radius: 14px; padding: 10px 8px;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	background: rgba(255,255,255,.06); box-sizing: border-box; color: #fff;
}
.wsb-mock__ix i {
	display: block; width: 28px; height: 28px; border-radius: 50%;
	background: linear-gradient(145deg,var(--a,#22d3ee),var(--b,#067a8a));
	box-shadow: 0 0 12px rgba(34,211,238,.45);
}
.wsb-mock__ix strong { font-size: 11px; }
.wsb-mock__ix em { font-size: 10px; font-style: normal; opacity: .7; }

.wsb-mock--ixbox-neon {
	flex-direction: row; gap: 8px; padding: 12px; background: #050816;
}
.wsb-mock--ixbox-neon .wsb-mock__ix { border: 1px solid rgba(34,211,238,.45); }
.wsb-mock--ixbox-neon .hot {
	border-color: #a855f7; border-radius: 40%;
	box-shadow: 0 0 16px rgba(168,85,247,.4);
}
.wsb-mock--ixbox-neon .hot i { --a:#a855f7; --b:#22d3ee; }
.wsb-mock--ixbox-neon .wsb-mock__ix:last-child {
	clip-path: polygon(8% 0,100% 0,92% 100%,0 100%); border-color: #f97316;
}
.wsb-mock--ixbox-neon .wsb-mock__ix:last-child i { --a:#f97316; --b:#fbbf24; }

.wsb-mock--ixbox-gold {
	flex-direction: row; gap: 8px; padding: 12px; background: #140f18;
}
.wsb-mock--ixbox-gold .wsb-mock__ix {
	border: 1px solid rgba(197,160,89,.4);
	background: linear-gradient(160deg,rgba(197,160,89,.12),rgba(20,15,24,.9));
}
.wsb-mock--ixbox-gold .wsb-mock__ix i { --a:#fbbf24; --b:#c5a059; border-radius: 50%; }
.wsb-mock--ixbox-gold .hot {
	background: linear-gradient(145deg,#78350f,#c5a059);
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(197,160,89,.35);
}

.wsb-mock--ixbox-brutal {
	display: grid !important; grid-template-columns: 1fr 1fr; gap: 7px; padding: 12px; background: #0a0a0a;
}
.wsb-mock--ixbox-brutal span {
	display: block; height: 44px; border-radius: 0;
	background: #111; border: 2px solid #333;
}
.wsb-mock--ixbox-brutal span:nth-child(1) { border-color: #ef4444; background: linear-gradient(145deg,#450a0a,#7f1d1d); }
.wsb-mock--ixbox-brutal span.hot { border-color: #22d3ee; background: linear-gradient(145deg,#083344,#0e7490); }
.wsb-mock--ixbox-brutal span:nth-child(3) { border-radius: 10px 10px 4px 4px; border-color: #fb7185; background: #4c0519; }
.wsb-mock--ixbox-brutal span:nth-child(4) {
	clip-path: polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
	border: 0; background: linear-gradient(145deg,#14532d,#22c55e);
}

.wsb-mock--ixbox-aurora {
	flex-direction: row; gap: 8px; padding: 12px;
	background:
		radial-gradient(circle at 20% 30%, rgba(56,189,248,.25), transparent 40%),
		radial-gradient(circle at 80% 70%, rgba(168,85,247,.25), transparent 40%),
		#0b1220;
}
.wsb-mock--ixbox-aurora .wsb-mock__ix {
	backdrop-filter: blur(4px);
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.15);
}
.wsb-mock--ixbox-aurora .a { border-radius: 18px; }
.wsb-mock--ixbox-aurora .a i { --a:#7dd3fc; --b:#a5b4fc; }
.wsb-mock--ixbox-aurora .b { border-radius: 40% 40% 30% 30%; }
.wsb-mock--ixbox-aurora .b i { --a:#34d399; --b:#818cf8; }
.wsb-mock--ixbox-aurora .c { border-radius: 999px; }
.wsb-mock--ixbox-aurora .c i { --a:#c084fc; --b:#38bdf8; }

.wsb-mock--ixbox-cinema {
	flex-direction: row; gap: 8px; padding: 12px; background: #07060b;
}
.wsb-mock--ixbox-cinema .wsb-mock__ix {
	background: linear-gradient(180deg,rgba(251,191,36,.12),rgba(0,0,0,.7));
	border: 1px solid rgba(251,191,36,.3);
}
.wsb-mock--ixbox-cinema .hot {
	background: linear-gradient(180deg,rgba(147,0,60,.35),rgba(0,0,0,.75));
	border-color: #f97316;
	transform: scale(1.05);
	box-shadow: 0 0 18px rgba(249,115,22,.35);
}
.wsb-mock--ixbox-cinema .wsb-mock__ix em { color: #fbbf24; font-weight: 800; }

.wsb-mock--fusion-arena {
	flex-direction: row; gap: 10px; padding: 12px; background: #06070f; align-items: stretch;
}
.wsb-mock--fusion-arena .wsb-mock__fusion-l {
	flex: 1.1; display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.wsb-mock--fusion-arena .wsb-mock__fusion-l strong { color: #67e8f9; font-size: 16px; }
.wsb-mock--fusion-arena .wsb-mock__fusion-l em { color: #fbbf24; font-size: 10px; letter-spacing: 1px; }
.wsb-mock--fusion-arena .wsb-mock__fusion-r { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.wsb-mock--fusion-arena .tick {
	height: 28px; border-radius: 6px;
	background: linear-gradient(90deg,#083344,#22d3ee); border: 1px solid rgba(34,211,238,.5);
}
.wsb-mock--fusion-arena .flip {
	flex: 1; border-radius: 8px; min-height: 48px;
	background: linear-gradient(145deg,#1e1b4b,#a855f7); border: 1px solid rgba(168,85,247,.5);
}

.wsb-mock--fusion-bridge {
	flex-direction: row; gap: 8px; padding: 12px; background: #0f0a12;
}
.wsb-mock--fusion-bridge .pane { flex: 1; min-height: 96px; border-radius: 12px; }
.wsb-mock--fusion-bridge .a {
	background: linear-gradient(160deg,#4c0519,#93003c 55%, transparent), #1c1917;
	border: 1px solid rgba(251,191,36,.3);
}
.wsb-mock--fusion-bridge .b {
	display: flex; flex-direction: column; gap: 6px; padding: 8px;
	background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1);
}
.wsb-mock--fusion-bridge .b i {
	display: block; height: 22px; border-radius: 8px;
	background: linear-gradient(90deg,rgba(197,160,89,.4),rgba(255,255,255,.06));
}

.wsb-mock--fusion-vault {
	flex-direction: row; gap: 8px; padding: 12px; background: #120810; align-items: stretch;
}
.wsb-mock--fusion-vault .cta {
	flex: 1.3; border-radius: 14px;
	background: linear-gradient(135deg,#7c2d12,#f97316 60%, #fbbf24);
}
.wsb-mock--fusion-vault .plan {
	flex: 1; border-radius: 8px; display: grid; place-items: center;
	background: #111; border: 2px solid #f97316;
}
.wsb-mock--fusion-vault .plan strong { color: #fbbf24; font-size: 22px; }

.wsb-mock--fusion-voices {
	flex-direction: row; gap: 10px; padding: 14px; background: #faf7f8; align-items: center;
}
.wsb-mock--fusion-voices .stat {
	width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center;
	background: linear-gradient(145deg,#93003c,#f97316); color: #fff;
}
.wsb-mock--fusion-voices .stat strong { color: #fff; font-size: 16px; }
.wsb-mock--fusion-voices .bubble {
	flex: 1; background: #fff; border-radius: 14px; padding: 12px;
	border: 1px solid #f3d5e2; box-shadow: 0 6px 14px rgba(147,0,60,.08);
}
.wsb-mock--fusion-voices .bubble p { color: #140f18; font-size: 13px; }

.wsb-mock--fusion-theater {
	flex-direction: row; gap: 8px; padding: 12px; background: #0b1220;
}
.wsb-mock--fusion-theater .tabs {
	flex: 1.2; display: flex; flex-direction: column; gap: 6px;
}
.wsb-mock--fusion-theater .tabs span {
	height: 22px; border-radius: 999px; background: rgba(56,189,248,.15);
	border: 1px solid rgba(56,189,248,.3);
}
.wsb-mock--fusion-theater .tabs .on { background: linear-gradient(90deg,#0ea5e9,#a855f7); border: 0; }
.wsb-mock--fusion-theater .faq {
	flex: 1; border-radius: 12px;
	background: repeating-linear-gradient(180deg,rgba(255,255,255,.08) 0 18px, transparent 18px 28px);
	border: 1px solid rgba(168,85,247,.35);
}

.wsb-mock--fusion-salon {
	display: grid !important; grid-template-columns: 1fr 1fr 1fr; gap: 6px; padding: 12px; background: #07060b;
}
.wsb-mock--fusion-salon .g {
	height: 40px; border-radius: 8px; background: #292524;
	border: 1px solid rgba(251,191,36,.25);
}
.wsb-mock--fusion-salon .g.hot { background: linear-gradient(145deg,#78350f,#fbbf24); grid-row: span 2; height: auto; }
.wsb-mock--fusion-salon .card {
	grid-column: 3; height: 40px; border-radius: 10px;
	background: linear-gradient(145deg,#3f1d2e,#93003c);
}

.wsb-mock--fusion-console {
	gap: 10px; padding: 12px; background: #0a1020; align-items: stretch;
}
.wsb-mock--fusion-console .steps {
	display: flex; gap: 6px; justify-content: space-between;
}
.wsb-mock--fusion-console .steps i {
	flex: 1; height: 12px; border-radius: 999px; background: #1e293b;
}
.wsb-mock--fusion-console .steps .on { background: linear-gradient(90deg,#38bdf8,#f97316); }
.wsb-mock--fusion-console .bars { display: flex; flex-direction: column; gap: 6px; }
.wsb-mock--fusion-console .bars b {
	display: block; height: 10px; border-radius: 6px;
	background: linear-gradient(90deg,#0ea5e9, transparent 70%);
	border: 1px solid rgba(14,165,233,.35);
}
.wsb-mock--fusion-console .bars b:last-child {
	background: linear-gradient(90deg,#f97316, transparent 55%);
	border-color: rgba(249,115,22,.35);
}

.wsb-mock--fusion-mirror {
	flex-direction: row; align-items: center; gap: 8px; padding: 12px; background: #100a12;
}
.wsb-mock--fusion-mirror .face {
	flex: 1; min-height: 88px; border-radius: 10px;
	display: grid; place-items: center; font-weight: 800; font-size: 14px; color: #fff;
}
.wsb-mock--fusion-mirror .a { background: #1e293b; border: 1px solid #475569; }
.wsb-mock--fusion-mirror .b {
	background: linear-gradient(145deg,#78350f,#fbbf24); border-radius: 40px 12px 12px 40px; color: #111;
}
.wsb-mock--fusion-mirror em { color: #fbbf24; font-weight: 900; font-style: normal; }

.wsb-mock--fusion-pulse {
	flex-direction: row; gap: 8px; padding: 12px; background: #fff;
}
.wsb-mock--fusion-pulse .form {
	flex: 1.1; border-radius: 12px; background:
		repeating-linear-gradient(180deg,#f1f5f9 0 14px, transparent 14px 24px);
	border: 1px solid #e2e8f0; min-height: 96px;
}
.wsb-mock--fusion-pulse .map {
	flex: 1; border-radius: 12px; display: grid; place-items: center; font-size: 28px;
	background: linear-gradient(145deg,#ecfdf5,#dbeafe); border: 1px solid #bbf7d0;
}

.wsb-mock--fusion-royal {
	gap: 8px; padding: 12px; background: #140f18; align-items: center;
}
.wsb-mock--fusion-royal > strong {
	font-size: 22px; color: #fbbf24;
	filter: drop-shadow(0 0 8px rgba(251,191,36,.5));
}
.wsb-mock--fusion-royal .circles { display: flex; gap: 8px; }
.wsb-mock--fusion-royal .circles i {
	width: 36px; height: 36px; border-radius: 50%;
	background: #292524; box-shadow: 0 0 0 3px rgba(197,160,89,.4);
}
.wsb-mock--fusion-royal .circles .hot {
	width: 44px; height: 44px;
	background: linear-gradient(145deg,#78350f,#c5a059);
}

/* —— posts mega thumbs —— */
.wsb-mock--posts-aurora,
.wsb-mock--posts-brutal,
.wsb-mock--posts-hologram,
.wsb-mock--posts-metro,
.wsb-mock--posts-cinema,
.wsb-mock--posts-orbit,
.wsb-mock--posts-ribbon,
.wsb-mock--posts-ink,
.wsb-mock--posts-liquid,
.wsb-mock--posts-spotlight {
	display: grid !important;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 8px;
	padding: 12px;
	align-items: stretch;
}
.wsb-mock--posts-aurora { background: #070816; }
.wsb-mock--posts-aurora span {
	min-height: 70px; border-radius: 14px;
	background: linear-gradient(145deg,#0b1224,#1a1040);
	box-shadow: 0 0 0 1px rgba(34,211,238,.35), 0 10px 20px rgba(168,85,247,.25);
}
.wsb-mock--posts-aurora .hot {
	background: radial-gradient(circle at 30% 30%,rgba(34,211,238,.55),transparent 55%), linear-gradient(145deg,#0b1224,#312e81);
}

.wsb-mock--posts-brutal { background: #f4f0e8; }
.wsb-mock--posts-brutal span {
	min-height: 68px; background: #fff; border: 3px solid #111; box-shadow: 5px 5px 0 #111;
}
.wsb-mock--posts-brutal .hot { background: #111; }

.wsb-mock--posts-hologram { background: #050510; }
.wsb-mock--posts-hologram span {
	min-height: 70px; border-radius: 14px;
	background: linear-gradient(120deg,rgba(34,211,238,.35),rgba(168,85,247,.4),rgba(251,191,36,.3));
	border: 1px solid rgba(255,255,255,.25);
}
.wsb-mock--posts-hologram .hot { filter: saturate(1.4); }

.wsb-mock--posts-metro { background: #0c0a09; grid-template-columns: 1.4fr 1fr 1fr; }
.wsb-mock--posts-metro span {
	min-height: 54px; border-radius: 4px; background: #1c1917;
	border-inline-start: 4px solid #fbbf24;
}
.wsb-mock--posts-metro .wide { grid-row: span 2; min-height: 116px; background: linear-gradient(160deg,#292524,#78350f); }

.wsb-mock--posts-cinema {
	background: #07060b; grid-template-columns: 1fr 1fr; position: relative;
}
.wsb-mock--posts-cinema em {
	position: absolute; top: 6px; inset-inline: 10px; z-index: 2;
	font-size: 9px; letter-spacing: .2em; color: #fbbf24; font-style: normal; font-weight: 800;
	text-align: center;
}
.wsb-mock--posts-cinema span {
	min-height: 88px; border-radius: 10px; margin-top: 10px;
	background: #1a1208; border: 1px solid rgba(197,160,89,.35);
	box-shadow: inset 0 8px 0 #111, inset 0 -8px 0 #111;
}
.wsb-mock--posts-cinema .hot { background: linear-gradient(160deg,#78350f,#fbbf24); }

.wsb-mock--posts-orbit {
	background: #0b1220; display: flex !important; justify-content: center; align-items: center; gap: 12px;
}
.wsb-mock--posts-orbit i {
	width: 36px; height: 36px; border-radius: 50%; background: #1e293b;
	box-shadow: 0 0 0 3px rgba(56,189,248,.45), 0 0 0 8px rgba(56,189,248,.15);
}
.wsb-mock--posts-orbit .hot {
	width: 48px; height: 48px;
	background: linear-gradient(145deg,#0ea5e9,#38bdf8);
}

.wsb-mock--posts-ribbon { background: #fff7f9; }
.wsb-mock--posts-ribbon span {
	position: relative; min-height: 72px; border-radius: 12px; background: #fff;
	border: 1px solid rgba(147,0,60,.12); overflow: visible;
}
.wsb-mock--posts-ribbon span b {
	position: absolute; top: 10px; inset-inline-end: -4px;
	width: 28px; height: 12px; border-radius: 3px 0 0 3px; background: #93003c;
}
.wsb-mock--posts-ribbon .hot { background: linear-gradient(160deg,#fff,#fce7f0); }
.wsb-mock--posts-ribbon .hot b { background: #f97316; }

.wsb-mock--posts-ink { background: #f3efe6; }
.wsb-mock--posts-ink span {
	min-height: 70px; border-radius: 6px; background: #f7f3ea;
	border: 1px dashed #1c1917;
}
.wsb-mock--posts-ink .hot { border-style: solid; border-width: 2px; background: #efe8d8; }

.wsb-mock--posts-liquid { background: #ecfeff; }
.wsb-mock--posts-liquid span {
	min-height: 70px;
	border-radius: 42% 58% 48% 52% / 52% 42% 58% 48%;
	background: linear-gradient(145deg,#a5f3fc,#67e8f9);
}
.wsb-mock--posts-liquid .hot {
	background: linear-gradient(145deg,#67e8f9,#818cf8);
	border-radius: 58% 42% 52% 48% / 42% 58% 48% 52%;
}

.wsb-mock--posts-spotlight { background: #0a080c; grid-template-columns: 1.5fr 1fr 1fr; }
.wsb-mock--posts-spotlight span {
	min-height: 54px; border-radius: 12px; background: #17131a;
	border: 1px solid rgba(197,160,89,.3);
}
.wsb-mock--posts-spotlight .wide {
	grid-row: span 2; min-height: 116px;
	background: radial-gradient(ellipse at 50% 20%, rgba(251,191,36,.45), transparent 55%), linear-gradient(160deg,#1a1208,#0a080c);
}

.wsb-mock--posts-cover {
	display: grid; grid-template-columns: 1.35fr 1fr; gap: 8px; padding: 10px; background: #1a0f14;
}
.wsb-mock--posts-cover .cover {
	border-radius: 10px; min-height: 118px; position: relative; overflow: hidden;
	background: linear-gradient(160deg,#4c0519,#93003c 55%,#fbbf24);
	display: flex; flex-direction: column; justify-content: flex-end; padding: 10px;
}
.wsb-mock--posts-cover .cover em {
	font-style: normal; font-size: 9px; font-weight: 900; letter-spacing: .18em; color: #fef3c7;
}
.wsb-mock--posts-cover .cover b {
	display: block; height: 8px; width: 72%; margin-top: 6px; border-radius: 4px; background: rgba(255,255,255,.85);
}
.wsb-mock--posts-cover .stack { display: grid; gap: 8px; }
.wsb-mock--posts-cover .stack span {
	min-height: 52px; border-radius: 10px; background: #2a1520; border: 1px solid rgba(251,191,36,.25);
}
.wsb-mock--posts-cover .stack .hot { background: linear-gradient(145deg,#3f1a28,#7f1d1d); }

.wsb-mock--posts-timeline {
	display: grid; grid-template-columns: 18px 1fr; gap: 10px; padding: 10px 12px; background: #faf7f2;
}
.wsb-mock--posts-timeline .rail {
	display: flex; flex-direction: column; align-items: center; justify-content: space-between;
	padding: 6px 0; position: relative;
}
.wsb-mock--posts-timeline .rail::before {
	content: ""; position: absolute; inset: 10px 50% 10px auto; width: 2px; transform: translateX(50%);
	background: linear-gradient(#93003c,#d6d3d1);
}
.wsb-mock--posts-timeline .rail i {
	width: 10px; height: 10px; border-radius: 50%; background: #d6d3d1; border: 2px solid #fff;
	box-shadow: 0 0 0 1px #a8a29e; z-index: 1;
}
.wsb-mock--posts-timeline .rail .on,
.wsb-mock--posts-timeline .rail .hot { background: #93003c; box-shadow: 0 0 0 1px #93003c; }
.wsb-mock--posts-timeline .cards { display: grid; gap: 7px; }
.wsb-mock--posts-timeline .cards span {
	min-height: 32px; border-radius: 0 10px 10px 10px; background: #fff;
	border: 1px solid #e7e5e4; box-shadow: inset 0 6px 0 #93003c;
}
.wsb-mock--posts-timeline .cards .hot { box-shadow: inset 0 6px 0 #fbbf24; }

.wsb-mock--posts-dual {
	display: grid; grid-template-columns: 1.1fr 1fr; gap: 8px; padding: 10px; background: #0f172a;
}
.wsb-mock--posts-dual .left {
	border-radius: 12px; min-height: 118px;
	background: linear-gradient(165deg,#1e293b,#334155 40%,#93003c);
}
.wsb-mock--posts-dual .right { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.wsb-mock--posts-dual .right span {
	min-height: 54px; border-radius: 10px; background: #1e293b; border: 1px solid rgba(148,163,184,.25);
}
.wsb-mock--posts-dual .right .hot { background: linear-gradient(145deg,#312e81,#93003c); }

.wsb-mock--posts-noir { background: #050505; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 10px; }
.wsb-mock--posts-noir span {
	min-height: 100px; border-radius: 0; background: #111; border: 1px solid #262626;
	filter: grayscale(1) contrast(1.1);
}
.wsb-mock--posts-noir .hot {
	background: linear-gradient(180deg,#1a1a1a,#000); border-color: #f5f5f5;
	box-shadow: inset 0 0 0 1px #f5f5f5;
}

.wsb-mock--posts-prism {
	display: grid; grid-template-columns: 1.2fr 1fr 1fr; grid-auto-rows: 54px; gap: 7px; padding: 10px;
	background: #070816;
}
.wsb-mock--posts-prism span {
	border-radius: 0; min-height: 54px;
	clip-path: polygon(0 0,100% 0,100% 82%,88% 100%,0 100%);
	background: linear-gradient(135deg,#38bdf8,#6366f1);
}
.wsb-mock--posts-prism span:nth-child(1) { grid-row: span 2; min-height: 116px; background: linear-gradient(145deg,#a855f7,#f43f5e); }
.wsb-mock--posts-prism .hot { background: linear-gradient(135deg,#22d3ee,#fbbf24); }

.wsb-mock--posts-vault { background: #1c1917; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 10px; }
.wsb-mock--posts-vault span {
	min-height: 100px; border-radius: 10px; background: linear-gradient(160deg,#292524,#44403c);
	border: 1px dashed #a8a29e; display: grid; place-items: center; position: relative;
}
.wsb-mock--posts-vault span::before {
	content: ""; position: absolute; inset-inline: 10px; top: 10px; height: 8px; border-radius: 4px; background: #a8a29e;
}
.wsb-mock--posts-vault span b { font-size: 18px; filter: grayscale(.2); }
.wsb-mock--posts-vault .hot {
	border-style: solid; border-color: #fbbf24;
	background: linear-gradient(160deg,#44403c,#78350f);
	box-shadow: 0 0 18px rgba(251,191,36,.25);
}

.wsb-mock--posts-wave { background: #ecfeff; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 10px; }
.wsb-mock--posts-wave span {
	min-height: 100px; background: #fff; border: 1px solid rgba(14,165,233,.2);
	clip-path: ellipse(100% 100% at 50% 35%);
}
.wsb-mock--posts-wave .hot {
	background: radial-gradient(ellipse at 50% 0%, #67e8f9 0 55%, #fff 56%);
	border-color: #38bdf8;
}

.wsb-mock--posts-pulse {
	display: grid; place-items: center; padding: 18px 12px; background: #0b0b12;
}
.wsb-mock--posts-pulse .ticker {
	display: flex; gap: 8px; width: 100%; align-items: stretch;
}
.wsb-mock--posts-pulse .ticker i {
	flex: 1; min-height: 72px; border-radius: 12px; background: #15151f;
	border: 1px solid rgba(147,0,60,.45); box-shadow: 0 0 0 0 rgba(147,0,60,.35);
}
.wsb-mock--posts-pulse .ticker .hot {
	border-color: #93003c; background: linear-gradient(160deg,#1a0a12,#93003c);
	box-shadow: 0 0 18px rgba(147,0,60,.45);
}

.wsb-mock--posts-atelier {
	display: grid; grid-template-columns: 1fr 1.1fr 1fr; gap: 8px; padding: 10px; background: #f3efe6; align-items: end;
}
.wsb-mock--posts-atelier .polaroid {
	min-height: 88px; background: #fff; border: 1px solid #d6d3d1; border-radius: 2px;
	box-shadow: 2px 3px 0 rgba(28,25,23,.08); transform: rotate(-3deg);
	background-image: linear-gradient(#e7e5e4 0 62%, #fff 62%);
}
.wsb-mock--posts-atelier .polaroid:last-child { transform: rotate(4deg); }
.wsb-mock--posts-atelier .ink {
	min-height: 108px; background: #faf7f0; border: 1px dashed #1c1917; border-radius: 4px;
	box-shadow: inset 0 -2px 0 #93003c; transform: none;
}

.wsb-mock--posts-crown {
	display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px; padding: 14px 10px 10px; background: #120d08; position: relative;
}
.wsb-mock--posts-crown strong {
	position: absolute; top: 4px; inset-inline-end: 10px; color: #fbbf24; font-size: 14px; z-index: 2;
	text-shadow: 0 0 10px rgba(251,191,36,.5);
}
.wsb-mock--posts-crown span {
	min-height: 54px; border-radius: 12px; background: #1c140c;
	border: 1px solid rgba(197,160,89,.35);
}
.wsb-mock--posts-crown .wide {
	grid-row: span 2; min-height: 116px;
	background: radial-gradient(ellipse at 50% 15%, rgba(251,191,36,.5), transparent 55%), linear-gradient(160deg,#2a1a08,#120d08);
}
.wsb-mock--posts-crown .hot { background: linear-gradient(145deg,#78350f,#fbbf24); border-color: #fbbf24; }


/* —— new pricing mega mocks (15) —— */
.wsb-mock--price-crystal {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px;
	background: linear-gradient(165deg,#070816,#1a1040 50%,#0c4a6e);
}
.wsb-mock--price-crystal span {
	min-height: 88px; border-radius: 42% 58% 48% 52%/52% 42% 58% 48%;
	background: linear-gradient(145deg,rgba(34,211,238,.35),rgba(168,85,247,.35));
	border: 1px solid rgba(103,232,249,.4); backdrop-filter: blur(4px);
}
.wsb-mock--price-crystal .hot {
	transform: translateY(-8px);
	background: linear-gradient(145deg,rgba(34,211,238,.65),rgba(168,85,247,.55));
	box-shadow: 0 12px 24px rgba(34,211,238,.3);
}

.wsb-mock--price-orbit {
	display: grid; place-items: center; padding: 16px; background: #050510; position: relative; min-height: 120px;
}
.wsb-mock--price-orbit .core {
	width: 36px; height: 36px; border-radius: 50%;
	background: radial-gradient(circle,#67e8f9,#38bdf8 40%,#a855f7);
	box-shadow: 0 0 24px rgba(56,189,248,.55); z-index: 2;
}
.wsb-mock--price-orbit i {
	position: absolute; width: 18px; height: 18px; border-radius: 50%;
	background: #1e293b; border: 2px solid #38bdf8;
}
.wsb-mock--price-orbit i:nth-of-type(1) { top: 18px; inset-inline-start: 22px; }
.wsb-mock--price-orbit i.hot { top: 22px; inset-inline-end: 20px; background: #a855f7; border-color: #e879f9; box-shadow: 0 0 12px #a855f7; }
.wsb-mock--price-orbit i:nth-of-type(3) { bottom: 16px; inset-inline-start: 46%; }

.wsb-mock--price-phoenix {
	gap: 8px; padding: 12px; background: linear-gradient(180deg,#1c0a05,#7c2d12);
}
.wsb-mock--price-phoenix em {
	align-self: center; font-style: normal; font-size: 11px; font-weight: 900;
	color: #fde68a; padding: 4px 12px; border-radius: 999px; border: 1px solid rgba(251,191,36,.45);
	background: rgba(0,0,0,.25);
}
.wsb-mock--price-phoenix .wsb-mock__plans3 span {
	background: linear-gradient(160deg,#431407,#9a3412); border: 1px solid rgba(251,146,60,.4);
}
.wsb-mock--price-phoenix .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,#c2410c,#fbbf24); transform: translateY(-6px);
	box-shadow: 0 10px 22px rgba(249,115,22,.4);
}

.wsb-mock--price-mirage {
	gap: 7px; padding: 12px; background: linear-gradient(160deg,#ecfdf5,#fef3c7,#fce7f3);
}
.wsb-mock--price-mirage .leaf {
	height: 10px; border-radius: 999px;
	background: linear-gradient(90deg,#0d9488,#fbbf24,#f472b6);
}
.wsb-mock--price-mirage .wsb-mock__li {
	background: rgba(255,255,255,.85); border-color: rgba(13,148,136,.25);
}
.wsb-mock--price-mirage .wsb-mock__li strong { color: #134e4a; }
.wsb-mock--price-mirage .wsb-mock__li em { color: #0d9488; font-weight: 800; }
.wsb-mock--price-mirage .wsb-mock__li.is-hot { border-color: #fbbf24; box-shadow: 0 6px 14px rgba(251,191,36,.2); }

.wsb-mock--price-quantum {
	gap: 8px; padding: 12px; background: #020617;
}
.wsb-mock--price-quantum em {
	align-self: center; font-style: normal; font-size: 10px; font-weight: 800; color: #22d3ee;
	padding: 3px 10px; border-radius: 999px; border: 1px solid rgba(34,211,238,.4);
}
.wsb-mock--price-quantum .wsb-mock__plans3 span {
	background: #0f172a; border: 1px solid rgba(34,211,238,.35); clip-path: polygon(8% 0,100% 0,100% 88%,92% 100%,0 100%,0 12%);
}
.wsb-mock--price-quantum .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,#083344,#581c87); border-color: #e879f9; transform: translateY(-5px);
}

.wsb-mock--price-sage {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px; background: #f4f7f4;
}
.wsb-mock--price-sage span {
	min-height: 90px; border-radius: 14px; background: #fff; border: 1px solid #d9e2d4;
}
.wsb-mock--price-sage .hot {
	border-color: #65a30d; background: #f7fee7; transform: translateY(-4px);
	box-shadow: 0 8px 16px rgba(101,163,13,.15);
}

.wsb-mock--price-linen {
	display: flex; flex-direction: column; gap: 7px; padding: 14px; background: #faf7f2;
}
.wsb-mock--price-linen span {
	min-height: 28px; border-radius: 10px; background: #fff; border: 1px solid #e7e5e4;
}
.wsb-mock--price-linen .hot { border-color: #a8a29e; background: #f5f5f4; box-shadow: inset 0 0 0 1px #d6d3d1; }

.wsb-mock--price-lavender {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px; background: #f5f3ff;
}
.wsb-mock--price-lavender span {
	min-height: 90px; border-radius: 40% 60% 50% 50%/50% 40% 60% 50%;
	background: #fff; border: 1px solid #ddd6fe;
}
.wsb-mock--price-lavender .hot {
	background: linear-gradient(160deg,#ede9fe,#c4b5fd); border-color: #8b5cf6; transform: translateY(-6px);
}

.wsb-mock--price-pearl {
	gap: 6px; padding: 14px; background: #fff; border: 1px solid #f1f5f9;
}
.wsb-mock--price-pearl .wsb-mock__li {
	background: transparent; border: 0; border-bottom: 1px solid #e2e8f0; border-radius: 0; padding: 6px 2px;
}
.wsb-mock--price-pearl .wsb-mock__li strong { color: #475569; font-weight: 600; }
.wsb-mock--price-pearl .wsb-mock__li em { color: #94a3b8; }
.wsb-mock--price-pearl .wsb-mock__li.is-hot em { color: #64748b; font-weight: 800; }

.wsb-mock--price-sky {
	display: flex; flex-direction: column; gap: 8px; padding: 12px; background: #f0f9ff;
}
.wsb-mock--price-sky span {
	min-height: 30px; border-radius: 999px; background: #fff; border: 1px solid #bae6fd;
}
.wsb-mock--price-sky .hot {
	background: linear-gradient(90deg,#e0f2fe,#7dd3fc); border-color: #0ea5e9;
	box-shadow: 0 6px 14px rgba(14,165,233,.2);
}

.wsb-mock--price-obsidian {
	gap: 8px; padding: 14px 12px 12px; background: #0a0a0a; position: relative;
}
.wsb-mock--price-obsidian > strong {
	position: absolute; top: 4px; inset-inline-end: 10px; color: #fbbf24; font-size: 14px;
	text-shadow: 0 0 10px rgba(251,191,36,.5);
}
.wsb-mock--price-obsidian .wsb-mock__plans3 span {
	background: #171717; border: 1px solid rgba(197,160,89,.35);
}
.wsb-mock--price-obsidian .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,#1c1408,#78350f); border-color: #fbbf24;
	box-shadow: 0 0 18px rgba(251,191,36,.3); transform: translateY(-6px);
}

.wsb-mock--price-gilt {
	gap: 7px; padding: 12px 14px; background: #111;
}
.wsb-mock--price-gilt .wsb-mock__li {
	background: rgba(251,191,36,.06); border-color: rgba(251,191,36,.25);
}
.wsb-mock--price-gilt .wsb-mock__li strong { color: #fde68a; font-size: 11px; }
.wsb-mock--price-gilt .wsb-mock__li em { color: #fbbf24; font-weight: 800; }
.wsb-mock--price-gilt .wsb-mock__li.is-hot {
	background: rgba(147,0,60,.25); border-color: #fbbf24;
}

.wsb-mock--price-velvet {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px;
	background: linear-gradient(180deg,#0c0a09,#1c1917);
}
.wsb-mock--price-velvet span {
	min-height: 96px; border-radius: 8px; display: grid; place-items: center; font-size: 18px;
	background: #292524; border: 1px dashed #a8a29e; color: #fbbf24;
}
.wsb-mock--price-velvet .hot {
	border-style: solid; border-color: #fbbf24;
	background: linear-gradient(160deg,#44403c,#78350f);
	box-shadow: 0 0 16px rgba(251,191,36,.3);
}

.wsb-mock--price-imperial {
	gap: 8px; padding: 12px; background: #050505;
}
.wsb-mock--price-imperial em {
	align-self: center; font-style: normal; font-size: 10px; font-weight: 800; color: #fde68a;
	padding: 3px 10px; border-radius: 4px; border: 1px solid rgba(251,191,36,.4);
}
.wsb-mock--price-imperial .wsb-mock__plans3 span {
	background: #171717; border: 1px solid rgba(197,160,89,.3);
	clip-path: polygon(0 8%,8% 0,100% 0,100% 92%,92% 100%,0 100%);
}
.wsb-mock--price-imperial .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,#292524,#92400e); border-color: #fbbf24; transform: translateY(-5px);
}

.wsb-mock--price-ingot {
	display: flex; flex-direction: column; gap: 8px; padding: 14px 12px; background: #09090b; position: relative;
}
.wsb-mock--price-ingot span {
	min-height: 28px; border-radius: 8px;
	background: linear-gradient(90deg,#292524,#3f3f46); border: 1px solid rgba(197,160,89,.3);
}
.wsb-mock--price-ingot .hot {
	background: linear-gradient(90deg,#78350f,#fbbf24,#c5a059);
	border-color: #fde68a; box-shadow: 0 6px 16px rgba(251,191,36,.25);
}
.wsb-mock--price-ingot b {
	align-self: center; font-size: 10px; color: #fbbf24; letter-spacing: .12em;
}

.wsb-mock--price-sakura {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px;
	background: linear-gradient(165deg,#fff1f2,#fce7f3 50%,#fdf2f8);
}
.wsb-mock--price-sakura span {
	min-height: 88px; border-radius: 60% 40% 55% 45%/45% 55% 40% 60%;
	background: linear-gradient(145deg,rgba(251,113,133,.35),rgba(244,114,182,.3));
	border: 1px solid rgba(244,63,94,.35);
}
.wsb-mock--price-sakura .hot {
	transform: translateY(-8px);
	background: linear-gradient(145deg,rgba(225,29,72,.55),rgba(251,113,133,.5));
	box-shadow: 0 12px 22px rgba(225,29,72,.25);
}

.wsb-mock--price-cyber {
	gap: 8px; padding: 12px; background: linear-gradient(160deg,#020617,#312e81);
}
.wsb-mock--price-cyber > em {
	display: block; text-align: center; font-size: 10px; color: #67e8f9; letter-spacing: .08em;
}
.wsb-mock--price-cyber .wsb-mock__plans3 span {
	background: rgba(34,211,238,.12); border: 1px solid rgba(34,211,238,.35);
	clip-path: polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);
	min-height: 52px;
}
.wsb-mock--price-cyber .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,rgba(34,211,238,.45),rgba(232,121,249,.4));
	border-color: #e879f9; box-shadow: 0 0 16px rgba(232,121,249,.35);
	transform: translateY(-6px);
}

.wsb-mock--price-tidal {
	display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px;
	background: linear-gradient(180deg,#042f2e,#0f766e);
}
.wsb-mock--price-tidal span {
	min-height: 88px;
	border-radius: 40% 60% 55% 45%/55% 40% 60% 45%;
	background: linear-gradient(145deg,rgba(45,212,191,.35),rgba(56,189,248,.3));
	border: 1px solid rgba(153,246,228,.4); backdrop-filter: blur(3px);
}
.wsb-mock--price-tidal .hot {
	transform: translateY(-10px) scale(1.04);
	background: linear-gradient(145deg,rgba(45,212,191,.7),rgba(56,189,248,.55));
	box-shadow: 0 14px 24px rgba(45,212,191,.3);
}

.wsb-mock--price-colosseum {
	gap: 8px; padding: 14px 12px 12px; background: linear-gradient(180deg,#0c0a09,#431407); position: relative;
}
.wsb-mock--price-colosseum > strong {
	position: absolute; top: 4px; inset-inline-end: 10px; font-size: 14px;
	filter: drop-shadow(0 0 8px rgba(249,115,22,.5));
}
.wsb-mock--price-colosseum .wsb-mock__plans3 span {
	background: #1c1917; border: 2px solid rgba(249,115,22,.4); border-radius: 4px;
}
.wsb-mock--price-colosseum .wsb-mock__plans3 .is-hot {
	background: linear-gradient(160deg,#7c2d12,#f97316); border-color: #fbbf24;
	box-shadow: 0 0 18px rgba(249,115,22,.4); transform: translateY(-8px) scale(1.06);
}

.wsb-mock--price-candy {
	display: flex; flex-direction: column; gap: 8px; padding: 14px 12px;
	background: linear-gradient(145deg,#fdf4ff,#ffedd5); position: relative;
}
.wsb-mock--price-candy span {
	min-height: 28px; border-radius: 999px;
	background: linear-gradient(90deg,#f5d0fe,#fbcfe8); border: 2px solid #e879f9;
}
.wsb-mock--price-candy .hot {
	background: linear-gradient(90deg,#d946ef,#fb923c);
	border-color: #a21caf; box-shadow: 0 6px 14px rgba(217,70,239,.3);
}
.wsb-mock--price-candy b {
	align-self: center; font-size: 14px;
}


.wsb-mock--cta-aurora {
	gap: 8px; padding: 14px; align-items: flex-start;
	background: linear-gradient(160deg,#0f172a,#1e1b4b 50%,#0f766e);
}
.wsb-mock--cta-aurora > em { color: #c4b5fd; font-size: 11px; letter-spacing: .08em; }
.wsb-mock--cta-aurora strong { color: #ecfeff; font-size: 14px; font-weight: 800; max-width: 200px; }
.wsb-mock--cta-aurora .wsb-mock__cta-btn {
	background: linear-gradient(90deg,#8b5cf6,#14b8a6); color: #fff !important; border: 0;
}

.wsb-mock--cta-neon {
	gap: 7px; padding: 12px; align-items: center;
	background: linear-gradient(165deg,#020617,#312e81);
	border: 1px solid rgba(34,211,238,.35);
	box-shadow: inset 0 0 24px rgba(168,85,247,.2);
}
.wsb-mock--cta-neon > em {
	font-size: 9px; font-weight: 800; color: #67e8f9; letter-spacing: .14em;
	padding: 2px 8px; border-radius: 999px; border: 1px solid rgba(34,211,238,.45);
}
.wsb-mock--cta-neon strong { color: #f8fafc; font-size: 13px; font-weight: 800; }
.wsb-mock--cta-neon i {
	display: inline-block; width: 18px; height: 22px; margin: 0 2px; border-radius: 4px;
	background: rgba(34,211,238,.2); border: 1px solid rgba(232,121,249,.4);
}
.wsb-mock--cta-neon .wsb-mock__cta-btn {
	background: transparent; color: #67e8f9 !important; border: 1px solid #22d3ee;
	box-shadow: 0 0 12px rgba(34,211,238,.35);
}

.wsb-mock--cta-obsidian {
	gap: 8px; padding: 14px; background: #0a0a0a; flex-direction: row; align-items: center;
}
.wsb-mock--cta-obsidian > em {
	font-size: 10px; font-weight: 800; color: #fbbf24; padding: 3px 8px;
	border-radius: 4px; border: 1px dashed #c5a059;
}
.wsb-mock--cta-obsidian strong { color: #fde68a; font-size: 13px; flex: 1; }
.wsb-mock--cta-obsidian .flip {
	width: 44px; height: 64px; border-radius: 8px; display: grid; place-items: center;
	background: linear-gradient(165deg,#1c1917,#78350f); border: 1px solid #fbbf24;
	color: #fbbf24; font-size: 18px;
}

.wsb-mock--cta-tidal {
	gap: 8px; padding: 14px;
	background: linear-gradient(180deg,#042f2e,#0f766e);
}
.wsb-mock--cta-tidal strong { color: #ecfeff; font-size: 14px; font-weight: 800; }
.wsb-mock--cta-tidal .waves { display: flex; gap: 6px; }
.wsb-mock--cta-tidal .waves i {
	width: 28px; height: 10px; border-radius: 999px;
	background: rgba(45,212,191,.35); border: 1px solid rgba(153,246,228,.4);
}
.wsb-mock--cta-tidal .waves i:nth-child(2) { background: rgba(45,212,191,.7); transform: scaleY(1.4); }
.wsb-mock--cta-tidal .wsb-mock__cta-btn {
	background: #2dd4bf; color: #042f2e !important; border: 0; font-weight: 800;
}

.wsb-mock--cta-sakura {
	gap: 8px; padding: 14px;
	background: linear-gradient(145deg,#fff1f2,#fce7f3 50%,#ffedd5);
}
.wsb-mock--cta-sakura > em {
	font-size: 10px; font-weight: 800; color: #db2777; padding: 3px 10px;
	border-radius: 999px; background: rgba(219,39,119,.12);
}
.wsb-mock--cta-sakura strong { color: #9d174d; font-size: 14px; font-weight: 800; }
.wsb-mock--cta-sakura .steps { display: flex; gap: 6px; }
.wsb-mock--cta-sakura .steps b {
	width: 22px; height: 8px; border-radius: 999px; background: #fbcfe8;
}
.wsb-mock--cta-sakura .steps .hot { background: linear-gradient(90deg,#db2777,#fb923c); }


.wsb-mock--proof-neon {
	display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:12px; position:relative;
	background:linear-gradient(165deg,#020617,#312e81);
}
.wsb-mock--proof-neon span { min-height:56px; border-radius:8px; background:rgba(34,211,238,.15); border:1px solid rgba(34,211,238,.35); }
.wsb-mock--proof-neon .hot { background:linear-gradient(160deg,rgba(34,211,238,.45),rgba(232,121,249,.4)); box-shadow:0 0 14px rgba(232,121,249,.35); }
.wsb-mock--proof-neon em { position:absolute; top:6px; inset-inline-end:8px; font-size:9px; color:#67e8f9; letter-spacing:.12em; }

.wsb-mock--proof-gold {
	gap:8px; padding:12px; background:#0a0a0a; flex-direction:row; align-items:center;
}
.wsb-mock--proof-gold > strong { color:#fbbf24; font-size:22px; }
.wsb-mock--proof-gold .wsb-mock__bubble { flex:1; background:#171717; border:1px solid rgba(251,191,36,.35); border-radius:10px; padding:8px; }
.wsb-mock--proof-gold .wsb-mock__bubble p { color:#fde68a; font-size:12px; margin:0; }
.wsb-mock--proof-gold b { color:#fbbf24; font-size:16px; }

.wsb-mock--proof-aurora {
	flex-direction:row; gap:8px; padding:12px; background:linear-gradient(160deg,#0f172a,#0f766e); align-items:stretch;
}
.wsb-mock--proof-aurora .stat { width:56px; border-radius:16px; background:linear-gradient(145deg,#8b5cf6,#14b8a6); }
.wsb-mock--proof-aurora .bubble { flex:1; border-radius:18px; background:rgba(255,255,255,.1); border:1px solid rgba(167,139,250,.4); }

.wsb-mock--proof-obsidian {
	gap:8px; padding:14px; background:#09090b; align-items:center;
}
.wsb-mock--proof-obsidian p { color:#fde68a; font-size:13px; font-weight:700; margin:0; }
.wsb-mock--proof-obsidian .row { display:flex; gap:6px; }
.wsb-mock--proof-obsidian i { width:36px; height:28px; border-radius:6px; background:#171717; border:1px solid rgba(251,191,36,.3); }
.wsb-mock--proof-obsidian .hot { background:linear-gradient(90deg,#78350f,#fbbf24); }

.wsb-mock--proof-tidal {
	display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:12px;
	background:linear-gradient(180deg,#042f2e,#0f766e);
}
.wsb-mock--proof-tidal span { min-height:64px; border-radius:40% 60% 55% 45%/55% 40% 60% 45%; background:rgba(45,212,191,.3); border:1px solid rgba(153,246,228,.4); }
.wsb-mock--proof-tidal .hot { transform:translateY(-6px); background:rgba(45,212,191,.65); }

.wsb-mock--proof-sakura {
	gap:8px; padding:14px; background:linear-gradient(145deg,#fff1f2,#ffedd5); align-items:center;
}
.wsb-mock--proof-sakura .wsb-mock__bubble { background:#fff; border:1px solid #fbcfe8; border-radius:14px; padding:10px; }
.wsb-mock--proof-sakura .wsb-mock__bubble p { color:#9d174d; margin:0; font-size:12px; }
.wsb-mock--proof-sakura em { color:#db2777; font-size:11px; }

.wsb-mock--proof-cyber {
	display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:12px; position:relative; background:#020617;
}
.wsb-mock--proof-cyber span { min-height:52px; clip-path:polygon(10% 0,100% 0,90% 100%,0 100%); background:rgba(56,189,248,.15); border:1px solid rgba(168,85,247,.4); }
.wsb-mock--proof-cyber .hot { background:linear-gradient(120deg,rgba(56,189,248,.45),rgba(168,85,247,.4)); }
.wsb-mock--proof-cyber b { position:absolute; bottom:6px; inset-inline-start:8px; font-size:9px; color:#67e8f9; letter-spacing:.14em; }

.wsb-mock--proof-velvet {
	flex-direction:row; gap:8px; padding:12px; background:#1c1917;
}
.wsb-mock--proof-velvet .mag { flex:1.4; border-radius:12px; background:linear-gradient(165deg,#292524,#78350f); border:1px solid rgba(197,160,89,.4); min-height:88px; }
.wsb-mock--proof-velvet .q { flex:1; border-radius:12px; background:#0c0a09; border:1px dashed #c5a059; }

.wsb-mock--proof-ember {
	display:grid; grid-template-columns:auto 1fr 1fr 1fr; gap:6px; padding:12px; align-items:center;
	background:linear-gradient(180deg,#0c0a09,#431407);
}
.wsb-mock--proof-ember > strong { font-size:16px; }
.wsb-mock--proof-ember span { min-height:48px; background:#1c1917; border:2px solid rgba(249,115,22,.45); border-radius:4px; }
.wsb-mock--proof-ember .hot { background:linear-gradient(160deg,#7c2d12,#f97316); border-color:#fbbf24; transform:translateY(-4px); }

.wsb-mock--proof-crystal {
	display:grid; place-items:center; padding:16px; background:linear-gradient(165deg,#070816,#0c4a6e); position:relative; min-height:110px;
}
.wsb-mock--proof-crystal .core { width:34px; height:34px; border-radius:50%; background:radial-gradient(circle,#67e8f9,#a855f7); box-shadow:0 0 20px rgba(56,189,248,.5); z-index:2; }
.wsb-mock--proof-crystal i { position:absolute; width:16px; height:16px; border-radius:50%; background:#1e293b; border:2px solid #38bdf8; }
.wsb-mock--proof-crystal i:first-of-type { top:18px; inset-inline-start:24px; }
.wsb-mock--proof-crystal i.hot { top:22px; inset-inline-end:22px; background:#a855f7; border-color:#e879f9; }

.wsb-mock--proof-soft {
	display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:14px; background:#f8fafc;
}
.wsb-mock--proof-soft span { min-height:64px; border-radius:14px; background:#fff; border:1px solid #e2e8f0; }

.wsb-mock--proof-plain {
	flex-direction:row; gap:6px; padding:12px; background:#fff;
}
.wsb-mock--proof-plain .c { flex:1; min-height:72px; border-radius:12px; background:#f8fafc; border:1px solid #e2e8f0; }

.wsb-mock--proof-stars {
	gap:6px; padding:16px; background:#fafaf9; align-items:center; justify-content:center;
}
.wsb-mock--proof-stars em { color:#eab308; font-size:14px; letter-spacing:2px; }
.wsb-mock--proof-stars strong { color:#1c1917; font-size:20px; }

.wsb-mock--proof-banner {
	flex-direction:row; gap:6px; padding:14px 12px; background:#f1f5f9;
}
.wsb-mock--proof-banner b { flex:1; min-height:28px; border-radius:999px; background:#fff; border:1px solid #cbd5e1; }

.wsb-mock--proof-duo {
	flex-direction:row; gap:8px; padding:12px; background:#fff; align-items:center;
}
.wsb-mock--proof-duo em { color:#93003c; font-size:11px; }
.wsb-mock--proof-duo span { flex:1; min-height:56px; border-radius:12px; background:#fff4f8; border:1px solid #f9a8c4; }
.wsb-mock--proof-duo .hot { background:linear-gradient(145deg,#93003c,#f97316); border-color:#f97316; }


.wsb-mock--cta-ember {
	gap:7px; padding:12px; align-items:center;
	background:linear-gradient(180deg,#0c0a09,#7c2d12);
}
.wsb-mock--cta-ember > em { font-size:9px; font-weight:800; color:#fbbf24; padding:2px 8px; border:2px solid #f97316; }
.wsb-mock--cta-ember strong { color:#fed7aa; font-size:13px; font-weight:800; }
.wsb-mock--cta-ember i { display:inline-block; width:16px; height:22px; margin:0 2px; background:rgba(249,115,22,.35); border:1px solid #f97316; }

.wsb-mock--cta-crystal {
	display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; padding:12px; align-items:center;
	background:linear-gradient(165deg,#070816,#0c4a6e);
}
.wsb-mock--cta-crystal strong { grid-column:1/-1; color:#e0f2fe; font-size:12px; text-align:center; }
.wsb-mock--cta-crystal span { min-height:48px; border-radius:42% 58% 48% 52%/52% 42% 58% 48%; background:rgba(34,211,238,.25); border:1px solid rgba(168,85,247,.4); }
.wsb-mock--cta-crystal .hot { background:linear-gradient(145deg,rgba(34,211,238,.55),rgba(168,85,247,.45)); transform:translateY(-6px); }

.wsb-mock--cta-metro {
	gap:8px; padding:12px; background:#0b1220; align-items:center;
}
.wsb-mock--cta-metro .line { display:flex; gap:6px; }
.wsb-mock--cta-metro .line i { width:18px; height:18px; border-radius:50%; background:#1e293b; border:2px solid #334155; }
.wsb-mock--cta-metro .line .on { background:#38bdf8; border-color:#f97316; box-shadow:0 0 10px #38bdf8; }
.wsb-mock--cta-metro strong { color:#e2e8f0; font-size:13px; }

.wsb-mock--cta-velvet {
	gap:8px; padding:14px; background:linear-gradient(180deg,#0c0a09,#1c1917); align-items:flex-start;
}
.wsb-mock--cta-velvet > em { font-size:10px; color:#fbbf24; border:1px dashed #c5a059; padding:2px 8px; }
.wsb-mock--cta-velvet strong { color:#fde68a; font-size:13px; }
.wsb-mock--cta-velvet .wsb-mock__cta-btn { background:#c5a059; color:#0c0a09 !important; }

.wsb-mock--cta-orbit {
	display:grid; place-items:center; padding:14px; background:#050510; position:relative; min-height:110px;
}
.wsb-mock--cta-orbit .core { width:28px; height:28px; border-radius:50%; background:radial-gradient(circle,#67e8f9,#0284c7); box-shadow:0 0 16px rgba(56,189,248,.5); z-index:2; }
.wsb-mock--cta-orbit i { position:absolute; width:14px; height:14px; border-radius:50%; border:2px solid #38bdf8; background:#0f172a; }
.wsb-mock--cta-orbit i:first-of-type { top:16px; inset-inline-start:20px; }
.wsb-mock--cta-orbit i.hot { top:18px; inset-inline-end:18px; background:#a855f7; border-color:#e879f9; }
.wsb-mock--cta-orbit strong { position:absolute; bottom:8px; font-size:9px; color:#67e8f9; letter-spacing:.12em; }

.wsb-mock--cta-soft {
	gap:8px; padding:14px; background:#f8fafc; align-items:center; justify-content:center; flex-direction:row;
}
.wsb-mock--cta-soft strong { color:#334155; font-size:13px; }
.wsb-mock--cta-soft .wsb-mock__cta-btn { background:#94a3b8; color:#fff !important; border-radius:999px; }

.wsb-mock--cta-plain {
	gap:8px; padding:16px; background:#fff; align-items:center;
}
.wsb-mock--cta-plain strong { color:#140f18; font-size:13px; }
.wsb-mock--cta-plain .wsb-mock__cta-btn { background:#93003c; color:#fff !important; }

.wsb-mock--cta-mini {
	flex-direction:row; gap:10px; padding:10px 14px; background:#140f18; align-items:center; justify-content:space-between;
}
.wsb-mock--cta-mini strong { color:#fafaf9; font-size:12px; }
.wsb-mock--cta-mini .wsb-mock__cta-btn { background:#f97316; color:#fff !important; border-radius:999px; padding:4px 12px; font-size:11px; }

.wsb-mock--cta-split {
	flex-direction:row; gap:0; padding:0; background:#fafafa; overflow:hidden;
}
.wsb-mock--cta-split .a, .wsb-mock--cta-split .b { flex:1; padding:16px; display:grid; place-items:center; }
.wsb-mock--cta-split .a { background:#fff; border-inline-end:1px solid #e2e8f0; }
.wsb-mock--cta-split .a strong { color:#334155; font-size:13px; }
.wsb-mock--cta-split .b { background:#f1f5f9; }
.wsb-mock--cta-split .wsb-mock__cta-btn { background:#334155; color:#fff !important; }

.wsb-mock--cta-lite {
	gap:8px; padding:16px; background:#f1f5f9; align-items:center;
}
.wsb-mock--cta-lite strong { color:#0c4a6e; font-size:13px; }
.wsb-mock--cta-lite .wsb-mock__cta-btn { background:#0ea5e9; color:#fff !important; border-radius:999px; }

/* —— language switcher + tabs —— */
.lp-langs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	margin: 0 0 18px;
	padding: 10px 12px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: rgba(255,255,255,.82);
	box-shadow: 0 8px 24px rgba(20,15,24,.04);
}
.lp-langs__label {
	font-size: 12px;
	font-weight: 800;
	color: var(--muted);
	letter-spacing: .02em;
}
.lp-langs__row {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.lp-lang {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 11px;
	border-radius: 999px;
	border: 1px solid var(--line);
	background: #fff;
	color: #4b4453;
	font-size: 12px;
	font-weight: 800;
	text-decoration: none;
	transition: border-color .15s, background .15s, color .15s, transform .15s;
}
.lp-lang__flag {
	display: inline-grid;
	place-items: center;
	min-width: 26px;
	height: 22px;
	padding: 0 6px;
	border-radius: 8px;
	background: #140f18;
	color: #fff;
	font-size: 10px;
	letter-spacing: .04em;
}
.lp-lang:hover {
	border-color: var(--accent);
	color: var(--accent);
	transform: translateY(-1px);
}
.lp-lang.is-active {
	border-color: var(--accent);
	background: #fff4f8;
	color: var(--accent);
}
.lp-lang.is-active .lp-lang__flag {
	background: linear-gradient(135deg, var(--accent), var(--accent2));
}
.layouts-page.is-tabs .lp-cats {
	position: sticky;
	top: 0;
	z-index: 5;
	padding: 10px 0 4px;
	background: linear-gradient(180deg, rgba(250,247,248,.96), rgba(250,247,248,.88));
	backdrop-filter: blur(8px);
}
.layouts-page.is-tabs .lp-cat {
	cursor: pointer;
	border: 1px solid var(--line);
	background: var(--card);
	font: inherit;
}
.layouts-page.is-tabs .lp-panel[hidden] { display: none !important; }
.lp-panel__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 14px;
}
.lp-panel__head .lp-section__title { margin: 0; }
.lp-panel__count {
	margin: 0;
	font-size: 13px;
	font-weight: 700;
	color: var(--muted);
}
html[dir="ltr"] .lp-hero h1,
html[dir="ltr"] .lp-lead,
html[dir="ltr"] .lp-section__title {
	letter-spacing: -.01em;
}

/* —— Mega heroes (10) —— */
.wsb-mock--hero-nebula {
	flex-direction: row; gap: 10px; padding: 14px;
	background: linear-gradient(165deg,#050816,#1a1040 50%,#0c4a6e);
}
.wsb-mock--hero-nebula .wsb-mock__fusion-l { flex: 1.1; display: flex; flex-direction: column; gap: 6px; justify-content: center; }
.wsb-mock--hero-nebula .wsb-mock__fusion-l strong { color: #67e8f9; font-size: 16px; }
.wsb-mock--hero-nebula .wsb-mock__fusion-l em { color: #c084fc; font-size: 10px; letter-spacing: 1px; }
.wsb-mock--hero-nebula .wsb-mock__fusion-r { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.wsb-mock--hero-nebula .tick {
	height: 28px; border-radius: 8px;
	background: linear-gradient(90deg,#083344,#22d3ee); box-shadow: 0 0 14px rgba(34,211,238,.35);
}
.wsb-mock--hero-nebula .flip {
	height: 48px; border-radius: 10px; border: 1px solid rgba(168,85,247,.45);
	background: linear-gradient(145deg,rgba(168,85,247,.25),rgba(2,6,23,.8));
}

.wsb-mock--hero-aurora-rift {
	flex-direction: row; gap: 10px; padding: 12px;
	background:
		radial-gradient(circle at 20% 30%, rgba(56,189,248,.3), transparent 42%),
		radial-gradient(circle at 85% 70%, rgba(192,132,252,.28), transparent 40%),
		#0b1220;
}
.wsb-mock--hero-aurora-rift .wsb-mock__fusion-l { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.wsb-mock--hero-aurora-rift .wsb-mock__fusion-l strong { color: #7dd3fc; font-size: 15px; }
.wsb-mock--hero-aurora-rift .wsb-mock__fusion-l i {
	display: block; height: 8px; border-radius: 999px;
	background: rgba(255,255,255,.12);
}
.wsb-mock--hero-aurora-rift .wsb-mock__fusion-l i:last-child { width: 70%; background: rgba(56,189,248,.35); }
.wsb-mock--hero-aurora-rift .pane {
	flex: 1.1; min-height: 96px; border-radius: 14px;
	background: linear-gradient(160deg,rgba(56,189,248,.2),rgba(168,85,247,.25));
	border: 1px solid rgba(255,255,255,.15);
}

.wsb-mock--hero-obsidian {
	align-items: center; gap: 12px; padding: 14px;
	background: linear-gradient(180deg,#050505,#1c1917);
}
.wsb-mock--hero-obsidian > strong { color: #fbbf24; font-size: 28px; line-height: 1; }
.wsb-mock--hero-obsidian .circles { display: flex; gap: 8px; }
.wsb-mock--hero-obsidian .circles i {
	width: 36px; height: 36px; border-radius: 50%;
	background: #292524; border: 1px solid rgba(197,160,89,.4);
}
.wsb-mock--hero-obsidian .circles .hot {
	background: linear-gradient(145deg,#78350f,#fbbf24);
	box-shadow: 0 0 16px rgba(251,191,36,.4);
}

.wsb-mock--hero-phoenix {
	flex-direction: row; gap: 10px; padding: 14px; align-items: center;
	background: linear-gradient(180deg,#1c0a05,#7c2d12);
}
.wsb-mock--hero-phoenix .wsb-mock__fusion-l strong { color: #fdba74; font-size: 16px; }
.wsb-mock--hero-phoenix .tick {
	flex: 1; height: 34px; border-radius: 10px;
	background: linear-gradient(90deg,#9a3412,#f97316 50%,#fbbf24);
	box-shadow: 0 0 18px rgba(249,115,22,.4);
}

.wsb-mock--hero-crystal {
	align-items: center; gap: 12px; padding: 14px;
	background: linear-gradient(160deg,#070816,#083344);
}
.wsb-mock--hero-crystal > strong { font-size: 26px; filter: drop-shadow(0 0 10px rgba(34,211,238,.5)); }
.wsb-mock--hero-crystal .steps { display: flex; gap: 6px; flex: 1; }
.wsb-mock--hero-crystal .steps i {
	flex: 1; height: 12px; border-radius: 999px; background: rgba(255,255,255,.1);
}
.wsb-mock--hero-crystal .steps .on {
	background: linear-gradient(90deg,#22d3ee,#67e8f9);
	box-shadow: 0 0 12px rgba(34,211,238,.45);
}

.wsb-mock--hero-velvet {
	align-items: center; gap: 12px; padding: 14px;
	background: linear-gradient(155deg,#14060f,#2a0a1a);
}
.wsb-mock--hero-velvet > strong { color: #fda4af; font-size: 15px; }
.wsb-mock--hero-velvet .circles { display: flex; gap: 8px; }
.wsb-mock--hero-velvet .circles i {
	width: 34px; height: 34px; border-radius: 50%;
	background: #3f1d2a; border: 1px solid rgba(225,29,72,.35);
}
.wsb-mock--hero-velvet .circles .hot {
	background: linear-gradient(145deg,#9f1239,#fb7185);
	box-shadow: 0 0 14px rgba(225,29,72,.45);
}

.wsb-mock--hero-quantum {
	flex-direction: column; gap: 10px; padding: 12px;
	background: linear-gradient(160deg,#020617,#1e1b4b);
}
.wsb-mock--hero-quantum .bars { display: flex; flex-direction: column; gap: 5px; }
.wsb-mock--hero-quantum .bars b {
	display: block; height: 8px; border-radius: 999px; width: 70%;
	background: rgba(168,85,247,.25);
}
.wsb-mock--hero-quantum .bars b:nth-child(2) { width: 85%; }
.wsb-mock--hero-quantum .bars .hot {
	width: 95%;
	background: linear-gradient(90deg,#a855f7,#22d3ee);
}
.wsb-mock--hero-quantum .tabs { display: flex; gap: 6px; }
.wsb-mock--hero-quantum .tabs span {
	flex: 1; height: 22px; border-radius: 999px; background: #1e293b;
}
.wsb-mock--hero-quantum .tabs .on {
	background: linear-gradient(90deg,#a855f7,#22d3ee);
}

.wsb-mock--hero-tidal {
	flex-direction: row; gap: 8px; padding: 14px; align-items: center;
	background: linear-gradient(170deg,#042f2e,#0c4a6e);
}
.wsb-mock--hero-tidal > strong { color: #5eead4; font-size: 15px; min-width: 48px; }
.wsb-mock--hero-tidal .tick {
	flex: 1; height: 30px; border-radius: 999px;
	background: linear-gradient(90deg,#0f766e,#2dd4bf);
}
.wsb-mock--hero-tidal .flip {
	width: 42px; height: 42px; border-radius: 12px;
	border: 1px solid rgba(45,212,191,.4);
	background: rgba(8,51,68,.7);
}

.wsb-mock--hero-mirage {
	flex-direction: column; gap: 10px; padding: 12px;
	background: linear-gradient(165deg,#1c0a05,#44403c);
}
.wsb-mock--hero-mirage > strong { color: #fbbf24; font-size: 15px; }
.wsb-mock--hero-mirage .plan { display: flex; gap: 6px; }
.wsb-mock--hero-mirage .plan b {
	flex: 1; height: 54px; border-radius: 10px;
	background: rgba(0,0,0,.35); border: 1px solid rgba(245,158,11,.25);
}
.wsb-mock--hero-mirage .plan .hot {
	background: linear-gradient(160deg,#78350f,#f59e0b);
	border-color: #fbbf24;
	transform: scale(1.05);
	box-shadow: 0 0 14px rgba(245,158,11,.35);
}

.wsb-mock--hero-prism {
	flex-direction: column; gap: 10px; padding: 12px;
	background: linear-gradient(155deg,#0f0a1a,#4c1d95);
}
.wsb-mock--hero-prism > strong { color: #e9d5ff; font-size: 15px; }
.wsb-mock--hero-prism .steps { display: flex; gap: 6px; }
.wsb-mock--hero-prism .steps i {
	flex: 1; height: 40px; border-radius: 12px;
	background: rgba(255,255,255,.08); border: 1px solid rgba(192,132,252,.25);
}
.wsb-mock--hero-prism .steps .on {
	background: linear-gradient(145deg,rgba(192,132,252,.45),rgba(56,189,248,.35));
	border-color: #c084fc;
	box-shadow: 0 0 16px rgba(192,132,252,.35);
}

/* WooCommerce layout group subtabs */
.lp-subcats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;
}
.lp-subcat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid var(--line, #e5e7eb);
	background: rgba(255,255,255,.72);
	color: #4b4453;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
}
.lp-subcat span {
	min-width: 18px;
	padding: 1px 6px;
	border-radius: 999px;
	background: #f3f0f2;
	font-size: 11px;
}
.lp-subcat.is-active,
.lp-subcat:hover {
	border-color: var(--accent, #93003c);
	background: #fff4f8;
	color: var(--accent, #93003c);
}
.lp-subcat.is-active span { background: var(--accent, #93003c); color: #fff; }

/* WooCommerce mock thumbs */
.wsb-mock--wc-shelf,
.wsb-mock--wc-noir,
.wsb-mock--wc-sale,
.wsb-mock--wc-neon,
.wsb-mock--wc-polaroid,
.wsb-mock--wc-orbit,
.wsb-mock--wc-mosaic,
.wsb-mock--wc-banners,
.wsb-mock--wc-dual,
.wsb-mock--wc-hall {
	display: grid;
	gap: 6px;
	padding: 10px;
	min-height: 118px;
	border-radius: 14px;
	box-sizing: border-box;
	overflow: hidden;
}
.wsb-mock--wc-shelf {
	grid-template-columns: repeat(3, 1fr);
	background: #fffaf8;
}
.wsb-mock--wc-shelf span {
	display: block; height: 78px; border-radius: 10px;
	background: linear-gradient(160deg, #f3e7ea, #fff);
	border: 1px solid rgba(147,0,60,.12);
}
.wsb-mock--wc-shelf .hot {
	background: linear-gradient(160deg, #93003c, #c5a059);
}
.wsb-mock--wc-noir {
	grid-template-columns: repeat(3, 1fr);
	background: #0a0810;
	position: relative;
}
.wsb-mock--wc-noir span {
	display: block; height: 86px; border-radius: 12px;
	background: linear-gradient(180deg, #2a2038, #120e18);
}
.wsb-mock--wc-noir .hot { box-shadow: 0 0 0 1px rgba(251,191,36,.35); }
.wsb-mock--wc-noir em {
	position: absolute; inset-inline-end: 12px; inset-block-start: 10px;
	font-size: 10px; font-style: normal; font-weight: 800; color: #fbbf24;
}
.wsb-mock--wc-sale {
	grid-template-columns: repeat(3, 1fr);
	background: #fff7ed;
	position: relative;
}
.wsb-mock--wc-sale span {
	display: block; height: 78px; border-radius: 18px 18px 40% 40% / 18px 18px 28% 28%;
	background: #ffe4e6;
}
.wsb-mock--wc-sale .hot { background: linear-gradient(160deg, #e11d48, #fb7185); }
.wsb-mock--wc-sale b {
	position: absolute; inset-inline-start: 10px; inset-block-start: 8px;
	background: #e11d48; color: #fff; font-size: 10px; padding: 2px 7px; border-radius: 999px;
}
.wsb-mock--wc-neon {
	grid-template-columns: repeat(3, 1fr);
	background: #050510;
	position: relative;
}
.wsb-mock--wc-neon span {
	display: block; height: 72px; border-radius: 8px;
	border: 1px dashed #22d3ee; background: #0b1020;
	transform: translateY(0);
}
.wsb-mock--wc-neon span:nth-child(2) { transform: translateY(10px); }
.wsb-mock--wc-neon .hot { box-shadow: 0 0 14px rgba(168,85,247,.45); border-color: #a855f7; }
.wsb-mock--wc-neon em {
	position: absolute; inset-inline-start: 10px; inset-block-end: 8px;
	color: #22d3ee; font-size: 10px; font-style: normal; font-weight: 800;
}
.wsb-mock--wc-polaroid {
	grid-template-columns: repeat(3, 1fr);
	background: #f5f0e8;
	align-items: end;
}
.wsb-mock--wc-polaroid span {
	display: block; height: 70px; border-radius: 4px;
	background: #fff; border: 1px solid #e7e5e4;
	box-shadow: 0 8px 16px rgba(28,25,23,.08);
	padding-bottom: 14px;
	background-clip: content-box;
	background-image: linear-gradient(145deg, #ddd6fe, #fae8ff);
}
.wsb-mock--wc-polaroid .hot { transform: rotate(-3deg); }
.wsb-mock--wc-orbit {
	grid-template-columns: repeat(4, 1fr);
	background: #faf7ff;
	align-items: center;
	justify-items: center;
}
.wsb-mock--wc-orbit i {
	width: 42px; height: 42px; border-radius: 50%;
	background: linear-gradient(145deg, #ede9fe, #fff);
	border: 2px solid #c4b5fd;
	display: block;
}
.wsb-mock--wc-orbit .hot {
	background: linear-gradient(145deg, #7c3aed, #c4b5fd);
	border-color: #7c3aed;
}
.wsb-mock--wc-mosaic {
	grid-template-columns: 1.2fr 1fr;
	grid-template-rows: 1fr 1fr;
	background: #111827;
}
.wsb-mock--wc-mosaic span { display: block; border-radius: 10px; min-height: 40px; }
.wsb-mock--wc-mosaic .a { grid-row: span 2; background: linear-gradient(160deg,#93003c,#1f2937); min-height: 88px; }
.wsb-mock--wc-mosaic .b { background: #374151; }
.wsb-mock--wc-mosaic .c { background: #1f2937; }
.wsb-mock--wc-mosaic .hot { box-shadow: inset 0 0 0 1px rgba(251,191,36,.4); }
.wsb-mock--wc-banners {
	grid-template-columns: 1fr;
	background: #fff;
}
.wsb-mock--wc-banners span {
	display: block; height: 40px; border-radius: 12px;
	background: linear-gradient(90deg, #f3e7ea 35%, #fff);
	border: 1px solid rgba(147,0,60,.1);
}
.wsb-mock--wc-banners .hot {
	background: linear-gradient(90deg, #93003c 28%, #c5a059);
}
.wsb-mock--wc-dual {
	grid-template-columns: .9fr 1.1fr;
	background: #fffaf8;
}
.wsb-mock--wc-dual .left,
.wsb-mock--wc-dual .right { display: grid; gap: 6px; }
.wsb-mock--wc-dual .left i {
	display: block; height: 34px; border-radius: 10px; background: #f3e7ea;
}
.wsb-mock--wc-dual .right {
	grid-template-columns: 1fr 1fr;
}
.wsb-mock--wc-dual .right span {
	display: block; height: 74px; border-radius: 10px; background: #fff; border: 1px solid #eee;
}
.wsb-mock--wc-dual .hot { background: linear-gradient(160deg,#93003c,#c5a059); }
.wsb-mock--wc-hall {
	grid-template-rows: auto 1fr;
	background: #0c0a09;
}
.wsb-mock--wc-hall .tiles {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px;
}
.wsb-mock--wc-hall .tiles i {
	display: block; height: 28px; border-radius: 8px; background: #1c1917;
}
.wsb-mock--wc-hall .tiles .hot { background: linear-gradient(135deg,#fbbf24,#93003c); }
.wsb-mock--wc-hall .mag {
	display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 5px; margin-top: 6px;
}
.wsb-mock--wc-hall .mag span {
	display: block; height: 54px; border-radius: 10px; background: #1c1917;
	border: 1px solid rgba(251,191,36,.2);
}
.wsb-mock--wc-hall .mag .hot { background: linear-gradient(160deg,#b45309,#1c1917); }

.wsb-mock--wc-aurora,.wsb-mock--wc-royal,.wsb-mock--wc-ocean,.wsb-mock--wc-ticket,.wsb-mock--wc-ribbon,.wsb-mock--wc-frost,.wsb-mock--wc-brutal,.wsb-mock--wc-mint,.wsb-mock--wc-diamond,.wsb-mock--wc-sunset{display:grid;gap:6px;padding:10px;min-height:118px;border-radius:14px;box-sizing:border-box;overflow:hidden}
.wsb-mock--wc-aurora{grid-template-columns:1fr 1fr 1fr;background:#070816}
.wsb-mock--wc-aurora span{display:block;border-radius:14px;background:linear-gradient(160deg,#312e81,#0f172a)}
.wsb-mock--wc-aurora span:nth-child(1){height:92px}.wsb-mock--wc-aurora span:nth-child(2){height:64px;margin-top:14px}.wsb-mock--wc-aurora span:nth-child(3){height:78px;margin-top:8px}
.wsb-mock--wc-aurora .hot{background:linear-gradient(160deg,#7c3aed,#22d3ee);box-shadow:0 0 18px rgba(34,211,238,.35)}
.wsb-mock--wc-royal{grid-template-columns:1.35fr 1fr 1fr;background:#140b24;position:relative}
.wsb-mock--wc-royal span{display:block;height:78px;border-radius:10px;border:2px double #c5a059;background:#1e1235}
.wsb-mock--wc-royal .hot{background:linear-gradient(160deg,#4c1d95,#c5a059)}
.wsb-mock--wc-royal strong{position:absolute;inset-inline-start:12px;inset-block-start:8px;color:#fbbf24;font-size:14px;z-index:2}
.wsb-mock--wc-ocean{grid-template-columns:1fr;background:#ecfeff}
.wsb-mock--wc-ocean span{display:block;height:28px;border-radius:0 0 40% 40%/0 0 28% 28%;background:linear-gradient(90deg,#bae6fd 40%,#fff)}
.wsb-mock--wc-ocean .hot{background:linear-gradient(90deg,#0369a1,#38bdf8)}
.wsb-mock--wc-ticket{grid-template-columns:repeat(3,1fr);background:#fff1f2}
.wsb-mock--wc-ticket span{display:block;height:78px;border-radius:14px;border:1px dashed #fb7185;background:#fff}
.wsb-mock--wc-ticket .hot{background:linear-gradient(160deg,#e11d48,#fb7185);border-style:solid}
.wsb-mock--wc-ribbon{grid-template-columns:repeat(3,1fr);background:#1c1917;position:relative}
.wsb-mock--wc-ribbon span{display:block;height:78px;border-radius:12px;border:2px double #d97706;background:#292524}
.wsb-mock--wc-ribbon .hot{background:linear-gradient(160deg,#b45309,#fbbf24)}
.wsb-mock--wc-ribbon b{position:absolute;inset-inline-end:14px;inset-block-start:6px;width:34px;height:16px;background:#fbbf24;border-radius:4px;transform:rotate(8deg);z-index:2}
.wsb-mock--wc-frost{grid-template-columns:repeat(3,1fr);background:#f1f5f9}
.wsb-mock--wc-frost span{display:block;height:78px;border-radius:18px;background:rgba(255,255,255,.8);border:1px solid #e2e8f0;backdrop-filter:blur(2px)}
.wsb-mock--wc-frost .hot{background:linear-gradient(160deg,#cbd5e1,#fff)}
.wsb-mock--wc-brutal{grid-template-columns:1fr;background:#f4f0e8;max-width:70%;margin-inline:auto}
.wsb-mock--wc-brutal span{display:block;height:40px;border:3px solid #111827;background:#fff;box-shadow:4px 4px 0 #111827}
.wsb-mock--wc-brutal .hot{background:#f59e0b}
.wsb-mock--wc-mint{grid-template-columns:repeat(4,1fr);background:#f0fdf4;align-items:center;justify-items:center}
.wsb-mock--wc-mint i{display:block;width:36px;height:48px;border-radius:70% 30% 70% 30%/30% 70% 30% 70%;background:#dcfce7}
.wsb-mock--wc-mint .hot{background:linear-gradient(160deg,#15803d,#86efac)}
.wsb-mock--wc-diamond{grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;background:#fafaf9}
.wsb-mock--wc-diamond span{display:block;border-radius:0;border:2px solid #1c1917;background:#fff;min-height:40px}
.wsb-mock--wc-diamond .wide{grid-row:span 2;min-height:88px;clip-path:polygon(8% 0,100% 0,92% 100%,0 100%)}
.wsb-mock--wc-diamond .hot{background:#1c1917}
.wsb-mock--wc-sunset{grid-template-columns:repeat(3,1fr);background:#431407;position:relative}
.wsb-mock--wc-sunset span{display:block;height:70px;border-radius:0 0 40% 40%/0 0 28% 28%;background:#7c2d12;transform:translateY(0)}
.wsb-mock--wc-sunset span:nth-child(2){transform:translateY(12px)}
.wsb-mock--wc-sunset .hot{background:linear-gradient(160deg,#ea580c,#fbbf24)}
.wsb-mock--wc-sunset em{position:absolute;inset-inline-start:10px;inset-block-end:8px;color:#fdba74;font-size:10px;font-style:normal;font-weight:800}

.wsb-mock--wc-organic{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;min-height:118px;border-radius:14px;box-sizing:border-box;overflow:hidden;background:#fff;align-items:center}
.wsb-mock--wc-organic span{display:block;height:88px;border:3px solid #1e1b4b;background:linear-gradient(160deg,#e11d48,#fb7185);border-radius:42% 58% 48% 52%/38% 42% 58% 62%;box-shadow:0 8px 18px rgba(30,27,75,.18)}
.wsb-mock--wc-organic .hot{border-radius:55% 45% 52% 48%/45% 55% 40% 60%;background:linear-gradient(160deg,#be123c,#fda4af)}
/* Fantasy WC thumbs — must override .wsb-mock{display:flex} */
.wsb-mock--wc-fantasy,
.wsb-mock--wc-fantasy-fire,
.wsb-mock--wc-fantasy-orbit,
.wsb-mock--wc-fantasy-violet,
.wsb-mock--wc-fantasy-matrix,
.wsb-mock--wc-fantasy-cyber,
.wsb-mock--wc-fantasy-ribbon,
.wsb-mock--wc-fantasy-dual,
.wsb-mock--wc-fantasy-future{
	display:grid!important;
	gap:8px;
	padding:12px!important;
	min-height:168px;
	width:100%;
	border-radius:0;
	box-sizing:border-box;
	overflow:hidden;
	align-items:stretch;
	justify-items:stretch;
	flex-direction:unset!important;
}
.wsb-mock--wc-fantasy{grid-template-columns:1fr 1fr 1fr;background:linear-gradient(145deg,#0b0614,#04140c 55%,#0b1020);align-items:end}
.wsb-mock--wc-fantasy > span,
.wsb-mock--wc-fantasy-fire > span,
.wsb-mock--wc-fantasy-orbit > span,
.wsb-mock--wc-fantasy-violet > span,
.wsb-mock--wc-fantasy-matrix > span,
.wsb-mock--wc-fantasy-cyber > span,
.wsb-mock--wc-fantasy-ribbon > span,
.wsb-mock--wc-fantasy-dual > span,
.wsb-mock--wc-fantasy-future > span{
	display:block!important;
	min-height:88px;
	height:100%;
	width:100%;
	box-sizing:border-box;
}
.wsb-mock--wc-fantasy .a{border:3px solid #1e1b4b;background:linear-gradient(180deg,#111827 42%,#e11d48 42%);border-radius:48% 52% 46% 54%/36% 48% 52% 64%;box-shadow:0 8px 16px rgba(225,29,72,.35);min-height:96px}
.wsb-mock--wc-fantasy .b{border:2px solid #a855f7;background:radial-gradient(circle at 50% 20%,#4c1d95,#12081f);border-radius:18px;box-shadow:0 0 16px rgba(168,85,247,.55);min-height:96px}
.wsb-mock--wc-fantasy .c{border:2px solid #22c55e;background:radial-gradient(120% 80% at 50% 0%,#14532d,#04140c);border-radius:28px;box-shadow:0 0 16px rgba(34,197,94,.45);min-height:96px}

.wsb-mock--wc-fantasy-fire{grid-template-columns:1fr 1fr;background:#fff;gap:12px;align-items:center}
.wsb-mock--wc-fantasy-fire > span{border:4px solid #1e1b4b;background:linear-gradient(180deg,#0f172a 46%,#e11d48 46%);border-radius:48% 52% 46% 54%/36% 48% 52% 64%;box-shadow:0 10px 20px rgba(30,27,75,.2);min-height:110px}
.wsb-mock--wc-fantasy-fire > span.hot{border-radius:54% 46% 58% 42%/48% 36% 64% 52%;background:linear-gradient(180deg,#111827 46%,#be123c 46%)}

.wsb-mock--wc-fantasy-orbit{grid-template-columns:1fr 1fr 1fr;background:#fafaf9;gap:10px;align-items:end}
.wsb-mock--wc-fantasy-orbit > span{background:#fff;border-radius:14px;box-shadow:0 10px 22px rgba(15,23,42,.08);overflow:hidden;position:relative;min-height:108px}
.wsb-mock--wc-fantasy-orbit > span::before{content:"";display:block;height:62%;background:radial-gradient(circle at 20% 20%,rgba(251,191,36,.35),transparent 40%),radial-gradient(circle at 80% 30%,rgba(59,130,246,.28),transparent 42%),#0b1020;border-radius:14px 14px 40% 40%/14px 14px 22% 22%}
.wsb-mock--wc-fantasy-orbit > span::after{content:"تخفيض";position:absolute;top:10px;inset-inline-start:0;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;font-size:9px;font-weight:800;padding:3px 8px;transform:skewX(-12deg)}
.wsb-mock--wc-fantasy-orbit > span.hot::after{content:"−30%"}

.wsb-mock--wc-fantasy-violet{grid-template-columns:1fr 1fr 1fr;background:linear-gradient(160deg,#0b0614,#1a0b2e);gap:10px}
.wsb-mock--wc-fantasy-violet > span{border:2px solid #a855f7;border-radius:18px;background:radial-gradient(circle at 50% 0%,#4c1d95,#12081f 70%);box-shadow:0 0 18px rgba(168,85,247,.45);min-height:108px}
.wsb-mock--wc-fantasy-violet > span.hot{border-color:#c084fc;box-shadow:0 0 22px rgba(192,132,252,.55)}

.wsb-mock--wc-fantasy-matrix{grid-template-columns:1fr 1fr 1fr;background:radial-gradient(120% 80% at 50% 0%,#14532d,#04140c 60%,#020617);gap:10px;align-items:stretch}
.wsb-mock--wc-fantasy-matrix > span{border:2px solid #22c55e;border-radius:28px;background:radial-gradient(120% 80% at 50% 0%,#166534,#04140c);box-shadow:0 0 18px rgba(34,197,94,.4);min-height:112px}
.wsb-mock--wc-fantasy-matrix > span.hot{border-color:#4ade80;box-shadow:0 0 22px rgba(74,222,128,.5)}

.wsb-mock--wc-fantasy-cyber{grid-template-columns:1fr 1fr 1fr;background:#020617;gap:10px;align-items:center}
.wsb-mock--wc-fantasy-cyber > span{border:2px solid #c084fc;background:radial-gradient(circle at 40% 20%,#5b21b6,#020617);border-radius:44% 56% 60% 40%/50% 46% 54% 50%;box-shadow:0 0 16px rgba(192,132,252,.4);min-height:100px;transform:rotate(-2deg)}
.wsb-mock--wc-fantasy-cyber > span.hot{transform:rotate(3deg);border-color:#22d3ee;box-shadow:0 0 16px rgba(34,211,238,.4)}

.wsb-mock--wc-fantasy-ribbon{grid-template-columns:1fr 1fr 1fr;background:#fff7ed;gap:10px;align-items:end}
.wsb-mock--wc-fantasy-ribbon > span{background:#fff;border-radius:16px;box-shadow:0 10px 22px rgba(154,52,18,.1);overflow:hidden;position:relative;min-height:108px}
.wsb-mock--wc-fantasy-ribbon > span::before{content:"";display:block;height:58%;background:linear-gradient(135deg,#1c1917,#292524);border-radius:16px 16px 55% 55%/16px 16px 28% 28%}
.wsb-mock--wc-fantasy-ribbon > span::after{content:"تخفيض";position:absolute;top:8px;inset-inline-end:6px;background:#93003c;color:#fff;font-size:9px;font-weight:800;padding:3px 7px;border-radius:6px;transform:rotate(8deg)}

.wsb-mock--wc-fantasy-dual{grid-template-columns:1fr 1fr;background:#0a0a0a;gap:12px;align-items:center}
.wsb-mock--wc-fantasy-dual > span:first-child{border:4px solid #1e1b4b;background:linear-gradient(180deg,#111827 45%,#e11d48 45%);border-radius:48% 52% 46% 54%/36% 48% 52% 64%;min-height:112px;box-shadow:0 0 18px rgba(225,29,72,.35)}
.wsb-mock--wc-fantasy-dual > span:last-child{border:2px solid #22c55e;background:radial-gradient(120% 80% at 50% 0%,#14532d,#04140c);border-radius:28px;min-height:112px;box-shadow:0 0 18px rgba(34,197,94,.4)}

.wsb-mock--wc-fantasy-future{grid-template-columns:1.35fr 1fr 1fr;background:linear-gradient(180deg,#022c22,#04140c);gap:8px;align-items:stretch}
.wsb-mock--wc-fantasy-future > span{border:2px solid #22c55e;border-radius:26px;background:radial-gradient(120% 80% at 50% 0%,#166534,#04140c);box-shadow:0 0 16px rgba(34,197,94,.35);min-height:108px}
.wsb-mock--wc-fantasy-future > span.wide{min-height:128px;border-color:#a855f7;box-shadow:0 0 18px rgba(168,85,247,.35)}

.wsb-mock--wc-showroom{
	display:grid!important;
	grid-template-columns:1.4fr 1fr 1fr;
	gap:8px;
	padding:12px!important;
	min-height:168px;
	background:
		radial-gradient(80% 60% at 70% 40%,rgba(168,85,247,.35),transparent 55%),
		radial-gradient(60% 50% at 20% 70%,rgba(34,211,238,.22),transparent 50%),
		linear-gradient(160deg,#0a0a12,#1a1030 55%,#0b1020);
	align-items:stretch;
	flex-direction:unset!important;
	overflow:hidden;
	box-sizing:border-box;
}
.wsb-mock--wc-showroom > span{
	display:block!important;
	min-height:100px;
	border-radius:14px;
	border:1px solid rgba(168,85,247,.55);
	background:linear-gradient(180deg,rgba(30,20,60,.85),rgba(10,12,20,.9));
	box-shadow:0 0 16px rgba(168,85,247,.35);
	position:relative;
	overflow:hidden;
}
.wsb-mock--wc-showroom > span::before{
	content:"";
	display:block;
	height:58%;
	background:linear-gradient(135deg,#22d3ee,#a855f7 55%,#312e81);
	opacity:.85;
}
.wsb-mock--wc-showroom > span.wide{min-height:120px;box-shadow:0 0 22px rgba(168,85,247,.5)}
.wsb-mock--wc-showroom > span.hot{border-color:rgba(34,211,238,.7);box-shadow:0 0 18px rgba(34,211,238,.45)}
.wsb-mock--wc-showroom > span.hot::before{background:linear-gradient(135deg,#a855f7,#22d3ee)}


.wsb-mock--hero-travel{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#1c1410;
	background-size:cover;
	background-position:center 55%;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-travel .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-travel .sky em{font-style:normal;font-size:10px;color:rgba(254,243,199,.92);letter-spacing:.4px}
.wsb-mock--hero-travel .sky strong{font-size:18px;color:#fffbeb;line-height:1.2;text-shadow:0 2px 10px rgba(28,20,16,.35)}
.wsb-mock--hero-travel .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#fde68a,#f59e0b);box-shadow:0 0 14px rgba(251,191,36,.55);margin-top:6px}
.wsb-mock--hero-travel .bags{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px}
.wsb-mock--hero-travel .bags i{display:block;width:26px;height:34px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#94a3b8,#64748b);box-shadow:0 3px 8px rgba(0,0,0,.4)}
.wsb-mock--hero-travel .bags i:nth-child(1){height:42px;width:20px;background:linear-gradient(180deg,#e2e8f0,#94a3b8)}
.wsb-mock--hero-travel .bags i.hot{height:38px;width:30px;background:linear-gradient(180deg,#60a5fa,#1e3a8a);box-shadow:0 0 14px rgba(96,165,250,.5)}
.wsb-mock--hero-travel .bags i:nth-child(3){height:28px;width:18px;background:linear-gradient(180deg,#fda4af,#9f1239)}

.wsb-mock--hero-screens{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#0a0a12;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-screens .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-screens .sky em{font-style:normal;font-size:10px;color:rgba(196,181,253,.92);letter-spacing:.4px}
.wsb-mock--hero-screens .sky strong{font-size:18px;color:#f5f3ff;line-height:1.2;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.wsb-mock--hero-screens .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#a855f7,#22d3ee);box-shadow:0 0 16px rgba(168,85,247,.55);margin-top:6px}
.wsb-mock--hero-screens .monitors{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.65}
.wsb-mock--hero-screens .monitors i{display:block;width:34px;height:22px;border-radius:4px;background:linear-gradient(135deg,#22d3ee,#a855f7);box-shadow:0 0 12px rgba(34,211,238,.45)}
.wsb-mock--hero-screens .monitors i:nth-child(1){width:26px;height:16px}
.wsb-mock--hero-screens .monitors i.hot{width:44px;height:28px;box-shadow:0 0 18px rgba(168,85,247,.55)}
.wsb-mock--hero-screens .monitors i:nth-child(3){width:24px;height:14px;background:linear-gradient(135deg,#a855f7,#312e81)}

.wsb-mock--hero-fashion{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#fdf2f8;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-fashion .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-fashion .sky em{font-style:normal;font-size:10px;color:#9d174d;letter-spacing:.4px}
.wsb-mock--hero-fashion .sky strong{font-size:18px;color:#3f1d2e;line-height:1.2}
.wsb-mock--hero-fashion .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#db2777,#f9a8d4);box-shadow:0 0 14px rgba(219,39,119,.4);margin-top:6px}
.wsb-mock--hero-fashion .rack{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.5}
.wsb-mock--hero-fashion .rack i{display:block;width:16px;height:34px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#f9a8d4,#db2777)}
.wsb-mock--hero-fashion .rack i:nth-child(1){height:26px;background:linear-gradient(180deg,#fce7f3,#be185d)}
.wsb-mock--hero-fashion .rack i.hot{width:22px;height:40px;background:linear-gradient(180deg,#fda4af,#9d174d);box-shadow:0 0 12px rgba(219,39,119,.4)}
.wsb-mock--hero-fashion .rack i:nth-child(3){height:28px;background:linear-gradient(180deg,#fbcfe8,#db2777)}

.wsb-mock--hero-mens{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#171717;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-mens .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-mens .sky em{font-style:normal;font-size:10px;color:#d6b48a;letter-spacing:.4px}
.wsb-mock--hero-mens .sky strong{font-size:18px;color:#fafafa;line-height:1.2}
.wsb-mock--hero-mens .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c4a574,#e7d3b0);box-shadow:0 0 14px rgba(196,165,116,.4);margin-top:6px}
.wsb-mock--hero-mens .rack{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.5}
.wsb-mock--hero-mens .rack i{display:block;width:16px;height:34px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#a3a3a3,#262626)}
.wsb-mock--hero-mens .rack i:nth-child(1){height:26px;background:linear-gradient(180deg,#e5e5e5,#525252)}
.wsb-mock--hero-mens .rack i.hot{width:22px;height:40px;background:linear-gradient(180deg,#e7d3b0,#8a6a42);box-shadow:0 0 12px rgba(196,165,116,.4)}
.wsb-mock--hero-mens .rack i:nth-child(3){height:28px;background:linear-gradient(180deg,#737373,#171717)}

.wsb-mock--hero-live-fashion{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#fff7fb;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-live-fashion .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-live-fashion .sky em{font-style:normal;font-size:10px;color:#be185d;letter-spacing:.5px;font-weight:800}
.wsb-mock--hero-live-fashion .sky strong{font-size:18px;color:#4a1d2e;line-height:1.2}
.wsb-mock--hero-live-fashion .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#ec4899,#f9a8d4);box-shadow:0 0 14px rgba(236,72,153,.4);margin-top:6px}
.wsb-mock--hero-live-fashion .rack{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.5}
.wsb-mock--hero-live-fashion .rack i{display:block;width:16px;height:34px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#f9a8d4,#ec4899)}
.wsb-mock--hero-live-fashion .rack i:nth-child(1){height:26px;background:linear-gradient(180deg,#fce7f3,#db2777)}
.wsb-mock--hero-live-fashion .rack i.hot{width:22px;height:40px;background:linear-gradient(180deg,#fbcfe8,#be185d);box-shadow:0 0 12px rgba(236,72,153,.4)}
.wsb-mock--hero-live-fashion .rack i:nth-child(3){height:28px;background:linear-gradient(180deg,#fde68a,#f59e0b)}

.wsb-mock--hero-arch-fashion{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#faf6f1;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-arch-fashion .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-arch-fashion .sky em{font-style:normal;font-size:10px;color:#9a6b5a;letter-spacing:.4px}
.wsb-mock--hero-arch-fashion .sky strong{font-size:18px;color:#4a342c;line-height:1.2}
.wsb-mock--hero-arch-fashion .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c9a27e,#e8c9b0);box-shadow:0 0 14px rgba(201,162,126,.4);margin-top:6px}
.wsb-mock--hero-arch-fashion .rack{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.48}
.wsb-mock--hero-arch-fashion .rack i{display:block;width:16px;height:34px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#f5e6d8,#c9a27e)}
.wsb-mock--hero-arch-fashion .rack i:nth-child(1){height:26px;background:linear-gradient(180deg,#fff,#d4b89a)}
.wsb-mock--hero-arch-fashion .rack i.hot{width:22px;height:40px;background:linear-gradient(180deg,#f3d5c4,#9a6b5a);box-shadow:0 0 12px rgba(201,162,126,.4)}
.wsb-mock--hero-arch-fashion .rack i:nth-child(3){height:28px;background:linear-gradient(180deg,#fce7f3,#d8a7b1)}

.wsb-mock--hero-events{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#080814;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-events .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-events .sky em{font-style:normal;font-size:10px;color:#fbbf24;letter-spacing:.4px}
.wsb-mock--hero-events .sky strong{font-size:18px;color:#f8fafc;line-height:1.2;text-shadow:0 2px 12px rgba(0,0,0,.55)}
.wsb-mock--hero-events .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f59e0b,#a855f7);box-shadow:0 0 16px rgba(245,158,11,.5);margin-top:6px}
.wsb-mock--hero-events .lights{display:flex;align-items:flex-end;justify-content:center;gap:10px;height:48px;opacity:.75}
.wsb-mock--hero-events .lights i{display:block;width:7px;height:34px;border-radius:4px;background:linear-gradient(180deg,#22d3ee,transparent);box-shadow:0 0 12px rgba(34,211,238,.5)}
.wsb-mock--hero-events .lights i:nth-child(1){height:26px;background:linear-gradient(180deg,#a855f7,transparent)}
.wsb-mock--hero-events .lights i.hot{width:9px;height:42px;background:linear-gradient(180deg,#fbbf24,transparent);box-shadow:0 0 18px rgba(251,191,36,.55)}
.wsb-mock--hero-events .lights i:nth-child(3){height:24px;background:linear-gradient(180deg,#f97316,transparent)}

.wsb-mock--hero-kids{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#fffaf5;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-kids .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-kids .sky em{font-style:normal;font-size:10px;color:#0284c7;letter-spacing:.4px}
.wsb-mock--hero-kids .sky strong{font-size:18px;color:#1e3a5f;line-height:1.2}
.wsb-mock--hero-kids .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#0ea5e9,#f9a8d4);box-shadow:0 0 14px rgba(14,165,233,.4);margin-top:6px}
.wsb-mock--hero-kids .rack{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.5}
.wsb-mock--hero-kids .rack i{display:block;width:16px;height:34px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#bae6fd,#0284c7)}
.wsb-mock--hero-kids .rack i:nth-child(1){height:26px;background:linear-gradient(180deg,#e0f2fe,#0ea5e9)}
.wsb-mock--hero-kids .rack i.hot{width:22px;height:40px;background:linear-gradient(180deg,#fbcfe8,#db2777);box-shadow:0 0 12px rgba(244,114,182,.4)}
.wsb-mock--hero-kids .rack i:nth-child(3){height:28px;background:linear-gradient(180deg,#fef3c7,#f59e0b)}

.wsb-mock--hero-laptop{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#0f1218;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-laptop .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-laptop .sky em{font-style:normal;font-size:10px;color:#38bdf8;letter-spacing:.4px}
.wsb-mock--hero-laptop .sky strong{font-size:18px;color:#f1f5f9;line-height:1.2}
.wsb-mock--hero-laptop .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#0ea5e9,#f97316);box-shadow:0 0 14px rgba(14,165,233,.45);margin-top:6px}
.wsb-mock--hero-laptop .screens{display:flex;align-items:flex-end;justify-content:center;gap:6px;height:48px;opacity:.72}
.wsb-mock--hero-laptop .screens i{display:block;width:28px;height:18px;border-radius:3px;background:linear-gradient(135deg,#38bdf8,#6366f1);box-shadow:0 0 10px rgba(56,189,248,.4)}
.wsb-mock--hero-laptop .screens i:nth-child(1){width:22px;height:14px;background:linear-gradient(135deg,#a855f7,#3b82f6)}
.wsb-mock--hero-laptop .screens i.hot{width:34px;height:20px;background:linear-gradient(135deg,#f97316,#0ea5e9);box-shadow:0 0 14px rgba(249,115,22,.45)}
.wsb-mock--hero-laptop .screens i:nth-child(3){width:22px;height:14px;background:linear-gradient(135deg,#22d3ee,#2563eb)}

.wsb-mock--hero-cars{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#0c0e12;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-cars .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-cars .sky em{font-style:normal;font-size:10px;color:#c4a574;letter-spacing:.4px}
.wsb-mock--hero-cars .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-cars .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c4a574,#e7d3b0);box-shadow:0 0 14px rgba(196,165,116,.4);margin-top:6px}
.wsb-mock--hero-cars .cars{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.62}
.wsb-mock--hero-cars .cars i{display:block;width:34px;height:14px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#94a3b8,#334155);box-shadow:0 3px 8px rgba(0,0,0,.45)}
.wsb-mock--hero-cars .cars i:nth-child(1){width:26px;height:12px;background:linear-gradient(180deg,#cbd5e1,#475569)}
.wsb-mock--hero-cars .cars i.hot{width:40px;height:16px;background:linear-gradient(180deg,#fb923c,#9a3412);box-shadow:0 0 14px rgba(249,115,22,.45)}
.wsb-mock--hero-cars .cars i:nth-child(3){width:28px;height:13px;background:linear-gradient(180deg,#e2e8f0,#64748b)}

.wsb-mock--hero-kids-fashion{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#fffaf5;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-kids-fashion .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-kids-fashion .sky em{font-style:normal;font-size:10px;color:#db2777;letter-spacing:.4px}
.wsb-mock--hero-kids-fashion .sky strong{font-size:18px;color:#1e3a5f;line-height:1.2}
.wsb-mock--hero-kids-fashion .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#db2777,#0ea5e9);box-shadow:0 0 14px rgba(219,39,119,.35);margin-top:6px}
.wsb-mock--hero-kids-fashion .kids{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.55}
.wsb-mock--hero-kids-fashion .kids i{display:block;width:20px;height:38px;border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,#7dd3fc,#0284c7)}
.wsb-mock--hero-kids-fashion .kids i:nth-child(1){height:32px;background:linear-gradient(180deg,#bae6fd,#0ea5e9)}
.wsb-mock--hero-kids-fashion .kids i.hot{width:22px;height:42px;background:linear-gradient(180deg,#fbcfe8,#db2777);box-shadow:0 0 14px rgba(244,114,182,.4)}
.wsb-mock--hero-kids-fashion .kids i:nth-child(3){height:30px;width:16px;background:linear-gradient(180deg,#fde68a,#f59e0b)}

.wsb-mock--hero-ai{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#050c1c;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-ai .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-ai .sky em{font-style:normal;font-size:10px;color:#22d3ee;letter-spacing:.4px}
.wsb-mock--hero-ai .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-ai .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#22d3ee,#a78bfa);box-shadow:0 0 16px rgba(34,211,238,.55);margin-top:6px}
.wsb-mock--hero-ai .bots{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.72}
.wsb-mock--hero-ai .bots i{display:block;width:18px;height:22px;border-radius:5px 5px 3px 3px;background:linear-gradient(180deg,#67e8f9,#0369a1);box-shadow:0 0 10px rgba(34,211,238,.45)}
.wsb-mock--hero-ai .bots i:nth-child(1){height:18px;width:24px;border-radius:3px;background:linear-gradient(180deg,#818cf8,#312e81)}
.wsb-mock--hero-ai .bots i.hot{width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#e0f2fe,#22d3ee 55%,#0e7490);box-shadow:0 0 18px rgba(34,211,238,.65)}
.wsb-mock--hero-ai .bots i:nth-child(3){height:20px;width:14px;background:linear-gradient(180deg,#c4b5fd,#6d28d9)}

.wsb-mock--hero-ai-prog{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#080614;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-ai-prog .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-ai-prog .sky em{font-style:normal;font-size:10px;color:#fb923c;letter-spacing:.4px}
.wsb-mock--hero-ai-prog .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-ai-prog .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f97316,#e879f9);box-shadow:0 0 16px rgba(249,115,22,.55);margin-top:6px}
.wsb-mock--hero-ai-prog .code{display:flex;align-items:flex-end;justify-content:center;gap:6px;height:48px;opacity:.74}
.wsb-mock--hero-ai-prog .code i{display:block;width:12px;border-radius:3px;background:linear-gradient(180deg,#fb923c,#9a3412);box-shadow:0 0 10px rgba(249,115,22,.4)}
.wsb-mock--hero-ai-prog .code i:nth-child(1){height:22px}
.wsb-mock--hero-ai-prog .code i.hot{width:16px;height:36px;background:linear-gradient(180deg,#f0abfc,#a21caf);box-shadow:0 0 16px rgba(232,121,249,.55)}
.wsb-mock--hero-ai-prog .code i:nth-child(3){height:28px;background:linear-gradient(180deg,#67e8f9,#0e7490)}

.wsb-mock--hero-social-auto{
	display:flex!important;
	flex-direction:column!important;
	justify-content:space-between;
	gap:10px;
	padding:14px!important;
	min-height:168px;
	background-color:#060a12;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
	box-sizing:border-box;
	align-items:stretch;
}
.wsb-mock--hero-social-auto .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-social-auto .sky em{font-style:normal;font-size:10px;color:#4ade80;letter-spacing:.4px}
.wsb-mock--hero-social-auto .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-social-auto .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#22c55e,#f97316);box-shadow:0 0 16px rgba(34,197,94,.55);margin-top:6px}
.wsb-mock--hero-social-auto .chans{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.78}
.wsb-mock--hero-social-auto .chans i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#86efac,#16a34a);box-shadow:0 0 10px rgba(34,197,94,.5)}
.wsb-mock--hero-social-auto .chans i:nth-child(1){background:radial-gradient(circle at 35% 30%,#f9a8d4,#db2777)}
.wsb-mock--hero-social-auto .chans i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#fdba74,#ea580c);box-shadow:0 0 16px rgba(249,115,22,.6)}
.wsb-mock--hero-social-auto .chans i:nth-child(3){background:radial-gradient(circle at 35% 30%,#7dd3fc,#0284c7)}
.wsb-mock--hero-sports{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0a0c10;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-sports .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-sports .sky em{font-style:normal;font-size:10px;color:#fb923c;letter-spacing:.4px}
.wsb-mock--hero-sports .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-sports .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f97316,#fbbf24);box-shadow:0 0 16px rgba(249,115,22,.55);margin-top:6px}
.wsb-mock--hero-sports .gear{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.8}
.wsb-mock--hero-sports .gear i{display:block;width:20px;height:20px;border-radius:5px;background:radial-gradient(circle at 35% 30%,#9ca3af,#1f2937);box-shadow:0 0 10px rgba(249,115,22,.4)}
.wsb-mock--hero-sports .gear i:nth-child(1){border-radius:50%;background:radial-gradient(circle at 35% 30%,#fdba74,#ea580c)}
.wsb-mock--hero-sports .gear i.hot{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fde68a,#f59e0b);box-shadow:0 0 16px rgba(251,191,36,.6)}
.wsb-mock--hero-sports .gear i:nth-child(3){width:28px;height:12px;border-radius:999px;background:linear-gradient(90deg,#ef4444,#3b82f6,#eab308)}
.wsb-mock--hero-salon{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#2a1820;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-salon .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-salon .sky em{font-style:normal;font-size:10px;color:#f9a8d4;letter-spacing:.4px}
.wsb-mock--hero-salon .sky strong{font-size:18px;color:#fff7fb;line-height:1.2}
.wsb-mock--hero-salon .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#ec4899,#f9a8d4);box-shadow:0 0 16px rgba(236,72,153,.55);margin-top:6px}
.wsb-mock--hero-salon .glam{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.82}
.wsb-mock--hero-salon .glam i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fbcfe8,#db2777);box-shadow:0 0 10px rgba(236,72,153,.45)}
.wsb-mock--hero-salon .glam i:nth-child(1){background:radial-gradient(circle at 35% 30%,#fde68a,#d97706)}
.wsb-mock--hero-salon .glam i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#fda4af,#e11d48);box-shadow:0 0 16px rgba(244,63,94,.6)}
.wsb-mock--hero-salon .glam i:nth-child(3){background:radial-gradient(circle at 35% 30%,#e9d5ff,#a855f7)}

.wsb-mock--hero-beauty{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#16120f;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-beauty .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-beauty .sky em{font-style:normal;font-size:10px;color:#e7d3b0;letter-spacing:.4px}
.wsb-mock--hero-beauty .sky strong{font-size:18px;color:#fffaf5;line-height:1.2}
.wsb-mock--hero-beauty .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c4a574,#e7d3b0);box-shadow:0 0 16px rgba(196,165,116,.55);margin-top:6px}
.wsb-mock--hero-beauty .locks{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.82}
.wsb-mock--hero-beauty .locks i{display:block;width:12px;height:28px;border-radius:999px;background:linear-gradient(180deg,#f5e6d3,#a16207);box-shadow:0 0 10px rgba(196,165,116,.4)}
.wsb-mock--hero-beauty .locks i:nth-child(1){height:22px;background:linear-gradient(180deg,#fde68a,#b45309)}
.wsb-mock--hero-beauty .locks i.hot{width:14px;height:36px;background:linear-gradient(180deg,#fff7ed,#c4a574);box-shadow:0 0 16px rgba(231,211,176,.6)}
.wsb-mock--hero-beauty .locks i:nth-child(3){height:20px;background:linear-gradient(180deg,#e7d3b0,#78350f)}

.wsb-mock--hero-makeup{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#24141c;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-makeup .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-makeup .sky em{font-style:normal;font-size:10px;color:#fda4af;letter-spacing:.4px}
.wsb-mock--hero-makeup .sky strong{font-size:18px;color:#fff1f2;line-height:1.2}
.wsb-mock--hero-makeup .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f43f5e,#fda4af);box-shadow:0 0 16px rgba(244,63,94,.55);margin-top:6px}
.wsb-mock--hero-makeup .blush{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.82}
.wsb-mock--hero-makeup .blush i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fecdd3,#e11d48);box-shadow:0 0 10px rgba(244,63,94,.45)}
.wsb-mock--hero-makeup .blush i:nth-child(1){background:radial-gradient(circle at 35% 30%,#fde68a,#d97706)}
.wsb-mock--hero-makeup .blush i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#fda4af,#be123c);box-shadow:0 0 16px rgba(244,63,94,.6)}
.wsb-mock--hero-makeup .blush i:nth-child(3){background:radial-gradient(circle at 35% 30%,#fbcfe8,#db2777)}

.wsb-mock--hero-barber{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0c0c0e;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-barber .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-barber .sky em{font-style:normal;font-size:10px;color:#d4a574;letter-spacing:.4px}
.wsb-mock--hero-barber .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-barber .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c4a574,#e7d3b0);box-shadow:0 0 16px rgba(196,165,116,.5);margin-top:6px}
.wsb-mock--hero-barber .clip{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.85}
.wsb-mock--hero-barber .clip i{display:block;width:18px;height:24px;border-radius:2px 2px 8px 8px;background:linear-gradient(180deg,#94a3b8,#1e293b);box-shadow:0 0 10px rgba(196,165,116,.35)}
.wsb-mock--hero-barber .clip i:nth-child(1){height:18px;background:linear-gradient(180deg,#cbd5e1,#334155)}
.wsb-mock--hero-barber .clip i.hot{width:22px;height:32px;background:linear-gradient(180deg,#e7d3b0,#92400e);box-shadow:0 0 16px rgba(212,165,116,.55)}
.wsb-mock--hero-barber .clip i:nth-child(3){height:20px;width:14px;background:linear-gradient(180deg,#64748b,#0f172a)}

.wsb-mock--hero-watches{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0a0a0c;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-watches .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-watches .sky em{font-style:normal;font-size:10px;color:#d4af37;letter-spacing:.4px}
.wsb-mock--hero-watches .sky strong{font-size:18px;color:#faf8f5;line-height:1.2}
.wsb-mock--hero-watches .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#c5a059,#e8d5a3);box-shadow:0 0 16px rgba(197,160,89,.5);margin-top:6px}
.wsb-mock--hero-watches .dials{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.88}
.wsb-mock--hero-watches .dials i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e8d5a3,#92400e);box-shadow:0 0 10px rgba(212,175,55,.45);border:1px solid rgba(232,213,163,.55)}
.wsb-mock--hero-watches .dials i:nth-child(1){width:16px;height:16px;background:radial-gradient(circle at 35% 30%,#cbd5e1,#334155)}
.wsb-mock--hero-watches .dials i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#fde68a,#b45309);box-shadow:0 0 16px rgba(212,175,55,.6)}
.wsb-mock--hero-watches .dials i:nth-child(3){width:16px;height:16px;background:radial-gradient(circle at 35% 30%,#94a3b8,#1e293b)}

.wsb-mock--hero-market{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0f1712;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-market .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-market .sky em{font-style:normal;font-size:10px;color:#4ade80;letter-spacing:.4px}
.wsb-mock--hero-market .sky strong{font-size:18px;color:#f0fdf4;line-height:1.2}
.wsb-mock--hero-market .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#16a34a,#4ade80);box-shadow:0 0 16px rgba(22,163,74,.5);margin-top:6px}
.wsb-mock--hero-market .cart{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:48px;opacity:.88}
.wsb-mock--hero-market .cart i{display:block;width:18px;height:22px;border-radius:3px;background:linear-gradient(180deg,#86efac,#15803d);box-shadow:0 0 10px rgba(74,222,128,.4)}
.wsb-mock--hero-market .cart i:nth-child(1){height:16px;width:24px;background:linear-gradient(180deg,#fde68a,#d97706)}
.wsb-mock--hero-market .cart i.hot{width:26px;height:28px;border-radius:5px 5px 3px 3px;background:linear-gradient(180deg,#bbf7d0,#16a34a);box-shadow:0 0 16px rgba(74,222,128,.55)}
.wsb-mock--hero-market .cart i:nth-child(3){height:18px;background:linear-gradient(180deg,#fca5a5,#dc2626)}

.wsb-mock--hero-toys{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#1e1432;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-toys .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-toys .sky em{font-style:normal;font-size:10px;color:#fbbf24;letter-spacing:.4px}
.wsb-mock--hero-toys .sky strong{font-size:18px;color:#fffbeb;line-height:1.2}
.wsb-mock--hero-toys .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f97316,#38bdf8);box-shadow:0 0 16px rgba(249,115,22,.5);margin-top:6px}
.wsb-mock--hero-toys .blocks{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.9}
.wsb-mock--hero-toys .blocks i{display:block;width:18px;height:18px;border-radius:4px;background:linear-gradient(180deg,#60a5fa,#2563eb);box-shadow:0 0 8px rgba(56,189,248,.4)}
.wsb-mock--hero-toys .blocks i:nth-child(1){height:24px;background:linear-gradient(180deg,#fbbf24,#d97706)}
.wsb-mock--hero-toys .blocks i.hot{width:20px;height:30px;background:linear-gradient(180deg,#fb923c,#ea580c);box-shadow:0 0 16px rgba(249,115,22,.55)}
.wsb-mock--hero-toys .blocks i:nth-child(3){height:16px;background:linear-gradient(180deg,#4ade80,#16a34a)}

.wsb-mock--hero-juices{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#142818;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-juices .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-juices .sky em{font-style:normal;font-size:10px;color:#86efac;letter-spacing:.4px}
.wsb-mock--hero-juices .sky strong{font-size:18px;color:#f0fdf4;line-height:1.2}
.wsb-mock--hero-juices .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f97316,#4ade80);box-shadow:0 0 16px rgba(249,115,22,.45);margin-top:6px}
.wsb-mock--hero-juices .cups{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.92}
.wsb-mock--hero-juices .cups i{display:block;width:16px;height:24px;border-radius:4px 4px 8px 8px;background:linear-gradient(180deg,#fdba74,#ea580c);box-shadow:0 0 8px rgba(249,115,22,.4)}
.wsb-mock--hero-juices .cups i:nth-child(1){height:20px;background:linear-gradient(180deg,#86efac,#16a34a)}
.wsb-mock--hero-juices .cups i.hot{width:18px;height:30px;background:linear-gradient(180deg,#fca5a5,#dc2626);box-shadow:0 0 16px rgba(248,113,113,.5)}
.wsb-mock--hero-juices .cups i:nth-child(3){height:18px;background:linear-gradient(180deg,#fde68a,#ca8a04)}

.wsb-mock--hero-sportwatch{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#080a0e;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-sportwatch .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-sportwatch .sky em{font-style:normal;font-size:10px;color:#fbbf24;letter-spacing:.4px}
.wsb-mock--hero-sportwatch .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-sportwatch .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#ef4444,#3b82f6);box-shadow:0 0 16px rgba(239,68,68,.5);margin-top:6px}
.wsb-mock--hero-sportwatch .faces{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.92}
.wsb-mock--hero-sportwatch .faces i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#60a5fa,#1e3a8a);box-shadow:0 0 8px rgba(59,130,246,.45);border:1px solid rgba(148,163,184,.45)}
.wsb-mock--hero-sportwatch .faces i:nth-child(1){background:radial-gradient(circle at 35% 30%,#fca5a5,#991b1b)}
.wsb-mock--hero-sportwatch .faces i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#fde68a,#a16207);box-shadow:0 0 16px rgba(251,191,36,.55)}
.wsb-mock--hero-sportwatch .faces i:nth-child(3){background:radial-gradient(circle at 35% 30%,#94a3b8,#0f172a)}

.wsb-mock--hero-stationery{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#1c1610;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-stationery .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-stationery .sky em{font-style:normal;font-size:10px;color:#fbbf24;letter-spacing:.4px}
.wsb-mock--hero-stationery .sky strong{font-size:18px;color:#fffbeb;line-height:1.2}
.wsb-mock--hero-stationery .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#2563eb,#fbbf24);box-shadow:0 0 16px rgba(37,99,235,.45);margin-top:6px}
.wsb-mock--hero-stationery .pens{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.92}
.wsb-mock--hero-stationery .pens i{display:block;width:8px;height:26px;border-radius:2px 2px 1px 1px;background:linear-gradient(180deg,#60a5fa,#1e40af);box-shadow:0 0 8px rgba(37,99,235,.4)}
.wsb-mock--hero-stationery .pens i:nth-child(1){height:20px;background:linear-gradient(180deg,#fbbf24,#b45309)}
.wsb-mock--hero-stationery .pens i.hot{width:10px;height:32px;background:linear-gradient(180deg,#f87171,#b91c1c);box-shadow:0 0 16px rgba(239,68,68,.45)}
.wsb-mock--hero-stationery .pens i:nth-child(3){height:18px;background:linear-gradient(180deg,#4ade80,#15803d)}

.wsb-mock--hero-gym{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0a0a0c;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-gym .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-gym .sky em{font-style:normal;font-size:10px;color:#f87171;letter-spacing:.4px}
.wsb-mock--hero-gym .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-gym .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#ef4444,#fbbf24);box-shadow:0 0 16px rgba(239,68,68,.5);margin-top:6px}
.wsb-mock--hero-gym .weights{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.92}
.wsb-mock--hero-gym .weights i{display:block;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#64748b,#0f172a);box-shadow:0 0 8px rgba(239,68,68,.35);border:2px solid #334155}
.wsb-mock--hero-gym .weights i:nth-child(1){width:24px;height:12px;border-radius:3px;background:linear-gradient(90deg,#475569,#1e293b)}
.wsb-mock--hero-gym .weights i.hot{width:24px;height:24px;background:radial-gradient(circle at 35% 30%,#fca5a5,#991b1b);box-shadow:0 0 16px rgba(239,68,68,.55);border-color:#ef4444}
.wsb-mock--hero-gym .weights i:nth-child(3){width:12px;height:28px;border-radius:999px;background:linear-gradient(180deg,#fbbf24,#b45309)}

.wsb-mock--hero-sportshall{
  display:flex!important;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;min-height:148px;
  background-color:#0c0e12;background-size:cover;background-position:center;background-repeat:no-repeat;
  overflow:hidden;border-radius:16px;box-sizing:border-box
}
.wsb-mock--hero-sportshall .sky{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.wsb-mock--hero-sportshall .sky em{font-style:normal;font-size:10px;color:#fb923c;letter-spacing:.4px}
.wsb-mock--hero-sportshall .sky strong{font-size:18px;color:#f8fafc;line-height:1.2}
.wsb-mock--hero-sportshall .sky .cta{display:block;width:88px;height:12px;border-radius:9px;background:linear-gradient(90deg,#f97316,#38bdf8);box-shadow:0 0 16px rgba(249,115,22,.5);margin-top:6px}
.wsb-mock--hero-sportshall .gear{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:48px;opacity:.92}
.wsb-mock--hero-sportshall .gear i{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fdba74,#c2410c);box-shadow:0 0 8px rgba(249,115,22,.4)}
.wsb-mock--hero-sportshall .gear i:nth-child(1){border-radius:50%;background:radial-gradient(circle at 35% 30%,#f8fafc,#0f172a);border:2px solid #e2e8f0}
.wsb-mock--hero-sportshall .gear i.hot{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#7dd3fc,#0369a1);box-shadow:0 0 16px rgba(56,189,248,.55)}
.wsb-mock--hero-sportshall .gear i:nth-child(3){width:24px;height:12px;border-radius:3px;background:linear-gradient(90deg,#475569,#1e293b)}

/* Community gallery */
.lp-cat--community{border-color:#f9a8d4;background:#fdf2f8;color:#9d174d}
.lp-cat--community.is-active,.lp-cat--community:hover{border-color:#be185d;background:#fce7f3;color:#9d174d}
.lp-cat--community.is-active span{background:#be185d;color:#fff}
.lp-card__img{display:block;width:100%;height:100%;min-height:140px;object-fit:cover}
.lp-card--community .lp-pill--author{background:#fce7f3;color:#9d174d;border-color:#f9a8d4}
.lp-empty{margin:2rem 0;text-align:center;color:#6b7280}

.wsb-mock--wc-console-neon,.wsb-mock--wc-console-royal,.wsb-mock--wc-console-glass,.wsb-mock--wc-console-hud,.wsb-mock--wc-console-coral{display:grid;gap:6px;padding:10px;min-height:118px;border-radius:14px;box-sizing:border-box;overflow:hidden;align-content:center}
.wsb-mock--wc-console-neon{background:radial-gradient(circle at 30% 20%,#a855f7,#0b1020 70%);grid-template-columns:repeat(3,1fr);color:#e0e7ff}
.wsb-mock--wc-console-neon em{grid-column:1/-1;font-size:10px;letter-spacing:.12em;opacity:.85}
.wsb-mock--wc-console-neon i{height:54px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(168,85,247,.45);box-shadow:0 0 12px rgba(34,211,238,.25)}
.wsb-mock--wc-console-neon i.hot{border-color:#22d3ee;box-shadow:0 0 16px rgba(34,211,238,.55);transform:scale(1.05)}
.wsb-mock--wc-console-royal{background:linear-gradient(160deg,#1e1b4b,#312e81);grid-template-columns:repeat(3,1fr);color:#fef3c7}
.wsb-mock--wc-console-royal strong{grid-column:1/-1;text-align:center;font-size:14px}
.wsb-mock--wc-console-royal span{height:52px;border-radius:18px 18px 40% 40%;background:rgba(197,160,89,.18);border:1px solid rgba(197,160,89,.45)}
.wsb-mock--wc-console-royal span.hot{background:rgba(251,191,36,.28);border-color:#fbbf24}
.wsb-mock--wc-console-glass{background:linear-gradient(180deg,#dbeafe,#f8fafc);grid-template-columns:repeat(4,1fr)}
.wsb-mock--wc-console-glass b{height:48px;border-radius:14px;background:rgba(255,255,255,.65);border:1px solid rgba(37,99,235,.2);backdrop-filter:blur(4px)}
.wsb-mock--wc-console-glass b.hot{border-color:#2563eb;box-shadow:0 8px 18px rgba(37,99,235,.18)}
.wsb-mock--wc-console-hud{background:#0f172a;grid-template-columns:repeat(3,1fr);gap:8px}
.wsb-mock--wc-console-hud .bar{grid-column:1/-1;height:7px;border-radius:4px;background:linear-gradient(90deg,#22d3ee,#a855f7)}
.wsb-mock--wc-console-hud span{height:50px;border-radius:8px;background:#111827;border:1px solid #334155}
.wsb-mock--wc-console-hud span.hot{border-color:#22d3ee;box-shadow:inset 0 0 0 1px rgba(34,211,238,.35)}
.wsb-mock--wc-console-coral{background:#fff1f2;place-items:center;justify-items:center}
.wsb-mock--wc-console-coral .pill{width:58%;height:70px;border-radius:999px;background:linear-gradient(135deg,#fda4af,#e11d48);opacity:.9;display:block}
.wsb-mock--wc-console-coral em{font-size:10px;color:#9f1239;letter-spacing:.08em}


/* image galleries mock */

.wsb-mock--iv-gallery {
	display: flex !important; flex-direction: column; align-items: center; justify-content: center;
	gap: 8px; padding: 14px 12px; color: #fff;
	background: linear-gradient(165deg, #0b0a10, #1a1020 55%, #140f18);
}
.wsb-mock--iv-gallery .frames {
	display: flex; align-items: flex-end; justify-content: center; gap: 6px; width: 100%;
}
.wsb-mock--iv-gallery .frames span {
	display: block; width: 42px; height: 56px; border-radius: 8px;
	background: linear-gradient(145deg, var(--a, #93003c), var(--b, #c5a059));
	box-shadow: 0 8px 18px rgba(0,0,0,.35); opacity: .72; transform: scale(.9);
}
.wsb-mock--iv-gallery .frames span.hot {
	width: 54px; height: 72px; opacity: 1; transform: scale(1);
	box-shadow: 0 12px 24px rgba(0,0,0,.45), 0 0 0 2px rgba(255,255,255,.18);
}
.wsb-mock--iv-gallery strong { font-size: 12px; font-weight: 800; color: #fff; }
.wsb-mock--iv-gallery em { font-size: 10px; color: rgba(255,255,255,.72); font-style: normal; }

/* === layout gallery 3-col (all categories) === */
.lp-hero__inner,
.lp-main { max-width: min(1560px, 100%); }
.lp-panel[data-lp-section="hero"] .lp-card__preview,
.lp-panel[data-lp-section="hero"] .lp-card__preview > .wsb-mock {
	min-height: 220px;
}
.lp-panel[data-lp-section="hero"] .lp-card__img {
	min-height: 220px;
	height: 220px;
	object-fit: cover;
	width: 100%;
	display: block;
}
.lp-pill--live {
	background: #140f18 !important;
	color: #fff !important;
	text-decoration: none;
}
@media (max-width: 1100px) {
	.lp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	.lp-grid { grid-template-columns: 1fr; }
}

/* portfolio layout mocks */
.wsb-mock--port-grid {
	display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 12px;
	background: #faf7f8; position: relative;
}
.wsb-mock--port-grid span {
	display: block; min-height: 36px; border-radius: 8px;
	background: linear-gradient(145deg,#fce7f0,#eadfe6);
}
.wsb-mock--port-grid span.hot { background: linear-gradient(145deg,#93003c,#c5a059); }
.wsb-mock--port-grid strong {
	position: absolute; inset-inline-end: 10px; bottom: 8px;
	font-size: 10px; font-weight: 800; color: #93003c;
}
.wsb-mock--port-metro {
	display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 44px 44px;
	gap: 6px; padding: 12px; background: #0b0a10; position: relative;
}
.wsb-mock--port-metro span { display: block; border-radius: 8px; background: linear-gradient(145deg,#1e293b,#334155); }
.wsb-mock--port-metro .wide { grid-column: span 2; background: linear-gradient(145deg,#0ea5e9,#7c3aed); }
.wsb-mock--port-metro .tall { grid-row: span 2; background: linear-gradient(145deg,#93003c,#f97316); }
.wsb-mock--port-metro em {
	position: absolute; top: 6px; inset-inline-start: 10px;
	font-size: 9px; letter-spacing: 1px; color: #38bdf8; font-style: normal; font-weight: 800;
}
.wsb-mock--port-masonry {
	display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 12px;
	background: #fffaf6; align-items: end;
}
.wsb-mock--port-masonry i {
	display: block; height: 34px; border-radius: 8px;
	background: linear-gradient(145deg,#fed7aa,#fdba74); border: 0;
}
.wsb-mock--port-masonry i.tall { height: 52px; }
.wsb-mock--port-masonry i.hot { background: linear-gradient(145deg,#93003c,#c5a059); height: 44px; }
.wsb-mock--port-overlay {
	display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; gap: 6px; padding: 12px;
	background: #09070c;
}
.wsb-mock--port-overlay span {
	display: grid; place-items: end start; min-height: 64px; border-radius: 8px; padding: 8px;
	background: linear-gradient(160deg,rgba(15,23,42,.2),rgba(0,0,0,.75)), linear-gradient(145deg,#1e293b,#334155);
	color: #fff; font-size: 10px; font-weight: 800;
}
.wsb-mock--port-overlay span.hot {
	background: linear-gradient(160deg,rgba(15,23,42,.15),rgba(0,0,0,.7)), linear-gradient(145deg,#78350f,#fbbf24);
}
.wsb-mock--port-bento {
	display: grid !important; grid-template-columns: 1.2fr 1fr; grid-template-rows: 40px 40px;
	gap: 6px; padding: 12px; background: linear-gradient(165deg,#f8fafc,#eef2ff);
}
.wsb-mock--port-bento span { display: block; border-radius: 12px; background: rgba(255,255,255,.85); border: 1px solid #e2e8f0; }
.wsb-mock--port-bento .a { grid-row: span 2; background: linear-gradient(160deg,#c7d2fe,#a5b4fc); }
.wsb-mock--port-bento .c.hot { background: linear-gradient(145deg,#93003c,#c5a059); border-color: transparent; }


/* === theme templates mode tabs === */
.lp-modes{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	margin:0 0 18px;
}
.lp-mode{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:8px 14px;
	border-radius:999px;
	border:1px solid var(--line, #eadfe6);
	background:var(--card, #fff);
	color:#4b4453;
	font-weight:700;
	font-size:13px;
	line-height:1.2;
	text-decoration:none;
	white-space:nowrap;
	box-shadow:none;
}
.lp-mode span{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:20px;
	padding:1px 7px;
	border-radius:999px;
	background:#f3f0f2;
	font-size:12px;
	font-weight:700;
	line-height:1.2;
}
.lp-mode:hover{
	border-color:var(--accent, #93003c);
	background:#fff4f8;
	color:var(--accent, #93003c);
}
.lp-mode.is-active{
	border-color:var(--accent, #93003c);
	background:#fff4f8;
	color:var(--accent, #93003c);
	box-shadow:none;
}
.lp-mode.is-active span{
	background:var(--accent, #93003c);
	color:#fff;
}
.layouts-page.is-tabs .lp-cat,
.layouts-page.is-tabs .lp-subcat{
	white-space:nowrap;
}
.lp-card__body p{
	max-width:none;
	width:100%;
	white-space:normal;
	overflow-wrap:anywhere;
	word-break:normal;
}
.lp-card__top h2{
	flex:1;
	min-width:0;
	white-space:normal;
}

/* Mobile Dock library thumbs */
.wsb-mock--mdk-hot,.wsb-mock--mdk-luxe,.wsb-mock--mdk-glass,.wsb-mock--mdk-night,.wsb-mock--mdk-fresh{
  display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:8px;min-height:88px;padding:10px 8px 8px;border-radius:12px;box-sizing:border-box;
}
.wsb-mock--mdk-hot{background:linear-gradient(165deg,#0a0a0a,#1a0505 55%,#7f1d1d);}
.wsb-mock--mdk-luxe{background:linear-gradient(165deg,#2a0012,#1a0a12 60%,#3f1a28);}
.wsb-mock--mdk-glass{background:linear-gradient(165deg,#e0f2fe,#f8fafc 50%,#dbeafe);}
.wsb-mock--mdk-night{background:linear-gradient(165deg,#020617,#0b1020 55%,#1e1b4b);}
.wsb-mock--mdk-fresh{background:linear-gradient(165deg,#f0fdfa,#ecfdf5 55%,#ccfbf1);}
.wsb-mock--mdk-hot .bar,.wsb-mock--mdk-luxe .bar,.wsb-mock--mdk-glass .bar,.wsb-mock--mdk-night .bar,.wsb-mock--mdk-fresh .bar{
  display:flex;align-items:flex-end;justify-content:space-around;gap:4px;padding:6px 8px;border-radius:14px;
}
.wsb-mock--mdk-hot .bar{background:#0a0a0a;border:1px solid #ef4444;box-shadow:0 0 12px rgba(239,68,68,.35);}
.wsb-mock--mdk-luxe .bar{background:#2a0012;border:1px solid #c5a059;box-shadow:0 0 10px rgba(197,160,89,.3);}
.wsb-mock--mdk-glass .bar{background:rgba(255,255,255,.72);border:1px solid rgba(37,99,235,.35);backdrop-filter:blur(6px);}
.wsb-mock--mdk-night .bar{background:#0b1020;border:1px solid #a855f7;box-shadow:0 0 12px rgba(168,85,247,.4);}
.wsb-mock--mdk-fresh .bar{background:#fff;border:1px solid #14b8a6;}
.wsb-mock--mdk-hot .bar i,.wsb-mock--mdk-luxe .bar i,.wsb-mock--mdk-glass .bar i,.wsb-mock--mdk-night .bar i,.wsb-mock--mdk-fresh .bar i{
  display:block;width:8px;height:8px;border-radius:50%;opacity:.45;
}
.wsb-mock--mdk-hot .bar i{background:#fecaca;}
.wsb-mock--mdk-hot .bar i.on{background:#ef4444;opacity:1;box-shadow:0 0 6px #ef4444;}
.wsb-mock--mdk-hot .bar i.fab{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#f97316);opacity:1;margin-bottom:2px;}
.wsb-mock--mdk-luxe .bar i{background:#f8e7c8;}
.wsb-mock--mdk-luxe .bar i.on{background:#c5a059;opacity:1;}
.wsb-mock--mdk-glass .bar i{background:#93c5fd;}
.wsb-mock--mdk-glass .bar i.on{background:#2563eb;opacity:1;}
.wsb-mock--mdk-night .bar i{background:#c4b5fd;}
.wsb-mock--mdk-night .bar i.on{background:#a855f7;opacity:1;box-shadow:0 0 6px #a855f7;}
.wsb-mock--mdk-night .bar i.fab{width:14px;height:14px;background:linear-gradient(135deg,#a855f7,#22d3ee);opacity:1;}
.wsb-mock--mdk-fresh .bar i{background:#99f6e4;}
.wsb-mock--mdk-fresh .bar i.on{background:#0d9488;opacity:1;}
.wsb-mock--mdk-hot strong{color:#fecaca;font-size:11px;font-weight:800;text-align:center;}
.wsb-mock--mdk-luxe strong{color:#f8e7c8;font-size:11px;font-weight:800;text-align:center;}
.wsb-mock--mdk-glass strong{color:#1e3a8a;font-size:11px;font-weight:800;text-align:center;}
.wsb-mock--mdk-night strong{color:#e9d5ff;font-size:11px;font-weight:800;text-align:center;}
.wsb-mock--mdk-fresh strong{color:#134e4a;font-size:11px;font-weight:800;text-align:center;}

/* Mobile dock stays inside the widget box in the editor (viewport media must not hide it). */
.wsb-canvas-frame .wsb-canvas__inner .wsb-type-mobile_dock{
	display:flex !important;
	flex-direction:column;
	justify-content:flex-end;
	min-height:92px;
	padding:.85rem .75rem .7rem;
	background:linear-gradient(180deg,#f4f1ee,#e7e2dc);
	overflow:visible !important;
}
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk,
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk.is-fixed,
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk.wsb-mdk-hide-d,
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk.wsb-mdk-hide-m,
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk.wsb-mdk-hide-t,
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk.wsb-mdk-hide-d.is-fixed{
	display:block !important;
	position:relative !important;
	inset:auto !important;
	opacity:1 !important;
	visibility:visible !important;
	filter:none !important;
	width:100% !important;
	max-width:100% !important;
	pointer-events:auto !important;
}
.wsb-canvas-frame .wsb-canvas__inner .wsb-mdk .wsb-mdk__bar{
	display:flex !important;
	visibility:visible !important;
	min-height:var(--wsb-mdk-h, 64px);
	width:100%;
}

/* === equal card preview images (all categories) v82 === */
.lp-card__preview {
	position: relative;
	height: 180px;
	min-height: 180px;
	max-height: 180px;
	overflow: hidden;
	background: #f3f4f6;
	display: block;
}
.lp-card__preview > .wsb-mock {
	flex: none;
	width: 100%;
	height: 100%;
	min-height: 180px;
	max-height: 180px;
	box-sizing: border-box;
}
.lp-card__img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: none !important;
	object-fit: cover !important;
	object-position: center center !important;
}
.lp-card__ph {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 180px;
	background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
}
.lp-panel[data-lp-section="hero"] .lp-card__preview,
.lp-panel[data-lp-section="hero"] .lp-card__preview > .wsb-mock {
	height: 220px;
	min-height: 220px;
	max-height: 220px;
}
.lp-panel[data-lp-section="hero"] .lp-card__img {
	height: 100% !important;
	min-height: 0 !important;
	object-fit: cover !important;
}

/* === layout gallery pagination v83 === */
.lp-pager {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 1.25rem 0 .25rem;
	padding: 14px 8px 4px;
}
.lp-pager__btn,
.lp-pager__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.4rem;
	height: 2.4rem;
	padding: 0 .85rem;
	border-radius: 999px;
	border: 1px solid var(--line, #e5e7eb);
	background: #fff;
	color: #140f18;
	font-weight: 700;
	font-size: .92rem;
	text-decoration: none;
	box-sizing: border-box;
}
.lp-pager__btn:hover,
.lp-pager__num:hover {
	border-color: #93003c;
	color: #93003c;
}
.lp-pager__num.is-active {
	background: #140f18;
	border-color: #140f18;
	color: #fff;
}
.lp-pager__btn.is-disabled {
	opacity: .4;
	pointer-events: none;
}
.lp-pager__gap {
	color: #9ca3af;
	padding: 0 .15rem;
	font-weight: 700;
}