/*
Theme Name: Grey News
Theme URI: https://www.grey-news.com
Author: Grey News
Description: Wirtschafts- und Unternehmensmagazin „Grey News – Unternehmen. Märkte. Innovationen.“ Umsetzung der freigegebenen Design-Vorlage vom 07.10.2026 (Tailwind per CDN, Newsreader + Public Sans, Signalrot #C8102E). Sechs Ressorts als echte WordPress-Kategorien.
Version: 1.0.0
Requires at least: 6.1
Requires PHP: 7.4
Text Domain: grey-news
*/

/* ==========================================================================
   Grundlagen (aus der Design-Vorlage)
   ========================================================================== */
:root { --bild-radius: 8px; }
body { font-family:'Public Sans',system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
.display { font-family:'Newsreader',Georgia,serif; letter-spacing:-0.012em; font-optical-sizing:auto; }
h1,h2,h3,h4 { text-wrap:balance; overflow-wrap:break-word; } p { text-wrap:pretty; }
/* lange deutsche Komposita in schmalen Spalten */
h2,h3 { -webkit-hyphens:auto; hyphens:auto; hyphenate-limit-chars:14 7 7; -webkit-hyphenate-limit-before:7; -webkit-hyphenate-limit-after:7; }
@media (max-width:640px) { h1 { -webkit-hyphens:auto; hyphens:auto; } }
html { scroll-behavior:smooth; scroll-padding-top:9rem; }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto!important} *{transition:none!important;animation:none!important} }

.rund, .rund img { border-radius:var(--bild-radius); overflow:hidden; }
.rund { background:#efefee; } /* Platzhalterfläche, solange das Bild lädt (keine weißen Löcher) */
main img[loading="eager"], #meistgelesen > img { background:#e3e4e6; }
.zoom img { transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.zoom:hover img { transform:scale(1.035); }
.no-scrollbar { scrollbar-width:none; } .no-scrollbar::-webkit-scrollbar { display:none; }
a:focus-visible, button:focus-visible, input:focus-visible { outline:2px solid #c8102e; outline-offset:2px; border-radius:4px; }
.kicker { font-size:.72rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:#c8102e; }
.meta { font-size:.8rem; color:#5b6068; }

/* Sticky-Kopfzeile unterhalb der WordPress-Admin-Leiste (nur für eingeloggte Redakteure sichtbar) */
.admin-bar .gn-sticky { top:32px; }
@media (max-width:782px) { .admin-bar .gn-sticky { top:46px; } }

/* Skip-Link */
.skip-link:focus { position:fixed; left:12px; top:12px; z-index:100; background:#1f2124; color:#fff; padding:.6rem 1rem; border-radius:6px; }

/* ==========================================================================
   Artikel-Fließtext (.beitragstext) – gilt für alle WordPress-Beiträge
   Tailwinds Reset entfernt Aufzählungszeichen und Link-Unterstreichung;
   diese Regeln stellen sie im Beitragstext wieder her.
   ========================================================================== */
.beitragstext { font-size:1.0625rem; line-height:1.75; color:#3a3d42; }
.beitragstext > p { margin-top:1.35rem; } .beitragstext > p:first-child { margin-top:0; }
.beitragstext .lead { font-size:1.22rem; line-height:1.6; color:#1f2124; }
.beitragstext h2 { font-family:'Newsreader',Georgia,serif; letter-spacing:-0.012em; font-weight:600; font-size:1.85rem; line-height:1.15; color:#1f2124; margin-top:3.2rem; scroll-margin-top:9.5rem; }
.beitragstext h3 { font-weight:700; font-size:1.12rem; color:#1f2124; margin-top:2rem; scroll-margin-top:9.5rem; }
.beitragstext h4 { font-weight:700; color:#1f2124; margin-top:1.6rem; }
.beitragstext ul { list-style:disc; padding-left:1.35rem; margin-top:1.1rem; }
.beitragstext ol { list-style:decimal; padding-left:1.45rem; margin-top:1.1rem; }
.beitragstext li { margin-top:.5rem; padding-left:.25rem; }
.beitragstext li::marker { color:#c8102e; font-weight:700; }
.beitragstext strong { color:#1f2124; font-weight:650; }
/* Links im Beitrag immer unterstrichen */
.beitragstext a:not(.no-prose) { color:#a30c25; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.beitragstext a:not(.no-prose):hover { color:#1f2124; }
.beitragstext blockquote { margin:2rem 0; padding:.2rem 0 .2rem 1.4rem; border-left:4px solid #c8102e; font-family:'Newsreader',Georgia,serif; font-size:1.3rem; line-height:1.45; color:#1f2124; }
.beitragstext blockquote p { margin:0; } .beitragstext blockquote cite { display:block; margin-top:.6rem; font:600 .85rem 'Public Sans',sans-serif; color:#5b6068; font-style:normal; }
.beitragstext hr { margin:2.5rem 0; border:0; border-top:1px solid #e3e4e6; }
.beitragstext img { height:auto; border-radius:var(--bild-radius); }
.beitragstext figure { margin:2rem 0; }
.beitragstext figcaption { margin-top:.7rem; font-size:.75rem; line-height:1.5; color:#5b6068; }
.beitragstext .wp-block-image img { max-width:100%; }
.beitragstext .alignleft { float:left; margin:.3rem 1.5rem 1rem 0; } .beitragstext .alignright { float:right; margin:.3rem 0 1rem 1.5rem; }
.beitragstext .aligncenter { margin-left:auto; margin-right:auto; }
.beitragstext::after { content:''; display:block; clear:both; }

/* Redaktionelle Module (im Editor als „Eigenes HTML“-Block einfügen) */
.tabelle { overflow-x:auto; margin:2rem 0; border:1px solid #e3e4e6; border-radius:8px; }
.beitragstext table { width:100%; border-collapse:collapse; font-size:.93rem; line-height:1.5; }
.beitragstext .wp-block-table { overflow-x:auto; margin:2rem 0; }
.beitragstext th, .beitragstext td { text-align:left; vertical-align:top; padding:.75rem .9rem; border-bottom:1px solid #e3e4e6; }
.beitragstext thead th { background:#f6f6f5; color:#1f2124; font-weight:700; white-space:nowrap; border-bottom:2px solid #c8102e; }
.beitragstext tbody tr:last-child td { border-bottom:0; }
.beitragstext td:last-child { color:#1f2124; font-weight:600; }
.beitragstext caption { caption-side:bottom; padding:.7rem .9rem; font-size:.75rem; color:#5b6068; text-align:left; border-top:1px solid #e3e4e6; }
.faq { margin-top:1.3rem; border-top:1px solid #e3e4e6; }
.faq details { border-bottom:1px solid #e3e4e6; }
.faq summary { cursor:pointer; list-style:none; padding:1.05rem 2.2rem 1.05rem 0; position:relative; font-weight:650; color:#1f2124; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; position:absolute; right:.2rem; top:.8rem; font-size:1.45rem; color:#c8102e; line-height:1; }
.faq details[open] summary::after { content:'–'; }
.faq .faq-a { margin:0 0 1.1rem; }
.quellen { list-style:decimal; padding-left:1.4rem; font-size:.92rem; color:#3a3d42; }

/* Direktlink an Überschriften: Icon, erst bei Hover/Fokus sichtbar – kein „#“/„§“ als Text */
.ueberschrift-link { display:inline-flex; vertical-align:middle; margin-left:.45rem; color:#c9cacd; opacity:0; transition:opacity .15s,color .15s; text-decoration:none!important; }
.beitragstext h2:hover .ueberschrift-link, .ueberschrift-link:focus-visible { opacity:1; }
.ueberschrift-link:hover { color:#c8102e; }
/* Sicherheitsnetz: Generator-Anker mit sichtbarem Text-Zeichen nie anzeigen */
.beitragstext a.anchor, .beitragstext a.heading-anchor { display:none; }

/* Inhaltsverzeichnis */
.toc-link { border-left:2px solid #e3e4e6; }
.toc-link.active { border-left-color:#c8102e; color:#1f2124; font-weight:600; }

#toTop { opacity:0; pointer-events:none; transition:opacity .2s,transform .2s; transform:translateY(6px); }
#toTop.show { opacity:1; pointer-events:auto; transform:none; }

/* Datenschutz-/Impressum-/Standardseiten */
.seite-text { max-width:44rem; }

/* Formular-Rückmeldung */
.nl-status { margin-top:.75rem; font-size:.85rem; font-weight:600; }
.nl-status.ok { color:#1f2124; } .nl-status.fehler { color:#a30c25; }
.nl-hp { position:absolute!important; left:-9999px!important; width:1px; height:1px; overflow:hidden; }

/* WordPress-Kern-Klassen */
.screen-reader-text { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.screen-reader-text:focus { clip:auto; width:auto; height:auto; margin:0; padding:.6rem 1rem; background:#fff; z-index:100000; }
.wp-caption { max-width:100%; }
.sticky .sticky-marker { display:none; }

/* Ohne JavaScript gibt es kein (leeres) Inhaltsverzeichnis */
html:not(.js) [data-toc-wrap] { display:none; }