/* =============================================================================
   TEN DIGITALS - GLOBAL FOOTER
   Spec 2: brand statement, Explore, Capabilities, Connect, locations,
   legal and the primary CTA.
   ========================================================================== */

.td-footer {
	background: var(--td-bg);
	border-top: 1px solid var(--td-line);
	overflow: hidden;
	position: relative;
}

.td-footer__inner {
	display: grid;
	gap: var(--td-s-8);
	grid-template-columns: minmax(0, 1fr);
	padding-block: clamp(56px, 6vw, 96px) var(--td-s-7);
	position: relative;
	z-index: 1;
}

@media (min-width: 768px) {
	.td-footer__inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, 2fr); }
}

@media (min-width: 1024px) {
	.td-footer__inner { grid-template-columns: minmax(0, 1.25fr) minmax(0, 2.4fr); gap: var(--td-s-10); }
}

/* -- Brand block ------------------------------------------------------------ */

.td-footer__brand { display: flex; flex-direction: column; gap: var(--td-s-4); }

.td-footer__logo { height: 40px; width: auto; }

.td-footer__descriptor {
	color: var(--td-ink-2);
	font-size: var(--td-fs-sm);
	max-width: 34ch;
}

.td-footer__statement {
	color: var(--td-ink);
	font-family: var(--td-font-display);
	font-size: var(--td-fs-h4);
	font-weight: 500;
	letter-spacing: var(--td-tracking-head);
	line-height: 1.34;
	max-width: 22ch;
}

.td-footer__lifecycle {
	color: var(--td-ink-4);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--td-font-mono);
	font-size: 0.6875rem;
	gap: 8px;
	letter-spacing: 0.12em;
	margin-top: var(--td-s-2);
	text-transform: uppercase;
}

.td-footer__lifecycle span::after {
	color: var(--td-accent);
	content: " \2192";
	margin-left: 8px;
}

.td-footer__lifecycle span:last-child::after { content: ""; }

/* -- Link columns ----------------------------------------------------------- */

.td-footer__cols {
	display: grid;
	gap: var(--td-s-6) var(--td-s-5);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 640px)  { .td-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .td-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.td-footer__col-title {
	color: var(--td-ink);
	font-size: var(--td-fs-eyebrow);
	font-weight: 600;
	letter-spacing: var(--td-tracking-eyebrow);
	margin-bottom: var(--td-s-4);
	text-transform: uppercase;
}

.td-footer__list { display: grid; gap: 10px; }

.td-footer__list a {
	color: var(--td-ink-3);
	font-size: var(--td-fs-sm);
	text-decoration: none;
	transition: color var(--td-t-micro) var(--td-ease),
	            transform var(--td-t-micro) var(--td-ease);
	width: fit-content;
}

.td-footer__list a:hover,
.td-footer__list a:focus-visible {
	color: var(--td-ink);
	transform: translateX(3px);
}

/* -- Footer CTA band -------------------------------------------------------- */

.td-footer__cta {
	align-items: center;
	border-top: 1px solid var(--td-line);
	display: flex;
	flex-wrap: wrap;
	gap: var(--td-s-5);
	justify-content: space-between;
	padding-block: var(--td-s-7);
	position: relative;
	z-index: 1;
}

.td-footer__cta-title {
	font-size: var(--td-fs-h3);
	letter-spacing: var(--td-tracking-head);
	max-width: 18ch;
}

/* -- Bottom bar ------------------------------------------------------------- */

.td-footer__bottom {
	align-items: center;
	border-top: 1px solid var(--td-line);
	color: var(--td-ink-4);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--td-fs-xs);
	gap: var(--td-s-3) var(--td-s-5);
	justify-content: space-between;
	padding-block: var(--td-s-5) var(--td-s-6);
	position: relative;
	z-index: 1;
}

.td-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: var(--td-s-4);
}

.td-footer__legal a { color: inherit; text-decoration: none; }
.td-footer__legal a:hover { color: var(--td-accent); }

.td-footer__social { display: flex; gap: var(--td-s-2); }

.td-footer__social a {
	align-items: center;
	border: 1px solid var(--td-line);
	border-radius: var(--td-r-xs);
	color: var(--td-ink-3);
	display: inline-flex;
	height: 36px;
	justify-content: center;
	transition:
		border-color var(--td-t-micro) var(--td-ease),
		color var(--td-t-micro) var(--td-ease),
		transform var(--td-t-micro) var(--td-ease-spring);
	width: 36px;
}

.td-footer__social a:hover {
	border-color: var(--td-hairline-accent);
	color: var(--td-accent);
	transform: translateY(-2px);
}

.td-footer__social svg { height: 16px; width: 16px; }

/* -- Oversized wordmark watermark ------------------------------------------- */

.td-footer__watermark {
	bottom: -0.28em;
	color: var(--td-ink);
	font-family: var(--td-font-display);
	font-size: clamp(5rem, 17vw, 17rem);
	font-weight: 700;
	inset-inline: 0;
	letter-spacing: -0.05em;
	line-height: 0.8;
	opacity: 0.04;
	pointer-events: none;
	position: absolute;
	text-align: center;
	user-select: none;
	white-space: nowrap;
	z-index: 0;
}