/* Artikelseite nach App-Screenshot (Maße Faktor 402/921), Kopf wie Startseite */

.fi-art-page { background: #fff; }

/* Rubrik-Leiste unter dem Kopf */
.fi-art-bar { display: flex; align-items: center; gap: 0; box-sizing: content-box; height: 52px; padding: 0 9px 0 22px; border-bottom: 1px solid var(--h-line); background: #fff; }
.fi-art-bar-logo { flex: 1; min-width: 0; display: flex; align-items: center; }
.fi-art-bar-logo img { display: block; width: 140px; height: auto; }
/* Logo und Kopfhöhe exakt wie auf der Startseite (.fi-apphead), damit beim Wechsel nichts springt */
@media (min-width: 400px) and (max-width: 767px) {
	.fi-art-bar { height: 58px; padding: 0 9px 0 20px; }
	.fi-art-bar-logo img { width: 164px; }
}
/* Handy: im Artikel kein allgemeiner Kopf (Suche, Glocke, Profil) – der Artikel-Kopf übernimmt */
@media (max-width: 1023px) { body.fi-art-page .fi-apphead, body.fi-art-page .fi-appsearch { display: none !important; } }
@media (min-width: 1024px) { .fi-art-bar-logo img { visibility: hidden; } }
.fi-art-bar-cat { flex: 1; min-width: 0; overflow: hidden; color: #111; font-size: 14.5px; font-weight: 800; letter-spacing: .16em; text-decoration: none; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.fi-art-bar-btn { display: grid; place-items: center; width: 34px; height: 38px; padding: 0; border: 0; background: none; color: #111; cursor: pointer; }
.fi-art-bar-btn[hidden] { display: none; }
.fi-art-share { display: contents; }
.fi-art-share-pop { display: none; }

/* Aufmacher */
.fi-art-hero { margin: 0; }
.fi-art-hero img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.fi-art-hero--video { position: relative; aspect-ratio: 16 / 9; background: #000; }
.fi-art-hero--video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.fi-art-head { margin: 0 15px; padding: 14px 0 14px; border-bottom: 1px solid #e3e5e6; }
.fi-art-head h1 { margin: 0; color: #111; font-size: 24px; font-weight: 800; line-height: 1.12; letter-spacing: -.03em; }
.fi-art-meta { margin: 12px 0 0; color: #6b6f76; font-size: 12.5px; font-weight: 600; }
.fi-art-meta a { color: inherit; text-decoration: none; }

/* Text */
.fi-art-body { padding: 16px 15px 8px; color: #1f1f23; font-size: var(--fi-art-fs, 18px); line-height: 1.6; overflow-wrap: break-word; }
.fi-art-body > * { max-width: 100%; }
.fi-art-body p { margin: 0 0 1em; }
.fi-art-body > p:first-of-type { color: #111; font-weight: 500; } /* Vorspann etwas kräftiger, wie in der App */
.fi-art-body h2 { margin: 1.3em 0 .6em; color: #111; font-size: 1.36em; font-weight: 700; line-height: 1.22; letter-spacing: -.02em; }
.fi-art-body h3 { margin: 1.2em 0 .5em; color: #111; font-size: 1.16em; font-weight: 700; line-height: 1.28; }
.fi-art-body a { color: #e6197a; text-decoration: underline; text-underline-offset: 2px; }
.fi-art-body ul, .fi-art-body ol { margin: 0 0 1em; padding-left: 1.3em; }
.fi-art-body blockquote:not(.twitter-tweet):not(.instagram-media) { margin: 0 0 1em; padding-left: 14px; border-left: 3px solid #e6197a; color: #111; font-weight: 500; }
.fi-art-body img { display: block; max-width: 100%; height: auto; }
.fi-art-body figure { margin: 0 0 1.2em; }
.fi-art-body figcaption, .fi-art-body .wp-caption-text { margin-top: 6px; color: #333; font-size: .82em; line-height: 1.4; text-align: left; }
.fi-art-body .wp-caption { width: auto !important; max-width: 100%; }
.fi-art-body iframe { max-width: 100%; }
.fi-art-body .fi-video { margin: 0 0 1.2em; }

/* Weitere News */
.fi-art-more { margin-top: 10px; border-top: 7px solid #f2f2f4; }
.fi-art-more h2 { margin: 0; padding: 16px 15px 4px; color: #e51a7a; font-size: 12.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.fi-art-more .fi-hitem-comments { display: none; } /* Kommentare kommen später mit dem neuen System */
/* Alte Artikel-Stile überschreiben: Schrift wie im Rest, Bilder eckig wie in der App */
.fi-art-body h2, .fi-art-body h3, .fi-art-body h4 { font-family: inherit; text-transform: none; }
.fi-art-body img, .fi-art-body figure, .fi-art-body .wp-caption { border-radius: 0 !important; }

/* "Mehr News"-Kasten, den Foxiz in den Text setzt: grauer Kasten mit pinken Nummern (wie Transfers-Liste der Startseite) */
.fi-art-body .related-sec { margin: 1.6em 0; padding: 14px 16px 6px; background: #f4f4f6; border-left: 3px solid #e6197a; counter-reset: fi-rel; }
.fi-art-body .related-sec .block-h { margin: 0; }
.fi-art-body .related-sec .heading-title { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; color: #e51a7a; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.fi-art-body .related-sec .heading-title::after { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.fi-art-body .related-sec .p-wrap { display: flex; align-items: flex-start; gap: 12px; padding: 11px 0; counter-increment: fi-rel; }
.fi-art-body .related-sec .p-wrap::before { content: counter(fi-rel); flex: none; width: 18px; color: #e6197a; font-size: 20px; font-weight: 800; line-height: 1.1; }
.fi-art-body .related-sec .p-wrap + .p-wrap { border-top: 1px solid #e3e4e7; }
.fi-art-body .related-sec .feat-holder { display: none; } /* ohne Bilder – die fehlten ohnehin bei manchen Einträgen */
.fi-art-body .related-sec .p-content { flex: 1; min-width: 0; }
.fi-art-body .related-sec .entry-title { margin: 0; font-size: 15.5px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.fi-art-body .related-sec .entry-title a { color: #e6197a; text-decoration: none; text-transform: none; } /* Titel in Magenta als Hervorhebung */
.fi-art-body .related-sec .entry-title a:hover { color: #b5125e; text-decoration: underline; text-underline-offset: 3px; }
.fi-art-body .related-sec .p-meta { margin-top: 3px; color: #8a8d93; font-size: 12px; }
.fi-art-body .related-sec .p-meta * { display: inline; margin: 0; padding: 0; }
.fi-art-body .related-sec .post-edit-link, .fi-art-body .related-sec a.post-edit-link { display: none; }

/* OneFootball-Player im Text: eckige Karte wie auf der Startseite – auch für den Player, den Ad Inserter live einsetzt */
.fi-art-body .fi-video--card { margin: 1.4em 4px 1.6em 0; }
.fi-art-body .code-block:has(.dugout-video) { margin: 1.4em 4px 1.6em 0 !important; }
.fi-art-body .code-block .dugout-video { border: 1px solid #e7e8e8; background: #fff; box-shadow: 4px 4px 0 #e61a7a; }
.fi-art-body .code-block .dugout-video::before { content: "Video"; display: block; padding: 9px 11px 0; color: #e51a7a; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.fi-art-body .code-block .dugout-title-bar { display: block !important; height: auto !important; margin: 0 !important; padding: 2px 11px 9px !important; background: none !important; border: 0 !important; border-radius: 0 !important; }
.fi-art-body .code-block .dugout-title-bar__link { display: block !important; height: auto !important; padding: 0 !important; }
.fi-art-body .code-block .dugout-title-bar__icon { display: none !important; }
.fi-art-body .code-block .dugout-title-bar__title { display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0 !important; padding: 0 !important; color: #111 !important; font-family: inherit !important; font-size: 14.5px !important; font-weight: 800 !important; line-height: 1.25 !important; white-space: normal !important; height: auto !important; }
.fi-art-body .code-block .of-widget-inner, .fi-art-body .code-block .jwplayer { border-radius: 0 !important; }
.fi-art-body .code-block .jw-title, .fi-art-body .fi-video--card .jw-title { display: none !important; }
.fi-art-body .dugout-video .jw-flag-floating .jw-wrapper { overflow: visible !important; }

/* Kommentarsymbol mit Zahl in der Rubrik-Leiste */
.fi-art-bar-comments { display: flex; align-items: center; gap: 4px; width: auto; padding: 0 5px; text-decoration: none; }
.fi-art-bar-comments b { color: #e6197a; font-size: 14.5px; font-weight: 800; }

/* "Bevorzugte Quelle bei Google": eckig und in unseren Farben, schlank in den Text eingefügt */
.fi-art-body .google-cta-banner { margin: 0 0 1.2em; padding: 0; border: 0; border-radius: 0; background: #fdeef5; box-shadow: none; }
.fi-art-body .google-cta-inner { display: flex; align-items: center; gap: 14px; padding: 12px 12px 12px 16px; border: 0; border-left: 3px solid #e6197a; border-radius: 0; background: none; }
.fi-art-body .google-cta-icon { display: grid; place-items: center; flex: none; width: 40px; height: 40px; background: #fff; }
.fi-art-body .google-cta-icon svg { width: 22px; height: 22px; }
.fi-art-body .google-cta-text { flex: 1; min-width: 0; color: #3a3a40; font-size: 14.5px; font-weight: 700; line-height: 1.35; letter-spacing: .04em; text-transform: uppercase; }
.fi-art-body .google-cta-text strong { color: #111; font-weight: 800; }
.fi-art-body a.google-cta-btn { display: flex; align-items: center; flex: none; height: 44px; padding: 0 20px; border-radius: 0; background: #e6197a; color: #fff; font-family: inherit; font-size: 14px; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.fi-art-body a.google-cta-btn:hover { background: #c8126a; }
.fi-art-body a.google-cta-btn i { display: none; }
@media (max-width: 599px) { .fi-art-body .google-cta-text { font-size: 12.5px; letter-spacing: .03em; } .fi-art-body a.google-cta-btn { height: 42px; padding: 0 16px; font-size: 13px; } }
.fi-art-body strong, .fi-art-body b, .fi-art-body h2, .fi-art-body h3, .fi-art-body h4 { color: #111; }

/* OneFootball-Player im Artikel ohne Rahmen/Schatten */
.fi-art-body .fi-video--card { margin: 1.4em 0 1.6em; border: 0; box-shadow: none; }
.fi-art-body .fi-video--card .fi-video-kicker, .fi-art-body .code-block .dugout-video::before { padding: 0; }
.fi-art-body .fi-video--card .dugout-title-bar, .fi-art-body .code-block .dugout-title-bar { padding: 3px 0 10px !important; }
.fi-art-body .code-block:has(.dugout-video) { margin: 1.4em 0 1.6em !important; }
.fi-art-body .code-block .dugout-video { border: 0; box-shadow: none; }

/* Brotkrumen über der Überschrift (FCBinside » Rubrik » Artikel) */
.fi-crumbs { margin: 0 0 10px; overflow: hidden; color: #6b6b74; font-size: 12.5px; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; }
.fi-crumbs a { color: #6b6b74; text-decoration: none; }
.fi-crumbs a:hover { color: #e6197a; }
.fi-crumbs .breadcrumb_last { color: #121212; }

/* Schriftgröße im Artikel (Aa-Knopf in der Leiste): 5 Stufen, gemerkt im Browser (fi_art_fs) */
html[data-art-fs="0"] { --fi-art-fs: 15px; }
html[data-art-fs="1"] { --fi-art-fs: 16.5px; }
html[data-art-fs="3"] { --fi-art-fs: 20px; }
html[data-art-fs="4"] { --fi-art-fs: 22px; }
.fi-art-bar { position: relative; }
.fi-art-bar-fs { font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.fi-art-bar-fs[aria-expanded="true"] { color: #e6197a; }
.fi-art-fs { position: absolute; top: 100%; right: 8px; z-index: 30; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #e6e6ea; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.fi-art-fs[hidden] { display: none; }
.fi-art-fs button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid #e6e6ea; background: #fff; color: #111; font-weight: 800; cursor: pointer; }
.fi-art-fs button:disabled { opacity: .35; cursor: default; }
.fi-art-fs [data-fs="-1"] { font-size: 13px; }
.fi-art-fs [data-fs="1"] { font-size: 19px; }
.fi-art-fs-dots { display: flex; gap: 5px; }
.fi-art-fs-dots i { width: 7px; height: 7px; border-radius: 50%; background: #d4d4da; }
.fi-art-fs-dots i.is-on { background: #e6197a; }

/* ======================= Computer (ab 1024 px): Lesespalte, Aktionsleiste links, Seitenleiste rechts ======================= */
.fi-art-side { display: none; }
@media (min-width: 1024px) {
	body.fi-art-page .fi-main {
		display: grid; grid-template-columns: minmax(16px, 1fr) 52px minmax(0, 760px) 340px minmax(16px, 1fr);
		column-gap: 44px; align-items: start; padding: 36px 0 0; /* 52 + 760 + 340 + 2 × 44 = 1240 px = 1280 px inkl. Rand */
	}
	/* Aktionen als mitlaufende Leiste links neben dem Text */
	body.fi-art-page .fi-art-bar { grid-column: 2; grid-row: 1 / span 2; position: sticky; top: 110px; z-index: 20; /* Schriftgröße/Teilen-Fenster liegen über dem Artikelbild */ flex-direction: column; align-items: center; gap: 10px; height: auto; padding: 0; border: 0; background: none; box-sizing: border-box; }
	body.fi-art-page .fi-art-bar-logo { display: none; }
	body.fi-art-page .fi-art-bar-btn { width: 52px; height: 52px; border: 1px solid var(--h-line, #e3e5e6); border-radius: 50%; background: #fff; transition: border-color .15s, color .15s; }
	body.fi-art-page .fi-art-bar-btn:hover { border-color: #e6197a; color: #e6197a; }
	/* Kommentare: Symbol mittig, Anzahl als Abzeichen oben rechts am Kreis */
	body.fi-art-page .fi-art-bar-comments { position: relative; justify-content: center; gap: 0; padding: 0; }
	body.fi-art-page .fi-art-bar-comments b { position: absolute; top: -4px; right: -6px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; box-sizing: border-box; border: 2px solid #fff; border-radius: 11px; background: #e6197a; color: #fff; font-size: 11.5px; line-height: 1; }
	body.fi-art-page .fi-art-bar-fs { font-size: 16px; }
	body.fi-art-page .fi-art-fs { top: 0; right: auto; left: calc(100% + 12px); }
	/* Teilen: beim Drüberfahren Facebook, X, WhatsApp rechts daneben */
	body.fi-art-page .fi-art-share { position: relative; display: block; }
	body.fi-art-page .fi-art-share::after { content: ""; position: absolute; top: 0; left: 100%; width: 14px; height: 100%; } /* Brücke, damit das Menü beim Hinüberfahren offen bleibt */
	body.fi-art-page .fi-art-share-pop { position: absolute; top: 50%; left: calc(100% + 12px); z-index: 5; display: flex; gap: 8px; padding: 6px; border: 1px solid var(--h-line, #e3e5e6); border-radius: 33px; background: #fff; box-shadow: 0 10px 28px rgba(18, 18, 18, .12); opacity: 0; visibility: hidden; transform: translate(-6px, -50%); transition: opacity .15s, transform .15s, visibility 0s linear .15s; }
	body.fi-art-page .fi-art-share:hover .fi-art-share-pop, body.fi-art-page .fi-art-share:focus-within .fi-art-share-pop { opacity: 1; visibility: visible; transform: translate(0, -50%); transition-delay: 0s; }
	body.fi-art-page .fi-art-share-pop a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; transition: transform .15s; }
	body.fi-art-page .fi-art-share-pop a:hover { transform: scale(1.08); }
	body.fi-art-page .fi-art-share-pop .is-fb { background: #1877f2; }
	body.fi-art-page .fi-art-share-pop .is-x { background: #000; }
	body.fi-art-page .fi-art-share-pop .is-wa { background: #25d366; }
	/* Artikel: Kopf über dem Bild, Text in Lesebreite */
	body.fi-art-page .fi-art { grid-column: 3; grid-row: 1; display: flex; flex-direction: column; min-width: 0; }
	.fi-art-page .fi-art-head { order: -1; margin: 0; padding: 0 0 26px; border: 0; }
	.fi-art-page .fi-crumbs { margin-bottom: 14px; font-size: 13.5px; }
	.fi-art-page .fi-art-head h1 { font-size: 46px; line-height: 1.08; letter-spacing: -.03em; }
	.fi-art-page .fi-art-meta { margin-top: 16px; font-size: 14.5px; }
	.fi-art-page .fi-art-hero img { aspect-ratio: 3 / 2; } /* Originale 1500 × 1000 – nichts abschneiden */
	.fi-art-page .fi-art-body { padding: 32px 0 8px; font-size: var(--fi-art-fs, 19px); line-height: 1.65; }
	/* Kommentare in der Lesespalte, Eingabe fest am Ende statt schwebend */
	body.fi-art-page .fcbk { grid-column: 3; grid-row: 2; margin: 40px 0 0; min-width: 0; }
	.fi-art-page .fcbk-bar.is-floating { position: static; max-width: none; margin: 0; box-shadow: none; border-bottom: 1px solid var(--fcbk-line, #e3e5e6); }
	.fi-art-page .fcbk-bar-slot { margin: 16px 0 0; }
	/* Seitenleiste: Spiel, News, Werbung läuft mit */
	body.fi-art-page .fi-art-side { grid-column: 4; grid-row: 1 / span 2; align-self: stretch; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
	.fi-art-side-ad { position: sticky; top: 110px; }
	/* Mehr aus der Rubrik: Kartenraster über die volle Breite */
	body.fi-art-page .fi-art-more { grid-column: 3 / 5; grid-row: 3; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; margin-top: 64px; padding: 36px 0 64px; border-top: 1px solid #e3e5e6; }
	.fi-art-page .fi-art-more h2 { grid-column: 1 / -1; padding: 0; font-size: 13px; }
	.fi-art-page .fi-art-more .fi-hitem a { flex-direction: column-reverse; justify-content: flex-end; align-items: stretch; gap: 12px; height: 100%; padding: 0; border: 0; }
	.fi-art-page .fi-art-more .fi-hitem-img { flex: none; width: 100%; height: auto; aspect-ratio: 3 / 2; }
	.fi-art-page .fi-art-more .fi-hitem-title { font-size: 18px; line-height: 1.25; }
	.fi-art-page .fi-art-more .fi-hitem a:hover .fi-hitem-title { color: #e6197a; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
	body.fi-art-page .fi-main { grid-template-columns: minmax(16px, 1fr) 52px minmax(0, 680px) 300px minmax(16px, 1fr); column-gap: 28px; }
	.fi-art-page .fi-art-head h1 { font-size: 38px; }
	body.fi-art-page .fi-art-more { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	/* Video im Artikel: „VIDEO“ links neben dem Titel in einer Zeile, Player darunter */
	.fi-art-body .fi-video--card .fi-video-kicker { float: left; margin: 3px 14px 0 0; line-height: 1.6; }
	.fi-art-body .fi-video--card .dugout-title-bar__title { -webkit-line-clamp: 1 !important; }
}

/* Bildnachweis im Bild (Aufmacher + Bilder im Text): kleines Etikett unten rechts, z. B. „IMAGO / Jan Huebner“ */
.fi-art-hero { position: relative; }
.fi-art-hero .fi-credit,
.fi-art-body figure.wp-caption { position: relative; }
.fi-art-hero .fi-credit,
.fi-art-body figure.wp-caption > figcaption[data-credit] {
	position: absolute; right: 10px; bottom: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 6px;
	max-width: calc(100% - 20px); margin: 0; padding: 5px 9px 5px 8px; box-sizing: border-box;
	background: rgba(12, 12, 15, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	color: #fff; font-size: 10.5px; font-style: normal; font-weight: 700; line-height: 1.2; letter-spacing: .08em; text-transform: uppercase;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none;
}
.fi-art-hero .fi-credit::before,
.fi-art-body figure.wp-caption > figcaption[data-credit]::before {
	content: ""; flex: none; width: 12px; height: 12px; opacity: .85;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 8h3l1.5-2h7L17 8h3v11H4z' fill='none' stroke='%23000' stroke-width='2.2' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='13' r='3.2' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 8h3l1.5-2h7L17 8h3v11H4z' fill='none' stroke='%23000' stroke-width='2.2' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='13' r='3.2' fill='none' stroke='%23000' stroke-width='2.2'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (min-width: 1024px) {
	.fi-art-hero .fi-credit, .fi-art-body figure.wp-caption > figcaption[data-credit] { right: 14px; bottom: 14px; font-size: 11px; }
}

/* Textanfang: Werbebanner (Ad Inserter), Google-Hinweis und erster Absatz mit gleichen Abständen.
 * Ad Inserter setzt um jeden Block 8 px Rand und vor manche leere Werbeplätze Zeilenumbrüche – das machte die Lücken unruhig. */
.fi-art-body { --fi-art-gap: 16px; }
.fi-art-body > :first-child { margin-top: 0 !important; }
.fi-art-body > br:first-child { display: none; }
.fi-art-body > .code-block:not(:has(.dugout-video)) { margin: 0 !important; }
.fi-art-body > .code-block:not(:has(.dugout-video)) > br { display: none; }
.fi-art-body > .code-block > a:has(> img) { display: block; margin-bottom: var(--fi-art-gap); line-height: 0; }
.fi-art-body > .code-block > a > img { display: block; width: 100%; height: auto; margin: 0; }
.fi-art-body > .code-block > [id^="traffective-ad-"] { margin-bottom: var(--fi-art-gap); } /* nur wenn die Werbung tatsächlich angezeigt wird */
.fi-art-body .google-cta-banner { margin: 0 0 var(--fi-art-gap); }
@media (min-width: 1024px) {
	.fi-art-page .fi-art-body { padding-top: 24px; --fi-art-gap: 24px; }
}

/* „Folge uns“ – Social-Kanäle in der Seitenleiste (inc/fi-social-box.php): dunkle Karte mit Arena-Rauten, Logo, Zeilen je Kanal */
.fi-socbox { position: relative; overflow: hidden; padding: 20px 18px 16px; background: #15151c; color: #fff; }
.fi-socbox::before { content: ""; position: absolute; inset: -40% -30% 40% 10%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='72' viewBox='0 0 160 72'%3E%3Cdefs%3E%3CradialGradient id='g' cx='50%25' cy='42%25' r='62%25'%3E%3Cstop offset='0' stop-color='%23ff5c95' stop-opacity='.62'/%3E%3Cstop offset='.55' stop-color='%23d6145a' stop-opacity='.38'/%3E%3Cstop offset='1' stop-color='%235c0024' stop-opacity='.30'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg fill='url%28%23g%29' stroke='%230c0c10' stroke-opacity='.9' stroke-width='2.5' stroke-linejoin='round'%3E%3Cpath d='M80 0L160 36L80 72L0 36Z'/%3E%3Cpath d='M0 -36L80 0L0 36L-80 0Z'/%3E%3Cpath d='M160 -36L240 0L160 36L80 0Z'/%3E%3Cpath d='M0 36L80 72L0 108L-80 72Z'/%3E%3Cpath d='M160 36L240 72L160 108L80 72Z'/%3E%3C/g%3E%3C/svg%3E"); background-size: 120px 54px; transform: rotate(-8deg); opacity: .55; -webkit-mask-image: linear-gradient(200deg, #000 10%, transparent 70%); mask-image: linear-gradient(200deg, #000 10%, transparent 70%); pointer-events: none; }
.fi-socbox > * { position: relative; }
.fi-socbox-head img { display: block; width: 150px; height: auto; }
.fi-socbox-head h2 { display: flex; flex-direction: column; gap: 3px; margin: 12px 0 14px; color: #fff; font-size: 20px; font-weight: 800; letter-spacing: -.01em; }
.fi-socbox-head h2 span { color: rgba(255, 255, 255, .7); font-size: 13px; font-weight: 600; letter-spacing: 0; }
.fi-socbox ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.fi-socbox a { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px 10px 8px 8px; background: rgba(255, 255, 255, .06); color: #fff; text-decoration: none; transition: background .15s; }
.fi-socbox a:hover { background: rgba(255, 255, 255, .12); }
.fi-socbox a i { display: grid; place-items: center; width: 36px; height: 36px; color: #fff; }
.fi-socbox a i svg { width: 19px; height: 19px; }
.fi-socbox .is-instagram i { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.fi-socbox .is-facebook i { background: #1877f2; }
.fi-socbox .is-tiktok i { background: #000; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.fi-socbox .is-x i { background: #000; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.fi-socbox .is-youtube i { background: #ff0000; }
.fi-socbox a span { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.fi-socbox a b { font-size: 14px; font-weight: 800; }
.fi-socbox a small { overflow: hidden; color: rgba(255, 255, 255, .6); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.fi-socbox a em { box-sizing: border-box; width: 64px; padding: 5px 0; text-align: center; /* alle Kästen gleich breit */ background: #e6197a; color: #fff; font-size: 12px; font-style: normal; font-weight: 800; letter-spacing: .03em; font-variant-numeric: tabular-nums; }
.fi-socbox a:hover em { background: #fff; color: #e6197a; }
/* Kommentare im Taboola-Feed (assets/fi.js verschiebt sie hinter den dritten Block); Meistgelesen davor mit Abstand */
.fi-trend.is-before-feed { margin-bottom: 40px !important; }
@media (min-width: 1024px) { .fi-trend.is-before-feed { margin-bottom: 56px !important; } }
.fcbk.is-in-feed { margin: 28px 0 36px !important; font-family: inherit; line-height: normal; }
