/*
 * Client lists (inc/clients.php). Figma "About" 2148:43781, section "Clients" 43919:
 * logo wall 43928 (150 × 46 logos, four across, 56 apart), "Who we supply" marquee 43958.
 * Figma "Clientele" 2148:47078: grids 47131 (six across, 100 high cells, 1px Line between).
 */

/* Logo wall */
.tmcl-wall {
	display: grid;
	grid-template-columns: repeat(4, 150px);
	justify-content: space-between;
	align-items: center;
	row-gap: 46px;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.tmcl-wall li {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 46px;
}
body .tmcl-wall img {
	display: block;
	width: auto;
	max-width: 150px;
	height: auto;
	max-height: 46px;
	object-fit: contain;
}

/* Clientele grids: six across, hairlines from the gap */
.tmcl-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1px;
	width: 100%;
	margin: 0;
	padding: 0;
	background: var(--line, #E4E4E7);
	list-style: none;
}
.tmcl-grid li {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 100px;
	padding: 16px;
	background: var(--white, #FFFFFF);
	text-align: center;
}
.tmcl-grid span {
	color: var(--body, #656569);
	font-size: 14px;
	line-height: 1.45;
}
body .tmcl-grid img {
	display: block;
	width: auto;
	max-width: 150px;
	height: auto;
	max-height: 49px;
	object-fit: contain;
}

/* Who we supply */
.tmcl-marquee {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.tmcl-track {
	display: flex;
	width: max-content;
	animation: tmcl-scroll var(--tmcl-dur, 40s) linear infinite;
}
.tmcl-marquee:hover .tmcl-track {
	animation-play-state: paused;
}
.tmcl-track ul {
	display: flex;
	gap: 64px;
	margin: 0;
	padding: 11px 64px 11px 0;
	list-style: none;
}
.tmcl-track li {
	color: var(--body, #656569);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -.2px;
	white-space: nowrap;
}
@keyframes tmcl-scroll {
	to {
		transform: translateX(-50%);
	}
}

@media (max-width: 1024px) {
	.tmcl-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.tmcl-wall {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		column-gap: 24px;
	}
	body .tmcl-wall img {
		max-width: 100%;
	}
}
@media (max-width: 767px) {
	.tmcl-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.tmcl-grid li {
		min-height: 64px;
		padding: 10px 6px;
	}
	.tmcl-grid li.is-wide {
		display: none;
	}
	.tmcl-grid span {
		font-size: 13px;
	}
	body .tmcl-grid img {
		max-height: 34px;
	}
	.tmcl-wall {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		row-gap: 28px;
	}
	.tmcl-wall li {
		height: 40px;
	}
	body .tmcl-wall img {
		max-height: 36px;
	}
	.tmcl-marquee {
		width: 100%;
	}
	.tmcl-track ul {
		gap: 40px;
		padding-right: 40px;
	}
	.tmcl-track li {
		font-size: 20px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.tmcl-marquee {
		-webkit-mask-image: none;
		mask-image: none;
	}
	.tmcl-track {
		width: auto;
		animation: none;
	}
	.tmcl-track ul {
		flex-wrap: wrap;
		gap: 12px 32px;
		padding: 0;
	}
	.tmcl-track ul[aria-hidden] {
		display: none;
	}
}

/*
 * "Welspun makes it" (Figma update 4054:125). Split (About, doorways) 4054:16785; home 4054:490;
 * "Certified at the factory" band 4054:2925.
 */
.tmcs,
.tmhc,
.tmcb {
	width: 100%;
	color: var(--ink, #171719);
}
body a.tmcs-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding-top: 8px;
	color: var(--ink, #171719);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
}
body a.tmcs-link span {
	font-weight: 400;
	transition: transform var(--m-dur-s, 200ms);
}
body a.tmcs-link:hover span {
	transform: translateX(3px);
}
body img.tmcs-partner,
body .elementor img.tmcs-partner {
	display: block;
	width: auto;
	max-width: none;
	height: 26px;
}

/* Split */
.tmcs {
	display: flex;
	align-items: flex-start;
	gap: 80px;
}
.tmcs-intro {
	display: flex;
	flex: 0 0 470px;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
}
.tmcs-intro > * {
	margin: 0;
}
.tmcs-intro .tmcs-p {
	margin-top: -16px;
}
.tmcs-badge {
	display: inline-flex;
	align-items: center;
	gap: 24px;
	padding: 16px 24px;
	border: 1px solid #E4E4E7;
	background: #FBFBFA;
}
.tmcs-rule {
	width: 1px;
	height: 30px;
	background: #E4E4E7;
}
.tmcs .tmcs-h {
	max-width: 403px;
	color: var(--ink, #171719);
	font-size: 30px;
	font-weight: 600;
	line-height: 1.33;
	letter-spacing: -.5px;
}
.tmcs-p {
	color: var(--body, #656569);
	font-size: 15px;
	line-height: 1.6;
}
.tmcs-walls {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 56px;
	min-width: 0;
	padding-top: 8px;
}
.tmcs-wall {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 142px));
	justify-content: space-between;
	align-items: center;
	gap: 48px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.tmcs-wall li,
.tmhc-grid li {
	display: flex;
	justify-content: center;
	align-items: center;
}
.tmcs-wall li {
	height: 46px;
}
body .tmcs-wall img,
body .tmhc-grid img {
	display: block;
	width: auto;
	max-width: 142px;
	height: auto;
	max-height: 46px;
	object-fit: contain;
}

/* Home */
.tmhc {
	display: flex;
	flex-direction: column;
	gap: 40px;
}
.tmhc-who {
	display: flex;
	flex-direction: column;
	gap: 32px;
}
.tmhc-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
}
.tmhc-titles {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 760px;
}
.tmhc .tmhc-h {
	margin: 0;
	color: var(--ink, #171719);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.32;
	letter-spacing: -.3px;
}
.tmhc-head .tmcs-link {
	padding-top: 0;
}
.tmhc-panels {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
}
.tmhc-panel {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
}
.tmhc-panel-head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}
.tmhc-panel-head p {
	margin: 0;
	color: var(--body, #656569);
	font-size: 14px;
	line-height: 1.6;
}
.tmhc-grid,
.tmhc-seals {
	display: grid;
	gap: 1px;
	margin: 0;
	padding: 1px;
	list-style: none;
	background: #E4E4E7;
}
.tmhc-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.tmhc-grid li,
.tmhc-seals li {
	background: #FFFFFF;
}
.tmhc-grid li {
	height: 104px;
	padding: 0 16px;
}
.tmhc-certs {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.tmhc-label,
.tmcb-eyebrow {
	margin: 0;
	color: #6F6556;
	font-size: 10px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 1.6px;
	text-transform: uppercase;
}
.tmhc-seals {
	grid-template-columns: repeat(8, minmax(0, 1fr));
}
.tmhc-seals li {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 128px;
	padding: 12px;
}
body .tmhc-seals img {
	display: block;
	width: auto;
	max-width: min(123px, 100%);
	height: auto;
	max-height: 90px;
	object-fit: contain;
}
body .tmhc-more a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	color: var(--ink, #171719);
	text-decoration: none;
}
.tmhc-more strong {
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -.3px;
}
.tmhc-more a > span {
	color: var(--body, #656569);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
}
body .tmhc-more a:hover > span {
	color: var(--ink, #171719);
}

/* "Certified at the factory" */
.tmcb {
	padding: 80px;
	background: #FBFBFA;
}
.tmcb-in {
	display: flex;
	flex-direction: column;
	gap: 40px;
	max-width: 1280px;
	margin: 0 auto;
}
.tmcb-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 48px;
}
.tmcb-copy {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.tmcb-eyebrow {
	font-size: 11px;
}
.tmcb .tmcb-h {
	max-width: 780px;
	margin: 0;
	color: var(--ink, #171719);
	font-size: 30px;
	font-weight: 600;
	line-height: 1.28;
	letter-spacing: -.5px;
}
.tmcb-p {
	max-width: 720px;
	margin: 0;
	color: var(--body, #656569);
	font-size: 16px;
	line-height: 1.62;
}
.tmcb-items {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.tmcb-items li {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-top: 24px;
	border-top: 1px solid #E4E4E7;
}
.tmcb-icon {
	width: 22px;
	height: 22px;
	color: var(--ink, #171719);
}
.tmcb .tmcb-items h3 {
	margin: 0;
	color: var(--ink, #171719);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.34;
	letter-spacing: -.2px;
}
.tmcb-items p {
	margin: 0;
	color: var(--body, #656569);
	font-size: 14px;
	line-height: 1.6;
}

@media (max-width: 1024px) {
	.tmcs {
		flex-direction: column;
		gap: 48px;
	}
	.tmcs-intro {
		flex-basis: auto;
	}
	.tmhc-panels {
		grid-template-columns: 1fr;
	}
	.tmhc-seals {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.tmcb {
		padding: 64px 40px;
	}
	.tmcb-items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 767px) {
	.tmcs-intro {
		gap: 24px;
	}
	.tmcs-intro .tmcs-p {
		margin-top: -12px;
	}
	.tmcs-badge {
		gap: 16px;
		padding: 12px 16px;
	}
	body img.tmcs-partner,
	body .elementor img.tmcs-partner {
		height: 22px;
	}
	.tmcs .tmcs-h {
		font-size: 24px;
	}
	.tmcs-wall {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 32px 16px;
	}
	body .tmcs-wall img {
		max-width: 100%;
		max-height: 38px;
	}
	.tmhc-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}
	.tmhc .tmhc-h {
		font-size: 20px;
	}
	.tmhc-grid li {
		height: 80px;
		padding: 0 10px;
	}
	body .tmhc-grid img {
		max-width: 100%;
		max-height: 36px;
	}
	.tmhc-seals {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.tmhc-seals li {
		height: 112px;
	}
	.tmcb {
		padding: 56px 20px;
	}
	.tmcb-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}
	.tmcb .tmcb-h {
		font-size: 24px;
	}
	.tmcb-items {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

.tmcs-badge {
	margin: 0;
	align-self: flex-start;
}


/* Division bands (Figma 4054:5823 flooring, 4054:10873 home linen) */
.tmcb.is-plain {
	background: #FFFFFF;
}
.tmcb-seals,
.tmcb-marks {
	display: grid;
	gap: 1px;
	margin: 0;
	padding: 1px;
	list-style: none;
	background: #E4E4E7;
}
.tmcb-seals {
	grid-template-columns: repeat(7, minmax(0, 1fr));
}
.tmcb-seals li {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 136px;
	padding: 16px;
	background: #FFFFFF;
}
body .tmcb-seals img {
	display: block;
	width: auto;
	max-width: min(110px, 100%);
	height: auto;
	max-height: 100px;
	object-fit: contain;
}
.tmcb-marks {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.tmcb-marks li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 32px 24px;
	background: #FFFFFF;
	text-align: center;
}
.tmcb-mark {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 96px;
}
body .tmcb-mark img {
	display: block;
	width: auto;
	max-width: 140px;
	height: auto;
	max-height: 96px;
	object-fit: contain;
}
body .tmcb-marks h3 {
	margin: 12px 0 0;
	color: var(--ink, #171719);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
}
.tmcb-marks p {
	margin: 0;
	color: var(--body, #656569);
	font-size: 14px;
	line-height: 1.57;
}
@media (min-width: 768px) {
	.tmcb-seals li.tmcb-all {
		display: none;
	}
}
@media (max-width: 1024px) {
	.tmcb-seals {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}
@media (max-width: 767px) {
	.tmcb-seals {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.tmcb-seals li {
		height: 104px;
		padding: 12px;
	}
	body .tmcb-seals img {
		max-height: 72px;
	}
	.tmcb-seals li.is-empty,
	.tmcb:has(.tmcb-all) .tmcb-head .tmcs-link {
		display: none;
	}
	body .tmcb-all a {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--ink, #171719);
		font-size: 15px;
		font-weight: 500;
		text-decoration: none;
	}
	.tmcb-marks {
		grid-template-columns: 1fr;
	}
	/* Figma 4054:11016: each mark is a row, logo on the left, name and line beside it. */
	.tmcb-marks li {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		grid-template-rows: auto 1fr;
		column-gap: 16px;
		row-gap: 4px;
		align-items: start;
		padding: 20px 16px;
		text-align: left;
	}
	.tmcb-mark {
		grid-row: 1 / 3;
		align-self: center;
		height: 64px;
	}
	body .tmcb-mark img {
		max-width: 96px;
		max-height: 64px;
	}
	body .tmcb-marks h3 {
		margin: 0;
	}
	.tmcb-marks p {
		font-size: 13px;
	}
}

/* Home clients on mobile (Figma 4054:1020): link under the logos, five seals three across. */
body a.tmhc-link-m,
.tmhc-more-m {
	display: none;
}
@media (max-width: 767px) {
	.tmhc-head .tmcs-link {
		display: none;
	}
	body a.tmhc-link-m {
		display: inline-flex;
		align-self: flex-start;
		padding-top: 0;
	}
	.tmhc-seals {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.tmhc-seals li:nth-child(n+6):not(.tmhc-more) {
		display: none;
	}
	.tmhc-seals li {
		height: 88px;
		padding: 10px;
	}
	body .tmhc-seals img {
		max-height: 60px;
	}
	.tmhc-more-d {
		display: none;
	}
	.tmhc-more-m {
		display: block;
	}
	.tmhc-more strong {
		font-size: 17px;
	}
	.tmhc-who {
		gap: 24px;
	}
	.tmhc-grid li {
		height: 72px;
	}
}

/* "Certified at the factory" on mobile: the link closes the band, after the points. */
@media (max-width: 767px) {
	.tmcb-head {
		display: contents;
	}
	.tmcb-in > .tmcb-items {
		order: 1;
	}
	.tmcb-in > .tmcs-link,
	.tmcb-head .tmcs-link {
		order: 2;
	}
	.tmcb-copy {
		order: 0;
	}
	body .tmcs-wall img {
		max-width: 92px;
		max-height: 26px;
	}
	.tmcs-wall li {
		height: 32px;
	}
	.tmcs-wall {
		gap: 36px 16px;
	}
}