.elementor-widget-spin-3d-model,
.elementor-widget-spin-rigged-3d-character {
	inline-size: 100%;
	max-inline-size: none;
	overflow: visible;
}

.elementor-widget-spin-3d-model.spin-model-widget--ratio-square,
.elementor-widget-spin-rigged-3d-character.spin-model-widget--ratio-square {
	aspect-ratio: 1;
}

.elementor-widget-spin-3d-model.spin-model-widget--ratio-portrait,
.elementor-widget-spin-rigged-3d-character.spin-model-widget--ratio-portrait {
	aspect-ratio: 4 / 5;
}

.elementor-widget-spin-3d-model.spin-model-widget--ratio-landscape,
.elementor-widget-spin-rigged-3d-character.spin-model-widget--ratio-landscape {
	aspect-ratio: 4 / 3;
}

.elementor-widget-spin-3d-model.spin-model-widget--ratio-wide,
.elementor-widget-spin-rigged-3d-character.spin-model-widget--ratio-wide {
	aspect-ratio: 16 / 9;
}

.elementor-widget-spin-3d-model.spin-model-widget--ratio-free,
.elementor-widget-spin-rigged-3d-character.spin-model-widget--ratio-free {
	block-size: var(--spin-model-height, 520px);
}

.elementor-widget-spin-3d-model > .elementor-widget-container,
.elementor-widget-spin-rigged-3d-character > .elementor-widget-container {
	inline-size: 100%;
	block-size: 100% !important;
	overflow: visible;
}

.spin-model-viewer {
	--spin-model-object: var(--spin-color-text, #10100f);
	--spin-model-accent: var(--spin-color-action, #ff4b0b);
	--spin-model-background: var(--spin-color-surface, #f7f5ef);
	--spin-model-background-secondary: var(--spin-color-surface-strong, #d7d4cc);
	--spin-model-breakout: 0%;
	--spin-model-safe-inline: 100%;
	--spin-model-height: 520px;
	position: relative;
	z-index: 0;
	inline-size: 100%;
	block-size: 100%;
	max-inline-size: none;
	margin: 0;
	overflow: visible;
	isolation: isolate;
}

.spin-model-viewer__frame {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 50%;
	inline-size: 100%;
	block-size: 100%;
	max-inline-size: 100vw;
	min-block-size: 220px;
	transform: translateX(-50%);
	overflow: clip;
	border-radius: var(--spin-radius-surface, 0);
	background: transparent;
	color: var(--spin-color-text, #10100f);
	contain: paint style;
}

.spin-model-viewer--breakout .spin-model-viewer__frame {
	inset-block: 50% auto;
	inline-size: min(calc(100% + (2 * var(--spin-model-breakout))), var(--spin-model-safe-inline));
	block-size: min(calc(100% + (2 * var(--spin-model-breakout))), 100vh);
	transform: translate(-50%, -50%);
	overflow: visible;
	contain: style;
}

.spin-model-viewer--surface-canvas .spin-model-viewer__frame {
	background: var(--spin-model-background, var(--spin-color-canvas));
}

.spin-model-viewer--surface-surface .spin-model-viewer__frame {
	background: var(--spin-model-background, var(--spin-color-surface));
}

.spin-model-viewer--surface-studio .spin-model-viewer__frame {
	background:
		radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--spin-model-background-secondary) 72%, transparent), transparent 48%),
		linear-gradient(180deg, var(--spin-model-background) 0%, color-mix(in srgb, var(--spin-model-background) 72%, var(--spin-color-canvas)) 100%);
}

.spin-model-viewer--surface-gradient .spin-model-viewer__frame {
	background:
		radial-gradient(circle at 72% 22%, color-mix(in srgb, var(--spin-model-accent) 22%, transparent), transparent 42%),
		linear-gradient(135deg, var(--spin-model-background), var(--spin-model-background-secondary));
}

.spin-model-viewer--surface-grid .spin-model-viewer__frame {
	background-color: var(--spin-model-background);
	background-image:
		linear-gradient(color-mix(in srgb, var(--spin-model-accent) 14%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--spin-model-accent) 14%, transparent) 1px, transparent 1px),
		radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--spin-model-background-secondary) 70%, transparent), transparent 58%);
	background-size: 48px 48px, 48px 48px, 100% 100%;
}

.spin-model-viewer__canvas,
.spin-model-viewer__fallback,
.spin-model-viewer__loading {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
}

.spin-model-viewer__canvas {
	z-index: 2;
	display: block;
	background: transparent;
	opacity: 0;
	transition: opacity var(--spin-motion-duration-base, 320ms) var(--spin-motion-ease-out, ease-out);
	touch-action: pan-y;
}

.spin-model-viewer__canvas:focus-visible {
	outline: 3px solid var(--spin-color-focus, Highlight);
	outline-offset: -5px;
}

.spin-model-viewer[data-model-state="ready"] .spin-model-viewer__canvas {
	opacity: 1;
}

.spin-model-viewer__fallback {
	z-index: 1;
	display: grid;
	place-items: center;
	overflow: hidden;
	opacity: 1;
	transition: opacity var(--spin-motion-duration-base, 320ms) var(--spin-motion-ease-out, ease-out);
}

.spin-model-viewer[data-model-state="ready"] .spin-model-viewer__fallback {
	opacity: 0;
	pointer-events: none;
}

.spin-model-viewer__poster {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
}

.spin-model-viewer__placeholder {
	position: relative;
	inline-size: min(54%, 18rem);
	aspect-ratio: 1;
	filter: drop-shadow(0 1.6rem 2rem color-mix(in srgb, var(--spin-color-text) 18%, transparent));
}

.spin-model-viewer__placeholder span {
	position: absolute;
	display: block;
	border: 1px solid color-mix(in srgb, var(--spin-model-accent) 48%, transparent);
	background: color-mix(in srgb, var(--spin-model-object) 88%, transparent);
}

.spin-model-viewer__placeholder span:first-child {
	inset: 9%;
	border-radius: 50%;
}

.spin-model-viewer__placeholder span:nth-child(2) {
	inset: 28% 5%;
	border-radius: 50%;
	background: transparent;
	transform: rotate(-18deg);
}

.spin-model-viewer__placeholder span:nth-child(3) {
	inset: 46% 0 auto;
	block-size: 2px;
	border: 0;
	background: var(--spin-model-accent);
}

.spin-model-viewer__placeholder--can span:first-child,
.spin-model-viewer__placeholder--bottle span:first-child,
.spin-model-viewer__placeholder--package span:first-child,
.spin-model-viewer__placeholder--device span:first-child,
.spin-model-viewer__placeholder--briefcase span:first-child,
.spin-model-viewer__placeholder--mixamo-robot span:first-child,
.spin-model-viewer__placeholder--model span:first-child {
	inset: 8% 24%;
	border-radius: var(--spin-radius-surface, 0.6rem);
}

.spin-model-viewer__placeholder--briefcase span:first-child {
	inset: 22% 4% 16%;
	border-radius: var(--spin-radius-surface, 0.6rem);
}

.spin-model-viewer__placeholder--briefcase span:nth-child(2) {
	inset: 8% 33% 70%;
	border-radius: var(--spin-radius-surface, 0.6rem);
	transform: none;
}

.spin-model-viewer__placeholder--mixamo-robot span:first-child {
	inset: 8% 28% 3%;
	border-radius: 48% 48% 22% 22% / 18% 18% 12% 12%;
}

.spin-model-viewer__placeholder--bottle span:first-child {
	inset: 18% 27% 5%;
	border-radius: 44% 44% 22% 22% / 18% 18% 12% 12%;
}

.spin-model-viewer__placeholder--device span:first-child {
	inset: 2% 18%;
	border-radius: 12%;
	transform: rotate(8deg);
}

.spin-model-viewer__placeholder--crystal span:first-child {
	border-radius: 0;
	clip-path: polygon(50% 0, 92% 24%, 78% 84%, 50% 100%, 16% 78%, 8% 26%);
}

.spin-model-viewer__loading {
	z-index: 4;
	display: grid;
	place-items: end start;
	padding: var(--spin-space-sm, 0.8rem);
	pointer-events: none;
	opacity: 0;
}

.spin-model-viewer[data-model-state="loading"] .spin-model-viewer__loading {
	opacity: 1;
}

.spin-model-viewer__loading span {
	inline-size: var(--spin-model-progress, 10%);
	block-size: 2px;
	background: var(--spin-model-accent);
	transition: inline-size 180ms linear;
}

.spin-model-viewer__toolbar {
	position: absolute;
	z-index: 6;
	inset-block-start: var(--spin-space-sm, 0.75rem);
	inset-inline-end: var(--spin-space-sm, 0.75rem);
	display: flex;
	gap: 0.28rem;
	opacity: 0;
	transform: translateY(-0.35rem);
	transition: opacity var(--spin-motion-duration-fast, 180ms) ease-out, transform var(--spin-motion-duration-fast, 180ms) ease-out;
}

.spin-model-viewer:is(:hover, :focus-within)[data-model-state="ready"] .spin-model-viewer__toolbar,
.spin-model-viewer[data-model-interacted="true"] .spin-model-viewer__toolbar {
	opacity: 1;
	transform: none;
}

.spin-model-viewer__toolbar button,
.spin-model-viewer__editor-preview {
	display: inline-grid;
	place-items: center;
	min-inline-size: 2.75rem;
	min-block-size: 2.75rem;
	padding: 0.55rem;
	border: 1px solid color-mix(in srgb, var(--spin-color-border) 82%, transparent);
	border-radius: var(--spin-radius-control, 0.3rem);
	background: color-mix(in srgb, var(--spin-color-surface) 88%, transparent);
	box-shadow: var(--spin-elevation-overlay, 0 0.8rem 2rem rgb(0 0 0 / 0.14));
	color: var(--spin-color-text);
	font: 700 0.82rem/1 var(--spin-type-family-utility, monospace);
	cursor: pointer;
	backdrop-filter: blur(12px);
}

.spin-model-viewer__toolbar button:hover,
.spin-model-viewer__toolbar button[aria-pressed="true"] {
	border-color: var(--spin-model-accent);
	background: var(--spin-model-accent);
	color: var(--spin-color-on-action);
}

.spin-model-viewer__toolbar button:focus-visible,
.spin-model-viewer__editor-preview:focus-visible {
	outline: 3px solid var(--spin-color-focus, Highlight);
	outline-offset: 2px;
}

.spin-model-viewer__hint {
	position: absolute;
	z-index: 5;
	inset-inline-start: 50%;
	inset-block-end: var(--spin-space-sm, 0.75rem);
	max-inline-size: calc(100% - 2rem);
	margin: 0;
	padding: 0.45rem 0.65rem;
	transform: translateX(-50%);
	border: 1px solid color-mix(in srgb, var(--spin-color-border) 75%, transparent);
	border-radius: var(--spin-radius-control, 0.3rem);
	background: color-mix(in srgb, var(--spin-color-surface) 84%, transparent);
	color: var(--spin-color-text-muted);
	font: 600 0.68rem/1.2 var(--spin-type-family-utility, monospace);
	letter-spacing: 0.02em;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	backdrop-filter: blur(10px);
	transition: opacity var(--spin-motion-duration-fast, 180ms) ease-out;
}

.spin-model-viewer[data-controls-hint="enabled"]:is(:hover, :focus-within)[data-model-state="ready"]:not([data-model-interacted="true"]) .spin-model-viewer__hint {
	opacity: 1;
}

.spin-model-viewer__status,
.spin-model-viewer__noscript {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.spin-model-viewer[data-model-state="error"] .spin-model-viewer__status,
.spin-model-viewer[data-model-state="empty"] .spin-model-viewer__status {
	position: absolute;
	z-index: 7;
	inset-inline: var(--spin-space-sm, 0.75rem);
	inset-block-end: var(--spin-space-sm, 0.75rem);
	inline-size: auto;
	block-size: auto;
	padding: 0.7rem 0.85rem;
	margin: 0;
	overflow: visible;
	clip: auto;
	white-space: normal;
	border: 1px solid var(--spin-color-border);
	background: color-mix(in srgb, var(--spin-color-surface) 94%, transparent);
	color: var(--spin-color-text-muted);
	font: 600 0.76rem/1.45 var(--spin-type-family-utility, monospace);
}

.spin-model-viewer__editor-preview {
	position: absolute;
	z-index: 8;
	inset: 50% auto auto 50%;
	display: none;
	min-inline-size: 9rem;
	transform: translate(-50%, -50%);
}

.elementor-editor-active .spin-model-viewer[data-model-editor="click"] .spin-model-viewer__editor-preview {
	display: inline-grid;
}

.elementor-editor-active .spin-model-viewer[data-model-editor="click"] .spin-model-viewer__toolbar,
.elementor-editor-active .spin-model-viewer[data-model-editor="click"] .spin-model-viewer__hint {
	display: none;
}

.spin-model-viewer:fullscreen {
	inline-size: 100vw;
	block-size: 100vh;
	padding: clamp(1rem, 4vw, 4rem);
	background: var(--spin-color-canvas);
}

.spin-model-viewer:fullscreen .spin-model-viewer__frame {
	inline-size: 100%;
	block-size: 100%;
	aspect-ratio: auto;
}

@media (max-width: 700px) {
	.spin-model-viewer__toolbar {
		opacity: 1;
		transform: none;
	}

	.spin-model-viewer__hint {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.spin-model-viewer__canvas,
	.spin-model-viewer__fallback,
	.spin-model-viewer__toolbar,
	.spin-model-viewer__hint,
	.spin-model-viewer__loading span {
		transition: none;
	}
}