/* Design: Cams 4 – Magazin-Stil, Schwarz mit Pink, Hochformat, Redaktionsstrecke */
:root {
	--ct-bg: #0c0a0d;
	--ct-surface: #17131a;
	--ct-surface-2: #221c26;
	--ct-text: #f5f0f4;
	--ct-muted: #a99fab;
	--ct-line: rgba(245, 240, 244, .09);
	--ct-accent: #ff3d8b;
	--ct-accent-text: #1c0010;
	--ct-live: #3be08f;
	--ct-live-text: #04200f;
	--ct-header-bg: #0c0a0d;

	--ct-font-body: "Inter", system-ui, sans-serif;
	--ct-font-head: "Oswald", "Arial Narrow", sans-serif;
	--ct-head-weight: 600;
	--ct-head-tracking: 0.01em;
	--ct-head-transform: uppercase;

	--ct-radius: 6px;
	--ct-radius-img: 6px;
	--ct-radius-btn: 4px;
	--ct-card-ratio: 3 / 4;
	--ct-gap: 18px 14px;
}

/* Kopf wie ein Magazin-Titel: Pink-Linie oben, Name in Versalien. */
.ct-header { border-top: 4px solid var(--ct-accent); border-bottom: 1px solid var(--ct-line); }
.ct-brand__name { font-size: 2rem; letter-spacing: .02em; }
.ct-brand__name::after { content: ""; display: inline-block; width: .38em; height: .38em; margin-left: .12em; background: var(--ct-accent); transform: rotate(45deg); vertical-align: .12em; }
.ct-brand__tagline { text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; }

.ct-page-title { font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3.1rem); line-height: 1.05; }
.ct-section-title { border-left: 4px solid var(--ct-accent); padding-left: 10px; }
.ct-prose h2, .ct-prose h3, .ct-front h2, .ct-front h3 { text-transform: none; font-family: var(--ct-font-head); letter-spacing: .01em; }

/* Kacheln: Hochformat, Name im Balken darunter. */
.ct-card-bar .ct-card__body { border: 1px solid var(--ct-line); border-top: 0; }
.ct-card__name { font-family: var(--ct-font-head); text-transform: uppercase; letter-spacing: .03em; font-size: 1.02rem; font-weight: 600; }
.ct-card__media { transition: filter .2s; }
.ct-card:hover .ct-card__media { filter: brightness(1.08); }
.ct-card:hover .ct-card__body { border-color: color-mix(in srgb, var(--ct-accent) 60%, transparent); }
.ct-live { border-radius: 3px; text-transform: uppercase; letter-spacing: .06em; font-size: .66rem; }

/* Buttons. */
.ct-btn { font-family: var(--ct-font-head); text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.ct-btn--primary { box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--ct-accent) 90%, transparent); }
.ct-chip { border-radius: 4px; }

/* Redaktionsstrecke im Magazin-Look. */
.ct-stats li { border-left: 4px solid var(--ct-accent); }
.ct-cotm { border-color: color-mix(in srgb, var(--ct-accent) 35%, transparent); }
.ct-cotm__title, .ct-tow__title { font-size: clamp(1.7rem, 1.2rem + 1.8vw, 2.6rem); }
.ct-cotm__kicker { display: inline-block; align-self: flex-start; background: var(--ct-accent); color: var(--ct-accent-text); padding: 3px 8px; border-radius: 3px; }
.ct-tow__head .ct-cotm__kicker { margin-bottom: 4px; }
.ct-cotm__quote blockquote { font-size: 1.05rem; }

.ct-panel { border: 1px solid var(--ct-line); }
.ct-tabs__list button[aria-selected="true"] { border-bottom-width: 3px; }