/*
 * The X Concept — sections, bento cards and backgrounds.
 *
 * Everything reads tokens (--txc-*). A section or card with a dark background
 * gets .is-dark, which swaps the tokens, so every card and component inside
 * turns light-on-dark without extra rules.
 */

:root {
	--txc-ink: #0A0F1C;
	--txc-muted: #5A6377;
	--txc-page: #FFFFFF;
	--txc-surface: #FFFFFF;
	--txc-surface-alt: #F3F5FA;
	--txc-border: #E4E8F0;
	--txc-accent: #3355FF;
	--txc-accent-2: #22D3EE;
	--txc-accent-ink: #FFFFFF;
	--txc-focus: #3355FF;
	--txc-star: #F5B301;
	--txc-radius: 24px;
	--txc-radius-sm: 14px;
	--txc-gap: clamp(.75rem, 1.6vw, 1.25rem);
	--txc-glass: rgba(255, 255, 255, .72);
	--txc-glass-border: rgba(10, 15, 28, .08);
	--txc-shadow: 0 1px 2px rgba(10, 15, 28, .04), 0 12px 32px -16px rgba(10, 15, 28, .18);
	--txc-wrap: 80rem;
	--txc-wrap-default: 70rem;
	--txc-wrap-narrow: 46rem;
	--txc-gutter: clamp(1rem, 4vw, 2.5rem);
}

.is-light {
	--txc-ink: #0A0F1C;
	--txc-muted: #5A6377;
	--txc-surface: #FFFFFF;
	--txc-surface-alt: #F3F5FA;
	--txc-border: #E4E8F0;
	--txc-glass: rgba(255, 255, 255, .72);
	--txc-glass-border: rgba(10, 15, 28, .08);
	color: var(--txc-ink);
}
.is-dark {
	--txc-ink: #F4F6FF;
	--txc-muted: rgba(226, 232, 255, .70);
	--txc-surface: rgba(255, 255, 255, .045);
	--txc-surface-alt: rgba(255, 255, 255, .07);
	--txc-border: rgba(255, 255, 255, .12);
	--txc-glass: rgba(255, 255, 255, .07);
	--txc-glass-border: rgba(255, 255, 255, .14);
	--txc-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 20px 40px -24px rgba(0, 0, 0, .6);
	--txc-accent: #6B86FF;
	--txc-star: #FFC83D;
	color: var(--txc-ink);
}

/* ------------------------------------------------------------- sections */
.txc-sec {
	position: relative;
	isolation: isolate;
	color: var(--txc-ink);
	padding-block: var(--txc-sec-space);
	--txc-sec-space: clamp(3rem, 7vw, 6rem);
	overflow: clip;
}
.txc-sp--none { --txc-sec-space: 0; }
.txc-sp--sm { --txc-sec-space: clamp(1.75rem, 4vw, 3rem); }
.txc-sp--md { --txc-sec-space: clamp(3rem, 7vw, 6rem); }
.txc-sp--lg { --txc-sec-space: clamp(4rem, 9vw, 8rem); }
.txc-sp--xl { --txc-sec-space: clamp(5rem, 12vw, 10rem); }
/* Two plain sections in a row share their spacing instead of doubling it. */
.txc-sec:not(.has-bg):not(.has-media) + .txc-sec:not(.has-bg):not(.has-media) { padding-top: 0; }
.txc-sec.is-inset { margin: clamp(.5rem, 1.5vw, 1.25rem); border-radius: clamp(20px, 3vw, 36px); }
.txc-sec.is-inset + .txc-sec.is-inset { margin-top: 0; }

/* A section paints only its own background (never one inherited from a parent). */
.txc-sec.has-bg { background: var(--txc-bg); }

.txc-sec__inner { position: relative; width: min(100% - 2 * var(--txc-gutter), var(--txc-wrap)); margin-inline: auto; }
.txc-w--default > .txc-sec__inner { width: min(100% - 2 * var(--txc-gutter), var(--txc-wrap-default)); }
.txc-w--narrow > .txc-sec__inner { width: min(100% - 2 * var(--txc-gutter), var(--txc-wrap-narrow)); }
.txc-w--full > .txc-sec__inner { width: calc(100% - 2 * var(--txc-gutter)); }

/* Background layers */
.txc-bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; border-radius: inherit; }
.txc-bg__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.txc-bg__video { opacity: 0; transition: opacity .8s ease; }
.txc-bg__video.is-playing { opacity: 1; }
.txc-bg__overlay { position: absolute; inset: 0; }
.txc-bg__texture { position: absolute; inset: 0; }
.txc-tex--grid {
	background-image: linear-gradient(to right, color-mix(in srgb, currentColor 9%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, currentColor 9%, transparent) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 30%, transparent 85%);
	mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 30%, transparent 85%);
}
.txc-tex--dots {
	background-image: radial-gradient(color-mix(in srgb, currentColor 22%, transparent) 1.2px, transparent 1.4px);
	background-size: 20px 20px;
	-webkit-mask-image: linear-gradient(180deg, #000, transparent 90%);
	mask-image: linear-gradient(180deg, #000, transparent 90%);
}
.txc-tex--lines { background-image: repeating-linear-gradient(135deg, color-mix(in srgb, currentColor 7%, transparent) 0 1px, transparent 1px 14px); }
.txc-tex--noise {
	opacity: .22; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.txc-tex--glow {
	background:
		radial-gradient(40% 55% at 85% 10%, color-mix(in srgb, var(--txc-accent-2) 45%, transparent), transparent 70%),
		radial-gradient(35% 50% at 10% 100%, color-mix(in srgb, #A855F7 40%, transparent), transparent 70%);
	filter: blur(10px);
}

/* Section header */
.txc-sec__head { display: grid; gap: .875rem; max-width: 46rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.txc-al--center .txc-sec__head { margin-inline: auto; text-align: center; justify-items: center; }
.txc-sec__title { margin: 0; font-size: clamp(1.875rem, 4.2vw, 3.25rem); line-height: 1.04; letter-spacing: -.035em; font-weight: 700; text-wrap: balance; color: var(--txc-ink); }
.txc-sec__intro { margin: 0; font-size: clamp(1.0625rem, 1.4vw, 1.1875rem); line-height: 1.6; color: var(--txc-muted); text-wrap: pretty; }
.txc-sec__more { margin: clamp(1.5rem, 3vw, 2.25rem) 0 0; }
.txc-al--center .txc-sec__more { text-align: center; }

/* Pills, buttons */
.txc-pill {
	display: inline-flex; align-items: center; gap: .5rem; justify-self: start; width: fit-content;
	margin: 0; padding: .375rem .875rem .375rem .625rem; border-radius: 999px;
	border: 1px solid var(--txc-glass-border); background: var(--txc-glass);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	font-size: .8125rem; font-weight: 600; letter-spacing: .01em; color: var(--txc-ink);
}
.txc-pill::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--txc-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--txc-accent) 25%, transparent); }
.txc-al--center .txc-pill { justify-self: center; }

.txc-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.txc-btn, .txc-button, .txc-load-more {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	min-height: 3rem; padding: 0 1.375rem; border-radius: 999px;
	font: inherit; font-weight: 600; font-size: .9375rem; text-decoration: none; cursor: pointer;
	border: 1px solid transparent; transition: transform .2s ease, background-color .2s, border-color .2s, box-shadow .2s;
}
.txc-btn--primary, .txc-button, .txc-load-more {
	background: var(--txc-accent); color: var(--txc-accent-ink);
	box-shadow: 0 8px 24px -10px color-mix(in srgb, var(--txc-accent) 70%, transparent), inset 0 1px 0 rgba(255, 255, 255, .25);
}
.txc-btn--primary:hover, .txc-button:hover, .txc-load-more:hover { transform: translateY(-1px); background: color-mix(in srgb, var(--txc-accent) 88%, #fff); color: var(--txc-accent-ink); }
.txc-btn--ghost, .txc-button--ghost { background: var(--txc-glass); color: var(--txc-ink); border-color: var(--txc-border); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: none; }
.txc-btn--ghost:hover, .txc-button--ghost:hover { border-color: var(--txc-ink); color: var(--txc-ink); background: var(--txc-glass); }
.txc-btn__icon { width: 1.125rem; height: 1.125rem; transition: transform .2s; }
.txc-btn:hover .txc-btn__icon { transform: translateX(3px); }
.is-dark .txc-btn--primary { background: #fff; color: #0A0F1C; box-shadow: 0 10px 30px -12px rgba(255, 255, 255, .45); }
.is-dark .txc-btn--primary:hover { background: #E8ECFF; color: #0A0F1C; }

.txc-icon { width: 1.5rem; height: 1.5rem; flex: none; }

/* ------------------------------------------------------------------ hero */
.txc-hero { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; margin: 0; }
.txc-hero--split { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.txc-hero--center { text-align: center; justify-items: center; }
.txc-hero--center .txc-hero__copy { display: grid; justify-items: center; max-width: 60rem; }
.txc-hero--center .txc-actions, .txc-hero--center .txc-hero__chips { justify-content: center; }
.txc-hero--left .txc-hero__copy { max-width: 56rem; }
.txc-hero__copy { display: grid; gap: 1.25rem; justify-items: start; }
.txc-hero__copy > .txc-breadcrumbs { margin: 0 0 .25rem; }
.txc-hero__title { margin: 0; font-size: clamp(2.5rem, 6.2vw, 5.25rem); line-height: .98; letter-spacing: -.045em; font-weight: 700; text-wrap: balance; color: var(--txc-ink); }
.txc-hero--left .txc-hero__title { font-size: clamp(2.25rem, 5vw, 4rem); }
.txc-hero__text { margin: 0; max-width: 40rem; font-size: clamp(1.0625rem, 1.5vw, 1.25rem); line-height: 1.6; color: var(--txc-muted); text-wrap: pretty; }
.txc-hero .txc-actions { margin-top: .5rem; }
.txc-hero__chips { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; list-style: none; padding: 0; margin: .5rem 0 0; font-size: .875rem; color: var(--txc-muted); }
.txc-hero__chips li { display: inline-flex; align-items: center; gap: .375rem; }
.txc-hero__chips .txc-icon { width: 1rem; height: 1rem; color: var(--txc-accent-2); stroke-width: 2.5; }
.txc-hero__stats { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: var(--txc-gap); margin: 0; align-items: stretch; }
.txc-hero__stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .375rem; padding: clamp(1.25rem, 2.4vw, 1.75rem); min-height: 9.5rem; margin: 0; min-width: 0; }
.txc-hero__stat dt { text-wrap: balance; }
.txc-hero__stat dd { margin: 0; font-size: clamp(2.25rem, 4.4vw, 3.5rem); font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.txc-hero__stat dt { font-size: .875rem; color: var(--txc-muted); }
.txc-hero__stat--1 { background: linear-gradient(160deg, color-mix(in srgb, var(--txc-accent) 32%, transparent), var(--txc-glass)) !important; }
.txc-hero__media { position: relative; border-radius: var(--txc-radius); overflow: hidden; box-shadow: var(--txc-shadow); border: 1px solid var(--txc-glass-border); aspect-ratio: 4 / 3; background: var(--txc-surface-alt); }
.txc-hero__media img, .txc-hero__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.txc-glass {
	background: var(--txc-glass); border: 1px solid var(--txc-glass-border); border-radius: var(--txc-radius);
	-webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3); box-shadow: var(--txc-shadow);
}

/* ---------------------------------------------------------- bento / tiles */
.txc-bento { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); grid-auto-rows: minmax(12.5rem, auto); grid-auto-flow: dense; gap: var(--txc-gap); }
.txc-cols--2 { --cols: 2; }
.txc-cols--3 { --cols: 3; }
.txc-cols--4 { --cols: 4; }
.txc-size--2x1 { grid-column: span 2; }
.txc-size--1x2 { grid-row: span 2; }
.txc-size--2x2 { grid-column: span 2; grid-row: span 2; }
.txc-size--3x1 { grid-column: 1 / -1; }

.txc-tile {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; min-width: 0;
	padding: clamp(1.25rem, 2.2vw, 1.75rem); margin: 0;
	border-radius: var(--txc-radius); border: 1px solid var(--txc-border);
	background: var(--txc-surface); color: var(--txc-ink);
	box-shadow: var(--txc-shadow);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.txc-tile.has-bg { background: var(--txc-bg); }
.txc-tile.has-bg, .txc-tile.has-media { border-color: transparent; }
.txc-tile.is-linked:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--txc-accent) 50%, transparent); box-shadow: 0 24px 48px -24px color-mix(in srgb, var(--txc-accent) 45%, rgba(0, 0, 0, .3)); }
.txc-tile__body { display: flex; flex-direction: column; gap: .625rem; flex: 1; position: relative; }
.txc-tile__iconwrap { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 14px; margin-bottom: .5rem; color: var(--txc-accent); background: color-mix(in srgb, var(--txc-accent) 12%, transparent); border: 1px solid color-mix(in srgb, var(--txc-accent) 22%, transparent); }
.is-dark .txc-tile__iconwrap { color: #fff; background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); }
.txc-tile__icon { width: 1.375rem; height: 1.375rem; }
.txc-tile__badge { margin: 0; align-self: flex-start; padding: .25rem .625rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--txc-glass); border: 1px solid var(--txc-glass-border); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.txc-tile__title { margin: 0; font-size: clamp(1.125rem, 1.6vw, 1.375rem); line-height: 1.2; letter-spacing: -.02em; font-weight: 700; text-wrap: balance; }
.txc-tile__title a { color: inherit; text-decoration: none; }
.txc-tile.is-linked .txc-tile__title a::after { content: ""; position: absolute; inset: calc(-1 * clamp(1.25rem, 2.2vw, 1.75rem)); z-index: 1; }
.txc-tile__text { margin: 0; color: var(--txc-muted); line-height: 1.55; text-wrap: pretty; }
.txc-tile__value { margin: 0; font-size: clamp(2.75rem, 5.5vw, 4.5rem); line-height: .95; letter-spacing: -.05em; font-weight: 700; background: linear-gradient(120deg, var(--txc-ink) 30%, var(--txc-accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.is-dark .txc-tile__value { background-image: linear-gradient(120deg, #fff 30%, #9FB1FF); }
.txc-tile__more { margin: auto 0 0; padding-top: .75rem; display: inline-flex; align-items: center; gap: .375rem; font-weight: 600; font-size: .9375rem; }
.txc-tile__more a { color: inherit; text-decoration: none; position: relative; z-index: 2; }
.txc-tile__more a::after { content: ""; position: absolute; inset: -1rem; }
.txc-tile__more .txc-icon { width: 1.125rem; height: 1.125rem; transition: transform .2s; }
.txc-tile:hover .txc-tile__more .txc-icon { transform: translate(2px, -2px); }
.txc-tile__media { margin: calc(-1 * clamp(1.25rem, 2.2vw, 1.75rem)) calc(-1 * clamp(1.25rem, 2.2vw, 1.75rem)) 1.25rem; }
.txc-tile__media img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.txc-tile--stat .txc-tile__body { justify-content: flex-end; }
.txc-tile--stat .txc-tile__value { margin-bottom: .25rem; }
.txc-tile--media .txc-tile__body, .txc-tile--case .txc-tile__body { justify-content: flex-end; }
.txc-tile--media { min-height: 14rem; }
.txc-tile--case { min-height: 18rem; }
.txc-tile--case .txc-tile__title { font-size: clamp(1.25rem, 2vw, 1.75rem); }
.txc-tile--rating .txc-tile__value { font-size: clamp(3.5rem, 6vw, 5rem); }
.txc-tile--rating .txc-stars { font-size: 1.25rem; }
.txc-tile--cta .txc-tile__body { justify-content: space-between; }
.txc-tile--cta .txc-tile__more { align-self: flex-start; padding: .625rem 1rem; border-radius: 999px; background: #fff; color: #0A0F1C; }
.txc-tile--review { padding: 0; }
.txc-tile--review .txc-card--testimonial { border: 0; box-shadow: none; background: transparent; height: 100%; }
.txc-size--2x2 .txc-tile__title, .txc-size--1x2 .txc-tile__title { font-size: clamp(1.375rem, 2.4vw, 2rem); }

/* Equal cards */
.txc-cardrow { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--txc-gap); }
.txc-cardrow--filled .txc-tile:not(.has-bg) { background: var(--txc-surface-alt); border-color: transparent; box-shadow: none; }
.txc-cardrow--glass .txc-tile:not(.has-bg) { background: var(--txc-glass); border-color: var(--txc-glass-border); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.txc-cardrow--plain .txc-tile:not(.has-bg) { background: transparent; border-color: transparent; box-shadow: none; padding-inline: 0; }
.txc-cardrow .txc-tile { min-height: 0; }

/* ------------------------------------------------------- media + text */
.txc-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.txc-split.is-reverse .txc-split__media { order: -1; }
.txc-split__copy { display: grid; gap: 1rem; justify-items: start; }
.txc-split__media { position: relative; border-radius: var(--txc-radius); overflow: hidden; aspect-ratio: 5 / 4; box-shadow: var(--txc-shadow); border: 1px solid var(--txc-glass-border); background: var(--txc-surface-alt); }
.txc-split__media.txc-ratio--square { aspect-ratio: 1; }
.txc-split__media.txc-ratio--portrait { aspect-ratio: 4 / 5; max-width: 30rem; width: 100%; justify-self: center; }
.txc-split__media img, .txc-split__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ----------------------------------------------------------------- prose */
.txc-prose { font-size: 1.0625rem; line-height: 1.7; color: var(--txc-ink); }
.txc-prose > :first-child { margin-top: 0; }
.txc-prose > :last-child { margin-bottom: 0; }
.txc-prose :is(h2, h3, h4) { letter-spacing: -.025em; line-height: 1.15; margin: 2em 0 .5em; }
.txc-prose h2 { font-size: clamp(1.5rem, 2.6vw, 2.125rem); }
.txc-prose h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
.txc-prose p, .txc-prose ul, .txc-prose ol { margin: 0 0 1.1em; }
.txc-prose a:not(.txc-btn) { color: var(--txc-accent); text-underline-offset: .2em; }
.txc-prose a.txc-btn { text-decoration: none; margin-block: .25rem; }
.txc-prose img { max-width: 100%; height: auto; border-radius: var(--txc-radius-sm); }
.txc-prose blockquote { margin: 1.5em 0; padding: 1.25rem 1.5rem; border-radius: var(--txc-radius-sm); background: var(--txc-surface-alt); border-left: 3px solid var(--txc-accent); font-size: 1.125rem; }

/* --------------------------------------------------------------- numbers */
.txc-numbers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: var(--txc-gap); margin: 0; }
.txc-numbers__item { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .5rem; padding: 1.5rem; border-radius: var(--txc-radius); background: var(--txc-surface); border: 1px solid var(--txc-border); margin: 0; }
.txc-numbers__item dd { margin: 0; font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 700; letter-spacing: -.05em; line-height: 1; background: linear-gradient(120deg, var(--txc-ink) 30%, var(--txc-accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.is-dark .txc-numbers__item dd { background-image: linear-gradient(120deg, #fff 30%, #9FB1FF); }
.txc-numbers__item dt { color: var(--txc-muted); font-size: .9375rem; }

/* ----------------------------------------------------------------- steps */
.txc-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--txc-gap); counter-reset: none; }
.txc-steps__item { position: relative; display: grid; align-content: start; gap: .625rem; padding: 1.5rem; border-radius: var(--txc-radius); background: var(--txc-surface); border: 1px solid var(--txc-border); margin: 0; }
.txc-steps__n { font-size: .8125rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .04em; color: var(--txc-accent); display: inline-flex; align-items: center; gap: .5rem; }
.txc-steps__n::after { content: ""; flex: 1; height: 1px; min-width: 2rem; background: linear-gradient(90deg, var(--txc-border), transparent); }
.txc-steps__title { margin: .25rem 0 0; font-size: 1.1875rem; letter-spacing: -.02em; }
.txc-steps__item p { margin: 0; color: var(--txc-muted); line-height: 1.55; }

/* ------------------------------------------------------------------- faq */
.txc-faq2 { display: grid; gap: .625rem; max-width: 52rem; }
.txc-al--center .txc-faq2 { margin-inline: auto; }
.txc-faq2__item { border: 1px solid var(--txc-border); border-radius: var(--txc-radius-sm); background: var(--txc-surface); transition: border-color .2s; }
.txc-faq2__item[open] { border-color: color-mix(in srgb, var(--txc-accent) 40%, var(--txc-border)); }
.txc-faq2__item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.125rem 1.25rem; cursor: pointer; font-weight: 600; font-size: 1.0625rem; list-style: none; }
.txc-faq2__item summary::-webkit-details-marker { display: none; }
.txc-faq2__toggle { position: relative; width: 1.75rem; height: 1.75rem; flex: none; border-radius: 50%; background: var(--txc-surface-alt); }
.txc-faq2__toggle::before, .txc-faq2__toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: .75rem; height: 2px; margin: -1px 0 0 -.375rem; background: currentColor; border-radius: 2px; transition: transform .2s; }
.txc-faq2__toggle::after { transform: rotate(90deg); }
.txc-faq2__item[open] .txc-faq2__toggle::after { transform: rotate(0); }
.txc-faq2__answer { padding: 0 1.25rem 1.25rem; color: var(--txc-muted); line-height: 1.65; }
.txc-faq2__answer > :first-child { margin-top: 0; }
.txc-faq2__answer > :last-child { margin-bottom: 0; }

/* ------------------------------------------------------------------- cta */
.txc-ctabox { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem 3rem; }
.txc-ctabox__copy { display: grid; gap: 1rem; max-width: 44rem; justify-items: start; }
.txc-ctabox--center { flex-direction: column; align-items: center; text-align: center; }
.txc-ctabox--center .txc-ctabox__copy { justify-items: center; }
.txc-sec--cta .txc-sec__title { font-size: clamp(2rem, 4.6vw, 3.75rem); }

/* --------------------------------------------------------------- reviews */
.txc-reviews { display: grid; gap: var(--txc-gap); }
.txc-reviews.has-rating { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); }
.txc-reviews__score { min-height: 100%; }
.txc-reviews__list { display: grid; gap: var(--txc-gap); grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); }
.txc-reviews__list--1 { --n: 1; }
.txc-reviews__list--2 { --n: 2; }

/* --------------------------------------------------- cards from templates */
.txc-sec .txc-grid { gap: var(--txc-gap); }
.txc-card { border-radius: var(--txc-radius); border-color: var(--txc-border); background: var(--txc-surface); box-shadow: var(--txc-shadow); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.txc-card--case:hover, .txc-card--industry:hover, .txc-card--post:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--txc-accent) 45%, var(--txc-border)); }
.txc-card__body { padding: 1.25rem 1.375rem 1.5rem; gap: .625rem; }
.txc-card__title { font-size: 1.1875rem; letter-spacing: -.02em; font-weight: 700; line-height: 1.25; }
.txc-card__meta { gap: .375rem; }
.txc-card__meta span, .txc-card__meta time { display: inline-flex; align-items: center; padding: .1875rem .625rem; border-radius: 999px; background: var(--txc-surface-alt); font-size: .75rem; font-weight: 600; color: var(--txc-muted); }
.txc-card__meta span:first-child { color: var(--txc-ink); }
.txc-card__metric { color: var(--txc-accent); font-weight: 700; }
.txc-card__media { overflow: hidden; background: var(--txc-surface-alt); }
.txc-card__media img { transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.txc-card:hover .txc-card__media img { transform: scale(1.04); }
.txc-card--industry { padding: 0; }
.txc-card--industry .txc-card__body { display: flex; flex-direction: column; gap: .625rem; flex: 1; padding: 1.5rem; }
.txc-card--industry .txc-card__media img { aspect-ratio: 4 / 3; }
.txc-card--industry.has-photo .txc-card__title { font-size: 1.25rem; }
.txc-cardgrid { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: var(--txc-gap); }
.txc-card__media.is-placeholder { display: grid; place-items: center; aspect-ratio: 16 / 10; padding: 1.5rem; background: radial-gradient(70% 90% at 20% 0%, color-mix(in srgb, var(--txc-accent) 55%, transparent), transparent 70%), radial-gradient(60% 80% at 100% 100%, rgba(124, 58, 237, .45), transparent 70%), #0A0F1F; }
.txc-card__placeholder { color: #fff; font-weight: 700; font-size: 1.125rem; letter-spacing: -.01em; text-align: center; opacity: .92; }
.txc-card--industry .txc-card__title { font-size: 1.375rem; }
.txc-card--industry .txc-card__meta { margin-top: auto; padding-top: .25rem; }
.txc-card--client { min-height: 6.5rem; box-shadow: none; }
.txc-card--client:hover { border-color: color-mix(in srgb, var(--txc-accent) 45%, var(--txc-border)); }
.txc-card__name { font-weight: 700; letter-spacing: -.01em; color: var(--txc-ink); }
.txc-card__logo { filter: grayscale(1) contrast(1.1); opacity: .8; transition: filter .25s, opacity .25s; }
.txc-card--client:hover .txc-card__logo { filter: none; opacity: 1; }
.is-dark .txc-card__logo { filter: grayscale(1) brightness(0) invert(1); opacity: .75; }
.txc-card--testimonial { padding: 1.75rem; gap: 1.25rem; justify-content: space-between; }
.txc-card--testimonial blockquote { font-size: 1.0625rem; line-height: 1.6; }
.txc-card--testimonial blockquote p { margin: 0 0 .75em; }
.txc-card--testimonial blockquote p:last-child { margin: 0; }
.txc-card--testimonial figcaption strong { display: block; }
.txc-card--testimonial figcaption span span { color: var(--txc-muted); font-size: .8125rem; }
.txc-stars { color: var(--txc-star); letter-spacing: .12em; }

/* Case studies: bento layout leads with one big card. */
.txc-cases--bento .txc-grid--cases { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.txc-cases--bento .txc-grid--cases > .txc-card:first-child { grid-column: span 2; grid-row: span 2; }
.txc-cases--bento .txc-grid--cases > .txc-card:first-child .txc-card__title { font-size: clamp(1.375rem, 2.4vw, 2rem); }
.txc-cases--bento .txc-grid--cases > .txc-card:first-child .txc-card__media { position: relative; flex: 1; min-height: 18rem; }
.txc-cases--bento .txc-grid--cases > .txc-card:first-child .txc-card__media img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
.txc-card--case:not(:has(.txc-card__media)) .txc-card__body { padding-top: 1.5rem; }
.txc-card--case:not(:has(.txc-card__media))::before { content: ""; display: block; height: 6px; background: linear-gradient(90deg, var(--txc-accent), var(--txc-accent-2)); }

/* Pagination / filters */
.txc-pagination { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.txc-pagination__pages a, .txc-pagination__pages span { border-radius: 999px; }
.txc-filters select { border-radius: 999px; border: 1px solid var(--txc-border); background: var(--txc-surface); color: inherit; padding: 0 1rem; }

/* Chips (related terms) */
.txc-chips a, .txc-chips span:only-child { border-color: var(--txc-border); background: var(--txc-surface); min-height: 2.5rem; padding: .375rem 1rem; font-weight: 600; transition: border-color .2s, transform .2s; }
.txc-chips a:hover { border-color: var(--txc-accent); transform: translateY(-1px); }
.txc-chips--large a { min-height: 3rem; font-size: 1rem; padding-inline: 1.25rem; }

/* Components inside sections: the section owns spacing. */
.txc-sec .txc-block.txc-block { margin-block: 0; }
.txc-sec .txc-block + .txc-block { margin-top: clamp(2rem, 4vw, 3rem); }
.txc-story__title, .txc-client-profile__name { font-size: clamp(2.25rem, 5vw, 4rem); line-height: 1; letter-spacing: -.045em; font-weight: 700; }
.txc-story__media img { border-radius: var(--txc-radius); box-shadow: var(--txc-shadow); }
.txc-glance, .txc-results__item, .txc-stats__item, .txc-process__aside, .txc-tldr, .txc-author-box, .txc-series__links a, .txc-client-tile a { border-radius: var(--txc-radius-sm); border: 1px solid var(--txc-border); background: var(--txc-surface); }
.txc-results__item { padding: 1.5rem; }
.txc-results__value { font-size: clamp(2.25rem, 4.5vw, 3.5rem); letter-spacing: -.04em; color: var(--txc-ink); }
.is-dark .txc-results__value { background: linear-gradient(120deg, #fff 30%, #9FB1FF); -webkit-background-clip: text; background-clip: text; color: transparent; }
.txc-pain-points__list > li { padding: 1.5rem; border-radius: var(--txc-radius-sm); background: var(--txc-surface); border: 1px solid var(--txc-border); }
.txc-matrix__table td a { background: var(--txc-accent); }
.txc-matrix__table td a:hover { background: var(--txc-ink); color: var(--txc-page); }
.txc-sec--work-grid .txc-matrix__scroll { padding: clamp(1rem, 2vw, 1.5rem); border-radius: var(--txc-radius); background: var(--txc-surface); border: 1px solid var(--txc-border); }
.txc-map, .leaflet-container { border-radius: var(--txc-radius); }

/* ----------------------------------------------------------- responsive */
.txc-hide-sm { }
@media (max-width: 1023px) {
	.txc-hero--split { grid-template-columns: 1fr; }
	.txc-cols--3, .txc-cols--4 { --cols: 2; }
	.txc-cardgrid.txc-cols--3, .txc-cardgrid.txc-cols--4 { --cols: 2; }
	.txc-cases--bento .txc-grid--cases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.txc-reviews.has-rating { grid-template-columns: 1fr; }
	.txc-reviews__list { --n: 2; }
	.txc-reviews__list--1 { --n: 1; }
}
@media (max-width: 719px) {
	.txc-hide-sm { display: none !important; }
	.txc-bento, .txc-cardrow, .txc-cardgrid { --cols: 1 !important; grid-auto-rows: auto; }
	.txc-size--2x1, .txc-size--2x2, .txc-size--3x1 { grid-column: auto; }
	.txc-size--1x2, .txc-size--2x2 { grid-row: auto; }
	.txc-tile { min-height: 0; }
	.txc-tile--media, .txc-tile--case { min-height: 16rem; }
	.txc-split { grid-template-columns: 1fr; }
	.txc-split.is-reverse .txc-split__media { order: 0; }
	.txc-cases--bento .txc-grid--cases { grid-template-columns: 1fr; }
	.txc-cases--bento .txc-grid--cases > .txc-card:first-child { grid-column: auto; grid-row: auto; }
	.txc-reviews__list { --n: 1; }
	.txc-hero__stat { min-height: 7.5rem; }
	.txc-ctabox { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
	.txc-tile, .txc-card, .txc-btn, .txc-card__media img, .txc-bg__video { transition: none !important; }
	.txc-tile.is-linked:hover, .txc-card:hover { transform: none; }
	.txc-card:hover .txc-card__media img { transform: none; }
}

/* Bento with one card left over on the last row: let it fill the row. */
@media (min-width: 1024px) {
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(4):last-child,
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(7):last-child { grid-column: 1 / -1; flex-direction: row; }
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(4):last-child .txc-card__media,
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(7):last-child .txc-card__media { flex: 0 0 40%; }
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(4):last-child .txc-card__body,
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(7):last-child .txc-card__body { align-content: center; padding: 2rem; }
	.txc-cases--bento .txc-grid--cases > .txc-card:nth-child(5):last-child { grid-column: span 2; }
}

/* A case study without an image never leads the bento (it would be a big empty card). */
.txc-cases--bento .txc-grid--cases > .txc-card:first-child:not(:has(.txc-card__media)) { grid-column: auto; grid-row: auto; }

/* ------------------------------------------------------- review slider */
/* Dark rating card on the left, review cards sliding beside it. */
.txc-reviews2 { display: grid; gap: var(--txc-gap); align-items: start; }
.txc-reviews2.has-score { grid-template-columns: minmax(15rem, 1fr) minmax(0, 3fr); }
.txc-reviews2__score { min-height: 17rem; }
.txc-reviews2__score .txc-tile__badge { display: inline-flex; align-items: center; gap: .5rem; }
.txc-reviews2__score .txc-revbar__g { width: 1.375rem; height: 1.375rem; font-size: .75rem; }
.txc-revbar__g { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: conic-gradient(#EA4335 0 25%, #FBBC05 0 50%, #34A853 0 75%, #4285F4 0); color: #fff; font-weight: 800; text-shadow: 0 1px 1px rgba(0, 0, 0, .25); }
.txc-reviews2__slider { display: flex; flex-direction: column; min-width: 0; gap: .75rem; }
.txc-carousel__nav { display: flex; justify-content: flex-end; gap: .5rem; }
.txc-carousel__nav[hidden] { display: none; }
.txc-carousel__btn { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--txc-border); background: var(--txc-surface); color: var(--txc-ink); cursor: pointer; transition: background .2s, border-color .2s, opacity .2s; }
.txc-carousel__btn:hover:not(:disabled) { border-color: var(--txc-ink); }
.txc-carousel__btn:disabled { opacity: .35; cursor: default; }

.txc-carousel { position: relative; flex: 1; min-width: 0; }
.txc-carousel__track {
	display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--txc-gap)) / 3);
	gap: var(--txc-gap); list-style: none; margin: 0; padding: 0 0 .75rem;
	overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
	scrollbar-width: thin; scrollbar-color: var(--txc-border) transparent;
	align-items: start; height: 100%;
}
.has-score .txc-carousel__track { grid-auto-columns: calc((100% - 2 * var(--txc-gap)) / 3); }
.txc-carousel__track:focus-visible { outline: 2px solid var(--txc-accent); outline-offset: 4px; border-radius: var(--txc-radius); }
.txc-carousel__item { scroll-snap-align: start; margin: 0; min-width: 0; }
.txc-card--testimonial.is-compact { padding: 1.25rem 1.375rem; gap: .75rem; box-shadow: none; }
.txc-card--testimonial.is-compact .txc-stars { font-size: .875rem; }
.txc-card--testimonial.is-compact .txc-quote { font-size: .9688rem; line-height: 1.55; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; line-clamp: 5; overflow: hidden; }
.txc-card--testimonial.is-compact .txc-quote p { margin: 0 0 .5em; }
.txc-card--testimonial.is-compact.is-expanded .txc-quote { -webkit-line-clamp: unset; line-clamp: none; display: block; }
.txc-readmore { align-self: flex-start; margin-top: -.25rem; padding: 0; border: 0; background: none; font: inherit; font-size: .875rem; font-weight: 600; color: var(--txc-accent); cursor: pointer; }
.txc-readmore:hover { text-decoration: underline; }
.txc-card--testimonial.is-compact figcaption { margin-top: auto; font-size: .8125rem; }
.txc-card--testimonial.is-compact .txc-avatar { width: 32px; height: 32px; }
@media (max-width: 1199px) { .has-score .txc-carousel__track { grid-auto-columns: calc((100% - var(--txc-gap)) / 2); } }
@media (max-width: 1023px) {
	.txc-reviews2.has-score { grid-template-columns: 1fr; }
	.txc-reviews2__score { min-height: 0; }
	.txc-carousel__track, .has-score .txc-carousel__track { grid-auto-columns: calc((100% - var(--txc-gap)) / 2); }
}
@media (max-width: 719px) {
	.txc-carousel__track, .has-score .txc-carousel__track { grid-auto-columns: 86%; }
	.txc-carousel__nav { display: none !important; } /* swipe on phones */
}

/* --------------------------------------------------- work by industry */
.txc-wgrid__layout { display: grid; grid-template-columns: minmax(16rem, 1fr) minmax(0, 2.4fr); gap: var(--txc-gap); align-items: start; }
.txc-wgrid__summary {
	position: sticky; top: 6rem;
	display: grid; gap: .5rem; justify-items: start; padding: clamp(1.5rem, 3vw, 2.25rem);
	border-radius: var(--txc-radius); color: #fff; box-shadow: var(--txc-shadow);
	background: radial-gradient(80% 60% at 0% 0%, color-mix(in srgb, var(--txc-accent) 35%, transparent), transparent 70%), var(--txc-dark, #070B16);
}
.txc-wgrid__total { margin: 0; font-size: clamp(3.5rem, 7vw, 5.5rem); line-height: .9; font-weight: 700; letter-spacing: -.05em; }
.txc-wgrid__label { margin: 0; font-size: 1.125rem; font-weight: 600; }
.txc-wgrid__sub { margin: .5rem 0 1rem; color: var(--txc-muted); line-height: 1.55; }
.txc-wgrid__list { list-style: none; margin: 0; padding: .5rem clamp(1rem, 2.5vw, 1.75rem); border-radius: var(--txc-radius); background: var(--txc-surface); border: 1px solid var(--txc-border); }
.txc-wgrid__row { display: grid; gap: .625rem; padding: 1.125rem 0; margin: 0; border-bottom: 1px solid var(--txc-border); }
.txc-wgrid__row:last-child { border-bottom: 0; }
.txc-wgrid__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; }
.txc-wgrid__ind { font-size: 1.125rem; font-weight: 700; letter-spacing: -.01em; color: var(--txc-ink); text-decoration: none; }
.txc-wgrid__ind:hover { text-decoration: underline; text-underline-offset: .2em; }
.txc-wgrid__count { font-size: .875rem; font-weight: 600; color: var(--txc-muted); font-variant-numeric: tabular-nums; }
.txc-wgrid__bar { display: block; height: 6px; border-radius: 999px; background: var(--txc-surface-alt); overflow: hidden; }
.txc-wgrid__bar span { display: block; height: 100%; border-radius: inherit; background: var(--txc-accent); }
.txc-wgrid__svcs { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: .125rem 0 0; padding: 0; }
.txc-wgrid__svcs li { margin: 0; }
.txc-wgrid__svcs a { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.25rem; padding: .25rem .375rem .25rem .875rem; border-radius: 999px; border: 1px solid var(--txc-border); background: var(--txc-surface); color: var(--txc-ink); font-size: .875rem; font-weight: 500; text-decoration: none; transition: border-color .2s, background .2s; }
.txc-wgrid__svcs a:hover { border-color: var(--txc-ink); }
.txc-wgrid__n { display: inline-grid; place-items: center; min-width: 1.625rem; height: 1.625rem; padding: 0 .375rem; border-radius: 999px; background: var(--txc-ink); color: #fff; font-size: .75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.is-dark .txc-wgrid__n { background: #fff; color: #0A0F1C; }
@media (max-width: 899px) {
	.txc-wgrid__layout { grid-template-columns: 1fr; }
	.txc-wgrid__summary { position: static; }
}

/* Service card without a photo yet: brand tile with the service icon. */
.txc-card__placeholder-icon { width: 3.25rem; height: 3.25rem; color: #fff; opacity: .92; stroke-width: 1.5; }
.txc-card--service .txc-card__media.is-placeholder { aspect-ratio: 4 / 3; }
