/* Design: BDSM 1 – Ochsenblut, Messing, Antiqua */
:root {
	--ct-bg: #0f0b0b;
	--ct-surface: #1a1313;
	--ct-surface-2: #261b1a;
	--ct-text: #ecdcc6;
	--ct-muted: #a99079;
	--ct-line: rgba(196, 154, 90, .24);
	--ct-accent: #b0182f;
	--ct-accent-text: #f7ead8;
	--ct-brass: #c49a5a;
	--ct-live: #c49a5a;
	--ct-live-text: #1a1210;
	--ct-offline: #5c4a44;
	--ct-star: #c49a5a;
	--ct-header-bg: #0b0808;

	--ct-font-body: "Cormorant Garamond", Georgia, serif;
	--ct-font-head: "Cinzel", Georgia, serif;
	--ct-head-weight: 600;
	--ct-head-tracking: 0.04em;
	--ct-body-size: 1.18rem;

	--ct-radius: 2px;
	--ct-radius-img: 0;
	--ct-radius-btn: 2px;
	--ct-card-ratio: 3 / 4;
	--ct-gap: 26px 22px;
}

body { line-height: 1.6; }
a { color: var(--ct-brass); }

.ct-header { border-bottom: 1px solid var(--ct-line); box-shadow: 0 3px 0 -2px var(--ct-line); }
.ct-brand__name { font-size: 2.2rem; letter-spacing: .12em; font-weight: 700; }
.ct-brand__tagline { font-style: italic; font-size: 1.05rem; }
.ct-nav__list a { font-family: var(--ct-font-head); font-size: .82rem; letter-spacing: .14em; }

/* Ornament unter dem Seitentitel */
.ct-page-head { text-align: center; margin-bottom: 34px; }
.ct-page-title { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); }
.ct-page-head::after { content: ""; display: block; width: 180px; height: 12px; margin: 16px auto 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='12' viewBox='0 0 180 12'%3E%3Cg fill='none' stroke='%23c49a5a'%3E%3Cpath d='M0 6h74M106 6h74'/%3E%3Cpath d='M90 1l5 5-5 5-5-5z' fill='%23c49a5a'/%3E%3Ccircle cx='79' cy='6' r='1.5' fill='%23c49a5a'/%3E%3Ccircle cx='101' cy='6' r='1.5' fill='%23c49a5a'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
.ct-page-intro { margin-inline: auto; font-style: italic; }
.ct-page-count { font-style: italic; }

/* Gerahmte Kacheln mit doppelter Messinglinie */
.ct-card-framed .ct-card { background: var(--ct-surface); border: 1px solid var(--ct-line); padding: 7px; box-shadow: inset 0 0 0 4px var(--ct-surface), inset 0 0 0 5px rgba(196, 154, 90, .14); }
.ct-card__name { font-family: var(--ct-font-head); font-size: .98rem; letter-spacing: .08em; }
.ct-card__motto { font-style: italic; font-size: .98rem; }
.ct-card__age::after { content: " Jahre"; }
.ct-live { border-radius: 0; font-family: var(--ct-font-head); letter-spacing: .1em; font-size: .66rem; }
.ct-live--off { background: rgba(15, 11, 11, .75); color: var(--ct-muted); }
.ct-feature { border-radius: 0; background: rgba(15, 11, 11, .78); color: var(--ct-brass); font-family: var(--ct-font-head); letter-spacing: .06em; }

.ct-btn { font-family: var(--ct-font-head); letter-spacing: .12em; font-weight: 600; font-size: .9rem; padding: 14px 22px; }
.ct-btn--primary { border-color: color-mix(in srgb, var(--ct-brass) 60%, transparent); }
.ct-btn--primary:hover { background: #c41f39; }
.ct-btn--ghost { border-color: var(--ct-line); }

.ct-setcard__head { text-align: center; }
.ct-setcard__title { margin-inline: auto; }
.ct-setcard__who { justify-content: center; font-style: italic; }
.ct-panel { border: 1px solid var(--ct-line); }
.ct-media { border: 1px solid var(--ct-line); }
.ct-tabs__list { justify-content: center; }
.ct-tabs__list button { font-family: var(--ct-font-head); letter-spacing: .1em; font-size: .85rem; }
.ct-section-title, .ct-related .ct-section-title { text-align: center; }
.ct-chip { border-radius: 0; font-style: italic; }
.ct-pagination a, .ct-pagination span { font-family: var(--ct-font-head); }
.ct-footer { background: #0b0808; }

/* „Neu“: Messing-Schild unten links im Bild (Profile der letzten 7 Tage). */
.ct-card.is-new .ct-card__media::after { content: "Neu"; position: absolute; left: 0; bottom: 12px; padding: 4px 12px 4px 10px; background: var(--ct-brass); color: #1a1210; font-family: var(--ct-font-head); font-size: .62rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%); }

/* Live-Laufband im Salon-Stil. */
.ct-ticker { border-radius: 0; background: var(--ct-surface); border-color: var(--ct-line); box-shadow: inset 0 0 0 3px var(--ct-surface), inset 0 0 0 4px rgba(196, 154, 90, .14); }
.ct-ticker__label { background: var(--ct-accent); color: var(--ct-accent-text); font-family: var(--ct-font-head); letter-spacing: .16em; }
.ct-ticker__list a { font-family: var(--ct-font-head); font-size: .9rem; letter-spacing: .08em; }
.ct-ticker__list a span { font-family: var(--ct-font-body); font-style: italic; letter-spacing: 0; font-size: 1rem; }
.ct-ticker__list li::after { content: "◆"; color: var(--ct-brass); font-size: .55rem; }

/* Redaktionsstrecke: Zahlen als Messing-Medaillons, Profil des Monats als gerahmtes Porträt. */
.ct-editorial { gap: 40px; margin-bottom: 56px; }
.ct-stats { gap: 18px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.ct-stats li { background: transparent; border: 0; align-items: center; text-align: center; padding: 6px; }
.ct-stats strong { display: grid; place-items: center; width: 92px; height: 92px; margin-bottom: 10px; border-radius: 50%; border: 1px solid var(--ct-brass); box-shadow: inset 0 0 0 5px var(--ct-bg), inset 0 0 0 6px rgba(196, 154, 90, .4); font-family: var(--ct-font-head); font-size: 1.9rem; color: var(--ct-brass); }
.ct-stats span { font-style: italic; font-size: 1.05rem; }

.ct-cotm { border-radius: 0; background: var(--ct-surface); box-shadow: inset 0 0 0 6px var(--ct-surface), inset 0 0 0 7px rgba(196, 154, 90, .2); }
.ct-cotm__media { margin: 14px; min-height: 420px; outline: 1px solid var(--ct-line); outline-offset: 6px; }
/* Siegel in Ochsenblut auf dem Porträt. */
.ct-cotm__media::after { content: "✦"; position: absolute; right: -14px; bottom: -14px; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #d4334c, #8e1024 70%); color: var(--ct-brass); font-size: 1.5rem; box-shadow: 0 0 0 3px #6e0c1c, 0 10px 22px -8px rgba(0, 0, 0, .8); z-index: 2; }
.ct-cotm__media .ct-live { border-radius: 0; }
.ct-cotm__body { padding: 30px 32px 30px 18px; }
.ct-cotm__kicker { color: var(--ct-brass); font-family: var(--ct-font-head); letter-spacing: .2em; font-size: .72rem; }
.ct-cotm__title { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.2rem); line-height: 1.2; }
.ct-cotm__title a { color: var(--ct-brass); }
.ct-cotm__teaser { font-style: italic; font-weight: 400; font-size: 1.2rem; }
.ct-cotm__facts div { border-radius: 0; background: transparent; border: 1px solid var(--ct-line); }
.ct-cotm__facts dt { font-family: var(--ct-font-head); font-size: .62rem; letter-spacing: .14em; }
.ct-cotm__facts dd { font-size: 1.05rem; }
.ct-cotm__quote { border-left: 0; padding: 0; text-align: center; }
.ct-cotm__quote blockquote { font-size: 1.2rem; }
.ct-cotm__quote::before { content: "◆"; display: block; margin-bottom: 8px; color: var(--ct-brass); font-size: .6rem; }

.ct-tow { padding-top: 34px; border-top: 1px solid var(--ct-line); }
.ct-tow__head { text-align: center; }
.ct-tow__title { letter-spacing: .06em; }
.ct-tow__text { font-style: italic; }
.ct-tow__more { color: var(--ct-brass); font-family: var(--ct-font-head); font-size: .85rem; letter-spacing: .1em; }
.ct-tow__list a { border-radius: 0; outline: 1px solid var(--ct-line); outline-offset: 4px; }
.ct-tow__list span { font-family: var(--ct-font-head); letter-spacing: .08em; font-size: .8rem; text-align: center; }

/* Abschnittsüberschriften mit Raute. */
.ct-section-title::after { content: ""; display: block; width: 120px; height: 10px; margin: 10px auto 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10' viewBox='0 0 120 10'%3E%3Cg fill='none' stroke='%23c49a5a'%3E%3Cpath d='M0 5h50M70 5h50'/%3E%3Cpath d='M60 1l4 4-4 4-4-4z' fill='%23c49a5a'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
.ct-front h2:not(.ct-cotm__title) { text-align: center; }
.ct-front h3 { color: var(--ct-brass); letter-spacing: .06em; }

@media (max-width: 760px) {
	.ct-cotm__media { min-height: 0; aspect-ratio: 4 / 5; margin: 12px 12px 4px; }
	.ct-cotm__body { padding: 22px 18px 24px; }
	.ct-cotm__media::after { width: 52px; height: 52px; right: 6px; bottom: -18px; }
}
@media (max-width: 600px) {
	.ct-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
	.ct-stats strong { width: 68px; height: 68px; font-size: 1.4rem; }
	.ct-stats span { font-size: .9rem; }
	.ct-ticker__label { padding: 0 10px; font-size: .62rem; letter-spacing: .08em; }
}
