/* ==========================================================================
 * Tilmeldingssiderne — konverteringen.
 * Iframen er tredjeparts og kan ikke styles, så alt arbejdet ligger omkring den.
 * ========================================================================== */

.tg-signup { display: grid; gap: var(--tg-space-8); align-items: start; }
@media (min-width: 62rem) {
	.tg-signup { grid-template-columns: 1fr 21rem; gap: var(--tg-space-10); }
}

/* ------------------------------------------------------ Forventningsafstemning */

.tg-signup__steps { margin-bottom: var(--tg-space-8); }
.tg-signup__steps-title {
	font-size: var(--tg-fs-300);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tg-text-muted);
	margin-bottom: var(--tg-space-4);
}
.tg-signup__list {
	display: grid;
	gap: var(--tg-space-3);
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: none;
}
@media (min-width: 48rem) { .tg-signup__list { grid-template-columns: repeat(3, 1fr); } }
.tg-signup__list li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--tg-space-3);
	align-items: start;
	margin: 0;
	padding: var(--tg-space-4);
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-lg);
	font-size: var(--tg-fs-300);
	line-height: 1.5;
}
.tg-signup__num {
	display: grid;
	place-items: center;
	width: 1.65rem; height: 1.65rem;
	border-radius: var(--tg-radius-pill);
	background: var(--tg-grad-accent);
	color: #fff;
	font-family: var(--tg-font-display);
	font-weight: 700;
	font-size: .75rem;
}

/* ------------------------------------------------------------------ Embed */

.tg-embed {
	position: relative;
	min-height: 620px;              /* Reserverer plads, så siden ikke hopper. */
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-xl);
	background: var(--tg-surface-strong);
	overflow: hidden;
}

.tg-embed__frame {
	display: block;
	width: 100%;
	min-height: 620px;
	border: 0;
	opacity: 0;
	transition: opacity var(--tg-dur) var(--tg-ease);
}
.tg-embed.is-loaded .tg-embed__frame { opacity: 1; }

.tg-embed__skeleton {
	position: absolute;
	inset: 0;
	display: grid;
	place-content: center;
	justify-items: center;
	gap: var(--tg-space-4);
	background: var(--tg-surface-strong);
	color: var(--tg-text-muted);
	font-size: var(--tg-fs-300);
}
.tg-embed__spinner {
	width: 2rem; height: 2rem;
	border: 2.5px solid var(--tg-skeleton);
	border-top-color: var(--tg-accent);
	border-radius: 50%;
	animation: tg-spin 900ms linear infinite;
}
@keyframes tg-spin { to { transform: rotate(360deg); } }

/* Widgeten leverer sit eget lyse tema — hold teksten læsbar i mørk tilstand
   ved at give iframen en hvid flade i stedet for temaets mørke baggrund. */
.tg-embed { color-scheme: light; }

.tg-embed.is-slow::after {
	content: "Tager det for lang tid? Ring til os på " attr(data-phone) ", så tilmelder vi dig over telefonen.";
	display: block;
	padding: var(--tg-space-4) var(--tg-space-5);
	border-top: 1px solid var(--tg-border);
	font-size: var(--tg-fs-300);
	color: var(--tg-text-muted);
}

/* ----------------------------------------------------------- Tryghedspanel */

.tg-assurance {
	position: sticky;
	top: calc(var(--tg-header-h) + 1.5rem);
	padding: var(--tg-space-6);
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-xl);
	backdrop-filter: blur(14px);
	box-shadow: var(--tg-shadow-sm);
}
@media (max-width: 61.99rem) { .tg-assurance { position: static; } }

.tg-assurance__title,
.tg-assurance h3 {
	font-size: var(--tg-fs-300);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tg-text-muted);
	margin-bottom: var(--tg-space-3);
}
.tg-assurance__list { list-style: none; margin: 0 0 var(--tg-space-6); padding: 0; }
.tg-assurance__list li {
	display: flex; align-items: flex-start; gap: var(--tg-space-3);
	margin-bottom: var(--tg-space-3);
	font-size: var(--tg-fs-300);
	line-height: 1.5;
	color: var(--tg-text-strong);
}
.tg-assurance__list svg { color: var(--tg-success); margin-top: .15rem; flex: none; }

.tg-assurance__help,
.tg-assurance__links {
	padding-top: var(--tg-space-5);
	margin-top: var(--tg-space-5);
	border-top: 1px solid var(--tg-border);
}
.tg-assurance__help p { font-size: var(--tg-fs-300); margin-bottom: var(--tg-space-4); }
.tg-assurance__hours {
	margin-top: var(--tg-space-3);
	font-size: var(--tg-fs-300);
	color: var(--tg-text-muted);
	text-align: center;
}
.tg-assurance__links ul { list-style: none; margin: 0; padding: 0; }
.tg-assurance__links li { margin-bottom: var(--tg-space-2); font-size: var(--tg-fs-300); }
