/* ==========================================================================
 * Indholdssider: sidetop, brødtekst, prislister, downloads, kontakt, artikler.
 * ========================================================================== */

/* ----------------------------------------------------------------- Sidetop */

.tg-page-hero {
	padding-block: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem);
	border-bottom: 1px solid var(--tg-border);
	background:
		radial-gradient(60% 100% at 80% 0%, var(--tg-accent-tint), transparent 70%);
}
.tg-page-hero__title { margin-bottom: var(--tg-space-4); }
.tg-page-hero__lede { margin-bottom: 0; }

/* --------------------------------------------------------------- Brødtekst */

.tg-prose { font-size: var(--tg-fs-400); }
.tg-prose > h2 {
	margin-top: var(--tg-space-10);
	font-size: var(--tg-fs-700);
	scroll-margin-top: calc(var(--tg-header-h) + 2rem);
}
.tg-prose > h2:first-child { margin-top: 0; }
.tg-prose > h3 { margin-top: var(--tg-space-8); font-size: var(--tg-fs-600); }
.tg-prose ul, .tg-prose ol { padding-left: 1.35rem; }
.tg-prose li::marker { color: var(--tg-accent-solid); }
.tg-prose a { font-weight: 550; }

/* --------------------------------------------------------------- Prisliste */

.tg-pricelist {
	width: 100%;
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-xl);
	overflow: hidden;
	background: var(--tg-surface);
	backdrop-filter: blur(14px);
}
.tg-pricelist table { margin: 0; }
.tg-pricelist th, .tg-pricelist td { padding: var(--tg-space-4) var(--tg-space-5); }
.tg-pricelist thead th {
	background: var(--tg-surface-sunk);
	font-family: var(--tg-font-display);
	font-size: var(--tg-fs-300);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--tg-text-muted);
}
.tg-pricelist td:last-child, .tg-pricelist th:last-child { text-align: right; white-space: nowrap; }
.tg-pricelist tbody tr:last-child td { border-bottom: 0; }
.tg-pricelist__total td {
	background: var(--tg-accent-tint);
	font-family: var(--tg-font-display);
	font-weight: 700;
	color: var(--tg-text-strong);
}
.tg-pricelist__note { font-size: var(--tg-fs-300); color: var(--tg-text-muted); margin-top: var(--tg-space-3); }

/* Vandret scroll på små skærme i stedet for at sprænge layoutet. */
.tg-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --------------------------------------------------------------- Downloads */

.tg-downloads { display: grid; gap: var(--tg-space-4); list-style: none; margin: 0; padding: 0; }
@media (min-width: 40rem) { .tg-downloads { grid-template-columns: 1fr 1fr; } }
.tg-download {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: var(--tg-space-4);
	margin: 0;
	padding: var(--tg-space-5);
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-lg);
	text-decoration: none;
	color: var(--tg-text);
	transition: border-color var(--tg-dur-fast) var(--tg-ease), transform var(--tg-dur-fast) var(--tg-ease);
}
.tg-download:hover { border-color: var(--tg-accent); transform: translateY(-2px); color: var(--tg-text); }
.tg-download__icon {
	display: grid; place-items: center;
	width: 2.75rem; height: 2.75rem;
	border-radius: var(--tg-radius-md);
	background: var(--tg-accent-soft);
	color: var(--tg-accent-solid);
}
.tg-download__body strong { display: block; color: var(--tg-text-strong); font-family: var(--tg-font-display); }
.tg-download__body span { font-size: var(--tg-fs-300); color: var(--tg-text-muted); }

/* ----------------------------------------------------------------- Kontakt */

.tg-contact-grid { display: grid; gap: var(--tg-space-10); }
@media (min-width: 56rem) { .tg-contact-grid { grid-template-columns: 1.2fr .8fr; gap: var(--tg-space-12); } }

.tg-contact-card {
	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);
}
.tg-contact-card h2 { font-size: var(--tg-fs-600); }
.tg-contact-list { list-style: none; margin: 0; padding: 0; }
.tg-contact-list li {
	display: flex; align-items: flex-start; gap: var(--tg-space-3);
	padding-block: var(--tg-space-3);
	border-bottom: 1px solid var(--tg-border);
}
.tg-contact-list li:last-child { border-bottom: 0; }
.tg-contact-list svg { color: var(--tg-accent-solid); margin-top: .2rem; flex: none; }
.tg-contact-list strong { display: block; color: var(--tg-text-strong); font-size: var(--tg-fs-300); }
.tg-contact-list a { text-decoration: none; }

/* ------------------------------------------------------------ Bylinks */

.tg-city-links {
	display: grid;
	gap: var(--tg-space-3);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}
.tg-city-links li { margin: 0; }
.tg-city-links a {
	display: flex;
	align-items: center;
	gap: var(--tg-space-3);
	padding: var(--tg-space-4) var(--tg-space-5);
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-lg);
	color: var(--tg-text-strong);
	text-decoration: none;
	font-weight: 550;
	transition: border-color var(--tg-dur-fast) var(--tg-ease),
		transform var(--tg-dur-fast) var(--tg-ease);
}
.tg-city-links a:hover {
	border-color: var(--tg-accent);
	transform: translateY(-2px);
	color: var(--tg-text-strong);
}
.tg-city-links svg { color: var(--tg-accent-solid); flex: none; }

/* ---------------------------------------------------------------- Galleri */

/*
 * Billedgitter til lokaler og undervisning. Det brede felt sætter tonen,
 * de to smalle viser detaljen.
 */
.tg-gallery { display: grid; gap: var(--tg-space-4); }
@media (min-width: 48rem) {
	.tg-gallery { grid-template-columns: repeat(2, 1fr); }
	.tg-gallery__item--wide { grid-column: 1 / -1; }
}
@media (min-width: 62rem) {
	.tg-gallery { grid-template-columns: repeat(4, 1fr); }
	.tg-gallery__item--wide { grid-column: span 2; grid-row: span 2; }
	.tg-gallery__item { grid-column: span 2; }
}

.tg-gallery__item {
	position: relative;
	margin: 0;
	border-radius: var(--tg-radius-xl);
	overflow: hidden;
	border: 1px solid var(--tg-border);
	background: var(--tg-surface-sunk);
}
.tg-gallery__item img {
	width: 100%;
	height: 100%;
	min-height: 11rem;
	max-height: 15rem;
	object-fit: cover;
	display: block;
}
@media (min-width: 62rem) {
	.tg-gallery__item--wide img { min-height: 22rem; max-height: 22rem; }
	.tg-gallery__item img { min-height: 10.5rem; max-height: 10.5rem; }
}

.tg-gallery__item figcaption {
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	padding: var(--tg-space-6) var(--tg-space-5) var(--tg-space-4);
	font-size: var(--tg-fs-300);
	color: #fff;
	background: linear-gradient(to top, rgba(4, 5, 10, .82), transparent);
}

/* ------------------------------------------------------------- Billeder */

/* Tekst ved siden af et billede. Billedet står altid sidst i DOM'en, så
   skærmlæsere og mobil får teksten først. */
.tg-media-split { display: grid; gap: var(--tg-space-8); align-items: center; }
@media (min-width: 62rem) {
	.tg-media-split { grid-template-columns: 1fr 26rem; gap: var(--tg-space-12); }
	.tg-media-split--reverse { grid-template-columns: 26rem 1fr; }
	.tg-media-split--reverse .tg-media-split__figure { order: -1; }
}

.tg-media-split__figure {
	margin: 0;
	border-radius: var(--tg-radius-2xl);
	overflow: hidden;
	border: 1px solid var(--tg-border);
	box-shadow: var(--tg-shadow);
}
/* Kilderne er høje portrætformater. Uden et fast forhold vokser de ud af
   layoutet — derfor beskæres de til et roligt 4:3 i stedet. */
.tg-media-split__figure img {
	width: 100%;
	aspect-ratio: 4 / 3;
	max-height: 20rem;
	object-fit: cover;
	object-position: 50% 30%;
	display: block;
}

/* Bredt billedbånd på tværs af spalten. */
.tg-media-band {
	margin: 0;
	border-radius: var(--tg-radius-2xl);
	overflow: hidden;
	border: 1px solid var(--tg-border);
	box-shadow: var(--tg-shadow);
}
.tg-media-band img {
	width: 100%;
	aspect-ratio: 21 / 9;
	max-height: 17rem;
	object-fit: cover;
	object-position: 50% 32%;
	display: block;
}

/* Kort med foto i toppen. */
.tg-card--photo { padding: 0; overflow: hidden; }
.tg-card__photo { margin: 0 0 var(--tg-space-5); }
.tg-card__photo img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
}
.tg-card--photo h3,
.tg-card--photo p { padding-inline: var(--tg-space-6); }
.tg-card--photo p { padding-bottom: var(--tg-space-6); }

/* ---------------------------------------------------------------- Artikler */

.tg-post-card {
	display: flex;
	flex-direction: column;
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-xl);
	overflow: hidden;
	transition: transform var(--tg-dur) var(--tg-ease), border-color var(--tg-dur) var(--tg-ease);
}
.tg-post-card:hover { transform: translateY(-3px); border-color: var(--tg-accent); }
.tg-post-card__body { padding: var(--tg-space-6); display: flex; flex-direction: column; flex: 1; }
.tg-post-card__meta { font-size: var(--tg-fs-300); color: var(--tg-text-muted); margin-bottom: var(--tg-space-2); }
.tg-post-card h2, .tg-post-card h3 { font-size: var(--tg-fs-600); margin-bottom: var(--tg-space-3); }
.tg-post-card a { text-decoration: none; color: var(--tg-text-strong); }
.tg-post-card a:hover { color: var(--tg-accent-solid); }

/* Paginering */
.pagination, .navigation.pagination { margin-top: var(--tg-space-10); }
.nav-links { display: flex; flex-wrap: wrap; gap: var(--tg-space-2); justify-content: center; }
.page-numbers {
	display: grid; place-items: center;
	min-width: 2.5rem; height: 2.5rem;
	padding-inline: .6rem;
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-md);
	text-decoration: none;
	color: var(--tg-text);
}
.page-numbers.current { background: var(--tg-grad-accent); color: #fff; border-color: transparent; }

/* ------------------------------------------------------------------- 404 */

.tg-404 { text-align: center; padding-block: var(--tg-section-y); }
.tg-404__code {
	font-family: var(--tg-font-display);
	font-size: clamp(4rem, 18vw, 9rem);
	line-height: 1;
	background: var(--tg-grad-accent);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-bottom: var(--tg-space-4);
}
.tg-404__links { display: flex; flex-wrap: wrap; gap: var(--tg-space-3); justify-content: center; margin-top: var(--tg-space-6); }

/* ------------------------------------------------------------------ Tilkøb */

.tg-addon-list { display: grid; gap: var(--tg-space-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.tg-addon {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--tg-space-4);
	padding: var(--tg-space-4) var(--tg-space-5);
	background: var(--tg-surface);
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius-lg);
	text-decoration: none;
	transition: border-color var(--tg-dur-fast) var(--tg-ease), transform var(--tg-dur-fast) var(--tg-ease);
}
.tg-addon:hover { border-color: var(--tg-accent); transform: translateY(-2px); }
.tg-addon__name { color: var(--tg-text-strong); font-weight: 550; }
.tg-addon__price {
	font-family: var(--tg-font-display);
	font-weight: 700;
	color: var(--tg-accent-solid);
	white-space: nowrap;
}

/* --------------------------------------------------------- Prisgrupper */

.tg-price-group + .tg-price-group { margin-top: var(--tg-space-12); }
.tg-price-group > h2 { margin-bottom: var(--tg-space-5); }

/* Direkte svar øverst på pris-siden — det folk faktisk søgte efter. */
.tg-answer {
	padding: var(--tg-space-6);
	margin-bottom: var(--tg-space-8);
	border-left: 3px solid var(--tg-accent);
	border-radius: 0 var(--tg-radius-lg) var(--tg-radius-lg) 0;
	background: var(--tg-accent-tint);
	font-size: var(--tg-fs-500);
	color: var(--tg-text-strong);
}
.tg-answer p { margin-bottom: 0; }

/* ---------------------------------------------------------------- Artikel */

.tg-article__media {
	margin: 0 0 var(--tg-space-8);
	border-radius: var(--tg-radius-xl);
	overflow: hidden;
}

/* ------------------------------------------------------------- Download */

.tg-download__meta { flex: none; }

/* ---------------------------------------------------- Betalingschips (footer) */

.tg-payments__chip {
	padding: .3rem .7rem;
	border: 1px solid var(--tg-border-strong);
	border-radius: var(--tg-radius-sm);
	font-size: .6875rem;
	font-weight: 650;
	letter-spacing: .04em;
	color: var(--tg-text-muted);
	background: var(--tg-surface-elev);
}

/* Stjernen ved obligatoriske felter. Rød, så den ikke forveksles med tekst. */
.tg-required { color: var(--tg-danger); }
