/* ============================================================
 * TD Onboarding — cinematic wizard styling
 * Namespace: .tdo
 * Matches the Troia theme aesthetic (dark, blue/yellow/green, Instrument fonts)
 * ============================================================ */

/* Page-level dark canvas so the bg fills entire viewport */
body:has(.tdo) { background: #0a0b0f; }

.tdo {
	--c-bg: #0a0b0f;
	--c-bg-2: #14171c;
	--c-card: #18191d;
	--c-line: rgba(255,255,255,.08);
	--c-line-hi: rgba(11,143,232,.5);
	--c-text: #ffffff;
	--c-text-2: #d6d8dc;
	--c-text-3: #9aa0a6;
	--c-text-4: #6b7079;
	--c-blue: #0b8fe8;
	--c-blue-hi: #3fb2ff;
	--c-yellow: #f6e760;
	--c-green: #1cd380;
	--c-red: #ff5d6c;
	--ease: cubic-bezier(.16,.84,.32,1);
	--font-sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--font-serif: 'Instrument Serif', Georgia, serif;

	position: relative;
	font-family: var(--font-sans);
	color: var(--c-text);
	max-width: 760px;
	margin: 40px auto;
	padding: 0 22px 60px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	z-index: 1;
}
.tdo *, .tdo *::before, .tdo *::after { box-sizing: border-box; }

/* ----- live space-particle background ----- */
.tdo__bg {
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
	z-index: 0;
	display: block;
}
/* Subtle radial overlay so the form area has depth */
.tdo::before {
	content: '';
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 60% 50% at 50% 30%, rgba(11,143,232,.08) 0%, transparent 70%),
		radial-gradient(ellipse 70% 50% at 50% 100%, rgba(28,211,128,.05) 0%, transparent 70%);
}

/* ----- top bar ----- */
.tdo__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 22px 0 10px;
}
.tdo__brand {
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
	font-family: var(--font-serif);
	font-style: italic;
	font-size: 22px;
	letter-spacing: -.02em;
}
.tdo__brand-mark {
	background: linear-gradient(135deg, var(--c-blue), #66e0ff);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.tdo__brand-divider { color: var(--c-text-4); margin: 0 4px; font-style: normal; }
.tdo__brand-sub {
	font-family: var(--font-sans);
	font-style: normal;
	font-size: 12px;
	color: var(--c-text-3);
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 600;
}
.tdo__autosave {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--c-text-3);
	letter-spacing: .04em;
	text-transform: uppercase;
	opacity: 0;
	transition: opacity .3s var(--ease);
}
.tdo__autosave.is-on { opacity: 1; }
.tdo__autosave-dot {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--c-green);
	box-shadow: 0 0 10px rgba(28,211,128,.7);
	animation: tdo-pulse 1.6s ease-in-out infinite;
}
@keyframes tdo-pulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.55;transform:scale(.8);} }

/* ----- progress bar ----- */
.tdo__progress {
	position: relative;
	height: 6px;
	background: rgba(255,255,255,.05);
	border-radius: 999px;
	margin: 6px 0 32px;
}
.tdo__progress-bar {
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 16%;
	background: linear-gradient(90deg, var(--c-blue), #66e0ff);
	border-radius: 999px;
	transition: width .55s var(--ease);
	box-shadow: 0 0 14px rgba(11,143,232,.5);
}
.tdo__progress-steps {
	position: absolute;
	inset: -4px 0 0 0;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
}

/* ----- steps ----- */
.tdo__step {
	display: none;
	animation: tdo-step-in .65s var(--ease);
}
.tdo__step.is-active { display: block; }
@keyframes tdo-step-in {
	from { opacity: 0; transform: translateY(20px) scale(.985); filter: blur(6px); }
	to   { opacity: 1; transform: translateY(0)    scale(1);    filter: blur(0); }
}

/* Card surfaces — semi-translucent so the bg shows through */
.tdo__field input,
.tdo__field textarea,
.tdo__color-row,
.tdo__service-row input,
.tdo__dropzone,
.tdo__review,
.tdo__live,
.tdo__done-step {
	backdrop-filter: blur(8px) saturate(140%);
	-webkit-backdrop-filter: blur(8px) saturate(140%);
}
.tdo__step-head {
	margin-bottom: 28px;
}
.tdo__step-eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--c-blue-hi);
	background: rgba(11,143,232,.12);
	padding: 5px 12px;
	border: 1px solid rgba(11,143,232,.3);
	border-radius: 999px;
	margin-bottom: 14px;
}
.tdo__step-title {
	font-family: var(--font-sans);
	font-size: clamp(28px, 4.5vw, 40px);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -.025em;
	margin: 0 0 10px;
	color: var(--c-text);
}
.tdo__step-sub {
	color: var(--c-text-2);
	font-size: 16px;
	line-height: 1.55;
	margin: 0;
	max-width: 580px;
}

/* ----- fields ----- */
.tdo__fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.tdo__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.tdo__field--full { grid-column: 1 / -1; }
@media (max-width: 540px) {
	.tdo__fields { grid-template-columns: 1fr; }
}
.tdo__label {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--c-text-3);
}
.tdo__label em {
	font-family: var(--font-serif);
	font-style: italic;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--c-text-4);
	margin-left: 6px;
}
.tdo__field input,
.tdo__field textarea {
	font: inherit;
	font-size: 15px;
	color: var(--c-text);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--c-line);
	border-radius: 12px;
	padding: 14px 16px;
	outline: 0;
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
	width: 100%;
	resize: vertical;
}
.tdo__field input:focus,
.tdo__field textarea:focus {
	border-color: var(--c-blue);
	background: rgba(11,143,232,.06);
	box-shadow: 0 0 0 4px rgba(11,143,232,.18);
}
.tdo__field input::placeholder,
.tdo__field textarea::placeholder { color: var(--c-text-4); }
.tdo__field.has-error input,
.tdo__field.has-error textarea {
	border-color: var(--c-red);
	box-shadow: 0 0 0 4px rgba(255,93,108,.16);
}

/* color picker row */
.tdo__color-row {
	display: flex;
	align-items: center;
	gap: 10px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--c-line);
	border-radius: 12px;
	padding: 8px 14px 8px 8px;
}
.tdo__color-row input[type="color"] {
	width: 44px; height: 36px;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	background: transparent;
	padding: 0;
}
.tdo__color-row input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; border-radius: 8px; }
.tdo__color-row input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 8px; }
.tdo__color-hint { font-family: ui-monospace, monospace; font-size: 13px; color: var(--c-text-2); }

/* ----- services repeater ----- */
.tdo__services { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.tdo__service-row {
	display: grid;
	grid-template-columns: 1fr 2fr auto;
	gap: 8px;
	align-items: stretch;
}
@media (max-width: 600px) { .tdo__service-row { grid-template-columns: 1fr; } }
.tdo__service-row input {
	font: inherit;
	font-size: 14px;
	color: var(--c-text);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--c-line);
	border-radius: 10px;
	padding: 12px 14px;
	outline: 0;
}
.tdo__service-row input:focus {
	border-color: var(--c-blue);
	box-shadow: 0 0 0 3px rgba(11,143,232,.16);
}
.tdo__service-remove {
	width: 40px;
	border-radius: 10px;
	background: rgba(255,93,108,.08);
	border: 1px solid rgba(255,93,108,.22);
	color: #ff8a93;
	cursor: pointer;
	font-size: 18px;
	transition: all .2s var(--ease);
}
.tdo__service-remove:hover { background: rgba(255,93,108,.16); color: #fff; }
.tdo__add {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(11,143,232,.10);
	border: 1px dashed rgba(11,143,232,.4);
	color: var(--c-blue-hi);
	padding: 12px 16px;
	border-radius: 12px;
	font: inherit;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	transition: all .2s var(--ease);
}
.tdo__add:hover { background: rgba(11,143,232,.18); border-style: solid; transform: translateY(-1px); }
.tdo__add span { font-size: 18px; line-height: 1; }

/* ----- uploads ----- */
.tdo__upload-block { margin-bottom: 22px; }
.tdo__upload-label {
	display: block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--c-text-3);
	margin-bottom: 8px;
}
.tdo__upload-label em {
	font-family: var(--font-serif);
	font-style: italic;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--c-text-4);
	margin-left: 6px;
}
.tdo__dropzone {
	position: relative;
	min-height: 140px;
	background: rgba(11,143,232,.04);
	border: 1.5px dashed rgba(11,143,232,.3);
	border-radius: 14px;
	padding: 22px;
	cursor: pointer;
	transition: all .25s var(--ease);
	overflow: hidden;
}
.tdo__dropzone:hover { border-color: var(--c-blue); background: rgba(11,143,232,.08); }
.tdo__dropzone.is-drag { border-color: var(--c-green); background: rgba(28,211,128,.08); }
.tdo__dropzone-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 100px;
	color: var(--c-text-2);
	font-size: 14px;
}
.tdo__dropzone-empty svg { color: var(--c-blue-hi); }
.tdo__dropzone-empty strong { color: var(--c-blue-hi); }
.tdo__dropzone-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	max-height: 180px;
}
.tdo__dropzone-preview img {
	max-height: 160px;
	max-width: 100%;
	border-radius: 8px;
	background: #fff;
	padding: 8px;
}
.tdo__remove {
	position: absolute;
	top: -10px;
	right: -10px;
	width: 28px; height: 28px;
	border-radius: 50%;
	background: var(--c-red);
	color: #fff;
	border: 0;
	cursor: pointer;
	font-size: 16px;
	box-shadow: 0 6px 18px -6px rgba(255,93,108,.6);
}
.tdo__photo-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
	gap: 10px;
	margin-top: 8px;
}
.tdo__photo-grid:empty { display: none; }
.tdo__photo {
	position: relative;
	aspect-ratio: 1/1;
	border-radius: 10px;
	overflow: hidden;
	background: rgba(255,255,255,.04);
}
.tdo__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tdo__photo-remove {
	position: absolute;
	top: 6px; right: 6px;
	width: 22px; height: 22px;
	border-radius: 50%;
	background: rgba(0,0,0,.7);
	color: #fff;
	border: 0;
	cursor: pointer;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.tdo__photo-remove:hover { background: var(--c-red); }
.tdo__photo--uploading {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--c-text-3);
	font-size: 11px;
	background: rgba(11,143,232,.08);
	border: 1px dashed rgba(11,143,232,.3);
}

/* ----- review ----- */
.tdo__review {
	background: rgba(255,255,255,.03);
	border: 1px solid var(--c-line);
	border-radius: 16px;
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.tdo__review-block { display: flex; flex-direction: column; gap: 6px; }
.tdo__review-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--c-text-3);
}
.tdo__review-edit {
	background: none;
	border: 0;
	color: var(--c-blue);
	font: inherit;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
}
.tdo__review-edit:hover { color: var(--c-yellow); }
.tdo__review-body { color: var(--c-text-2); font-size: 14px; line-height: 1.55; }
.tdo__review-body strong { color: var(--c-text); }
.tdo__review-body ul { margin: 0; padding-left: 18px; }
.tdo__review-body li { margin: 2px 0; }
.tdo__review-empty { color: var(--c-text-4); font-style: italic; }

/* ----- nav ----- */
.tdo__nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 32px;
	gap: 12px;
}
.tdo__nav.is-first .tdo__btn--ghost { visibility: hidden; }
.tdo__nav.is-hidden { display: none; }

.tdo__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 24px;
	border-radius: 999px;
	font: inherit;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: all .2s var(--ease);
	border: 0;
	text-decoration: none;
}
.tdo__btn--primary {
	background: var(--c-blue);
	color: #fff !important;
	box-shadow: 0 12px 30px -12px rgba(11,143,232,.55), inset 0 1px 0 rgba(255,255,255,.18);
}
.tdo__btn--primary:hover { background: var(--c-blue-hi); transform: translateY(-2px); }
.tdo__btn--primary:disabled { opacity: .55; cursor: progress; transform: none; }
.tdo__btn--xl {
	padding: 18px 36px;
	font-size: 17px;
}
/* Final-step submit button breathes a soft launch glow */
.tdo__nav.is-final .tdo__btn--primary {
	background: linear-gradient(135deg, var(--c-blue), #5cc4ff);
	box-shadow: 0 16px 40px -12px rgba(11,143,232,.7), 0 0 30px rgba(11,143,232,.35), inset 0 1px 0 rgba(255,255,255,.22);
	animation: tdo-launch-glow 2.4s ease-in-out infinite;
}
@keyframes tdo-launch-glow {
	0%, 100% { box-shadow: 0 16px 40px -12px rgba(11,143,232,.7), 0 0 30px rgba(11,143,232,.35), inset 0 1px 0 rgba(255,255,255,.22); }
	50%      { box-shadow: 0 18px 50px -10px rgba(11,143,232,.9), 0 0 50px rgba(11,143,232,.5),  inset 0 1px 0 rgba(255,255,255,.22); }
}
.tdo__btn--ghost {
	background: transparent;
	color: var(--c-text-2);
	border: 1px solid var(--c-line);
}
.tdo__btn--ghost:hover { color: var(--c-text); border-color: var(--c-line-hi); }

/* ----- error ----- */
.tdo__error {
	margin-top: 16px;
	padding: 12px 16px;
	background: rgba(255,93,108,.08);
	border: 1px solid rgba(255,93,108,.32);
	border-radius: 10px;
	color: #fca5a5;
	font-size: 13px;
}

/* ----- confirmation ----- */
.tdo__step--done {
	position: relative;
}
.tdo__fireworks {
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
	z-index: 2;
}
.tdo__step--done .tdo__done {
	text-align: center;
	padding: 32px 12px;
	position: relative;
	z-index: 3;
}
.tdo__done-tease {
	font-family: var(--font-serif);
	font-style: italic;
	font-size: 16px;
	color: var(--c-text-3);
	margin: 0 auto 28px;
	max-width: 460px;
}
.tdo__done-tease strong { color: var(--c-yellow); font-style: normal; font-family: var(--font-sans); font-weight: 600; }

/* live activity log */
.tdo__live {
	max-width: 540px;
	margin: 0 auto 36px;
	background: rgba(11,143,232,.04);
	border: 1px solid rgba(11,143,232,.18);
	border-radius: 16px;
	padding: 18px 22px;
	text-align: left;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 12px 30px -16px rgba(11,143,232,.3);
}
.tdo__live-head {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--c-green);
	margin-bottom: 14px;
}
.tdo__live-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--c-green);
	box-shadow: 0 0 12px rgba(28,211,128,.7);
	animation: tdo-pulse 1.6s ease-in-out infinite;
}
.tdo__live-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.tdo__live-list li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	color: var(--c-text-3);
	padding: 8px 0;
	opacity: 0;
	transform: translateX(-8px);
	transition: opacity .4s var(--ease), transform .4s var(--ease), color .4s var(--ease);
}
.tdo__live-list li.is-visible { opacity: 1; transform: translateX(0); }
.tdo__live-list li.is-active   { color: var(--c-text); }
.tdo__live-list li.is-done     { color: var(--c-text-2); }
.tdo__live-list li em { font-family: var(--font-serif); font-style: italic; color: var(--c-text); }
.tdo__live-icon {
	width: 18px; height: 18px;
	flex-shrink: 0;
	border-radius: 50%;
	border: 1.5px solid var(--c-text-4);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color .3s var(--ease), background .3s var(--ease);
	position: relative;
}
.tdo__live-list li.is-active .tdo__live-icon {
	border-color: var(--c-blue);
	border-top-color: transparent;
	animation: tdo-spin 1s linear infinite;
}
.tdo__live-list li.is-done .tdo__live-icon {
	background: var(--c-green);
	border-color: var(--c-green);
}
.tdo__live-list li.is-done .tdo__live-icon::after {
	content: '';
	position: absolute;
	left: 4px; top: 7px;
	width: 4px; height: 8px;
	border: solid #0a0b0f;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
@keyframes tdo-spin { to { transform: rotate(360deg); } }
.tdo__done-pulse {
	width: 100px; height: 100px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--c-green), #14a865);
	color: #0a0b0f;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 24px;
	box-shadow: 0 24px 60px -16px rgba(28,211,128,.45);
	animation: tdo-bounce-in .8s var(--ease);
}
@keyframes tdo-bounce-in {
	0%   { transform: scale(0); opacity: 0; }
	60%  { transform: scale(1.12); }
	100% { transform: scale(1); opacity: 1; }
}
.tdo__done-title {
	font-family: var(--font-sans);
	font-size: clamp(36px, 6vw, 56px);
	font-weight: 700;
	letter-spacing: -.03em;
	line-height: 1.05;
	margin: 0 0 14px;
}
.tdo__done-sub {
	color: var(--c-text-2);
	font-size: 17px;
	line-height: 1.55;
	margin: 0 auto 32px;
	max-width: 480px;
}
.tdo__done-sub strong { color: var(--c-yellow); }
.tdo__done-next {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 540px;
	margin: 0 auto 32px;
	text-align: left;
}
.tdo__done-step {
	display: grid;
	grid-template-columns: 44px 1fr;
	gap: 14px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--c-line);
	border-radius: 14px;
	padding: 16px 18px;
}
.tdo__done-num {
	width: 36px; height: 36px;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--c-blue), #66e0ff);
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.tdo__done-step strong { display: block; font-size: 14px; margin-bottom: 4px; }
.tdo__done-step p { margin: 0; color: var(--c-text-2); font-size: 13.5px; line-height: 1.5; }

/* ============== Post-payment welcome interstitial ============== */
.tdo.is-post-payment .tdo__wizard,
.tdo.is-post-payment .tdo__progress,
.tdo.is-post-payment .tdo__top { visibility: hidden; }
.tdo.is-post-payment.is-welcomed .tdo__wizard,
.tdo.is-post-payment.is-welcomed .tdo__progress,
.tdo.is-post-payment.is-welcomed .tdo__top { visibility: visible; }
.tdo-welcome {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px 20px;
	background: radial-gradient(ellipse at top, rgba(11,143,232,.18), transparent 60%), rgba(8,9,12,.88);
	backdrop-filter: blur(20px) saturate(140%);
	-webkit-backdrop-filter: blur(20px) saturate(140%);
	opacity: 0;
	transform: scale(.99);
	animation: tdo-welcome-in .55s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes tdo-welcome-in {
	to { opacity: 1; transform: scale(1); }
}
.tdo-welcome.is-leaving { animation: tdo-welcome-out .45s cubic-bezier(.4,0,.6,1) forwards; }
@keyframes tdo-welcome-out {
	to { opacity: 0; transform: scale(1.02); }
}
.tdo-welcome__inner {
	max-width: 560px;
	width: 100%;
	text-align: center;
	color: #fff;
	font-family: 'Instrument Sans', system-ui, sans-serif;
}
.tdo-welcome__pulse {
	width: 88px; height: 88px;
	margin: 0 auto 20px;
	border-radius: 50%;
	background: linear-gradient(135deg, #0b8fe8, #34d399);
	display: flex; align-items: center; justify-content: center;
	color: #fff;
	box-shadow: 0 0 0 0 rgba(11,143,232,.6);
	animation: tdo-welcome-pulse 2.4s ease-out infinite;
}
@keyframes tdo-welcome-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(11,143,232,.5); }
	70%  { box-shadow: 0 0 0 22px rgba(11,143,232,0); }
	100% { box-shadow: 0 0 0 0 rgba(11,143,232,0); }
}
.tdo-welcome__eyebrow {
	display: inline-block;
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #34d399;
	font-weight: 600;
	margin-bottom: 16px;
}
.tdo-welcome__title {
	font-family: 'Instrument Serif', serif;
	font-size: clamp(48px, 7vw, 76px);
	line-height: 1;
	margin: 0 0 14px;
	letter-spacing: -.02em;
	background: linear-gradient(135deg, #fff 0%, #c9e8ff 60%, #a6f4d8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.tdo-welcome__sub {
	font-size: 16px;
	line-height: 1.55;
	color: rgba(255,255,255,.78);
	margin: 0 auto 28px;
	max-width: 440px;
}
.tdo-welcome__list {
	list-style: none;
	padding: 0;
	margin: 0 0 32px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	text-align: left;
	max-width: 380px;
	margin-left: auto;
	margin-right: auto;
}
.tdo-welcome__list li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	background: rgba(255,255,255,.04);
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 12px;
	font-size: 14px;
	color: rgba(255,255,255,.88);
}
.tdo-welcome__list li span {
	flex: none;
	width: 26px; height: 26px;
	border-radius: 7px;
	background: rgba(11,143,232,.18);
	color: #6dc3ff;
	font-weight: 700;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.tdo-welcome__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 32px;
	border: 0;
	border-radius: 100px;
	background: linear-gradient(135deg, #0b8fe8, #34d399);
	color: #fff;
	font-family: 'Instrument Sans', system-ui, sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: .01em;
	cursor: pointer;
	box-shadow: 0 8px 28px rgba(11,143,232,.35);
	transition: transform .2s ease, box-shadow .2s ease;
}
.tdo-welcome__btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 12px 36px rgba(11,143,232,.45);
}
.tdo-welcome__support {
	margin: 22px 0 0;
	font-size: 13px;
	color: rgba(255,255,255,.55);
}
.tdo-welcome__support a {
	color: #6dc3ff;
	text-decoration: none;
	border-bottom: 1px solid rgba(109,195,255,.3);
}

/* ============== Support footer ============== */
.tdo__support {
	max-width: 720px;
	margin: 32px auto 24px;
	padding: 16px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 13px;
	color: rgba(255,255,255,.5);
	border-top: 1px solid rgba(255,255,255,.06);
}
.tdo__support a {
	color: #6dc3ff;
	text-decoration: none;
	border-bottom: 1px solid rgba(109,195,255,.3);
}