/*
Theme Name: Hello Elementor Child
Theme URI: https://tandix.sdlab.ee
Description: Дочерняя тема Tandix. Вёрстка главной собрана по прототипу project-tandix-hub.lovable.app (генерируется td-home-build.py + td-home.css + build-style.py).
Author: SDLab
Author URI: https://sdlab.ee
Template: hello-elementor
Version: 1.0.3
Text Domain: hello-elementor-child
*/

/* ============================================================
   TANDIX — главная страница. Вёрстка по прототипу
   https://project-tandix-hub.lovable.app
   Замеры (CDP, 1440): boxed-контент 1336 (max-w-1400 + px-32),
   секции py-96, hero-карточка 1393x623 r20, h1 72/1.03/800,
   h2 48/1.08/800/-1.2px, карточки r16, тёмные карточки #1b2432.
   ============================================================ */

:root {
	--td-bg: #f5f7fa;
	--td-fg: #1b2432;
	--td-card: #ffffff;
	--td-primary: #1b2432;
	--td-primary-fg: #f5f7fa;
	--td-secondary: #e7ebf1;
	--td-muted: #edf0f5;
	--td-muted-fg: #4c566b;
	--td-accent: #ff6a28;
	--td-accent-fg: #131a24;
	--td-accent-on-light: #b8420e;
	--td-border: #d6dce5;
	--td-font: 'Pliant', ui-sans-serif, system-ui, sans-serif;
	--td-font-accent: 'Instrument Serif', Georgia, 'Times New Roman', serif;
	--td-font-mono: 'Alumni Sans Pinstripe', ui-monospace, monospace;
	--td-metal: linear-gradient(135deg, #f1f2f2 0%, #cecfce 26%, #9a9a9a 46%, #767677 58%, #e0e1e0 78%, #b8b9b8 100%);
	--td-chip-metal: conic-gradient(from 145deg, #f1f2f2 0%, #dbdcdb 24%, #b8b9b8 46%, #fff 60%, #cecfce 82%, #e0e1e0 100%);
}

body {
	font-family: var(--td-font) !important;
	color: var(--td-fg) !important;
	background-color: var(--td-bg) !important;
}

/* ---------- общие элементы ---------- */

.td-accent-serif {
	font-family: var(--td-font-accent) !important;
	font-style: italic !important;
	font-weight: 400 !important;
}

/* label-плашка: уголки + mono-капс (прототип .inline-flex.items-center) */
.td-label {
	display: inline-flex !important;
	align-items: center !important;
}

.td-label-mark {
	display: flex !important;
	height: 20px !important;
	flex-direction: column !important;
	justify-content: space-between !important;
}

.td-label-mark--end {
	align-items: flex-end !important;
}

.td-label-mark i {
	display: block !important;
	background: var(--td-accent-on-light) !important;
}
.td-label-mark i:first-child,
.td-label-mark i:last-child {
	height: 1.5px !important;
	width: 8px !important;
}
.td-label-mark i:nth-child(2) {
	height: 100% !important;
	width: 1.5px !important;
}

.td-label-text {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 0 12px !important;
	font-family: var(--td-font-mono) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: .25em !important;
	color: inherit !important;
}

.td-label--light .td-label-mark i {
	background: var(--td-accent) !important;
}

/* заголовки секций */
.td-h2 .elementor-heading-title {
	margin: 0 !important;
	font-family: var(--td-font) !important;
	font-size: 30px !important;
	font-weight: 800 !important;
	line-height: 1.08 !important;
	letter-spacing: -.8px !important;
	color: var(--td-fg) !important;
}

.td-h2--light .elementor-heading-title {
	color: var(--td-primary-fg) !important;
}
.td-h2 .td-accent-serif {
	color: var(--td-accent-on-light) !important;
}

.td-head-center {
	max-width: 768px !important;
	margin: 0 auto !important;
	text-align: center !important;
	align-items: center !important;
}

.td-head-center .td-h2 {
	margin-top: 20px !important;
}
.td-head-center .td-label {
	align-self: center !important;
}

/* ---------- кнопки ---------- */
.td-btn .elementor-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	width: auto !important;
	height: auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 4px !important;
	box-shadow: none !important;
	font-family: var(--td-font) !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: -.02em !important;
	text-decoration: none !important;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease !important;
}

.td-btn .elementor-button-content-wrapper {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
}
.td-btn .elementor-button-icon {
	display: inline-flex !important;
	align-items: center !important;
}
.td-btn .elementor-button-icon svg {
	width: 16px !important;
	height: 16px !important;
	fill: none !important;
	stroke: currentColor !important;
}
.td-btn .elementor-button-text {
	display: inline-block !important;
}

.td-btn--lg .elementor-button {
	height: 48px !important;
	padding: 0 28px !important;
	font-size: 16px !important;
}
.td-btn--md .elementor-button {
	height: 44px !important;
	padding: 0 20px !important;
	font-size: 14px !important;
}
.td-btn--sm .elementor-button {
	height: 40px !important;
	padding: 0 20px !important;
	font-size: 14px !important;
}

.td-btn--accent .elementor-button {
	background-color: var(--td-accent) !important;
	color: var(--td-accent-fg) !important;
}
.td-btn--accent .elementor-button:hover {
	background-color: rgba(255, 106, 40, .9) !important;
	color: var(--td-accent-fg) !important;
}

.td-btn--ghost .elementor-button {
	background-color: transparent !important;
	color: var(--td-primary-fg) !important;
	border: 1px solid rgba(245, 247, 250, .4) !important;
}

.td-btn--ghost .elementor-button:hover {
	border-color: rgba(245, 247, 250, .75) !important;
	color: var(--td-primary-fg) !important;
}

.td-btn--outline .elementor-button {
	background-color: var(--td-bg) !important;
	color: var(--td-fg) !important;
	border: 1px solid rgba(27, 36, 50, .2) !important;
}

.td-btn--outline .elementor-button:hover {
	border-color: rgba(27, 36, 50, .45) !important;
	color: var(--td-fg) !important;
}

.td-btn--dark .elementor-button {
	background-color: var(--td-primary) !important;
	color: var(--td-primary-fg) !important;
}
.td-btn--dark .elementor-button:hover {
	background-color: #2a3444 !important;
	color: var(--td-primary-fg) !important;
}

.td-btn--link .elementor-button {
	height: auto !important;
	padding: 0 !important;
	background-color: transparent !important;
	color: var(--td-fg) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}

.td-btn--link .elementor-button-icon svg {
	color: var(--td-accent-on-light) !important;
}
.td-btn--link .elementor-button:hover {
	color: var(--td-accent-on-light) !important;
}

/* ============================================================
   HERO
   ============================================================ */
.td-hero {
	position: relative !important;
	overflow: hidden !important;
	border-radius: 20px !important;
}

/* металлический водяной знак TANDIX */
.td-hero::after {
	content: 'TANDIX' !important;
	position: absolute !important;
	left: 16px !important;
	bottom: -48px !important;
	z-index: 1 !important;
	font-family: var(--td-font) !important;
	font-size: 208px !important;
	font-weight: 500 !important;
	line-height: 1 !important;
	letter-spacing: -.05em !important;
	opacity: .12 !important;
	background-image: var(--td-metal) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	color: transparent !important;
	pointer-events: none !important;
	user-select: none !important;
}

.td-hero-inner {
	position: relative !important;
	z-index: 2 !important;
}

.td-hero-title {
	margin-top: 24px !important;
}

.td-hero-title .elementor-heading-title {
	margin: 0 !important;
	max-width: 896px !important;
	font-family: var(--td-font) !important;
	font-size: 36px !important;
	font-weight: 800 !important;
	line-height: 1.03 !important;
	letter-spacing: -.9px !important;
	color: var(--td-primary-fg) !important;
}

.td-hero-title .td-accent-serif {
	color: var(--td-accent) !important;
}

.td-hero-sub {
	margin-top: 24px !important;
}

.td-hero-sub p {
	margin: 0 !important;
	max-width: 576px !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: rgba(245, 247, 250, .85) !important;
}

.td-hero-actions {
	margin-top: 36px !important;
	gap: 12px !important;
}

/* ============================================================
   СТАТИСТИКА (перекрывает hero снизу на 32px)
   ============================================================ */
.td-stats {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 16px !important;
}

.td-stat {
	background-color: var(--td-card) !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 16px !important;
	padding: 24px !important;
}

.td-stat-num .elementor-heading-title {
	margin: 0 !important;
	font-size: 36px !important;
	font-weight: 800 !important;
	line-height: 40px !important;
	letter-spacing: -.9px !important;
	color: var(--td-fg) !important;
}

.td-dot {
	color: var(--td-accent-on-light) !important;
}

.td-stat-label {
	margin-top: 4px !important;
}

.td-stat-label p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: var(--td-muted-fg) !important;
}

/* ============================================================
   СЕТКИ КАРТОЧЕК
   ============================================================ */
.td-cards-3,
.td-cards-3 > .e-con-inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 20px !important;
}

.td-cards-4,
.td-cards-4 > .e-con-inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 20px !important;
}

/* --- секция Industries --- */
.td-head,
.td-head > .e-con-inner {
	display: flex !important;
	flex-direction: row !important;
	justify-content: space-between !important;
	align-items: flex-end !important;
	gap: 24px !important;
}

.td-head-action {
	flex: 0 0 auto !important;
}

.td-ind-sec .td-cards-3 {
	margin-top: 48px !important;
}

.td-card {
	position: relative !important;
	background-color: var(--td-card) !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 16px !important;
	padding: 40px 24px 24px !important;
}

.td-chip {
	position: absolute !important;
	top: -20px !important;
	right: 24px !important;
	z-index: 2 !important;
	margin: 0 !important;
}

.td-chip .elementor-icon {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 56px !important;
	height: 56px !important;
	border-radius: 9999px !important;
	background-image: var(--td-chip-metal) !important;
	box-shadow: inset 0 1px rgba(255, 255, 255, .7), inset 0 -1px 2px rgba(27, 36, 50, .25), 0 4px 10px rgba(27, 36, 50, .18) !important;
	color: var(--td-fg) !important;
}

.td-chip .elementor-icon svg {
	width: 24px !important;
	height: 24px !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
}

.td-card-title .elementor-heading-title {
	margin: 0 !important;
	max-width: 80% !important;
	font-family: var(--td-font) !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 28px !important;
	letter-spacing: -.5px !important;
	color: var(--td-fg) !important;
}

.td-card-text {
	margin-top: 12px !important;
}

.td-card-text p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: var(--td-muted-fg) !important;
}

.td-card .td-btn--link {
	margin-top: 24px !important;
}

/* ============================================================
   CAPABILITIES (светлая карточка с текстурой 8%)
   ============================================================ */
.td-cap {
	position: relative !important;
	overflow: hidden !important;
	border-radius: 20px !important;
}
.td-cap-body {
	position: relative !important;
	z-index: 2 !important;
}

.td-cap-intro {
	margin-top: 16px !important;
}

.td-cap-intro p {
	margin: 0 !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: var(--td-muted-fg) !important;
}

.td-cap-body .td-cards-4 {
	margin-top: 56px !important;
}

.td-cap-card {
	background-color: var(--td-card) !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 16px !important;
	padding: 24px !important;
}

.td-cap-title .elementor-heading-title {
	margin: 0 !important;
	font-family: var(--td-font) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 28px !important;
	letter-spacing: -.45px !important;
	color: var(--td-fg) !important;
}

.td-cap-text {
	margin-top: 12px !important;
}

.td-cap-text p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: var(--td-muted-fg) !important;
}

.td-checks {
	margin-top: 20px !important;
}

.td-checks .elementor-icon-list-items {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.td-checks .elementor-icon-list-item {
	display: flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	font-size: 14px !important;
	line-height: 20px !important;
}

.td-checks .elementor-icon-list-icon {
	line-height: 1 !important;
}
.td-checks .elementor-icon-list-icon svg {
	width: 12px !important;
	height: 12px !important;
	margin-top: 4px !important;
	fill: none !important;
	stroke: var(--td-accent-on-light) !important;
}
.td-checks .elementor-icon-list-text {
	padding-left: 0 !important;
	color: var(--td-fg) !important;
}

.td-cap-action {
	margin-top: 48px !important;
	justify-content: center !important;
}

/* ============================================================
   COMPARE (слайдер CAD ↔ готовая деталь)
   ============================================================ */
.td-compare-grid,
.td-compare-grid > .e-con-inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 40px !important;
	align-items: center !important;
}

.td-compare-sub {
	margin-top: 16px !important;
}

.td-compare-sub p {
	margin: 0 !important;
	max-width: 672px !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: var(--td-muted-fg) !important;
}

.td-compare-action {
	margin-top: 32px !important;
}

.td-compare-media {
	border: 1px solid var(--td-border) !important;
	border-radius: 20px !important;
	overflow: hidden !important;
}

.td-compare {
	position: relative !important;
	width: 100% !important;
	aspect-ratio: 4 / 3 !important;
	overflow: hidden !important;
	border-radius: 12px !important;
	box-shadow: 0 20px 25px -5px rgba(27, 36, 50, .1), 0 8px 10px -6px rgba(27, 36, 50, .1) !important;
	cursor: ew-resize !important;
	touch-action: none !important;
	user-select: none !important;
	--td-pos: 50%;
}

.td-compare-img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}
.td-compare-clip {
	position: absolute !important;
	inset: 0 !important;
	clip-path: inset(0 calc(100% - var(--td-pos)) 0 0) !important;
}
.td-compare-clip img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

.td-compare-div {
	position: absolute !important;
	top: 0 !important;
	bottom: 0 !important;
	left: var(--td-pos) !important;
	width: 2px !important;
	background: var(--td-accent) !important;
	transform: translateX(-50%) !important;
}

.td-compare-handle {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	transform: translate(-50%, -50%) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 9999px !important;
	background: var(--td-accent) !important;
	color: var(--td-accent-fg) !important;
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .2) !important;
}

.td-compare-handle svg {
	width: 20px !important;
	height: 20px !important;
	fill: none !important;
	stroke: currentColor !important;
}

.td-compare-tag {
	position: absolute !important;
	top: 12px !important;
	padding: 4px 8px !important;
	border-radius: 6px !important;
	background: rgba(245, 247, 250, .8) !important;
	-webkit-backdrop-filter: blur(4px) !important;
	backdrop-filter: blur(4px) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	color: var(--td-fg) !important;
}

.td-compare-tag--l {
	left: 12px !important;
}
.td-compare-tag--r {
	right: 12px !important;
}

.td-compare-range {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	opacity: 0 !important;
	cursor: ew-resize !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	background: transparent !important;
}

/* ============================================================
   HOW IT WORKS (тёмная карточка)
   ============================================================ */
.td-steps {
	position: relative !important;
	overflow: hidden !important;
	border-radius: 20px !important;
	color: var(--td-primary-fg) !important;
}

.td-steps::after {
	content: 'TANDIX' !important;
	position: absolute !important;
	left: 50% !important;
	bottom: -40px !important;
	z-index: 1 !important;
	transform: translateX(-50%) !important;
	font-family: var(--td-font) !important;
	font-size: 160px !important;
	font-weight: 500 !important;
	line-height: 1 !important;
	letter-spacing: -.05em !important;
	opacity: .1 !important;
	background-image: var(--td-metal) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	color: transparent !important;
	pointer-events: none !important;
	user-select: none !important;
}

.td-steps-body {
	position: relative !important;
	z-index: 2 !important;
}

.td-steps-grid,
.td-steps-grid > .e-con-inner {
	gap: 40px !important;
	margin-top: 56px !important;
}

.td-step {
	text-align: center !important;
}

.td-step-num .elementor-heading-title {
	display: block !important;
	width: 56px !important;
	height: 56px !important;
	margin: 0 auto !important;
	border-radius: 9999px !important;
	background: var(--td-accent) !important;
	color: var(--td-accent-fg) !important;
	font-family: var(--td-font) !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	line-height: 56px !important;
	text-align: center !important;
}

.td-step-title {
	margin-top: 20px !important;
}

.td-step-title .elementor-heading-title {
	margin: 0 !important;
	font-family: var(--td-font) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 28px !important;
	letter-spacing: -.18px !important;
	color: var(--td-primary-fg) !important;
}

.td-step-text {
	margin-top: 8px !important;
}

.td-step-text p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: rgba(245, 247, 250, .75) !important;
}

/* ============================================================
   ABOUT
   ============================================================ */
.td-about-grid,
.td-about-grid > .e-con-inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 48px !important;
	align-items: center !important;
}

.td-about-media {
	position: relative !important;
}

.td-about-img img {
	display: block !important;
	width: 100% !important;
	aspect-ratio: 4 / 3 !important;
	object-fit: cover !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 20px !important;
	box-shadow: 0 10px 15px -3px rgba(27, 36, 50, .1) !important;
}

.td-about-badge {
	position: absolute !important;
	right: 16px !important;
	bottom: -24px !important;
	padding: 16px 24px !important;
	background: var(--td-card) !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 15px -3px rgba(27, 36, 50, .1) !important;
}

.td-about-num {
	font-family: var(--td-font) !important;
	font-size: 36px !important;
	font-weight: 800 !important;
	line-height: 40px !important;
	letter-spacing: -.9px !important;
	color: var(--td-fg) !important;
}

.td-about-badge-label {
	font-size: 14px !important;
	line-height: 20px !important;
	color: var(--td-muted-fg) !important;
}

.td-about-text .td-h2 {
	margin-top: 20px !important;
}

.td-about-sub {
	margin-top: 16px !important;
}

.td-about-sub p {
	margin: 0 !important;
	max-width: 672px !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: var(--td-muted-fg) !important;
}

.td-about-action {
	margin-top: 32px !important;
}

/* ============================================================
   CTA
   ============================================================ */
.td-cta {
	border-radius: 20px !important;
}

.td-cta-title .elementor-heading-title {
	margin: 0 !important;
	font-family: var(--td-font) !important;
	font-size: 30px !important;
	font-weight: 800 !important;
	line-height: 1.08 !important;
	letter-spacing: -.8px !important;
	color: var(--td-primary-fg) !important;
}

.td-cta-text {
	margin-top: 12px !important;
}

.td-cta-text p {
	margin: 0 !important;
	max-width: 720px !important;
	font-size: 16px !important;
	line-height: 24px !important;
	color: rgba(245, 247, 250, .85) !important;
}

.td-cta-action {
	flex: 0 0 auto !important;
}

/* ============================================================
   АДАПТИВ (брейкпоинты прототипа: sm=640, lg=1024)
   ============================================================ */
@media (min-width: 640px) {
	.td-h2 .elementor-heading-title {
	font-size: 36px !important;
}
	.td-hero-title .elementor-heading-title {
	font-size: 60px !important;
	letter-spacing: -1.5px !important;
}
	.td-hero-sub p {
	font-size: 18px !important;
	line-height: 28px !important;
}
	.td-cards-3, .td-cards-3 > .e-con-inner {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
	.td-cards-4, .td-cards-4 > .e-con-inner {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
	.td-about-badge {
	display: block !important;
}
	/* шапка секции: в прототипе flex-col sm:flex-row sm:items-end — строка уже с 640 */
	.td-head,
	.td-head > .e-con-inner {
	flex-direction: row !important;
	align-items: flex-end !important;
}
}

@media (min-width: 1024px) {
	.td-h2 .elementor-heading-title {
	font-size: 48px !important;
	letter-spacing: -1.2px !important;
}
	.td-hero-title .elementor-heading-title {
	font-size: 72px !important;
	letter-spacing: -1.8px !important;
}
	.td-cards-3, .td-cards-3 > .e-con-inner {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
	.td-cards-4, .td-cards-4 > .e-con-inner {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
	.td-compare-grid, .td-compare-grid > .e-con-inner {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
	.td-about-grid, .td-about-grid > .e-con-inner {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
	.td-cta-title .elementor-heading-title {
	font-size: 36px !important;
}
	/* статистика: 4 колонки только с lg (в прототипе grid-cols-2 lg:grid-cols-4) */
	.td-stats {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
}

@media (max-width: 1023px) {
	.td-head,
	.td-head > .e-con-inner {
	flex-direction: column !important;
	align-items: flex-start !important;
}
	.td-hero::after {
	bottom: -24px !important;
	font-size: 96px !important;
}
	.td-steps::after {
	bottom: -24px !important;
	font-size: 80px !important;
}
	.td-cta {
	flex-direction: column !important;
	align-items: flex-start !important;
}
	.td-cta .td-cta-action, .td-cta .td-cta-body {
	width: 100% !important;
}
	.td-about-badge {
	position: static !important;
	margin-top: 16px !important;
	display: inline-block !important;
}
	.td-about-media {
	margin-bottom: 8px !important;
}
	.td-btn .elementor-button {
	width: 100% !important;
}
	.td-hero-actions .td-btn,
	.td-hero-actions .td-btn .elementor-button {
	width: 100% !important;
}
	.td-head-action, .td-head-action .td-btn, .td-head-action .td-btn .elementor-button {
	width: 100% !important;
}
	.td-card .td-btn .elementor-button,
	.td-compare-action .td-btn .elementor-button,
	.td-cap-action .td-btn .elementor-button,
	.td-about-action .td-btn .elementor-button {
	width: auto !important;
}
}

/* ============================================================
   ГЕОМЕТРИЯ СЕКЦИЙ
   Boxed-секция прототипа = `mx-auto max-w-[1400px] px-8`:
   контент 1336 при вьюпорте 1425. Elementor кладёт max-width на .e-con-inner,
   а padding — на внешний .e-con, из-за чего контент выходил 1361.
   Поэтому геометрию секций задаём здесь целиком.
   ============================================================ */
.td-sec > .e-con-inner {
	max-width: 1400px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 96px 32px !important;
}

.td-stats-sec > .e-con-inner {
	max-width: 1400px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 32px !important;
}

.td-hero-sec > .e-con-inner {
	max-width: none !important;
	padding: 12px 16px 0 !important;
}
.td-cap-sec > .e-con-inner,
.td-steps-sec > .e-con-inner {
	max-width: none !important;
	padding: 0 16px !important;
}
.td-cta-sec > .e-con-inner {
	max-width: none !important;
	padding: 0 16px 12px !important;
}

/* CTA: текст слева (растягивается), кнопка справа */
.td-cta > .e-con-inner {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 32px !important;
}

.td-cta-body {
	flex: 1 1 auto !important;
	min-width: 0 !important;
}

/* шапка hello-elementor не нужна — контент страницы начинается с hero */
.page-header {
	display: none !important;
}

/* ============================================================
   SVG-иконки (грабля #10): Elementor красит SVG через fill, из-за чего
   контурные Lucide-иконки превращаются в монолитную заливку.
   ============================================================ */
.elementor-widget-icon svg[fill="none"],
.elementor-icon-list-icon svg[fill="none"],
.elementor-button-icon svg[fill="none"] {
	fill: none !important;
}

@media (max-width: 1023px) {
	.td-sec > .e-con-inner {
	padding: 64px 24px !important;
}
	.td-stats-sec > .e-con-inner {
	padding: 0 24px !important;
}
	.td-cta > .e-con-inner {
	flex-direction: column !important;
	align-items: flex-start !important;
}
}

/* ============================================================
   Базовый шрифт проекта. Elementor в своём kit-CSS жёстко ставит Roboto на
   .elementor-heading-title / .elementor-button / text-editor, поэтому одной
   настройки body недостаточно. Акцентный курсив (.td-accent-serif) и mono-плашка
   (.td-label-text) — другие элементы со своими правилами, наследование их не ломает.
   ============================================================ */
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-button .elementor-button,
.elementor-widget-icon-list .elementor-icon-list-text {
	font-family: var(--td-font) !important;
}

/* ============================================================
   ФИКСЫ ПО ЗАМЕРАМ (1440)
   ============================================================ */

/* boxed-секция: padding живёт на .e-con-inner (max-w-1400 + px-32 = контент 1336).
   У внешнего .e-con padding должен быть 0, иначе он складывался с внутренним
   и контент выходил 1297 вместо 1336. */
.td-sec,
.td-stats-sec {
	padding: 0 !important;
}

/* CTA: Elementor вешает на контейнеры .e-con-full {
	width: 100% !important;
}, из-за чего
   в flex-строке кнопка забирала всю ширину, а текст схлопывался в 0. */
.td-cta {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 32px !important;
}

.td-cta-body {
	flex: 1 1 0 !important;
	width: auto !important;
	min-width: 0 !important;
}
.td-cta-action {
	flex: 0 0 auto !important;
	width: auto !important;
}

/* h2: у левых шапок прототипа ограничение max-w-2xl (672px), у центрированных — нет */
.td-h2 {
	max-width: 672px !important;
}
.td-head-center .td-h2 {
	max-width: none !important;
}

/* акцентный курсив на тёмном фоне — яркий accent, на светлом — accent-on-light */
.td-h2--light .td-accent-serif {
	color: var(--td-accent) !important;
}
.td-cta-title .td-accent-serif {
	color: var(--td-accent) !important;
}

/* CTA-текст в прототипе — primary-foreground/80 */
.td-cta-text p {
	color: rgba(245, 247, 250, .8) !important;
}

@media (max-width: 1023px) {
	.td-cta {
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
}
	.td-cta-body, .td-cta-action {
	width: 100% !important;
}
}

/* ============================================================
   ФИКСЫ №2 (замеры): колонки внутри flex-строк Elementor получают
   .e-con-full {
	width: 100% !important;
} и переносятся на новую строку (flex-wrap),
   поэтому шапка Industries «пухла» на 70px.
   ============================================================ */
.td-head {
	flex-wrap: nowrap !important;
}
.td-head-text {
	flex: 1 1 auto !important;
	width: auto !important;
	min-width: 0 !important;
}
.td-head-action {
	flex: 0 0 auto !important;
	width: auto !important;
}

/* чек-листы: Elementor добавляет отступы/высоту строки, из-за чего
   3 пункта занимали 104px вместо 76 (3×20 + 2×8). */
.td-checks .elementor-icon-list-items {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.td-checks .elementor-icon-list-item,
.td-checks .elementor-icon-list-item > a,
.td-checks .elementor-icon-list-item > span {
	display: flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
}

.td-checks .elementor-icon-list-icon {
	display: flex !important;
	flex: 0 0 auto !important;
	align-items: flex-start !important;
	height: 20px !important;
	padding: 0 !important;
}

.td-checks .elementor-icon-list-text {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 14px !important;
	line-height: 20px !important;
}

/* кнопка под карточками capabilities: в прототипе отступ 40, не 48 */
.td-cap-action {
	margin-top: 40px !important;
}

/* ============================================================
   HERO-оверлей: Elementor рисует свой 2-стоповый градиент на ::before,
   из-за чего картинка просвечивала сильнее прототипа. В макете — три стопа:
   `bg-gradient-to-r from-primary via-primary/92 to-primary/50`
   (на мобильном — плоский bg-primary/85).
   ============================================================ */
/* content/positioning задаём явно: без `content` псевдоэлемент не создаётся,
   и градиент молча не рисуется (проверено замером яркости области hero). */
.td-hero::before {
	content: '' !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	display: block !important;
	background-color: transparent !important;
	background-image: linear-gradient(90deg, #1b2432 0%, rgba(27, 36, 50, .92) 50%, rgba(27, 36, 50, .5) 100%) !important;
}

@media (max-width: 639px) {
	.td-hero::before {
	background-color: rgba(27, 36, 50, .85) !important;
	background-image: none !important;
}
}

/* ============================================================
   АДАПТИВ: паддинги и типографика по брейкпоинтам ПРОТОТИПА
   (Tailwind: base / sm 640 / lg 1024). Раньше были упрощённые значения —
   на 375 страница выходила на ~1000px выше макета.
   ============================================================ */

/* boxed-секции: px-4 py-16 / sm:px-6 / lg:px-8 lg:py-24 */
@media (max-width: 639px) {
	.td-sec > .e-con-inner {
	padding: 64px 16px !important;
}
	.td-stats-sec > .e-con-inner {
	padding: 0 16px !important;
}

	/* hero-карточка: px-6 py-16, минимальная высота не задаётся (в макете её нет) */
	.td-hero {
	min-height: 0 !important;
	padding: 64px 24px !important;
}
	.td-hero-sec > .e-con-inner {
	padding: 12px 12px 0 !important;
}

	/* тёмные/светлые карточки: px-6 py-16 */
	.td-cap, .td-steps {
	padding: 64px 24px !important;
}
	.td-cap-sec > .e-con-inner, .td-steps-sec > .e-con-inner {
	padding: 0 12px !important;
}
	.td-cta-sec > .e-con-inner {
	padding: 0 12px 12px !important;
}
	.td-cta {
	padding: 56px 24px !important;
}

	/* футер: px-6 py-14 */
	.td-footer-sec {
	padding: 0 12px 12px !important;
}
	.td-footer-card {
	padding: 56px 24px !important;
}

	/* бейдж «18+» в прототипе скрыт до sm */
	.td-about-badge {
	display: none !important;
}

	/* заголовок CTA: text-2xl (24) до sm */
	.td-cta-title .elementor-heading-title {
	font-size: 24px !important;
	letter-spacing: -.6px !important;
}
}

@media (min-width: 640px) and (max-width: 1023px) {
	.td-sec > .e-con-inner {
	padding: 64px 24px !important;
}
	.td-stats-sec > .e-con-inner {
	padding: 0 24px !important;
}

	/* hero: sm:px-10 sm:py-24 */
	.td-hero {
	min-height: 0 !important;
	padding: 96px 40px !important;
}
	.td-hero-sec > .e-con-inner {
	padding: 12px 16px 0 !important;
}

	/* карточки: sm:px-10 lg:py-24 */
	.td-cap, .td-steps {
	padding: 64px 40px !important;
}
	.td-cta {
	padding: 56px 40px !important;
}

	.td-footer-card {
	padding: 56px 40px !important;
}

	/* заголовок CTA: sm:text-4xl (36) */
	.td-cta-title .elementor-heading-title {
	font-size: 36px !important;
	letter-spacing: -.8px !important;
}
}

/* ============================================================
   TANDIX — Site Header и Site Footer (Theme Builder).
   Замеры прототипа (1440):
   шапка — 1425x112 sticky, bg #f5f7fa/70 + blur 8px, контент max-w 1400 px-40,
   лого 101x80, ссылки 14/20 w600 ls .7px uppercase паддинг 8/12 radius 6,
   разделители 1x20 #b8420e, кнопка 149x44, EN-чип 80x44;
   футер — секция px-16 pb-12, тёмная карточка r20 padding 56/64,
   сетка 4 равных колонки gap 40, лого 121x96, заголовки 12/16 w700 ls 2.16px,
   ссылки min-h 32 (14/20 /75), металлическая линия (mt 48), нижняя строка 12/16 /70.
   ============================================================ */

/* ============================== HEADER ============================== */
.td-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 50 !important;
	width: 100% !important;
	background-color: rgba(245, 247, 250, .7) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	backdrop-filter: blur(8px) !important;
}

.td-header-inner,
.td-header-inner > .e-con-inner {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	max-width: 1400px !important;
	height: 112px !important;
	margin: 0 auto !important;
	padding: 0 40px !important;
}

.td-logo {
	flex: 0 0 auto !important;
}

.td-logo-link {
	display: inline-flex !important;
	align-items: center !important;
}

.td-logo-img {
	display: block !important;
	width: auto !important;
	height: 80px !important;
	filter: drop-shadow(0 4px 10px rgba(27, 36, 50, .18)) !important;
}

/* --- меню --- */
/* .e-con-full {
	width: 100% !important;
} у Elementor: без width:auto блок действий раздувался
   до ширины контента (1320) и выдавливал меню за вьюпорт (scrollWidth 1473). */
.td-nav {
	flex: 0 1 auto !important;
	width: auto !important;
	min-width: 0 !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu {
	display: flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu > li {
	position: relative !important;
}

/* разделитель между пунктами — 1x20 accent-on-light (в прототипе отдельный span) */
.td-nav .elementor-nav-menu--main .elementor-nav-menu > li + li::before {
	content: '' !important;
	position: absolute !important;
	left: -2px !important;
	top: 50% !important;
	width: 1px !important;
	height: 20px !important;
	transform: translateY(-50%) !important;
	background: var(--td-accent-on-light) !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
	display: flex !important;
	align-items: center !important;
	gap: 4px !important;
	padding: 8px 12px !important;
	border-radius: 6px !important;
	font-family: var(--td-font) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 20px !important;
	letter-spacing: .05em !important;
	text-transform: uppercase !important;
	color: var(--td-fg) !important;
	text-decoration: none !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item:hover,
.td-nav .elementor-nav-menu--main .elementor-nav-menu > li.current-menu-item > a.elementor-item {
	color: var(--td-accent-on-light) !important;
}

.td-nav .sub-arrow {
	display: inline-flex !important;
	align-items: center !important;
	font-size: 12px !important;
	line-height: 1 !important;
}

.td-nav .sub-arrow svg,
.td-nav .sub-arrow i {
	width: 14px !important;
	height: 14px !important;
}

/* выпадающий список Industries */
.td-nav .elementor-nav-menu--main .elementor-nav-menu .sub-menu {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	z-index: 100 !important;
	display: none !important;
	min-width: 258px !important;
	margin: 0 !important;
	padding: 8px !important;
	list-style: none !important;
	background: var(--td-card) !important;
	border: 1px solid var(--td-border) !important;
	border-radius: 8px !important;
	box-shadow: 0 16px 40px rgba(27, 36, 50, .14) !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu > li:hover > .sub-menu,
.td-nav .elementor-nav-menu--main .elementor-nav-menu > li:focus-within > .sub-menu {
	display: block !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu .sub-menu a.elementor-item {
	display: block !important;
	padding: 8px 12px !important;
	border-radius: 6px !important;
	font-family: var(--td-font) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 20px !important;
	letter-spacing: .04em !important;
	text-transform: uppercase !important;
	color: var(--td-fg) !important;
	text-decoration: none !important;
}

.td-nav .elementor-nav-menu--main .elementor-nav-menu .sub-menu a.elementor-item:hover {
	color: var(--td-accent-on-light) !important;
	background: var(--td-muted) !important;
}

/* --- правая группа: EN-чип + кнопка --- */
.td-header-actions {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 12px !important;
	flex: 0 0 auto !important;
	width: auto !important;
}

.td-lang-chip {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	min-height: 44px !important;
	padding: 0 12px !important;
	border-radius: 6px !important;
	background-image: var(--td-chip-metal) !important;
	font-family: var(--td-font) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 16px !important;
	color: var(--td-fg) !important;
	cursor: pointer !important;
	user-select: none !important;
}

.td-lang-globe,
.td-lang-chev {
	width: 14px !important;
	height: 14px !important;
	fill: none !important;
	stroke: currentColor !important;
}

.td-header-cta {
	flex: 0 0 auto !important;
}

/* --- мобильная версия шапки --- */
@media (max-width: 1023px) {
	.td-header-inner,
	.td-header-inner > .e-con-inner {
	height: 96px !important;
	padding: 0 24px !important;
}
	.td-logo-img {
	height: 64px !important;
}
}

@media (max-width: 639px) {
	.td-lang,
	.td-header-cta {
	display: none !important;
}
}

/* ============================== FOOTER ============================== */
.td-footer-sec {
	padding: 0 16px 12px !important;
}

.td-footer-card {
	position: relative !important;
	overflow: hidden !important;
	max-width: 1400px !important;
	margin: 0 auto !important;
	border-radius: 20px !important;
	color: var(--td-primary-fg) !important;
}

/* металлический водяной знак TANDIX (справа снизу) */
.td-footer-card::after {
	content: 'TANDIX' !important;
	position: absolute !important;
	right: 32px !important;
	bottom: -64px !important;
	z-index: 1 !important;
	font-family: var(--td-font) !important;
	font-size: 256px !important;
	font-weight: 500 !important;
	line-height: 1 !important;
	letter-spacing: -.05em !important;
	opacity: .12 !important;
	background-image: var(--td-metal) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	color: transparent !important;
	pointer-events: none !important;
	user-select: none !important;
}

.td-footer-grid,
.td-footer-grid > .e-con-inner {
	position: relative !important;
	z-index: 2 !important;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 40px !important;
	width: 100% !important;
}

.td-f-logo {
	display: block !important;
	width: auto !important;
	height: 96px !important;
}

.td-f-tagline {
	margin-top: 16px !important;
}

.td-f-tagline p {
	margin: 0 !important;
	max-width: 320px !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: rgba(245, 247, 250, .75) !important;
}

.td-f-cta {
	margin-top: 24px !important;
}

.td-f-title .elementor-heading-title {
	margin: 0 !important;
	font-family: var(--td-font) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 16px !important;
	letter-spacing: .18em !important;
	text-transform: uppercase !important;
	color: var(--td-primary-fg) !important;
}

.td-f-list {
	margin-top: 8px !important;
}

.td-f-list ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.td-f-list li a {
	display: flex !important;
	align-items: center !important;
	min-height: 32px !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: rgba(245, 247, 250, .75) !important;
	text-decoration: none !important;
	transition: color .15s ease !important;
}

.td-f-list li a:hover {
	color: var(--td-accent) !important;
}

.td-f-contact-wrap {
	margin-top: 12px !important;
}

.td-f-contact {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.td-f-contact li {
	display: flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	margin-bottom: 8px !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: rgba(245, 247, 250, .8) !important;
}

.td-f-contact a {
	color: inherit !important;
	text-decoration: none !important;
}
.td-f-contact a:hover {
	color: var(--td-accent) !important;
}
.td-f-contact .td-ci {
	flex: 0 0 auto !important;
	width: 16px !important;
	height: 16px !important;
	margin-top: 2px !important;
	fill: none !important;
	stroke: var(--td-accent) !important;
}

.td-footer-bottom,
.td-footer-bottom > .e-con-inner {
	position: relative !important;
	z-index: 2 !important;
	width: 100% !important;
}

.td-metal-line-wrap {
	margin-top: 48px !important;
}

.td-metal-line {
	height: 1px !important;
	background-image: linear-gradient(90deg, rgba(0, 0, 0, 0), #9a9a9a 20%, #e0e1e0 50%, #767677 80%, rgba(0, 0, 0, 0)) !important;
}

.td-f-bottom-inner {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	padding-top: 24px !important;
	font-size: 12px !important;
	line-height: 16px !important;
	color: rgba(245, 247, 250, .7) !important;
}

.td-f-bottom-inner p {
	margin: 0 !important;
}
.td-f-bottom-inner a {
	color: inherit !important;
	text-decoration: none !important;
}
.td-f-bottom-inner a:hover {
	color: var(--td-accent) !important;
}

@media (min-width: 640px) {
	.td-f-bottom-inner {
	flex-direction: row !important;
}
}

@media (min-width: 768px) {
	.td-footer-grid,
	.td-footer-grid > .e-con-inner {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
}
